Mercurial > repos > other > Adwaita-Dark-Green
changeset 104:87e188db01a5
Fix various GTK3 issues
* Fix suggested action button colouring outside headerbar
* Use gradient to darken dividers through headerbar
* Lighten links in header bar
* Improve Fractal
* Make box around input area the same colour (was relying on accidental match)
* Make text messages (not emotes) lighter
* Mostly fix DConf pathbar (still has a border)
| author | IBBoard <dev@ibboard.co.uk> |
|---|---|
| date | Sat, 16 Apr 2022 19:44:18 +0100 |
| parents | d007f45f5171 |
| children | 94ce48857c6d |
| files | gtk-3.24/fractal.css gtk-3.24/gtk.css gtk-3.24/gtk.scss |
| diffstat | 3 files changed, 96 insertions(+), 8 deletions(-) [+] |
line wrap: on
line diff
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/gtk-3.24/fractal.css Sat Apr 16 19:44:18 2022 +0100 @@ -0,0 +1,12 @@ +.messages-history row { + background-color: @theme_lightened_bg_color; +} + +.messages-history row.msg-emote { + background-color: @theme_bg_color; +} + +box.message-input { + background-color: @theme_input_bg_color +} +
--- a/gtk-3.24/gtk.css Sun Mar 27 15:16:09 2022 +0100 +++ b/gtk-3.24/gtk.css Sat Apr 16 19:44:18 2022 +0100 @@ -2,6 +2,7 @@ @import url("./nautilus.css"); @import url("./gnome-builder.css"); @import url("./cawbird.css"); +@import url("./fractal.css"); * { padding: 0; -GtkToolButton-icon-spacing: 4; -GtkTextView-error-underline-color: #cc0000; -GtkScrolledWindow-scrollbar-spacing: 0; -GtkToolItemGroup-expander-size: 11; -GtkWidget-text-handle-width: 20; -GtkWidget-text-handle-height: 24; -GtkDialog-button-spacing: 4; -GtkDialog-action-area-border: 0; outline-color: alpha(currentColor,0.3); outline-style: dashed; outline-offset: -3px; outline-width: 1px; -gtk-outline-radius: 3px; -gtk-secondary-caret-color: #5E7F3E; } /*************** Base States * */ @@ -2057,6 +2058,8 @@ @define-color theme_base_color #C6C6C6; @define-color theme_fg_dark_color #dddddd; @define-color theme_bg_dark_color #3D3D3D; +@define-color theme_lightened_bg_color #e0e0e0; +@define-color theme_input_bg_color #F0F0F0; @define-color wm_title #dddddd; @define-color wm_unfocused_title #dddddd; @define-color wm_highlight shade(#3D3D3D, 1.03); @@ -2184,6 +2187,8 @@ #pathbarbox { background-color: #C6C6C6; } +.large-window .titlebar:not(headerbar) box.pathbar, .large-window headerbar box.pathbar { background-image: linear-gradient(to bottom, #454545 0%, #3D3D3D 45%); border-width: 0 !important; } + list-row.sidebar-item { background-color: #b9b9b9; border-color: #7a7a7a; } list-row.sidebar-item:backdrop, list-row.sidebar-item:backdrop:hover { background-color: #b9b9b9; border-color: #818181; } @@ -2276,9 +2281,9 @@ button.suggested-action:backdrop, button.suggested-action.flat:backdrop { color: #dfe5d8; border-color: #5E7F3E; background-image: image(#5E7F3E); text-shadow: none; -gtk-icon-shadow: none; box-shadow: inset 0 1px rgba(255, 255, 255, 0); border-color: #2b3a1d; } -button.suggested-action:backdrop:active, button.suggested-action:backdrop:checked, button.suggested-action.flat:backdrop:active, button.suggested-action.flat:backdrop:checked { color: #83877e; border-color: #5a7043; background-image: image(#5a7043); box-shadow: inset 0 1px rgba(255, 255, 255, 0); } - -button.suggested-action:backdrop:disabled, button.suggested-action:backdrop:disabled label, button.suggested-action.flat:backdrop:disabled, button.suggested-action.flat:backdrop:disabled label { color: #8d8d8d; background-color: #3D3D3D; background-image: none; border-color: #303030; box-shadow: none; } +button.suggested-action:backdrop:active, button.suggested-action:backdrop:checked, button.suggested-action.flat:backdrop:active, button.suggested-action.flat:backdrop:checked { color: #6a6e65; border-color: #5a7043; background-image: image(#5a7043); box-shadow: inset 0 1px rgba(255, 255, 255, 0); } + +button.suggested-action:backdrop:disabled, button.suggested-action:backdrop:disabled label, button.suggested-action.flat:backdrop:disabled, button.suggested-action.flat:backdrop:disabled label { color: #6e6e6e; background-color: #C6C6C6; background-image: none; box-shadow: none; } button.suggested-action:backdrop:disabled:active, button.suggested-action:backdrop:disabled:checked, button.suggested-action:backdrop:disabled label:active, button.suggested-action:backdrop:disabled label:checked, button.suggested-action.flat:backdrop:disabled:active, button.suggested-action.flat:backdrop:disabled:checked, button.suggested-action.flat:backdrop:disabled label:active, button.suggested-action.flat:backdrop:disabled label:checked { color: #93a285; border-color: #5a7043; background-image: image(#5a7043); box-shadow: inset 0 1px rgba(255, 255, 255, 0); } @@ -2289,3 +2294,27 @@ infobar.action:hover > revealer > box { background-color: #d9d7da; } infobar .info > revealer > box, infobar .info:backdrop > revealer > box, infobar.question > revealer > box, infobar.question:backdrop > revealer > box, infobar.warning > revealer > box, infobar.warning:backdrop > revealer > box, infobar.error > revealer > box, infobar.error:backdrop > revealer > box { background-color: #d4d2d5; } + +headerbar *:link { color: #91b76c; } + +headerbar *:link:visited { color: #77a14f; } + +*:selected headerbar *:link:visited { color: #7da15a; } + +headerbar *:link:hover { color: #abc88e; } + +*:selected headerbar *:link:hover { color: #8cb267; } + +headerbar *:link:active { color: #91b76c; } + +*:selected headerbar *:link:active { color: #87ac63; } + +headerbar *:link:backdrop, headerbar *:link:backdrop:hover, headerbar *:link:backdrop:hover:selected { color: #91b76c; } + +headerbar *:link:selected, *:selected headerbar *:link { color: #dfe5d8; } + +separator.sidebar { background-image: linear-gradient(to bottom, #303030, #303030 46px, #7a7a7a 46px); } + +separator.sidebar:backdrop { background-image: linear-gradient(to bottom, #303030, #303030 46px, #818181 46px); } + +window { border-top-left-radius: 9px; border-top-right-radius: 9px; }
--- a/gtk-3.24/gtk.scss Sun Mar 27 15:16:09 2022 +0100 +++ b/gtk-3.24/gtk.scss Sat Apr 16 19:44:18 2022 +0100 @@ -39,6 +39,7 @@ $dark_fill: mix($borders_color, $bg_color, 35%); $link_color: darken($selected_bg_color,10%); $link_visited_color: darken($selected_bg_color,20%); +$header_link_color: lighten($selected_bg_color, 20%); $top_hilight: $borders_edge; $popover_bg_color: $bg_color; $popover_hover_color: lighten($bg_color, 5%); @@ -119,6 +120,8 @@ @define-color theme_base_color #{"" + $base_color}; @define-color theme_fg_dark_color #{"" + $fg_dark_color}; @define-color theme_bg_dark_color #{"" + $bg_dark_color}; +@define-color theme_lightened_bg_color #{"" + lighten($bg_color, 10%)}; +@define-color theme_input_bg_color #{"" + $text_input_color}; @define-color wm_title #{"" + $fg_dark_color}; @define-color wm_unfocused_title #{"" + $fg_dark_color}; @define-color wm_highlight shade(#{"" + $bg_dark_color}, 1.03); @@ -495,6 +498,14 @@ #pathbarbox { background-color: $bg_color; } +.large-window { + %titlebar, headerbar { + box.pathbar { + background-image: linear-gradient(to bottom, lighten($bg_dark_color, 3%) 0%, $bg_dark_color 45%); + border-width: 0 !important; + } + } +} list-row { // Set sidebar items back to something reasonable &.sidebar-item { @@ -699,13 +710,12 @@ border-color: $selected_bg_border; &:active, - &:checked { @include button(backdrop-active, $selected_bg_color, $insensitive_dark_fg_color); } + &:checked { @include button(backdrop-active, $selected_bg_color, $insensitive_fg_color); } &:disabled, &:disabled label { - color: $insensitive_dark_fg_color; - background-color: $bg_dark_color; + color: $insensitive_fg_color; + background-color: $bg_color; background-image: none; - border-color: $header_button_border; box-shadow: none; &:active, @@ -747,6 +757,40 @@ } } +headerbar *:link { + color: $header_link_color; + &:visited { + color: darken($header_link_color, 10%); + *:selected & { color: mix($header_link_color, $selected_bg_color, 60%); } + } + &:hover { + color: lighten($header_link_color,10%); + *:selected & { color: mix($header_link_color, $selected_bg_color, 90%); } + } + &:active { + color: $header_link_color; + *:selected & { color: mix($header_link_color, $selected_bg_color, 80%); } + } + &:backdrop, &:backdrop:hover, &:backdrop:hover:selected { + color: $header_link_color; + } + &:selected, *:selected & { + color: mix($selected_fg_color, $selected_bg_color, 80%); + } +} + +separator.sidebar { + background-image: linear-gradient(to bottom, $header_button_border, $header_button_border 46px, $borders_color 46px); + + &:backdrop { + background-image: linear-gradient(to bottom, $header_button_border_unfocused, $header_button_border_unfocused 46px, $backdrop_borders_color 46px); + } +} + +window { + border-top-left-radius: 9px; + border-top-right-radius: 9px; +} // Import extra Nautilus CSS manually, because they only do this if @@ -758,4 +802,7 @@ @import url("./gnome-builder.css"); // Customise Cawbird bar to be dark, because it's like a menu bar but isn't -@import url("./cawbird.css"); \ No newline at end of file +@import url("./cawbird.css"); + +// Customise Fractal because it looks a bit odd in places +@import url("./fractal.css"); \ No newline at end of file