diff options
| -rw-r--r-- | desktop-themes/YaruGreen/gtk-3.0/_headerbar_buttons.scss | 39 | ||||
| -rw-r--r-- | desktop-themes/YaruGreen/gtk-3.0/gtk.css | 8 | ||||
| -rw-r--r-- | desktop-themes/YaruGreen/gtk-3.0/gtk.scss | 1 | ||||
| -rw-r--r-- | desktop-themes/YaruOk/gtk-3.0/_headerbar_buttons.scss | 39 | ||||
| -rw-r--r-- | desktop-themes/YaruOk/gtk-3.0/gtk.css | 8 | ||||
| -rw-r--r-- | desktop-themes/YaruOk/gtk-3.0/gtk.scss | 1 |
6 files changed, 96 insertions, 0 deletions
diff --git a/desktop-themes/YaruGreen/gtk-3.0/_headerbar_buttons.scss b/desktop-themes/YaruGreen/gtk-3.0/_headerbar_buttons.scss new file mode 100644 index 00000000..a613bbb0 --- /dev/null +++ b/desktop-themes/YaruGreen/gtk-3.0/_headerbar_buttons.scss @@ -0,0 +1,39 @@ +$headerbar_button_gradient_a: gtkshade(desaturate($core_color_a, 20%), 1.15); +$headerbar_button_gradient_b: gtkshade(desaturate($core_color_a, 20%), 1.1); +$headerbar_button_gradient_c: gtkshade(desaturate($core_color_a, 20%), 1.08); +$headerbar_button_gradient_d: gtkshade(desaturate($core_color_a, 20%), 1.02); + +$headerbar_button_hover_gradient_a: gtkshade(desaturate($core_color_a, 40%), 1.25); +$headerbar_button_hover_gradient_b: gtkshade(desaturate($core_color_a, 40%), 1.2); +$headerbar_button_hover_gradient_c: gtkshade(desaturate($core_color_a, 40%), 1.19); +$headerbar_button_hover_gradient_d: gtkshade(desaturate($core_color_a, 40%), 1.12); + +$headerbar_button_backdrop_gradient_a: gtkshade(desaturate($core_color_a, 100%), 1.25); +$headerbar_button_backdrop_gradient_b: gtkshade(desaturate($core_color_a, 100%), 1.2); +$headerbar_button_backdrop_gradient_c: gtkshade(desaturate($core_color_a, 100%), 1.18); +$headerbar_button_backdrop_gradient_d: gtkshade(desaturate($core_color_a, 100%), 1.12); + +$headerbar_button_backdrop_hover_gradient_a: gtkshade(desaturate($core_color_a, 100%), 1.3); +$headerbar_button_backdrop_hover_gradient_b: gtkshade(desaturate($core_color_a, 100%), 1.25); +$headerbar_button_backdrop_hover_gradient_c: gtkshade(desaturate($core_color_a, 100%), 1.23); +$headerbar_button_backdrop_hover_gradient_d: gtkshade(desaturate($core_color_a, 100%), 1.17); + + +headerbar { + button { + background-image: linear-gradient(to bottom, $headerbar_button_gradient_a, $headerbar_button_gradient_b 50%, $headerbar_button_gradient_c 50%, $headerbar_button_gradient_d); + border-color: gtkshade(#707662, 0.6); + &:hover { + background-image: linear-gradient(to bottom, $headerbar_button_hover_gradient_a, $headerbar_button_hover_gradient_b 50%, $headerbar_button_hover_gradient_c 50%, $headerbar_button_hover_gradient_d); + border-color: gtkshade(#707662, 0.6); + } + &:backdrop { + background-image: linear-gradient(to bottom, $headerbar_button_backdrop_gradient_a, $headerbar_button_backdrop_gradient_b 50%, $headerbar_button_backdrop_gradient_c 50%, $headerbar_button_backdrop_gradient_d); + } + &:backdrop:hover { + background-image: linear-gradient(to bottom, $headerbar_button_backdrop_hover_gradient_a, $headerbar_button_backdrop_hover_gradient_b 50%, $headerbar_button_backdrop_hover_gradient_c 50%, $headerbar_button_backdrop_hover_gradient_d); + border-color: gtkshade(desaturate(#707662, 100%), 0.7); + } + } +} + diff --git a/desktop-themes/YaruGreen/gtk-3.0/gtk.css b/desktop-themes/YaruGreen/gtk-3.0/gtk.css index 49834f86..1f971960 100644 --- a/desktop-themes/YaruGreen/gtk-3.0/gtk.css +++ b/desktop-themes/YaruGreen/gtk-3.0/gtk.css @@ -2630,6 +2630,14 @@ headerbar switch slider:disabled, headerbar scale slider:disabled, .titlebar swi .selection-mode headerbar .selection-menu:backdrop .arrow, .selection-mode headerbar .selection-menu .arrow, headerbar.selection-mode .selection-menu:backdrop .arrow, headerbar.selection-mode .selection-menu .arrow, .selection-mode .titlebar .selection-menu:backdrop .arrow, .selection-mode .titlebar .selection-menu .arrow, .titlebar.selection-mode .selection-menu:backdrop .arrow, .titlebar.selection-mode .selection-menu .arrow { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); color: rgba(66, 69, 62, 0.5); -gtk-icon-shadow: none; } +headerbar button { background-image: linear-gradient(to bottom, #efefef, #e4e4e4 50%, #e0e0e0 50%, #d4d4d4); border-color: #42443d; } + +headerbar button:hover { background-image: linear-gradient(to bottom, white, #f9f9f9 50%, #f7f7f7 50%, #e8e8e8); border-color: #42443d; } + +headerbar button:backdrop { background-image: linear-gradient(to bottom, white, #f9f9f9 50%, whitesmoke 50%, #e8e8e8); } + +headerbar button:backdrop:hover { background-image: linear-gradient(to bottom, white, white 50%, white 50%, #f3f3f3); border-color: #4c4c4c; } + /* GTK NAMED COLORS ---------------- use responsibly! */ /* widget text/foreground color */ diff --git a/desktop-themes/YaruGreen/gtk-3.0/gtk.scss b/desktop-themes/YaruGreen/gtk-3.0/gtk.scss index 6a9e07fc..56bbc739 100644 --- a/desktop-themes/YaruGreen/gtk-3.0/gtk.scss +++ b/desktop-themes/YaruGreen/gtk-3.0/gtk.scss @@ -7,6 +7,7 @@ $ambiance: true; @import 'apps'; @import 'tweaks'; @import 'headerbar'; +@import 'headerbar_buttons'; @import 'colors-public'; @import 'libhandy/Adwaita-base'; @import "libhandy/headerbar"; diff --git a/desktop-themes/YaruOk/gtk-3.0/_headerbar_buttons.scss b/desktop-themes/YaruOk/gtk-3.0/_headerbar_buttons.scss new file mode 100644 index 00000000..e32a39c0 --- /dev/null +++ b/desktop-themes/YaruOk/gtk-3.0/_headerbar_buttons.scss @@ -0,0 +1,39 @@ +$headerbar_button_gradient_a: gtkshade(desaturate($core_color_a, 20%), 1.15); +$headerbar_button_gradient_b: gtkshade(desaturate($core_color_a, 20%), 1.1); +$headerbar_button_gradient_c: gtkshade(desaturate($core_color_a, 20%), 1.08); +$headerbar_button_gradient_d: gtkshade(desaturate($core_color_a, 20%), 1.02); + +$headerbar_button_hover_gradient_a: gtkshade(desaturate($core_color_a, 40%), 1.25); +$headerbar_button_hover_gradient_b: gtkshade(desaturate($core_color_a, 40%), 1.2); +$headerbar_button_hover_gradient_c: gtkshade(desaturate($core_color_a, 40%), 1.19); +$headerbar_button_hover_gradient_d: gtkshade(desaturate($core_color_a, 40%), 1.12); + +$headerbar_button_backdrop_gradient_a: gtkshade(desaturate($core_color_a, 100%), 1.25); +$headerbar_button_backdrop_gradient_b: gtkshade(desaturate($core_color_a, 100%), 1.2); +$headerbar_button_backdrop_gradient_c: gtkshade(desaturate($core_color_a, 100%), 1.18); +$headerbar_button_backdrop_gradient_d: gtkshade(desaturate($core_color_a, 100%), 1.12); + +$headerbar_button_backdrop_hover_gradient_a: gtkshade(desaturate($core_color_a, 100%), 1.3); +$headerbar_button_backdrop_hover_gradient_b: gtkshade(desaturate($core_color_a, 100%), 1.25); +$headerbar_button_backdrop_hover_gradient_c: gtkshade(desaturate($core_color_a, 100%), 1.23); +$headerbar_button_backdrop_hover_gradient_d: gtkshade(desaturate($core_color_a, 100%), 1.17); + + +headerbar { + button { + background-image: linear-gradient(to bottom, $headerbar_button_gradient_a, $headerbar_button_gradient_b 50%, $headerbar_button_gradient_c 50%, $headerbar_button_gradient_d); + border-color: gtkshade(#a7bdd8, 0.6); + &:hover { + background-image: linear-gradient(to bottom, $headerbar_button_hover_gradient_a, $headerbar_button_hover_gradient_b 50%, $headerbar_button_hover_gradient_c 50%, $headerbar_button_hover_gradient_d); + border-color: gtkshade(#a7bdd8, 0.6); + } + &:backdrop { + background-image: linear-gradient(to bottom, $headerbar_button_backdrop_gradient_a, $headerbar_button_backdrop_gradient_b 50%, $headerbar_button_backdrop_gradient_c 50%, $headerbar_button_backdrop_gradient_d); + } + &:backdrop:hover { + background-image: linear-gradient(to bottom, $headerbar_button_backdrop_hover_gradient_a, $headerbar_button_backdrop_hover_gradient_b 50%, $headerbar_button_backdrop_hover_gradient_c 50%, $headerbar_button_backdrop_hover_gradient_d); + border-color: gtkshade(desaturate(#a7bdd8, 100%), 0.7); + } + } +} + diff --git a/desktop-themes/YaruOk/gtk-3.0/gtk.css b/desktop-themes/YaruOk/gtk-3.0/gtk.css index 8d35e41e..9cfb175f 100644 --- a/desktop-themes/YaruOk/gtk-3.0/gtk.css +++ b/desktop-themes/YaruOk/gtk-3.0/gtk.css @@ -2630,6 +2630,14 @@ headerbar switch slider:disabled, headerbar scale slider:disabled, .titlebar swi .selection-mode headerbar .selection-menu:backdrop .arrow, .selection-mode headerbar .selection-menu .arrow, headerbar.selection-mode .selection-menu:backdrop .arrow, headerbar.selection-mode .selection-menu .arrow, .selection-mode .titlebar .selection-menu:backdrop .arrow, .selection-mode .titlebar .selection-menu .arrow, .titlebar.selection-mode .selection-menu:backdrop .arrow, .titlebar.selection-mode .selection-menu .arrow { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); color: rgba(255, 255, 255, 0.5); -gtk-icon-shadow: none; } +headerbar button { background-image: linear-gradient(to bottom, #d7e2f0, #cad8ea 50%, #c4d4e7 50%, #b5c7df); border-color: #58708d; } + +headerbar button:hover { background-image: linear-gradient(to bottom, #f6f7f9, #e9edf2 50%, #e7ebf0 50%, #d6dde5); border-color: #58708d; } + +headerbar button:backdrop { background-image: linear-gradient(to bottom, #f8f8f8, #eeeeee 50%, #eaeaea 50%, #dedede); } + +headerbar button:backdrop:hover { background-image: linear-gradient(to bottom, white, #f8f8f8 50%, #f4f4f4 50%, #e8e8e8); border-color: #868686; } + /* GTK NAMED COLORS ---------------- use responsibly! */ /* widget text/foreground color */ diff --git a/desktop-themes/YaruOk/gtk-3.0/gtk.scss b/desktop-themes/YaruOk/gtk-3.0/gtk.scss index 6a9e07fc..56bbc739 100644 --- a/desktop-themes/YaruOk/gtk-3.0/gtk.scss +++ b/desktop-themes/YaruOk/gtk-3.0/gtk.scss @@ -7,6 +7,7 @@ $ambiance: true; @import 'apps'; @import 'tweaks'; @import 'headerbar'; +@import 'headerbar_buttons'; @import 'colors-public'; @import 'libhandy/Adwaita-base'; @import "libhandy/headerbar"; |