aboutsummaryrefslogtreecommitdiff
path: root/dotfiles/.config/DankMaterialShell/firefox.css
diff options
context:
space:
mode:
authorYaroslav de la Peña Smirnov <yps@yaroslavps.com>2026-05-04 17:42:20 +0300
committerYaroslav de la Peña Smirnov <yps@yaroslavps.com>2026-05-04 17:42:20 +0300
commit12f6f4702e64d775ee1991d704dcb08d4e2704c4 (patch)
treeac58a8ff5ce1a09011c7155f3be2a1c2d3ad5912 /dotfiles/.config/DankMaterialShell/firefox.css
parent9c935d9d95496f6b0a05f719a4fd0b435ce54956 (diff)
downloadswayrice-12f6f4702e64d775ee1991d704dcb08d4e2704c4.tar.gz
swayrice-12f6f4702e64d775ee1991d704dcb08d4e2704c4.zip
try out dank shell
Diffstat (limited to 'dotfiles/.config/DankMaterialShell/firefox.css')
-rw-r--r--dotfiles/.config/DankMaterialShell/firefox.css132
1 files changed, 132 insertions, 0 deletions
diff --git a/dotfiles/.config/DankMaterialShell/firefox.css b/dotfiles/.config/DankMaterialShell/firefox.css
new file mode 100644
index 0000000..a8efeae
--- /dev/null
+++ b/dotfiles/.config/DankMaterialShell/firefox.css
@@ -0,0 +1,132 @@
+@media -moz-pref("userChrome.theme-material") {
+ :root {
+ --md-sys-color-primary: #006877;
+ --md-sys-color-surface-tint: #006877;
+ --md-sys-color-on-primary: #ffffff;
+ --md-sys-color-primary-container: #a3eeff;
+ --md-sys-color-on-primary-container: #001f25;
+ --md-sys-color-secondary: #4a6268;
+ --md-sys-color-on-secondary: #ffffff;
+ --md-sys-color-secondary-container: #cde7ed;
+ --md-sys-color-on-secondary-container: #051f24;
+ --md-sys-color-tertiary: #545d7e;
+ --md-sys-color-on-tertiary: #ffffff;
+ --md-sys-color-tertiary-container: #dce1ff;
+ --md-sys-color-on-tertiary-container: #111a37;
+ --md-sys-color-error: #ba1a1a;
+ --md-sys-color-on-error: #ffffff;
+ --md-sys-color-error-container: #ffdad6;
+ --md-sys-color-on-error-container: #410002;
+ --md-sys-color-background: #f9f9f9;
+ --md-sys-color-on-background: #1b1b1b;
+ --md-sys-color-surface: #f9f9f9;
+ --md-sys-color-on-surface: #1b1b1b;
+ --md-sys-color-surface-variant: #e2e2e2;
+ --md-sys-color-on-surface-variant: #474747;
+ --md-sys-color-outline: #777777;
+ --md-sys-color-outline-variant: #c6c6c6;
+ --md-sys-color-shadow: #000000;
+ --md-sys-color-scrim: #000000;
+ --md-sys-color-inverse-surface: #303030;
+ --md-sys-color-inverse-on-surface: #f1f1f1;
+ --md-sys-color-inverse-primary: #52d7f0;
+ --md-sys-color-primary-fixed: #a3eeff;
+ --md-sys-color-on-primary-fixed: #001f25;
+ --md-sys-color-primary-fixed-dim: #52d7f0;
+ --md-sys-color-on-primary-fixed-variant: #004e5a;
+ --md-sys-color-secondary-fixed: #cde7ed;
+ --md-sys-color-on-secondary-fixed: #051f24;
+ --md-sys-color-secondary-fixed-dim: #b2cbd1;
+ --md-sys-color-on-secondary-fixed-variant: #334a50;
+ --md-sys-color-tertiary-fixed: #dce1ff;
+ --md-sys-color-on-tertiary-fixed: #111a37;
+ --md-sys-color-tertiary-fixed-dim: #bcc5eb;
+ --md-sys-color-on-tertiary-fixed-variant: #3d4665;
+ --md-sys-color-surface-dim: #dadada;
+ --md-sys-color-surface-bright: #f9f9f9;
+ --md-sys-color-surface-container-lowest: #ffffff;
+ --md-sys-color-surface-container-low: #f3f3f3;
+ --md-sys-color-surface-container: #f9f9f9;
+ --md-sys-color-surface-container-high: #f9f9f9;
+ --md-sys-color-surface-container-highest: #f9f9f9;
+
+ --m3-radius: 12px;
+ --m3-radius-sm: 10px;
+ --m3-elev-0: none;
+ --m3-elev-1: 0 1px 2px rgba(0,0,0,.08), 0 1px 3px rgba(0,0,0,.06);
+ --m3-elev-2: 0 2px 6px rgba(0,0,0,.10), 0 1px 3px rgba(0,0,0,.06);
+
+ --tab-height: 34px;
+ --urlbar-height: 38px;
+
+ --state-hover: color-mix(in srgb, var(--md-sys-color-on-surface) 8%, transparent);
+ --state-press: color-mix(in srgb, var(--md-sys-color-on-surface) 12%, transparent);
+
+ --focus-ring: 0 0 0 2px color-mix(in srgb, var(--md-sys-color-primary) 70%, transparent);
+ }
+}
+
+@media (prefers-color-scheme: dark) {
+ :root {
+ --md-sys-color-primary: #52d7f0;
+ --md-sys-color-surface-tint: #52d7f0;
+ --md-sys-color-on-primary: #00363e;
+ --md-sys-color-primary-container: #004e5a;
+ --md-sys-color-on-primary-container: #a3eeff;
+ --md-sys-color-secondary: #b2cbd1;
+ --md-sys-color-on-secondary: #1c3439;
+ --md-sys-color-secondary-container: #334a50;
+ --md-sys-color-on-secondary-container: #cde7ed;
+ --md-sys-color-tertiary: #bcc5eb;
+ --md-sys-color-on-tertiary: #262f4d;
+ --md-sys-color-tertiary-container: #3d4665;
+ --md-sys-color-on-tertiary-container: #dce1ff;
+ --md-sys-color-error: #ffb4ab;
+ --md-sys-color-on-error: #690005;
+ --md-sys-color-error-container: #93000a;
+ --md-sys-color-on-error-container: #ffdad6;
+ --md-sys-color-background: #131313;
+ --md-sys-color-on-background: #e2e2e2;
+ --md-sys-color-surface: #131313;
+ --md-sys-color-on-surface: #e2e2e2;
+ --md-sys-color-surface-variant: #474747;
+ --md-sys-color-on-surface-variant: #c6c6c6;
+ --md-sys-color-outline: #919191;
+ --md-sys-color-outline-variant: #474747;
+ --md-sys-color-shadow: #000000;
+ --md-sys-color-scrim: #000000;
+ --md-sys-color-inverse-surface: #e2e2e2;
+ --md-sys-color-inverse-on-surface: #303030;
+ --md-sys-color-inverse-primary: #006877;
+ --md-sys-color-primary-fixed: #a3eeff;
+ --md-sys-color-on-primary-fixed: #001f25;
+ --md-sys-color-primary-fixed-dim: #52d7f0;
+ --md-sys-color-on-primary-fixed-variant: #004e5a;
+ --md-sys-color-secondary-fixed: #cde7ed;
+ --md-sys-color-on-secondary-fixed: #051f24;
+ --md-sys-color-secondary-fixed-dim: #b2cbd1;
+ --md-sys-color-on-secondary-fixed-variant: #334a50;
+ --md-sys-color-tertiary-fixed: #dce1ff;
+ --md-sys-color-on-tertiary-fixed: #111a37;
+ --md-sys-color-tertiary-fixed-dim: #bcc5eb;
+ --md-sys-color-on-tertiary-fixed-variant: #3d4665;
+ --md-sys-color-surface-dim: #131313;
+ --md-sys-color-surface-bright: #393939;
+ --md-sys-color-surface-container-lowest: #0e0e0e;
+ --md-sys-color-surface-container-low: #1b1b1b;
+ --md-sys-color-surface-container: #1f1f1f;
+ --md-sys-color-surface-container-high: #2a2a2a;
+ --md-sys-color-surface-container-highest: #353535;
+
+ --m3-elev-1: 0 1px 2px rgba(0,0,0,.50), 0 1px 3px rgba(0,0,0,.35);
+ --m3-elev-2: 0 4px 10px rgba(0,0,0,.55), 0 1px 3px rgba(0,0,0,.35);
+
+ --state-hover: color-mix(in srgb, var(--md-sys-color-on-surface) 6%, transparent);
+ --state-press: color-mix(in srgb, var(--md-sys-color-on-surface) 10%, transparent);
+ }
+}
+
+/* idk if this even works, but the suggestion in the material updated readme bricks symbols no matter how many fallbacks I add */
+:root {
+ font-family: system-ui, "Inter Variable", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
+}