✨ eww: add floating media popup on bar media click

2024-12-20 15:46:04 -03:00
parent b0d61250e8
commit 5bc04e4dff
13 changed files with 224 additions and 163 deletions
@@ -145,3 +145,60 @@ tooltip {
        box-shadow: 0 3px 5px 1px rgba($color: #000000, $alpha: .8);
    }
 }
+
+
+.big-media {
+    padding: 16px;
+    margin: 6px 0;
+    border-radius: 18px;
+
+    & > box > .album-image {
+        background-size: 100%;
+        background-repeat: no-repeat;
+        background-position: center 0;
+        margin-right: 12px;
+        border-radius: 11px;
+    }
+
+    & > box > .right {
+
+        & > .media-info { 
+            label {
+                font-family: "Cantarell", "Noto Sans CJK JP";
+            }
+
+            & label.title {
+                font-weight: 700;
+                font-size: 16px;
+                margin-bottom: 6px;
+            }
+
+            & label.artist {
+                font-weight: 600;
+                font-size: 12px;
+                margin-bottom: 12px;
+            }
+        }
+
+        & > .controls {
+            padding: 0px;
+
+            & > button {
+                padding: 4px 9px;
+
+                & > label {
+                    font-size: 13.3px;
+                }
+            }
+
+            & > button.repeat {
+                padding-right: 11px;
+            }
+        }
+    }
+
+    &.album-bg {
+        box-shadow: inset 0 0 0 100px rgba($background, .55);
+        background-size: cover;
+    }
+}