Improve budgie panel appearance

This commit is contained in:
EliverLara
2020-03-02 16:19:32 -06:00
parent b0818c2689
commit 0a6a71af84
3 changed files with 40 additions and 39 deletions

View File

@@ -10,6 +10,7 @@ $mpris_overlay_bg: transparentize(if($variant=='light',$base_color, darken($bg_c
$mpris_overlay_border: $top_highlight; $mpris_overlay_border: $top_highlight;
$panel_bg: transparentize( darken($headerbar_color,10%),0.05); $panel_bg: transparentize( darken($headerbar_color,10%),0.05);
$panel_color: $headerbar_fg_color; $panel_color: $headerbar_fg_color;
$panel_secondary_color: lighten($headerbar_fg_color, 70%);
$panel_border: transparentize($_borders_color, 0.08); $panel_border: transparentize($_borders_color, 0.08);
$panel_shadow: transparentize(black, 0.7); $panel_shadow: transparentize(black, 0.7);
$raven_bg: transparentize($headerbar_color, 0.08); $raven_bg: transparentize($headerbar_color, 0.08);
@@ -178,16 +179,16 @@ $pos_list: ((top, bottom),(bottom,top),(left,right),(right,left));
// Menu Button // Menu Button
button.budgie-menu-launcher { button.budgie-menu-launcher {
padding: 0 2px; padding: 0 2px;
color: $headerbar_fg_color; color: $panel_secondary_color;
box-shadow: none; box-shadow: none;
background-color: transparent; background-color: transparent;
&:hover { color: $headerbar_fg_color; } &:hover { color: $panel_secondary_color; }
&:active, &:checked { color: $headerbar_fg_color; } &:active, &:checked { color: $panel_secondary_color; }
&:backdrop { &:backdrop {
color: $headerbar_fg_color; color: $panel_secondary_color;
background-color: transparent; background-color: transparent;
&:hover { color: $headerbar_fg_color; } &:hover { color: $panel_secondary_color; }
&:active, &:checked { &:active, &:checked {
color: $selected_bg_color; color: $selected_bg_color;
box-shadow: none; box-shadow: none;
@@ -252,10 +253,10 @@ button.budgie-menu-launcher {
button.raven-trigger { button.raven-trigger {
padding-left: 2px; padding-left: 2px;
padding-right: 2px; padding-right: 2px;
color: $headerbar_fg_color; color: $panel_secondary_color;
box-shadow: none; box-shadow: none;
&:hover { &:hover {
color: $headerbar_fg_color; color: $panel_secondary_color;
background-color: transparent; background-color: transparent;
} }
&:active, &:checked { &:active, &:checked {
@@ -264,9 +265,9 @@ button.raven-trigger {
color: $selected_bg_color; color: $selected_bg_color;
} }
&:backdrop { &:backdrop {
color: $headerbar_fg_color; color: $panel_secondary_color;
&:hover { &:hover {
color: $headerbar_fg_color; color: $panel_secondary_color;
} }
&:active, &:checked { &:active, &:checked {
box-shadow: none; box-shadow: none;
@@ -365,7 +366,7 @@ button.raven-trigger {
// Panel // Panel
.budgie-panel { .budgie-panel {
color: $headerbar_fg_color; color: $panel_secondary_color;
background-color: $panel_bg; background-color: $panel_bg;
background-image: none; background-image: none;
box-shadow: none; box-shadow: none;
@@ -375,7 +376,7 @@ button.raven-trigger {
.alert { color: $alert_color; } .alert { color: $alert_color; }
&:backdrop { &:backdrop {
color: $headerbar_fg_color; color: $panel_secondary_color;
background-color: $panel_bg; background-color: $panel_bg;
} }
@@ -400,12 +401,12 @@ button.raven-trigger {
} }
label { label {
color: $headerbar_fg_color; color: $panel_secondary_color;
font-weight: 700; font-weight: 700;
} }
&.transparent { &.transparent {
background-color: transparent; background-color: transparentize($panel_bg, 0.75);
.top & { .top & {
border-bottom-color: transparent; border-bottom-color: transparent;

View File

@@ -4800,18 +4800,18 @@ entry selection, row:selected, treeview.view:selected:focus, treeview.view:selec
button.budgie-menu-launcher { button.budgie-menu-launcher {
padding: 0 2px; padding: 0 2px;
color: #C3C7D1; color: white;
box-shadow: none; box-shadow: none;
background-color: transparent; } background-color: transparent; }
button.budgie-menu-launcher:hover { button.budgie-menu-launcher:hover {
color: #C3C7D1; } color: white; }
button.budgie-menu-launcher:active, button.budgie-menu-launcher:checked { button.budgie-menu-launcher:active, button.budgie-menu-launcher:checked {
color: #C3C7D1; } color: white; }
button.budgie-menu-launcher:backdrop { button.budgie-menu-launcher:backdrop {
color: #C3C7D1; color: white;
background-color: transparent; } background-color: transparent; }
button.budgie-menu-launcher:backdrop:hover { button.budgie-menu-launcher:backdrop:hover {
color: #C3C7D1; } color: white; }
button.budgie-menu-launcher:backdrop:active, button.budgie-menu-launcher:backdrop:checked { button.budgie-menu-launcher:backdrop:active, button.budgie-menu-launcher:backdrop:checked {
color: #c50ed2; color: #c50ed2;
box-shadow: none; box-shadow: none;
@@ -4862,19 +4862,19 @@ button.budgie-menu-launcher {
button.raven-trigger { button.raven-trigger {
padding-left: 2px; padding-left: 2px;
padding-right: 2px; padding-right: 2px;
color: #C3C7D1; color: white;
box-shadow: none; } box-shadow: none; }
button.raven-trigger:hover { button.raven-trigger:hover {
color: #C3C7D1; color: white;
background-color: transparent; } background-color: transparent; }
button.raven-trigger:active, button.raven-trigger:checked { button.raven-trigger:active, button.raven-trigger:checked {
box-shadow: none; box-shadow: none;
background-color: transparent; background-color: transparent;
color: #c50ed2; } color: #c50ed2; }
button.raven-trigger:backdrop { button.raven-trigger:backdrop {
color: #C3C7D1; } color: white; }
button.raven-trigger:backdrop:hover { button.raven-trigger:backdrop:hover {
color: #C3C7D1; } color: white; }
button.raven-trigger:backdrop:active, button.raven-trigger:backdrop:checked { button.raven-trigger:backdrop:active, button.raven-trigger:backdrop:checked {
box-shadow: none; box-shadow: none;
color: #c50ed2; color: #c50ed2;
@@ -4951,7 +4951,7 @@ button.raven-trigger {
box-shadow: inset 0px 1px 1px alpha(@theme_fg_color, 0.04);; } box-shadow: inset 0px 1px 1px alpha(@theme_fg_color, 0.04);; }
.budgie-panel { .budgie-panel {
color: #C3C7D1; color: white;
background-color: rgba(0, 0, 0, 0.95); background-color: rgba(0, 0, 0, 0.95);
background-image: none; background-image: none;
box-shadow: none; box-shadow: none;
@@ -4960,7 +4960,7 @@ button.raven-trigger {
.budgie-panel .alert { .budgie-panel .alert {
color: #ed254e; } color: #ed254e; }
.budgie-panel:backdrop { .budgie-panel:backdrop {
color: #C3C7D1; color: white;
background-color: rgba(0, 0, 0, 0.95); } background-color: rgba(0, 0, 0, 0.95); }
.budgie-panel button { .budgie-panel button {
border-top-width: 0; border-top-width: 0;
@@ -4977,10 +4977,10 @@ button.raven-trigger {
padding: 0; padding: 0;
margin: 0; } margin: 0; }
.budgie-panel label { .budgie-panel label {
color: #C3C7D1; color: white;
font-weight: 700; } font-weight: 700; }
.budgie-panel.transparent { .budgie-panel.transparent {
background-color: transparent; } background-color: rgba(0, 0, 0, 0.2); }
.top .budgie-panel.transparent { .top .budgie-panel.transparent {
border-bottom-color: transparent; } border-bottom-color: transparent; }
.bottom .budgie-panel.transparent { .bottom .budgie-panel.transparent {

View File

@@ -4800,18 +4800,18 @@ entry selection, row:selected, treeview.view:selected:focus, treeview.view:selec
button.budgie-menu-launcher { button.budgie-menu-launcher {
padding: 0 2px; padding: 0 2px;
color: #C3C7D1; color: white;
box-shadow: none; box-shadow: none;
background-color: transparent; } background-color: transparent; }
button.budgie-menu-launcher:hover { button.budgie-menu-launcher:hover {
color: #C3C7D1; } color: white; }
button.budgie-menu-launcher:active, button.budgie-menu-launcher:checked { button.budgie-menu-launcher:active, button.budgie-menu-launcher:checked {
color: #C3C7D1; } color: white; }
button.budgie-menu-launcher:backdrop { button.budgie-menu-launcher:backdrop {
color: #C3C7D1; color: white;
background-color: transparent; } background-color: transparent; }
button.budgie-menu-launcher:backdrop:hover { button.budgie-menu-launcher:backdrop:hover {
color: #C3C7D1; } color: white; }
button.budgie-menu-launcher:backdrop:active, button.budgie-menu-launcher:backdrop:checked { button.budgie-menu-launcher:backdrop:active, button.budgie-menu-launcher:backdrop:checked {
color: #c50ed2; color: #c50ed2;
box-shadow: none; box-shadow: none;
@@ -4862,19 +4862,19 @@ button.budgie-menu-launcher {
button.raven-trigger { button.raven-trigger {
padding-left: 2px; padding-left: 2px;
padding-right: 2px; padding-right: 2px;
color: #C3C7D1; color: white;
box-shadow: none; } box-shadow: none; }
button.raven-trigger:hover { button.raven-trigger:hover {
color: #C3C7D1; color: white;
background-color: transparent; } background-color: transparent; }
button.raven-trigger:active, button.raven-trigger:checked { button.raven-trigger:active, button.raven-trigger:checked {
box-shadow: none; box-shadow: none;
background-color: transparent; background-color: transparent;
color: #c50ed2; } color: #c50ed2; }
button.raven-trigger:backdrop { button.raven-trigger:backdrop {
color: #C3C7D1; } color: white; }
button.raven-trigger:backdrop:hover { button.raven-trigger:backdrop:hover {
color: #C3C7D1; } color: white; }
button.raven-trigger:backdrop:active, button.raven-trigger:backdrop:checked { button.raven-trigger:backdrop:active, button.raven-trigger:backdrop:checked {
box-shadow: none; box-shadow: none;
color: #c50ed2; color: #c50ed2;
@@ -4951,7 +4951,7 @@ button.raven-trigger {
box-shadow: inset 0px 1px 1px alpha(@theme_fg_color, 0.04);; } box-shadow: inset 0px 1px 1px alpha(@theme_fg_color, 0.04);; }
.budgie-panel { .budgie-panel {
color: #C3C7D1; color: white;
background-color: rgba(0, 0, 0, 0.95); background-color: rgba(0, 0, 0, 0.95);
background-image: none; background-image: none;
box-shadow: none; box-shadow: none;
@@ -4960,7 +4960,7 @@ button.raven-trigger {
.budgie-panel .alert { .budgie-panel .alert {
color: #ed254e; } color: #ed254e; }
.budgie-panel:backdrop { .budgie-panel:backdrop {
color: #C3C7D1; color: white;
background-color: rgba(0, 0, 0, 0.95); } background-color: rgba(0, 0, 0, 0.95); }
.budgie-panel button { .budgie-panel button {
border-top-width: 0; border-top-width: 0;
@@ -4977,10 +4977,10 @@ button.raven-trigger {
padding: 0; padding: 0;
margin: 0; } margin: 0; }
.budgie-panel label { .budgie-panel label {
color: #C3C7D1; color: white;
font-weight: 700; } font-weight: 700; }
.budgie-panel.transparent { .budgie-panel.transparent {
background-color: transparent; } background-color: rgba(0, 0, 0, 0.2); }
.top .budgie-panel.transparent { .top .budgie-panel.transparent {
border-bottom-color: transparent; } border-bottom-color: transparent; }
.bottom .budgie-panel.transparent { .bottom .budgie-panel.transparent {