From e14ea3a8a6ca65ce29eba7a1ed254f4fabdc615c Mon Sep 17 00:00:00 2001 From: EliverLara Date: Wed, 22 Jul 2020 13:32:50 -0500 Subject: [PATCH] Improve mate and xfce panel appearance --- gtk-3.0/_apps.scss | 1 + gtk-3.0/_colors.scss | 2 +- gtk-3.0/apps/_mate.scss | 38 +++++++++++++++++++++++ gtk-3.0/apps/_xfce.scss | 4 +-- gtk-3.0/gtk-dark.css | 69 +++++++++++++++++++++++++++++++++-------- gtk-3.0/gtk.css | 69 +++++++++++++++++++++++++++++++++-------- 6 files changed, 154 insertions(+), 29 deletions(-) create mode 100644 gtk-3.0/apps/_mate.scss diff --git a/gtk-3.0/_apps.scss b/gtk-3.0/_apps.scss index ff65b52..76586d4 100755 --- a/gtk-3.0/_apps.scss +++ b/gtk-3.0/_apps.scss @@ -7,6 +7,7 @@ @import 'apps/xfce'; @import 'apps/pantheon'; @import 'apps/unity'; +@import 'apps/mate'; /*********************** * App-Specific Styles * diff --git a/gtk-3.0/_colors.scss b/gtk-3.0/_colors.scss index 70674c3..b1aab00 100755 --- a/gtk-3.0/_colors.scss +++ b/gtk-3.0/_colors.scss @@ -79,7 +79,7 @@ $info_color: $lime; $question_color: $cyan; // Panel colors -$panel_bg_color: transparentize(black, 0); +$panel_bg_color: #222e39; $panel_fg_color: #C3C7D1; $panel_borders_color: transparentize(black, 0.8); diff --git a/gtk-3.0/apps/_mate.scss b/gtk-3.0/apps/_mate.scss new file mode 100644 index 0000000..b77a7de --- /dev/null +++ b/gtk-3.0/apps/_mate.scss @@ -0,0 +1,38 @@ +.mate-panel-menu-bar, +panel-toplevel.background { + + &, menubar { background-color: opacify($panel_bg_color, 1); } + + menubar, + #PanelApplet label, + #PanelApplet image { color: $panel_fg_color; } + + // Panel buttons + button:not(#tasklist-button) { + @extend %panelbutton; + } + + button, + #tasklist-button { + label, image { color: inherit; } + } + + .wnck-pager { + color: mix($panel_fg_color, black, 50%); + background-color: darken($panel_bg_color, 3%); + + &:hover { + background-color: lighten($panel_bg_color, 5%); + } + + &:selected { + color: lighten($selected_bg_color, 20%); + background-color: $selected_bg_color; + } + } + + na-tray-applet { + -NaTrayApplet-icon-padding: 0; + -NaTrayApplet-icon-size: 16px; + } +} \ No newline at end of file diff --git a/gtk-3.0/apps/_xfce.scss b/gtk-3.0/apps/_xfce.scss index d5ac003..0f421f0 100644 --- a/gtk-3.0/apps/_xfce.scss +++ b/gtk-3.0/apps/_xfce.scss @@ -33,11 +33,11 @@ &:hover { border: none; - background-color: lighten($panel_bg_color, 25%); + background-color: lighten($panel_bg_color, 7%); } &:active, &:checked { color: $selected_fg_color; - background-color: lighten($panel_bg_color, 20%); + background-color: lighten($panel_bg_color, 5%); border-bottom: 2px solid $selected_bg_color; label, image { color: inherit; } diff --git a/gtk-3.0/gtk-dark.css b/gtk-3.0/gtk-dark.css index 1aee32e..956ac7d 100755 --- a/gtk-3.0/gtk-dark.css +++ b/gtk-3.0/gtk-dark.css @@ -5707,7 +5707,7 @@ window.background.budgie-settings-window.csd > box.horizontal > stack > scrolled border: none; } .xfce4-panel.panel { - background-color: black; + background-color: #222e39; text-shadow: none; -gtk-icon-shadow: none; } @@ -5715,7 +5715,7 @@ window.background.budgie-settings-window.csd > box.horizontal > stack > scrolled color: rgba(195, 199, 209, 0.8); border-radius: 0; border: none; - background-color: rgba(0, 0, 0, 0); } + background-color: rgba(34, 46, 57, 0); } #tasklist-button:hover { color: #e0e2e7; background-color: rgba(0, 0, 0, 0.17); } @@ -5724,19 +5724,23 @@ window.background.budgie-settings-window.csd > box.horizontal > stack > scrolled background-color: rgba(0, 0, 0, 0.25); box-shadow: inset 0 -2px #00D3A7; } -.xfce4-panel.panel button.flat { +.xfce4-panel.panel button.flat, .mate-panel-menu-bar button:not(#tasklist-button), +panel-toplevel.background button:not(#tasklist-button) { color: #C3C7D1; border-radius: 0; border: none; - background-color: rgba(0, 0, 0, 0); } - .xfce4-panel.panel button.flat:hover { + background-color: rgba(34, 46, 57, 0); } + .xfce4-panel.panel button.flat:hover, .mate-panel-menu-bar button:hover:not(#tasklist-button), + panel-toplevel.background button:hover:not(#tasklist-button) { border: none; - background-color: #404040; } - .xfce4-panel.panel button.flat:active, .xfce4-panel.panel button.flat:checked { + background-color: #2f404f; } + .xfce4-panel.panel button.flat:active, .mate-panel-menu-bar button:active:not(#tasklist-button), + panel-toplevel.background button:active:not(#tasklist-button), .xfce4-panel.panel button.flat:checked, .mate-panel-menu-bar button:checked:not(#tasklist-button), + panel-toplevel.background button:checked:not(#tasklist-button) { color: #fefefe; - background-color: #333333; + background-color: #2c3b49; border-bottom: 2px solid #00D3A7; } - .xfce4-panel.panel button.flat:active label, .xfce4-panel.panel button.flat:active image, .xfce4-panel.panel button.flat:checked label, .xfce4-panel.panel button.flat:checked image { + .xfce4-panel.panel button.flat:active label, .mate-panel-menu-bar button:active:not(#tasklist-button) label, panel-toplevel.background button:active:not(#tasklist-button) label, .xfce4-panel.panel button.flat:active image, .mate-panel-menu-bar button:active:not(#tasklist-button) image, panel-toplevel.background button:active:not(#tasklist-button) image, .xfce4-panel.panel button.flat:checked label, .mate-panel-menu-bar button:checked:not(#tasklist-button) label, panel-toplevel.background button:checked:not(#tasklist-button) label, .xfce4-panel.panel button.flat:checked image, .mate-panel-menu-bar button:checked:not(#tasklist-button) image, panel-toplevel.background button:checked:not(#tasklist-button) image { color: inherit; } #whiskermenu-window button { @@ -5874,9 +5878,9 @@ window.thunar paned > scrolledwindow treeview.view:selected { background-color: transparent; transition: all 100ms ease-in-out; } .panel.maximized { - background-color: black; } + background-color: #222e39; } .panel.translucent { - background-color: rgba(0, 0, 0, 0.5); } + background-color: rgba(34, 46, 57, 0.5); } .panel.color-light.translucent { background-color: rgba(195, 199, 209, 0.85); } @@ -6131,6 +6135,45 @@ SheetStyleDialog.unity-force-quit { animation: playbackmenuitem_spinner 1s infinite linear; color: #00D3A7; } +.mate-panel-menu-bar, .mate-panel-menu-bar menubar, +panel-toplevel.background, +panel-toplevel.background menubar { + background-color: #222e39; } + +.mate-panel-menu-bar menubar, +.mate-panel-menu-bar #PanelApplet label, +.mate-panel-menu-bar #PanelApplet image, +panel-toplevel.background menubar, +panel-toplevel.background #PanelApplet label, +panel-toplevel.background #PanelApplet image { + color: #C3C7D1; } + +.mate-panel-menu-bar button label, .mate-panel-menu-bar button image, +.mate-panel-menu-bar #tasklist-button label, +.mate-panel-menu-bar #tasklist-button image, +panel-toplevel.background button label, +panel-toplevel.background button image, +panel-toplevel.background #tasklist-button label, +panel-toplevel.background #tasklist-button image { + color: inherit; } + +.mate-panel-menu-bar .wnck-pager, +panel-toplevel.background .wnck-pager { + color: #626469; + background-color: #1c262f; } + .mate-panel-menu-bar .wnck-pager:hover, + panel-toplevel.background .wnck-pager:hover { + background-color: #2c3b49; } + .mate-panel-menu-bar .wnck-pager:selected, + panel-toplevel.background .wnck-pager:selected { + color: #3affd6; + background-color: #00D3A7; } + +.mate-panel-menu-bar na-tray-applet, +panel-toplevel.background na-tray-applet { + -NaTrayApplet-icon-padding: 0; + -NaTrayApplet-icon-size: 16px; } + /*********************** * App-Specific Styles * ***********************/ @@ -6160,10 +6203,10 @@ ConversationListView { * LightDm * ***********/ #panel_window { - background-color: black; + background-color: #222e39; color: #C3C7D1; font-weight: bold; - box-shadow: inset 0 -1px black; } + box-shadow: inset 0 -1px #151c23; } #panel_window .menubar, #panel_window .menubar > .menuitem menubar, #panel_window menubar > menuitem { diff --git a/gtk-3.0/gtk.css b/gtk-3.0/gtk.css index 13780a3..7f5259c 100755 --- a/gtk-3.0/gtk.css +++ b/gtk-3.0/gtk.css @@ -5732,7 +5732,7 @@ window.background.budgie-settings-window.csd > box.horizontal > stack > scrolled border: none; } .xfce4-panel.panel { - background-color: black; + background-color: #222e39; text-shadow: none; -gtk-icon-shadow: none; } @@ -5740,7 +5740,7 @@ window.background.budgie-settings-window.csd > box.horizontal > stack > scrolled color: rgba(195, 199, 209, 0.8); border-radius: 0; border: none; - background-color: rgba(0, 0, 0, 0); } + background-color: rgba(34, 46, 57, 0); } #tasklist-button:hover { color: #e0e2e7; background-color: rgba(0, 0, 0, 0.17); } @@ -5749,19 +5749,23 @@ window.background.budgie-settings-window.csd > box.horizontal > stack > scrolled background-color: rgba(0, 0, 0, 0.25); box-shadow: inset 0 -2px #00D3A7; } -.xfce4-panel.panel button.flat { +.xfce4-panel.panel button.flat, .mate-panel-menu-bar button:not(#tasklist-button), +panel-toplevel.background button:not(#tasklist-button) { color: #C3C7D1; border-radius: 0; border: none; - background-color: rgba(0, 0, 0, 0); } - .xfce4-panel.panel button.flat:hover { + background-color: rgba(34, 46, 57, 0); } + .xfce4-panel.panel button.flat:hover, .mate-panel-menu-bar button:hover:not(#tasklist-button), + panel-toplevel.background button:hover:not(#tasklist-button) { border: none; - background-color: #404040; } - .xfce4-panel.panel button.flat:active, .xfce4-panel.panel button.flat:checked { + background-color: #2f404f; } + .xfce4-panel.panel button.flat:active, .mate-panel-menu-bar button:active:not(#tasklist-button), + panel-toplevel.background button:active:not(#tasklist-button), .xfce4-panel.panel button.flat:checked, .mate-panel-menu-bar button:checked:not(#tasklist-button), + panel-toplevel.background button:checked:not(#tasklist-button) { color: #fefefe; - background-color: #333333; + background-color: #2c3b49; border-bottom: 2px solid #00D3A7; } - .xfce4-panel.panel button.flat:active label, .xfce4-panel.panel button.flat:active image, .xfce4-panel.panel button.flat:checked label, .xfce4-panel.panel button.flat:checked image { + .xfce4-panel.panel button.flat:active label, .mate-panel-menu-bar button:active:not(#tasklist-button) label, panel-toplevel.background button:active:not(#tasklist-button) label, .xfce4-panel.panel button.flat:active image, .mate-panel-menu-bar button:active:not(#tasklist-button) image, panel-toplevel.background button:active:not(#tasklist-button) image, .xfce4-panel.panel button.flat:checked label, .mate-panel-menu-bar button:checked:not(#tasklist-button) label, panel-toplevel.background button:checked:not(#tasklist-button) label, .xfce4-panel.panel button.flat:checked image, .mate-panel-menu-bar button:checked:not(#tasklist-button) image, panel-toplevel.background button:checked:not(#tasklist-button) image { color: inherit; } #whiskermenu-window button { @@ -5899,9 +5903,9 @@ window.thunar paned > scrolledwindow treeview.view:selected { background-color: transparent; transition: all 100ms ease-in-out; } .panel.maximized { - background-color: black; } + background-color: #222e39; } .panel.translucent { - background-color: rgba(0, 0, 0, 0.5); } + background-color: rgba(34, 46, 57, 0.5); } .panel.color-light.translucent { background-color: rgba(195, 199, 209, 0.85); } @@ -6156,6 +6160,45 @@ SheetStyleDialog.unity-force-quit { animation: playbackmenuitem_spinner 1s infinite linear; color: #00D3A7; } +.mate-panel-menu-bar, .mate-panel-menu-bar menubar, +panel-toplevel.background, +panel-toplevel.background menubar { + background-color: #222e39; } + +.mate-panel-menu-bar menubar, +.mate-panel-menu-bar #PanelApplet label, +.mate-panel-menu-bar #PanelApplet image, +panel-toplevel.background menubar, +panel-toplevel.background #PanelApplet label, +panel-toplevel.background #PanelApplet image { + color: #C3C7D1; } + +.mate-panel-menu-bar button label, .mate-panel-menu-bar button image, +.mate-panel-menu-bar #tasklist-button label, +.mate-panel-menu-bar #tasklist-button image, +panel-toplevel.background button label, +panel-toplevel.background button image, +panel-toplevel.background #tasklist-button label, +panel-toplevel.background #tasklist-button image { + color: inherit; } + +.mate-panel-menu-bar .wnck-pager, +panel-toplevel.background .wnck-pager { + color: #626469; + background-color: #1c262f; } + .mate-panel-menu-bar .wnck-pager:hover, + panel-toplevel.background .wnck-pager:hover { + background-color: #2c3b49; } + .mate-panel-menu-bar .wnck-pager:selected, + panel-toplevel.background .wnck-pager:selected { + color: #3affd6; + background-color: #00D3A7; } + +.mate-panel-menu-bar na-tray-applet, +panel-toplevel.background na-tray-applet { + -NaTrayApplet-icon-padding: 0; + -NaTrayApplet-icon-size: 16px; } + /*********************** * App-Specific Styles * ***********************/ @@ -6185,10 +6228,10 @@ ConversationListView { * LightDm * ***********/ #panel_window { - background-color: black; + background-color: #222e39; color: #C3C7D1; font-weight: bold; - box-shadow: inset 0 -1px black; } + box-shadow: inset 0 -1px #151c23; } #panel_window .menubar, #panel_window .menubar > .menuitem menubar, #panel_window menubar > menuitem {