diff options
| author | blue-devil-93 <[email protected]> | 2021-06-24 10:32:21 +0200 |
|---|---|---|
| committer | GitHub <[email protected]> | 2021-06-24 10:32:21 +0200 |
| commit | 9bf6f4ec2f77fd09a12ba2b68416e81a13b4ca3d (patch) | |
| tree | 497fa90cd62785e4c9a522d265f323598fe575d8 /desktop-themes/YaruGreen/gtk-4.0/_headerbar.scss | |
| parent | fb195c9951cd9d87cd650f1cb901dbfc5966ab04 (diff) | |
| download | mate-themes-9bf6f4ec2f77fd09a12ba2b68416e81a13b4ca3d.tar.bz2 mate-themes-9bf6f4ec2f77fd09a12ba2b68416e81a13b4ca3d.tar.xz | |
Propose a different traditional ok implentation (#290)
* tr
* Propose another Traditonal Ok implementation based on Yaru
* Makefile
* fix makefile
* remove whitespace+
* remove trailing whitespaces
* rename it to traditionalok
* move Theme to yaruok
* Fix regression in mate appearance yaruok
* Sync with official branch
* readd traditionalokf
* fix YaruOK case mismatch
* improve tabs on gtk4
* fix Makefile.am
* Add YaruGreen
* Fix YaruGreen GTK3
* Fix Build - first try
* Fix Build - second try
* Fix Build - third try
* improve colors of yaru green, decrease tab size
* import scrollbar code from traditional green to yaru green
* fix build
* Tab_alignment_fix_for_yaru_green
* add panel grip
* decrease_tab_size fix_panel fix_link_color
* sync_yru_ok_with_green
* addpanel_gripper_to yaru
* darken yarugreen scrollbar as requested
* decrease border radius for popover on yaru grren and ok
* decrease border radius for popover on yaru grren and ok .
* fiy overlay - first try
* fix osd colors
* improve tabs and panel grabber
* decrease popover and menu radius to 2px
* fix mate-calc
* fix mate-calc.
Diffstat (limited to 'desktop-themes/YaruGreen/gtk-4.0/_headerbar.scss')
| -rw-r--r-- | desktop-themes/YaruGreen/gtk-4.0/_headerbar.scss | 133 |
1 files changed, 133 insertions, 0 deletions
diff --git a/desktop-themes/YaruGreen/gtk-4.0/_headerbar.scss b/desktop-themes/YaruGreen/gtk-4.0/_headerbar.scss new file mode 100644 index 00000000..dd27bc9e --- /dev/null +++ b/desktop-themes/YaruGreen/gtk-4.0/_headerbar.scss @@ -0,0 +1,133 @@ +// Color variables dependant on $headerbar_bg_color defined in _colors.scss +$_button_bg_color: lighten($headerbar_bg_color, 7.5%); +$_button_border_color: darken($headerbar_bg_color, 9%); +// deducted from the color used in common which is $backdrop_borders_color: mix($borders_color, $bg_color, 80%); +$_backdrop_button_border_color: darken($inkstone, 9%); + +// overwriting the headerbar styling from common, for the inverted look in the ambiance theme + +%titlebar, +headerbar { + @include headerbar_fill($headerbar_bg_color); + + color: $headerbar_fg_color; + border-color: $borders_color; + + .title, + label.title { + color: $headerbar_fg_color; + &:backdrop { color: $backdrop_headerbar_fg_color; } + } + + &.backdrop { + } + + .maximized &, + .fullscreen & { + box-shadow: none; + } + + entry { + &, + &:backdrop { + border-color: darken($headerbar_bg_color, 8%); + } + + &:focus { @include entry(focus); } + } + + + + + + switch { + border-color: $_button_border_color; + color: $headerbar_fg_color; + background-color: $_button_bg_color; + + &:checked { + color: $selected_fg_color; + border-color: $_button_border_color; + background-color: $checkradio_bg_color; + } + + &:disabled { + color: $insensitive_fg_color; + background-color: $headerbar_bg_color; + border-color: $_button_border_color; + } + + &:backdrop { + color: $backdrop_fg_color; + border-color: $backdrop_borders_color; + background-color: lighten($backdrop_headerbar_bg_color, 2%); + + &:checked { + color: $selected_fg_color; + border-color: $_button_border_color; + background-color: $checkradio_bg_color; + } + + &:disabled { + color: $backdrop_insensitive_color; + background-color: $backdrop_headerbar_bg_color; + border-color: $_backdrop_button_border_color; + } + } + } + + switch, scale { + &:checked { + border-color: $checkradio_borders_color; + } + slider { + @include button(normal, $_button_bg_color); + } + + &:hover slider { + @include button(hover, $_button_bg_color); + } + + &:checked > slider { border-color: $_button_border_color; } + + &:disabled slider { @include button(insensitive, darken($headerbar_bg_color, 8%)); } + + &:backdrop { + slider { + @include button(backdrop, $_button_bg_color); + } + + &, &:checked, &:disabled, &:checked:disabled { + > slider { border-color: darken($_backdrop_button_border_color, 4%); box-shadow: none; } + } + + &:checked > slider { border-color: $_button_border_color; } + + &:disabled slider { @include button(backdrop-insensitive, $_button_bg_color); } + } + } + + // TODO: Test separator + // TODO: Test switches +} + +windowcontrols button image { + color: $headerbar_fg_color; +} + +window.devel { + headerbar.titlebar { + $c: darken($bg_color, 10%); + + $gradient: cross-fade(10% -gtk-icontheme("system-run-symbolic"), image(transparent)) 90% 0/256px 256px no-repeat, + linear-gradient(to right, transparent 65%, transparentize($selected_bg_color, 0.9)), + linear-gradient(to top, lighten($c, 3%) 3px, lighten($c, 5%)); + + background: $bg_color $gradient; + + &:backdrop { + background: $bg_color cross-fade(10% -gtk-icontheme("system-run-symbolic"), image(transparent)) 90% 0/256px 256px no-repeat, + image($bg_color); /* background-color would flash */ + } + } +} |