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-3.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-3.0/_headerbar.scss')
| -rw-r--r-- | desktop-themes/YaruGreen/gtk-3.0/_headerbar.scss | 268 |
1 files changed, 268 insertions, 0 deletions
diff --git a/desktop-themes/YaruGreen/gtk-3.0/_headerbar.scss b/desktop-themes/YaruGreen/gtk-3.0/_headerbar.scss new file mode 100644 index 00000000..09599aec --- /dev/null +++ b/desktop-themes/YaruGreen/gtk-3.0/_headerbar.scss @@ -0,0 +1,268 @@ +// 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 +headerbar, +.titlebar { + @include headerbar_fill($headerbar_bg_color, $hc: $headerbar_border_color); + color: $headerbar_fg_color; + border-color: $borders_color; + + .title, + label.title { + color: darken($borders_color, 25%); text-shadow:none; + &:backdrop { color: darken($borders_color, 15%); text-shadow:none; } + } + + &.backdrop { + } + + .maximized &, + .fullscreen & { + box-shadow: none; + } + + entry { + &, + &:backdrop { + border-color: darken($headerbar_bg_color, 8%); + } + + &:focus { @include entry(focus); } + } + + + + separator { + background: image(lighten($_button_border_color, 5%)); + &:backdrop { + background: image($_backdrop_button_border_color); + } + } + + // Re-style switches because they are drawn on a dark headerbar + switch { + border-color: $_button_border_color; + color: $headerbar_fg_color; + background-color: $_button_bg_color; + + &:hover { background-color: lighten($_button_bg_color, 2%); } + + &:backdrop { + background-color: lighten($backdrop_headerbar_bg_color, 2%); + + &, + &:checked { border-color: darken($_backdrop_button_border_color, 4%); } + + &:disabled { + background-color: $backdrop_headerbar_bg_color; + border-color: $_backdrop_button_border_color; + } + } + + &:disabled { + background-color: $headerbar_bg_color; + border-color: $_button_border_color; + } + + &:checked { + color: $selected_fg_color; + border-color: $_button_border_color; + background-color: $checkradio_bg_color; + } + } + + // Re-style sliders for switches and scales do make them look sharp on the dark headerbar + switch, scale { + slider { + &:checked { + border-color: $checkradio_borders_color; + } + &:backdrop { + @include button(backdrop-alt, $_button_bg_color); + + &, + &:checked, + &:disabled, + &:checked:disabled { + border-color: darken($_backdrop_button_border_color, 4%); box-shadow: none; + } + } + + &:not(:checked) { + border-color: $_button_border_color; + } + &:disabled { + @include button(insensitive, darken($headerbar_bg_color, 8%)); + } + } + } + + // re-insert the full selection mode section from common ... + .selection-mode &, + &.selection-mode { + $_hc: mix($top_hilight, $suggested_bg_color, 50%); // hilight color + + color: $selected_fg_color; + border-color: $suggested_border_color; + + @include headerbar_fill($suggested_bg_color, $_hc); + + separator { + background: image(lighten($suggested_bg_color, 5%)); + } + + &:backdrop { + background-color: $suggested_bg_color; + background-image: none; + box-shadow: inset 0 1px mix($top_hilight, $suggested_bg_color, 60%); + + label { + text-shadow: none; + color: $selected_fg_color; + } + } + + .subtitle:link { @extend %link_selected; } + + button, + button.image-button, + button.image-button.toggle, + button.text.button, + button.toggle, + box button.toggle, + buttonbox.toggle, + stackswitcher button, + filechooser .path-bar.linked>button, + .path-bar button { + @include button(normal, $suggested_bg_color, $selected_fg_color); + &.flat { + @include button(undecorated); + } + + &:hover { + @include button(hover, $suggested_bg_color, $selected_fg_color); + } + + &:active, + &:checked, + &.toggle:checked, + &.toggle:active { + @include button(active, $suggested_bg_color, $selected_fg_color); + } + + &:backdrop { + + &.flat, + & { + @include button(backdrop, $suggested_bg_color, $selected_fg_color); + + //-gtk-icon-effect: none; + border-color: lighten($suggested_bg_color, 5%); + + &:active, + &:checked { + @include button(backdrop-active, $suggested_bg_color, $selected_fg_color); + + border-color: $suggested_border_color; + } + + &:disabled { + @include button(backdrop-insensitive, $suggested_bg_color, $selected_fg_color); + + border-color: $suggested_border_color; + + &:active, + &:checked { + @include button(backdrop-insensitive-active, $suggested_bg_color, $selected_fg_color); + + border-color: $suggested_border_color; + } + } + } + } + + &.flat { + + &:backdrop, + &:disabled, + &:backdrop:disabled { + @include button(undecorated); + } + } + + &:disabled { + @include button(insensitive, $suggested_bg_color, $selected_fg_color); + + &:active, + &:checked { + @include button(insensitive-active, $suggested_bg_color, $selected_fg_color); + } + } + + &.suggested-action { + @include button(normal); + + border-color: $suggested_border_color; + + &:hover { + @include button(hover); + + border-color: $suggested_border_color; + } + + &:active { + @include button(active); + + border-color: darken($suggested_border_color, 10%); + } + + &:disabled { + @include button(insensitive); + + border-color: $suggested_border_color; + } + + &:backdrop { + @include button(backdrop); + + border-color: $suggested_border_color; + } + + &:backdrop:disabled { + @include button(backdrop-insensitive); + + border-color: $suggested_border_color; + } + } + } + + .selection-menu { + + &:backdrop, + & { + border-color: transparentize($suggested_bg_color, 1); + background-color: transparentize($suggested_bg_color, 1); + background-image: none; + box-shadow: none; + min-height: 20px; + padding: $_sel_menu_pad; + + arrow { + -GtkArrow-arrow-scaling: 1; + } + + .arrow { + -gtk-icon-source: -gtk-icontheme('pan-down-symbolic'); + color: transparentize($selected_fg_color, 0.5); + -gtk-icon-shadow: none; + } + } + } + } +} + + |