From 6affbd6c4cb60786993690f35a90711094f18268 Mon Sep 17 00:00:00 2001 From: Hannes Schulze Date: Sun, 26 Apr 2026 01:28:37 +0200 Subject: add flat theme --- res/styles/meson.build | 2 +- res/styles/monokai-pro-flat.scss | 44 ++++++++++++++++++++++++++++++++ res/styles/monokai-pro.scss | 1 + res/styles/partials/_control-center.scss | 4 +-- res/styles/partials/_launcher.scss | 2 +- res/styles/partials/_panel.scss | 2 +- res/styles/styles.gresource.xml | 1 + res/styles/teatime.scss | 1 + 8 files changed, 52 insertions(+), 5 deletions(-) create mode 100644 res/styles/monokai-pro-flat.scss (limited to 'res') diff --git a/res/styles/meson.build b/res/styles/meson.build index fbc904c..0a2e55c 100644 --- a/res/styles/meson.build +++ b/res/styles/meson.build @@ -1,6 +1,6 @@ sassc = find_program('sassc') -styles = ['default', 'monokai-pro', 'teatime'] +styles = ['default', 'monokai-pro', 'monokai-pro-flat', 'teatime'] style_targets = [] common_inputs = files( diff --git a/res/styles/monokai-pro-flat.scss b/res/styles/monokai-pro-flat.scss new file mode 100644 index 0000000..c0b4718 --- /dev/null +++ b/res/styles/monokai-pro-flat.scss @@ -0,0 +1,44 @@ +// +// Variation of monokai-pro with flat (square) window borders. +// + +$foobar-color-background-primary: #19181A; +$foobar-color-background-secondary: #2d2a2e; +$foobar-color-background-tertiary: #3e3b40; +$foobar-color-background-quaternary: #474449; +$foobar-color-foreground-primary: #fcfcfa; +$foobar-color-foreground-secondary: transparentize($foobar-color-foreground-primary, 0.5); +$foobar-color-foreground-tertiary: transparentize($foobar-color-foreground-primary, 0.8); +$foobar-color-foreground-quaternary: transparentize($foobar-color-foreground-primary, 0.9); +$foobar-color-accent-primary: #c3b4b0; +$foobar-color-accent-secondary: transparentize($foobar-color-accent-primary, 0.5); +$foobar-color-accent-tertiary: transparentize($foobar-color-accent-primary, 0.8); +$foobar-color-accent-quaternary: transparentize($foobar-color-accent-primary, 0.9); +$foobar-color-special-primary: #fc9867; +$foobar-color-special-secondary: transparentize($foobar-color-special-primary, 0.5); +$foobar-color-special-tertiary: transparentize($foobar-color-special-primary, 0.8); +$foobar-color-special-quaternary: transparentize($foobar-color-special-primary, 0.9); +$foobar-color-urgent-primary: #ff6188; +$foobar-color-urgent-secondary: transparentize($foobar-color-urgent-primary, 0.5); +$foobar-color-urgent-tertiary: transparentize($foobar-color-urgent-primary, 0.8); +$foobar-color-urgent-quaternary: transparentize($foobar-color-urgent-primary, 0.9); +$foobar-color-border: #101011; +$foobar-dim-border-strong: 2px; +$foobar-dim-border-light: 1px; +$foobar-dim-radius-large: 12px; +$foobar-dim-radius-small: 6px; +$foobar-dim-radius-outer: 0px; +$foobar-dim-spacing-relaxed: 18px; +$foobar-dim-spacing-large: 12px; +$foobar-dim-spacing-medium: 6px; +$foobar-dim-spacing-small: 3px; +$foobar-dim-margin-large-horizontal: 24px; +$foobar-dim-margin-large-vertical: 18px; +$foobar-dim-margin-medium-horizontal: 18px; +$foobar-dim-margin-medium-vertical: 12px; +$foobar-dim-margin-small-horizontal: 6px; +$foobar-dim-margin-small-vertical: 6px; +$foobar-dim-font-large: 16px; +$foobar-dim-font-small: 13px; + +@import './common'; diff --git a/res/styles/monokai-pro.scss b/res/styles/monokai-pro.scss index 5cf35b8..5cfbb67 100644 --- a/res/styles/monokai-pro.scss +++ b/res/styles/monokai-pro.scss @@ -29,6 +29,7 @@ $foobar-dim-border-strong: 2px; $foobar-dim-border-light: 1px; $foobar-dim-radius-large: 12px; $foobar-dim-radius-small: 6px; +$foobar-dim-radius-outer: $foobar-dim-radius-large; $foobar-dim-spacing-relaxed: 18px; $foobar-dim-spacing-large: 12px; $foobar-dim-spacing-medium: 6px; diff --git a/res/styles/partials/_control-center.scss b/res/styles/partials/_control-center.scss index e91a105..dda34c3 100644 --- a/res/styles/partials/_control-center.scss +++ b/res/styles/partials/_control-center.scss @@ -5,14 +5,14 @@ window.control-center { // XXX: To prevent some glitches background: rgba(0, 0, 0, 0.005); - border-radius: $foobar-dim-radius-large; + border-radius: $foobar-dim-radius-outer; & > box { background: $foobar-color-background-primary; // XXX: Applying the border directly to the window seems to confuse hyprland, GTK, or something else. // To reproduce: set position to "right", alignment to "start", and foobar-dim-border-light to some large value. border: $foobar-dim-border-light solid $foobar-color-border; - border-radius: $foobar-dim-radius-large; + border-radius: $foobar-dim-radius-outer; } & control-button, diff --git a/res/styles/partials/_launcher.scss b/res/styles/partials/_launcher.scss index 55d6bd0..7873f7d 100644 --- a/res/styles/partials/_launcher.scss +++ b/res/styles/partials/_launcher.scss @@ -7,7 +7,7 @@ window.launcher { background: $foobar-color-background-primary; border: $foobar-dim-border-light solid $foobar-color-border; - border-radius: $foobar-dim-radius-large; + border-radius: $foobar-dim-radius-outer; $search-icon-size: 24px; $app-icon-size: 32px; diff --git a/res/styles/partials/_panel.scss b/res/styles/partials/_panel.scss index ae9ffdf..7c29a91 100644 --- a/res/styles/partials/_panel.scss +++ b/res/styles/partials/_panel.scss @@ -5,7 +5,7 @@ window.panel { background: $foobar-color-background-primary; border: $foobar-dim-border-light solid $foobar-color-border; - border-radius: $foobar-dim-radius-large; + border-radius: $foobar-dim-radius-outer; & panel-item.workspaces { & row, diff --git a/res/styles/styles.gresource.xml b/res/styles/styles.gresource.xml index e708a1d..33d8aad 100644 --- a/res/styles/styles.gresource.xml +++ b/res/styles/styles.gresource.xml @@ -3,6 +3,7 @@ default.css monokai-pro.css + monokai-pro-flat.css teatime.css diff --git a/res/styles/teatime.scss b/res/styles/teatime.scss index 6889f9b..2457bce 100644 --- a/res/styles/teatime.scss +++ b/res/styles/teatime.scss @@ -30,6 +30,7 @@ $foobar-dim-border-strong: 2px; $foobar-dim-border-light: 2px; $foobar-dim-radius-large: 12px; $foobar-dim-radius-small: 6px; +$foobar-dim-radius-outer: $foobar-dim-radius-large; $foobar-dim-spacing-relaxed: 18px; $foobar-dim-spacing-large: 12px; $foobar-dim-spacing-medium: 6px; -- cgit v1.3.1