From 751ad07e151f0abfd111c4d800d172f726ffa33c Mon Sep 17 00:00:00 2001
From: 2 * r + 2 * t <61896496+soramanew@users.noreply.github.com>
Date: Wed, 15 Jan 2025 20:58:01 +1100
Subject: brightness and volume osds

---
 scss/_lib.scss |  4 ++++
 scss/osds.scss | 27 +++++++++++++++++++++++++++
 2 files changed, 31 insertions(+)
 create mode 100644 scss/osds.scss

(limited to 'scss')

diff --git a/scss/_lib.scss b/scss/_lib.scss
index dda7dfd..e12140f 100644
--- a/scss/_lib.scss
+++ b/scss/_lib.scss
@@ -31,6 +31,10 @@ $scale: 0.068rem;
     transition: $duration cubic-bezier(0, 0.55, 0.45, 1);
 }
 
+@mixin fluent-decel($duration: 200ms) {
+    transition: $duration cubic-bezier(0.1, 1, 0, 1);
+}
+
 @mixin overshot {
     transition-timing-function: cubic-bezier(0.05, 0.9, 0.1, 1.1);
 }
diff --git a/scss/osds.scss b/scss/osds.scss
new file mode 100644
index 0000000..62a38f5
--- /dev/null
+++ b/scss/osds.scss
@@ -0,0 +1,27 @@
+@use "scheme";
+@use "lib";
+@use "font";
+
+.brightness,
+.volume {
+    @include lib.rounded(8);
+    @include font.icon;
+
+    background-color: scheme.$mantle;
+    font-size: lib.s(28);
+    padding: lib.s(3);
+
+    .inner {
+        @include lib.rounded(8);
+        @include lib.fluent-decel(1000ms);
+
+        min-width: lib.s(300);
+        min-height: lib.s(32);
+        background-color: scheme.$teal;
+        color: scheme.$mantle;
+    }
+}
+
+.brightness {
+    font-size: lib.s(26);
+}
-- 
cgit v1.2.3-freya