diff --git a/gtk-3.0/_colors-public.scss b/gtk-3.0/_colors-public.scss index f8d5e5d..23738e1 100755 --- a/gtk-3.0/_colors-public.scss +++ b/gtk-3.0/_colors-public.scss @@ -92,3 +92,6 @@ read if you used those and something break with a version upgrade you're on your @define-color content_view_bg #{"" + $base_color}; +//Budgie desktop +@define-color budgie_tasklist_indicator_color #{"" +$selected_bg_color}; +@define-color budgie_tasklist_indicator_color_active #{"" +$selected_bg_color}; \ No newline at end of file diff --git a/gtk-3.0/_drawing.scss b/gtk-3.0/_drawing.scss index e1d5366..edc3407 100755 --- a/gtk-3.0/_drawing.scss +++ b/gtk-3.0/_drawing.scss @@ -259,6 +259,13 @@ border:none; } +@else if $t==active-header { + border-radius: 23px; + background: #00e8b7; + box-shadow: 0px 2px 4px rgba(177, 177, 177, 0.753); + color: rgb(255, 250, 250); +} + @else if $t==backdrop-header { // // backdrop button headerbar look diff --git a/gtk-3.0/apps/_budgie.scss b/gtk-3.0/apps/_budgie.scss index 96a6d3d..1bff23e 100755 --- a/gtk-3.0/apps/_budgie.scss +++ b/gtk-3.0/apps/_budgie.scss @@ -1,20 +1,21 @@ /********* * Budgie * *********/ - $alert_color: $red; $button_bg: transparent; $entry_border: transparent; $mpris_overlay_fg: $fg_color; $mpris_overlay_bg: transparentize(if($variant=='light',$base_color, darken($bg_color, 10%)), 0.1); $mpris_overlay_border: $top_highlight; -$panel_bg: transparentize( darken($headerbar_color,10%),0.05); -$panel_border: transparentize(darken($headerbar_color, 7%), 0.08); +$panel_bg: transparentize( darken($_sidebar_color,10%),0.05); +$panel_color: $headerbar_fg_color; // text color for raven and popovers +$panel_secondary_color: #98abb2; // text color for dark panel +$panel_border: transparentize($borders_color, 0.08); $panel_shadow: transparentize(black, 0.7); -$raven_bg: transparentize($bg_color, 0.08); +$raven_bg: transparentize($headerbar_color, 0.08); $raven_expander_border: transparentize($borders_color, 0.05); -$raven_border: transparentize($bg_color, 0.08); -$raven_expander_bg: transparentize($bg_color, 0.8); +$raven_border: transparentize($borders_color, 0.08); +$raven_expander_bg: transparentize(darken($headerbar_color, 7%), 0.5); $raven_background_bg: transparent; $raven_background_border: transparent; @@ -69,10 +70,10 @@ $pos_list: ((top, bottom),(bottom,top),(left,right),(right,left)); .budgie-popover.background { border-radius: 2px; padding: 0; - background: if( $variant == 'light', linear-gradient(to bottom, $base_color 20%, $bg_color), linear-gradient(to bottom, lighten($bg_color, 12%), darken($bg_color, 2%))); + background: if( $variant == 'light', linear-gradient(to bottom, $bg_color 20%, $bg_color), linear-gradient(to bottom, lighten($bg_color, 12%), darken($bg_color, 2%))); background-clip: border-box; box-shadow: 0 2px 3px 1px transparentize(black, 0.65); - border: 1px solid #{"@borders"}; + border: 1px solid $borders_color; list, row { &:hover { background: none; } @@ -82,6 +83,15 @@ $pos_list: ((top, bottom),(bottom,top),(left,right),(right,left)); margin: 0 -1px -1px; // remove gap padding: 2px 0 0; } + button { + color: $panel_color; + border: none; + background: transparent; + // @include button(normal-header); + &:hover { + color: $selected_bg_color; + } + } } .budgie-popover > .container { @@ -90,6 +100,7 @@ $pos_list: ((top, bottom),(bottom,top),(left,right),(right,left)); // Budgie Menu .budgie-menu { + color: $panel_color; .container { padding: 0; } button:hover { -gtk-icon-effect: none; } @@ -98,11 +109,11 @@ $pos_list: ((top, bottom),(bottom,top),(left,right),(right,left)); border: none; background: none; padding: 5px 2px; - border-bottom: 1px solid #{"@borders"}; + border-bottom: 1px solid $borders_color; border-radius: 0; font-size: 120%; box-shadow: none; - + color:$panel_color; image { &:dir(ltr) { padding-left: 8px; padding-right: 12px; } &:dir(rtl) { padding-left: 12px; padding-right: 8px; } @@ -112,10 +123,9 @@ $pos_list: ((top, bottom),(bottom,top),(left,right),(right,left)); .categories { border-width: 0; margin-left: 3px; - - background-color: transparent; - &:dir(ltr) { border-right: 1px solid #{"@borders"}; } - &:dir(rtl) { border-left: 1px solid #{"@borders"}; } + background: transparent; + &:dir(ltr) { border-right: 1px solid $borders_color; } + &:dir(rtl) { border-left: 1px solid $borders_color; } } .category-button { @@ -130,17 +140,20 @@ $pos_list: ((top, bottom),(bottom,top),(left,right),(right,left)); &:checked { color: $selected_fg_color; background: $suggested_bg_color; + &:hover { + color: transparentize($selected_fg_color, 0.1); + } } &:checked:disabled { opacity: 0.5; - label { color: transparentize($selected_fg_color, 0.3); } } + } scrollbar { background-color: transparent; - border-color: transparent; + border-color: $borders_color; } button:not(.category-button) { @@ -148,12 +161,18 @@ $pos_list: ((top, bottom),(bottom,top),(left,right),(right,left)); padding-bottom: 5px; border-radius: 0; box-shadow: none; + background:yellow; } button{ border: none; + background: transparent; } undershoot, overshoot { background: none; } + + list { + color: transparentize($panel_color, 0.3); + } } // Menu Button @@ -194,7 +213,7 @@ button.budgie-menu-launcher { .indicator-item { box-shadow: $depth; - background-color: $cyan; + background-color: $selected_bg_color; transition-duration: 0.2s; &:dir(ltr) { // mask avatar's background @@ -346,7 +365,7 @@ button.raven-trigger { // Panel .budgie-panel { - color: $headerbar_fg_color; + color: $panel_secondary_color; background-color: $panel_bg; background-image: none; box-shadow: none; @@ -356,7 +375,7 @@ button.raven-trigger { .alert { color: $alert_color; } &:backdrop { - color: $headerbar_fg_color; + color: $panel_secondary_color; background-color: $panel_bg; } @@ -364,6 +383,15 @@ button.raven-trigger { border-top-width: 0; border-bottom-width: 0; border-radius: 0; + &.flat { + background: transparent; + border: 1px solid $panel_bg; + color:$panel_secondary_color; + &:hover, &:active, &:checked { + background: transparent; + color: $selected_bg_color; + } + } } popover list, @@ -373,7 +401,7 @@ button.raven-trigger { } label { - color: $headerbar_fg_color; + color: $red; font-weight: 700; } @@ -403,7 +431,7 @@ button.raven-trigger { separator { background-color: transparentize($headerbar_fg_color, 0.85); } label { font-weight: 700; - color: $headerbar_fg_color; + color: $panel_secondary_color; } } } @@ -494,7 +522,7 @@ button.raven-trigger { .raven { padding: 0; color: $fg_color; - background: if($variant == 'light', linear-gradient(to bottom, #EAEAEA, rgb(187, 184, 184)) , mix($base_color, darken($headerbar_color, 8%), 30%)); + background: if( $variant == 'light', linear-gradient(to bottom, $bg_color 20%, $bg_color), linear-gradient(to bottom, lighten($bg_color, 12%), darken($bg_color, 2%))); transition: 170ms ease-out; .raven-header { @@ -504,7 +532,7 @@ button.raven-trigger { } min-height: 32px; - color: $fg_color; + color: $panel_color; border: solid $raven_expander_border; border-width: 1px 0; background-color: $raven_expander_bg; @@ -542,51 +570,44 @@ button.raven-trigger { &.bottom { border-bottom-style: none; } button { - background-image: if( $variant == 'light', - linear-gradient(to bottom, $base_color, $bg_color), - linear-gradient(to bottom, lighten($base_color, 12%), darken($bg_color, 2%)) - ); - border: 1px solid $borders_color; - color: $fg_color; - border-radius: 0; - //border: none; - box-shadow: none; - margin-top: -4px; - margin-bottom: -4px; - min-height: 24px; - - &:hover { + @include button(normal-header); border-radius: 0; - background-color: transparent; - color: $selected_bg_color; - } - - &:active, - &:checked { - color: $selected_bg_color; - border-radius: 0; - background: mix($bg_color, $base_color, 20%); - } - - &:disabled { - color: $insensitive_fg_color; - } + &:hover { + @include button(hover-header); + border-radius: 0; + } + + &:disabled { + color: $insensitive_fg_color; + } + &.text-button.radio { + margin: 5px 0px; + min-height: 20px; + padding: 3px; + &:active, + &:checked { + @include button(active-header); + } + } } } list { + color: $panel_color; background-color: transparent; &:selected { background-color: transparentize($selected_bg_color,0.1); } row, row.activatable { + background-color: transparent; + &:hover { background-color: transparentize(lighten($panel_bg, 15%), 0.7);} &:selected { background-color: transparentize($selected_bg_color,0.1); } } } .raven-background { - color: $fg_color; + color: $panel_color; background-color: transparent; border-color: transparent; @@ -605,7 +626,7 @@ button.raven-trigger { min-height: 32px; margin-bottom: 3px; - background: linear-gradient(to right, #8f94fb, #4e54c8); + background: $purple; color: $selected_fg_color; box-shadow: $depth; @@ -613,30 +634,28 @@ button.raven-trigger { font-size: 100%; &:hover { - transition: 170ms ease all; - background: transparentize($darkpurple,0.15); + background: transparentize($purple,0.15); color: $selected_fg_color; } &:active { - transition: 170ms ease all; - background: $darkpurple; + background: $purple; color: $selected_fg_color; } &:first-child { background: $suggested_bg_color; &:hover { - background: transparentize($cyan,0); + background: transparentize($selected_bg_color, 0.15); } &:active { - background: $cyan; + background: $selected_bg_color; } } &:last-child { background: $destructive_bg_color; &:hover { - background: transparentize($red,0); + background: transparentize($red, 0.15); } &:active { background: $red; @@ -651,7 +670,7 @@ button.raven-trigger { // Calendar calendar.raven-calendar { padding: 6px; - color: $fg_color; + color: $panel_color; background: transparent; border-color: transparent; @@ -666,7 +685,7 @@ calendar.raven-calendar { &:backdrop { background-color: transparent; } &.header { - color: $fg_color; + color: $panel_color; border: none; border-radius: 0; background-color: transparent; @@ -717,14 +736,14 @@ calendar.raven-calendar { background: none; border-radius: 1px; button { - background-color: $cyan; + background-color: $selected_bg_color; color: $selected_fg_color; border: none; &:hover { - background-color: darken($cyan, 5%); + background-color: darken($selected_bg_color, 5%); border: none; } - &:active, &:checked { background-color: darken($cyan, 5%); } + &:active, &:checked { background-color: darken($selected_bg_color, 5%); } } } @@ -815,6 +834,7 @@ calendar.raven-calendar { margin-bottom: 0; min-height: 32px; border-bottom: none; + border-color:$borders_color; border-radius: 0; color: $headerbar_fg_color; background-color: transparent; @@ -830,9 +850,10 @@ calendar.raven-calendar { } } - @each $b_type, $b_color in (suggested-action, $cyan), + @each $b_type, $b_color in (suggested-action, $selected_bg_color), (destructive-action, $destructive_color) { &.#{$b_type} { + color: #fff; background-color: transparentize($b_color, 0.1); &:hover { background-color: transparentize(lighten($b_color,5%), 0.1); } &:active, &:checked { background-color: transparentize(lighten($b_color,5%), 0.1); } diff --git a/gtk-3.0/gtk-dark.css b/gtk-3.0/gtk-dark.css index d1f0bc6..2243cdc 100755 --- a/gtk-3.0/gtk-dark.css +++ b/gtk-3.0/gtk-dark.css @@ -56,6 +56,8 @@ read if you used those and something break with a version upgrade you're on your @define-color wm_button_active_color_b shade(#161925, 0.89); @define-color wm_button_active_color_c shade(#161925, 0.9); @define-color content_view_bg #181b28; +@define-color budgie_tasklist_indicator_color #00D3A7; +@define-color budgie_tasklist_indicator_color_active #00D3A7; /***************** * Drawing mixins * *****************/ @@ -4697,7 +4699,7 @@ entry selection, row:selected, treeview.view:selected:focus, treeview.view:selec background: linear-gradient(to bottom, #2d334b, #12151f); background-clip: border-box; box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.35); - border: 1px solid @borders; } + border: 1px solid rgba(238, 238, 238, 0.1); } .budgie-popover list:hover, .budgie-popover row:hover, .budgie-popover.background list:hover, @@ -4707,71 +4709,80 @@ entry selection, row:selected, treeview.view:selected:focus, treeview.view:selec .budgie-popover.background > frame.container { margin: 0 -1px -1px; padding: 2px 0 0; } + .budgie-popover button, + .budgie-popover.background button { + color: #C3C7D1; + border: none; + background: transparent; } + .budgie-popover button:hover, + .budgie-popover.background button:hover { + color: #00D3A7; } .budgie-popover > .container { padding: 2px; } -.budgie-menu .container { - padding: 0; } - -.budgie-menu button:hover { - -gtk-icon-effect: none; } - -.budgie-menu entry.search { - border: none; - background: none; - padding: 5px 2px; - border-bottom: 1px solid @borders; - border-radius: 0; - font-size: 120%; - box-shadow: none; } - .budgie-menu entry.search image:dir(ltr) { - padding-left: 8px; - padding-right: 12px; } - .budgie-menu entry.search image:dir(rtl) { - padding-left: 12px; - padding-right: 8px; } - -.budgie-menu .categories { - border-width: 0; - margin-left: 3px; - background-color: transparent; } - .budgie-menu .categories:dir(ltr) { - border-right: 1px solid @borders; } - .budgie-menu .categories:dir(rtl) { - border-left: 1px solid @borders; } - -.budgie-menu .category-button { - padding: 7px; - border-radius: 2px 0 0 2px; } - .budgie-menu .category-button:hover { - background-color: rgba(195, 199, 209, 0.05); +.budgie-menu { + color: #C3C7D1; } + .budgie-menu .container { + padding: 0; } + .budgie-menu button:hover { + -gtk-icon-effect: none; } + .budgie-menu entry.search { + border: none; + background: none; + padding: 5px 2px; + border-bottom: 1px solid rgba(238, 238, 238, 0.1); + border-radius: 0; + font-size: 120%; + box-shadow: none; color: #C3C7D1; } - .budgie-menu .category-button:active { - box-shadow: inset 0 2px 2px -2px rgba(0, 0, 0, 0.2); } - .budgie-menu .category-button:checked { - color: #fefefe; - background: linear-gradient(to right, #5797f7 0%, #00dcf4 100%); } - .budgie-menu .category-button:checked:disabled { - opacity: 0.5; } - .budgie-menu .category-button:checked:disabled label { - color: rgba(254, 254, 254, 0.7); } - -.budgie-menu scrollbar { - background-color: transparent; - border-color: transparent; } - -.budgie-menu button:not(.category-button) { - padding-top: 5px; - padding-bottom: 5px; - border-radius: 0; - box-shadow: none; } - -.budgie-menu button { - border: none; } - -.budgie-menu undershoot, .budgie-menu overshoot { - background: none; } + .budgie-menu entry.search image:dir(ltr) { + padding-left: 8px; + padding-right: 12px; } + .budgie-menu entry.search image:dir(rtl) { + padding-left: 12px; + padding-right: 8px; } + .budgie-menu .categories { + border-width: 0; + margin-left: 3px; + background: transparent; } + .budgie-menu .categories:dir(ltr) { + border-right: 1px solid rgba(238, 238, 238, 0.1); } + .budgie-menu .categories:dir(rtl) { + border-left: 1px solid rgba(238, 238, 238, 0.1); } + .budgie-menu .category-button { + padding: 7px; + border-radius: 2px 0 0 2px; } + .budgie-menu .category-button:hover { + background-color: rgba(195, 199, 209, 0.05); + color: #C3C7D1; } + .budgie-menu .category-button:active { + box-shadow: inset 0 2px 2px -2px rgba(0, 0, 0, 0.2); } + .budgie-menu .category-button:checked { + color: #fefefe; + background: linear-gradient(to right, #5797f7 0%, #00dcf4 100%); } + .budgie-menu .category-button:checked:hover { + color: rgba(254, 254, 254, 0.9); } + .budgie-menu .category-button:checked:disabled { + opacity: 0.5; } + .budgie-menu .category-button:checked:disabled label { + color: rgba(254, 254, 254, 0.7); } + .budgie-menu scrollbar { + background-color: transparent; + border-color: rgba(238, 238, 238, 0.1); } + .budgie-menu button:not(.category-button) { + padding-top: 5px; + padding-bottom: 5px; + border-radius: 0; + box-shadow: none; + background: yellow; } + .budgie-menu button { + border: none; + background: transparent; } + .budgie-menu undershoot, .budgie-menu overshoot { + background: none; } + .budgie-menu list { + color: rgba(195, 199, 209, 0.7); } button.budgie-menu-launcher { padding: 0 2px; @@ -4803,7 +4814,7 @@ button.budgie-menu-launcher { .user-menu > box.vertical row.activatable:first-child .indicator-item, .user-menu > frame.container > box.vertical row.activatable:first-child .indicator-item { box-shadow: 0 1px 1px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.2), inset 0px 1px 0px 0px rgba(255, 255, 255, 0.1); - background-color: #00c1e4; + background-color: #00D3A7; transition-duration: 0.2s; } .user-menu > box.vertical row.activatable:first-child .indicator-item:dir(ltr), .user-menu > frame.container > box.vertical row.activatable:first-child .indicator-item:dir(ltr) { @@ -4926,7 +4937,7 @@ button.raven-trigger { box-shadow: inset 0px 1px 1px alpha(@theme_fg_color, 0.04);; } .budgie-panel { - color: #C3C7D1; + color: #98abb2; background-color: rgba(3, 3, 5, 0.95); background-image: none; box-shadow: none; @@ -4935,18 +4946,25 @@ button.raven-trigger { .budgie-panel .alert { color: #ed254e; } .budgie-panel:backdrop { - color: #C3C7D1; + color: #98abb2; background-color: rgba(3, 3, 5, 0.95); } .budgie-panel button { border-top-width: 0; border-bottom-width: 0; border-radius: 0; } + .budgie-panel button.flat { + background: transparent; + border: 1px solid rgba(3, 3, 5, 0.95); + color: #98abb2; } + .budgie-panel button.flat:hover, .budgie-panel button.flat:active, .budgie-panel button.flat:checked { + background: transparent; + color: #00D3A7; } .budgie-panel popover list, .budgie-panel popover row { padding: 0; margin: 0; } .budgie-panel label { - color: #C3C7D1; + color: #ed254e; font-weight: 700; } .budgie-panel.transparent { background-color: transparent; } @@ -4964,7 +4982,7 @@ button.raven-trigger { background-color: rgba(195, 199, 209, 0.15); } .budgie-panel .end-region label { font-weight: 700; - color: #C3C7D1; } + color: #98abb2; } .budgie-panel #tasklist-button, .budgie-panel #tasklist-button:backdrop { @@ -5073,56 +5091,56 @@ button.raven-trigger { border-right: 2px solid #00D3A7; } .top .budgie-panel { - border-bottom: 1px solid rgba(9, 10, 15, 0.92); } + border-bottom: 1px solid rgba(238, 238, 238, 0.02); } .top .raven-frame { padding: 0; background: none; } .top .raven-frame border { border: none; - border-bottom: 1px solid rgba(22, 25, 37, 0.92); } + border-bottom: 1px solid rgba(238, 238, 238, 0.02); } .top .shadow-block { background-color: transparent; background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.3), transparent); } .bottom .budgie-panel { - border-top: 1px solid rgba(9, 10, 15, 0.92); } + border-top: 1px solid rgba(238, 238, 238, 0.02); } .bottom .raven-frame { padding: 0; background: none; } .bottom .raven-frame border { border: none; - border-top: 1px solid rgba(22, 25, 37, 0.92); } + border-top: 1px solid rgba(238, 238, 238, 0.02); } .bottom .shadow-block { background-color: transparent; background-image: linear-gradient(to top, rgba(0, 0, 0, 0.3), transparent); } .left .budgie-panel { - border-right: 1px solid rgba(9, 10, 15, 0.92); } + border-right: 1px solid rgba(238, 238, 238, 0.02); } .left .raven-frame { padding: 0; background: none; } .left .raven-frame border { border: none; - border-right: 1px solid rgba(22, 25, 37, 0.92); } + border-right: 1px solid rgba(238, 238, 238, 0.02); } .left .shadow-block { background-color: transparent; background-image: linear-gradient(to right, rgba(0, 0, 0, 0.3), transparent); } .right .budgie-panel { - border-left: 1px solid rgba(9, 10, 15, 0.92); } + border-left: 1px solid rgba(238, 238, 238, 0.02); } .right .raven-frame { padding: 0; background: none; } .right .raven-frame border { border: none; - border-left: 1px solid rgba(22, 25, 37, 0.92); } + border-left: 1px solid rgba(238, 238, 238, 0.02); } .right .shadow-block { background-color: transparent; @@ -5131,14 +5149,14 @@ button.raven-trigger { .raven { padding: 0; color: #C3C7D1; - background: #0c0e14; + background: linear-gradient(to bottom, #2d334b, #12151f); transition: 170ms ease-out; } .raven .raven-header { min-height: 32px; color: #C3C7D1; border: solid rgba(238, 238, 238, 0.05); border-width: 1px 0; - background-color: rgba(22, 25, 37, 0.2); } + background-color: rgba(9, 10, 15, 0.5); } .raven .raven-header * { padding-top: 0; padding-bottom: 0; } @@ -5167,31 +5185,40 @@ button.raven-trigger { .raven .raven-header.bottom { border-bottom-style: none; } .raven .raven-header button { - background-image: linear-gradient(to bottom, #2f354f, #12151f); - border: 1px solid rgba(238, 238, 238, 0.1); - color: #C3C7D1; - border-radius: 0; + color: #8b8b8b; + text-shadow: none; box-shadow: none; - margin-top: -4px; - margin-bottom: -4px; - min-height: 24px; } + background: transparent; + border: none; + border-radius: 0; } .raven .raven-header button:hover { - border-radius: 0; - background-color: transparent; - color: #00D3A7; } - .raven .raven-header button:active, .raven .raven-header button:checked { color: #00D3A7; border-radius: 0; - background: #181b28; } + text-shadow: none; + border: none; + border-radius: 0; } .raven .raven-header button:disabled { color: #6d707b; } + .raven .raven-header button.text-button.radio { + margin: 5px 0px; + min-height: 20px; + padding: 3px; } + .raven .raven-header button.text-button.radio:active, .raven .raven-header button.text-button.radio:checked { + border-radius: 23px; + background: #00e8b7; + box-shadow: 0px 2px 4px rgba(177, 177, 177, 0.753); + color: snow; } .raven list { + color: #C3C7D1; background-color: transparent; } .raven list:selected { background-color: rgba(0, 211, 167, 0.9); } .raven list row, .raven list row.activatable { background-color: transparent; } + .raven list row:hover, + .raven list row.activatable:hover { + background-color: rgba(32, 36, 53, 0.25); } .raven list row:selected, .raven list row.activatable:selected { background-color: rgba(0, 211, 167, 0.9); } @@ -5210,29 +5237,27 @@ button.raven-trigger { min-width: 32px; min-height: 32px; margin-bottom: 3px; - background: linear-gradient(to right, #8f94fb, #4e54c8); + background: #c74ded; color: #fefefe; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.2), inset 0px 1px 0px 0px rgba(255, 255, 255, 0.1); border: none; font-size: 100%; } .raven .powerstrip button.image-button:hover { - transition: 170ms ease all; - background: rgba(123, 123, 189, 0.85); + background: rgba(199, 77, 237, 0.85); color: #fefefe; } .raven .powerstrip button.image-button:active { - transition: 170ms ease all; - background: #7b7bbd; + background: #c74ded; color: #fefefe; } .raven .powerstrip button.image-button:first-child { background: linear-gradient(to right, #5797f7 0%, #00dcf4 100%); } .raven .powerstrip button.image-button:first-child:hover { - background: #00c1e4; } + background: rgba(0, 211, 167, 0.85); } .raven .powerstrip button.image-button:first-child:active { - background: #00c1e4; } + background: #00D3A7; } .raven .powerstrip button.image-button:last-child { background: linear-gradient(to right, #ee0979, #ff6a00); } .raven .powerstrip button.image-button:last-child:hover { - background: #ed254e; } + background: rgba(237, 37, 78, 0.85); } .raven .powerstrip button.image-button:last-child:active { background: #ed254e; } .raven .option-subtitle { @@ -5290,14 +5315,14 @@ calendar.raven-calendar { background: none; border-radius: 1px; } .budgie-notification-window button, .budgie-osd-window button, .budgie-switcher-window button { - background-color: #00c1e4; + background-color: #00D3A7; color: #fefefe; border: none; } .budgie-notification-window button:hover, .budgie-osd-window button:hover, .budgie-switcher-window button:hover { - background-color: #00abcb; + background-color: #00ba93; border: none; } .budgie-notification-window button:active, .budgie-osd-window button:active, .budgie-switcher-window button:active, .budgie-notification-window button:checked, .budgie-osd-window button:checked, .budgie-switcher-window button:checked { - background-color: #00abcb; } + background-color: #00ba93; } .budgie-notification.background, .background.budgie-osd, .background.budgie-switcher { border-radius: 1px; } @@ -5361,6 +5386,7 @@ calendar.raven-calendar { margin-bottom: 0; min-height: 32px; border-bottom: none; + border-color: rgba(238, 238, 238, 0.1); border-radius: 0; color: #C3C7D1; background-color: transparent; @@ -5378,12 +5404,14 @@ calendar.raven-calendar { .budgie-session-dialog .linked.horizontal > button:hover:backdrop label, .budgie-polkit-dialog .linked.horizontal > button:hover:backdrop label, .budgie-run-dialog .linked.horizontal > button:hover:backdrop label { color: rgba(255, 255, 255, 0.5); } .budgie-session-dialog .linked.horizontal > button.suggested-action, .budgie-polkit-dialog .linked.horizontal > button.suggested-action, .budgie-run-dialog .linked.horizontal > button.suggested-action { - background-color: rgba(0, 193, 228, 0.9); } + color: #fff; + background-color: rgba(0, 211, 167, 0.9); } .budgie-session-dialog .linked.horizontal > button.suggested-action:hover, .budgie-polkit-dialog .linked.horizontal > button.suggested-action:hover, .budgie-run-dialog .linked.horizontal > button.suggested-action:hover { - background-color: rgba(0, 215, 254, 0.9); } + background-color: rgba(0, 237, 187, 0.9); } .budgie-session-dialog .linked.horizontal > button.suggested-action:active, .budgie-polkit-dialog .linked.horizontal > button.suggested-action:active, .budgie-run-dialog .linked.horizontal > button.suggested-action:active, .budgie-session-dialog .linked.horizontal > button.suggested-action:checked, .budgie-polkit-dialog .linked.horizontal > button.suggested-action:checked, .budgie-run-dialog .linked.horizontal > button.suggested-action:checked { - background-color: rgba(0, 215, 254, 0.9); } + background-color: rgba(0, 237, 187, 0.9); } .budgie-session-dialog .linked.horizontal > button.destructive-action, .budgie-polkit-dialog .linked.horizontal > button.destructive-action, .budgie-run-dialog .linked.horizontal > button.destructive-action { + color: #fff; background-color: rgba(206, 17, 56, 0.9); } .budgie-session-dialog .linked.horizontal > button.destructive-action:hover, .budgie-polkit-dialog .linked.horizontal > button.destructive-action:hover, .budgie-run-dialog .linked.horizontal > button.destructive-action:hover { background-color: rgba(230, 19, 62, 0.9); } diff --git a/gtk-3.0/gtk.css b/gtk-3.0/gtk.css index b71b55e..02de743 100755 --- a/gtk-3.0/gtk.css +++ b/gtk-3.0/gtk.css @@ -56,6 +56,8 @@ read if you used those and something break with a version upgrade you're on your @define-color wm_button_active_color_b shade(#e6e6e6, 0.89); @define-color wm_button_active_color_c shade(#e6e6e6, 0.9); @define-color content_view_bg #ebf0f5; +@define-color budgie_tasklist_indicator_color #00D3A7; +@define-color budgie_tasklist_indicator_color_active #00D3A7; /***************** * Drawing mixins * *****************/ @@ -4719,10 +4721,10 @@ entry selection, row:selected, treeview.view:selected:focus, treeview.view:selec .budgie-popover.background { border-radius: 2px; padding: 0; - background: linear-gradient(to bottom, #ebf0f5 20%, #e6e6e6); + background: linear-gradient(to bottom, #e6e6e6 20%, #e6e6e6); background-clip: border-box; box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.35); - border: 1px solid @borders; } + border: 1px solid rgba(0, 0, 0, 0.13); } .budgie-popover list:hover, .budgie-popover row:hover, .budgie-popover.background list:hover, @@ -4732,71 +4734,80 @@ entry selection, row:selected, treeview.view:selected:focus, treeview.view:selec .budgie-popover.background > frame.container { margin: 0 -1px -1px; padding: 2px 0 0; } + .budgie-popover button, + .budgie-popover.background button { + color: #31363D; + border: none; + background: transparent; } + .budgie-popover button:hover, + .budgie-popover.background button:hover { + color: #00D3A7; } .budgie-popover > .container { padding: 2px; } -.budgie-menu .container { - padding: 0; } - -.budgie-menu button:hover { - -gtk-icon-effect: none; } - -.budgie-menu entry.search { - border: none; - background: none; - padding: 5px 2px; - border-bottom: 1px solid @borders; - border-radius: 0; - font-size: 120%; - box-shadow: none; } - .budgie-menu entry.search image:dir(ltr) { - padding-left: 8px; - padding-right: 12px; } - .budgie-menu entry.search image:dir(rtl) { - padding-left: 12px; - padding-right: 8px; } - -.budgie-menu .categories { - border-width: 0; - margin-left: 3px; - background-color: transparent; } - .budgie-menu .categories:dir(ltr) { - border-right: 1px solid @borders; } - .budgie-menu .categories:dir(rtl) { - border-left: 1px solid @borders; } - -.budgie-menu .category-button { - padding: 7px; - border-radius: 2px 0 0 2px; } - .budgie-menu .category-button:hover { - background-color: rgba(49, 54, 61, 0.05); - color: #31363d; } - .budgie-menu .category-button:active { - box-shadow: inset 0 2px 2px -2px rgba(0, 0, 0, 0.2); } - .budgie-menu .category-button:checked { - color: #fefefe; - background: linear-gradient(to right, #5797f7 0%, #00dcf4 100%); } - .budgie-menu .category-button:checked:disabled { - opacity: 0.5; } - .budgie-menu .category-button:checked:disabled label { - color: rgba(254, 254, 254, 0.7); } - -.budgie-menu scrollbar { - background-color: transparent; - border-color: transparent; } - -.budgie-menu button:not(.category-button) { - padding-top: 5px; - padding-bottom: 5px; - border-radius: 0; - box-shadow: none; } - -.budgie-menu button { - border: none; } - -.budgie-menu undershoot, .budgie-menu overshoot { - background: none; } +.budgie-menu { + color: #31363D; } + .budgie-menu .container { + padding: 0; } + .budgie-menu button:hover { + -gtk-icon-effect: none; } + .budgie-menu entry.search { + border: none; + background: none; + padding: 5px 2px; + border-bottom: 1px solid rgba(0, 0, 0, 0.13); + border-radius: 0; + font-size: 120%; + box-shadow: none; + color: #31363D; } + .budgie-menu entry.search image:dir(ltr) { + padding-left: 8px; + padding-right: 12px; } + .budgie-menu entry.search image:dir(rtl) { + padding-left: 12px; + padding-right: 8px; } + .budgie-menu .categories { + border-width: 0; + margin-left: 3px; + background: transparent; } + .budgie-menu .categories:dir(ltr) { + border-right: 1px solid rgba(0, 0, 0, 0.13); } + .budgie-menu .categories:dir(rtl) { + border-left: 1px solid rgba(0, 0, 0, 0.13); } + .budgie-menu .category-button { + padding: 7px; + border-radius: 2px 0 0 2px; } + .budgie-menu .category-button:hover { + background-color: rgba(49, 54, 61, 0.05); + color: #31363d; } + .budgie-menu .category-button:active { + box-shadow: inset 0 2px 2px -2px rgba(0, 0, 0, 0.2); } + .budgie-menu .category-button:checked { + color: #fefefe; + background: linear-gradient(to right, #5797f7 0%, #00dcf4 100%); } + .budgie-menu .category-button:checked:hover { + color: rgba(254, 254, 254, 0.9); } + .budgie-menu .category-button:checked:disabled { + opacity: 0.5; } + .budgie-menu .category-button:checked:disabled label { + color: rgba(254, 254, 254, 0.7); } + .budgie-menu scrollbar { + background-color: transparent; + border-color: rgba(0, 0, 0, 0.13); } + .budgie-menu button:not(.category-button) { + padding-top: 5px; + padding-bottom: 5px; + border-radius: 0; + box-shadow: none; + background: yellow; } + .budgie-menu button { + border: none; + background: transparent; } + .budgie-menu undershoot, .budgie-menu overshoot { + background: none; } + .budgie-menu list { + color: rgba(49, 54, 61, 0.7); } button.budgie-menu-launcher { padding: 0 2px; @@ -4828,7 +4839,7 @@ button.budgie-menu-launcher { .user-menu > box.vertical row.activatable:first-child .indicator-item, .user-menu > frame.container > box.vertical row.activatable:first-child .indicator-item { box-shadow: 0 1px 1px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.2), inset 0px 1px 0px 0px rgba(255, 255, 255, 0.2); - background-color: #00c1e4; + background-color: #00D3A7; transition-duration: 0.2s; } .user-menu > box.vertical row.activatable:first-child .indicator-item:dir(ltr), .user-menu > frame.container > box.vertical row.activatable:first-child .indicator-item:dir(ltr) { @@ -4951,8 +4962,8 @@ button.raven-trigger { box-shadow: inset 0px 1px 1px alpha(@theme_fg_color, 0.04);; } .budgie-panel { - color: #31363D; - background-color: rgba(205, 205, 205, 0.95); + color: #98abb2; + background-color: rgba(15, 20, 25, 0.95); background-image: none; box-shadow: none; border: none; @@ -4960,18 +4971,25 @@ button.raven-trigger { .budgie-panel .alert { color: #ed254e; } .budgie-panel:backdrop { - color: #31363D; - background-color: rgba(205, 205, 205, 0.95); } + color: #98abb2; + background-color: rgba(15, 20, 25, 0.95); } .budgie-panel button { border-top-width: 0; border-bottom-width: 0; border-radius: 0; } + .budgie-panel button.flat { + background: transparent; + border: 1px solid rgba(15, 20, 25, 0.95); + color: #98abb2; } + .budgie-panel button.flat:hover, .budgie-panel button.flat:active, .budgie-panel button.flat:checked { + background: transparent; + color: #00D3A7; } .budgie-panel popover list, .budgie-panel popover row { padding: 0; margin: 0; } .budgie-panel label { - color: #31363D; + color: #ed254e; font-weight: 700; } .budgie-panel.transparent { background-color: transparent; } @@ -4989,13 +5007,13 @@ button.raven-trigger { background-color: rgba(49, 54, 61, 0.15); } .budgie-panel .end-region label { font-weight: 700; - color: #31363D; } + color: #98abb2; } .budgie-panel #tasklist-button, .budgie-panel #tasklist-button:backdrop { outline-color: transparent; transition: all 100ms cubic-bezier(0.25, 0.46, 0.45, 0.94); - border-color: rgba(205, 205, 205, 0); + border-color: rgba(15, 20, 25, 0); border-radius: 0; background-color: transparent; box-shadow: none; @@ -5004,7 +5022,7 @@ button.raven-trigger { .budgie-panel button.flat.launcher { outline-color: transparent; transition: all 100ms cubic-bezier(0.25, 0.46, 0.45, 0.94); - border-color: rgba(205, 205, 205, 0); + border-color: rgba(15, 20, 25, 0); border-radius: 0; padding: 0; background-clip: padding-box; @@ -5098,56 +5116,56 @@ button.raven-trigger { border-right: 2px solid #00D3A7; } .top .budgie-panel { - border-bottom: 1px solid rgba(213, 213, 213, 0.92); } + border-bottom: 1px solid rgba(0, 0, 0, 0.05); } .top .raven-frame { padding: 0; background: none; } .top .raven-frame border { border: none; - border-bottom: 1px solid rgba(230, 230, 230, 0.92); } + border-bottom: 1px solid rgba(0, 0, 0, 0.05); } .top .shadow-block { background-color: transparent; background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.3), transparent); } .bottom .budgie-panel { - border-top: 1px solid rgba(213, 213, 213, 0.92); } + border-top: 1px solid rgba(0, 0, 0, 0.05); } .bottom .raven-frame { padding: 0; background: none; } .bottom .raven-frame border { border: none; - border-top: 1px solid rgba(230, 230, 230, 0.92); } + border-top: 1px solid rgba(0, 0, 0, 0.05); } .bottom .shadow-block { background-color: transparent; background-image: linear-gradient(to top, rgba(0, 0, 0, 0.3), transparent); } .left .budgie-panel { - border-right: 1px solid rgba(213, 213, 213, 0.92); } + border-right: 1px solid rgba(0, 0, 0, 0.05); } .left .raven-frame { padding: 0; background: none; } .left .raven-frame border { border: none; - border-right: 1px solid rgba(230, 230, 230, 0.92); } + border-right: 1px solid rgba(0, 0, 0, 0.05); } .left .shadow-block { background-color: transparent; background-image: linear-gradient(to right, rgba(0, 0, 0, 0.3), transparent); } .right .budgie-panel { - border-left: 1px solid rgba(213, 213, 213, 0.92); } + border-left: 1px solid rgba(0, 0, 0, 0.05); } .right .raven-frame { padding: 0; background: none; } .right .raven-frame border { border: none; - border-left: 1px solid rgba(230, 230, 230, 0.92); } + border-left: 1px solid rgba(0, 0, 0, 0.05); } .right .shadow-block { background-color: transparent; @@ -5156,14 +5174,14 @@ button.raven-trigger { .raven { padding: 0; color: #31363d; - background: linear-gradient(to bottom, #EAEAEA, #bbb8b8); + background: linear-gradient(to bottom, #e6e6e6 20%, #e6e6e6); transition: 170ms ease-out; } .raven .raven-header { min-height: 32px; - color: #31363d; + color: #31363D; border: solid rgba(0, 0, 0, 0.08); border-width: 1px 0; - background-color: rgba(230, 230, 230, 0.2); } + background-color: rgba(213, 213, 213, 0.5); } .raven .raven-header * { padding-top: 0; padding-bottom: 0; } @@ -5192,36 +5210,45 @@ button.raven-trigger { .raven .raven-header.bottom { border-bottom-style: none; } .raven .raven-header button { - background-image: linear-gradient(to bottom, #ebf0f5, #e6e6e6); - border: 1px solid rgba(0, 0, 0, 0.13); - color: #31363d; - border-radius: 0; + color: #8b8b8b; + text-shadow: none; box-shadow: none; - margin-top: -4px; - margin-bottom: -4px; - min-height: 24px; } + background: transparent; + border: none; + border-radius: 0; } .raven .raven-header button:hover { - border-radius: 0; - background-color: transparent; - color: #00D3A7; } - .raven .raven-header button:active, .raven .raven-header button:checked { color: #00D3A7; border-radius: 0; - background: #eaeef2; } + text-shadow: none; + border: none; + border-radius: 0; } .raven .raven-header button:disabled { color: #8c8e92; } + .raven .raven-header button.text-button.radio { + margin: 5px 0px; + min-height: 20px; + padding: 3px; } + .raven .raven-header button.text-button.radio:active, .raven .raven-header button.text-button.radio:checked { + border-radius: 23px; + background: #00e8b7; + box-shadow: 0px 2px 4px rgba(177, 177, 177, 0.753); + color: snow; } .raven list { + color: #31363D; background-color: transparent; } .raven list:selected { background-color: rgba(0, 211, 167, 0.9); } .raven list row, .raven list row.activatable { background-color: transparent; } + .raven list row:hover, + .raven list row.activatable:hover { + background-color: rgba(44, 59, 73, 0.25); } .raven list row:selected, .raven list row.activatable:selected { background-color: rgba(0, 211, 167, 0.9); } .raven .raven-background { - color: #31363d; + color: #31363D; background-color: transparent; border-color: transparent; } .raven .raven-background.middle { @@ -5235,29 +5262,27 @@ button.raven-trigger { min-width: 32px; min-height: 32px; margin-bottom: 3px; - background: linear-gradient(to right, #8f94fb, #4e54c8); + background: #c74ded; color: #fefefe; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.2), inset 0px 1px 0px 0px rgba(255, 255, 255, 0.2); border: none; font-size: 100%; } .raven .powerstrip button.image-button:hover { - transition: 170ms ease all; - background: rgba(123, 123, 189, 0.85); + background: rgba(199, 77, 237, 0.85); color: #fefefe; } .raven .powerstrip button.image-button:active { - transition: 170ms ease all; - background: #7b7bbd; + background: #c74ded; color: #fefefe; } .raven .powerstrip button.image-button:first-child { background: linear-gradient(to right, #5797f7 0%, #00dcf4 100%); } .raven .powerstrip button.image-button:first-child:hover { - background: #00c1e4; } + background: rgba(0, 211, 167, 0.85); } .raven .powerstrip button.image-button:first-child:active { - background: #00c1e4; } + background: #00D3A7; } .raven .powerstrip button.image-button:last-child { background: linear-gradient(to right, #ee0979, #ff6a00); } .raven .powerstrip button.image-button:last-child:hover { - background: #ed254e; } + background: rgba(237, 37, 78, 0.85); } .raven .powerstrip button.image-button:last-child:active { background: #ed254e; } .raven .option-subtitle { @@ -5265,7 +5290,7 @@ button.raven-trigger { calendar.raven-calendar { padding: 6px; - color: #31363d; + color: #31363D; background: transparent; border-color: transparent; } calendar.raven-calendar:indeterminate { @@ -5277,7 +5302,7 @@ calendar.raven-calendar { calendar.raven-calendar:backdrop { background-color: transparent; } calendar.raven-calendar.header { - color: #31363d; + color: #31363D; border: none; border-radius: 0; background-color: transparent; } @@ -5315,14 +5340,14 @@ calendar.raven-calendar { background: none; border-radius: 1px; } .budgie-notification-window button, .budgie-osd-window button, .budgie-switcher-window button { - background-color: #00c1e4; + background-color: #00D3A7; color: #fefefe; border: none; } .budgie-notification-window button:hover, .budgie-osd-window button:hover, .budgie-switcher-window button:hover { - background-color: #00abcb; + background-color: #00ba93; border: none; } .budgie-notification-window button:active, .budgie-osd-window button:active, .budgie-switcher-window button:active, .budgie-notification-window button:checked, .budgie-osd-window button:checked, .budgie-switcher-window button:checked { - background-color: #00abcb; } + background-color: #00ba93; } .budgie-notification.background, .background.budgie-osd, .background.budgie-switcher { border-radius: 1px; } @@ -5377,7 +5402,7 @@ calendar.raven-calendar { .budgie-session-dialog, .budgie-polkit-dialog, .budgie-run-dialog { color: #31363D; - background-color: rgba(205, 205, 205, 0.95); } + background-color: rgba(15, 20, 25, 0.95); } .budgie-session-dialog label:backdrop, .budgie-polkit-dialog label:backdrop, .budgie-run-dialog label:backdrop { color: rgba(49, 54, 61, 0.5); } .budgie-session-dialog .dialog-title, .budgie-polkit-dialog .dialog-title, .budgie-run-dialog .dialog-title { @@ -5386,6 +5411,7 @@ calendar.raven-calendar { margin-bottom: 0; min-height: 32px; border-bottom: none; + border-color: rgba(0, 0, 0, 0.13); border-radius: 0; color: #31363D; background-color: transparent; @@ -5403,12 +5429,14 @@ calendar.raven-calendar { .budgie-session-dialog .linked.horizontal > button:hover:backdrop label, .budgie-polkit-dialog .linked.horizontal > button:hover:backdrop label, .budgie-run-dialog .linked.horizontal > button:hover:backdrop label { color: rgba(255, 255, 255, 0.5); } .budgie-session-dialog .linked.horizontal > button.suggested-action, .budgie-polkit-dialog .linked.horizontal > button.suggested-action, .budgie-run-dialog .linked.horizontal > button.suggested-action { - background-color: rgba(0, 193, 228, 0.9); } + color: #fff; + background-color: rgba(0, 211, 167, 0.9); } .budgie-session-dialog .linked.horizontal > button.suggested-action:hover, .budgie-polkit-dialog .linked.horizontal > button.suggested-action:hover, .budgie-run-dialog .linked.horizontal > button.suggested-action:hover { - background-color: rgba(0, 215, 254, 0.9); } + background-color: rgba(0, 237, 187, 0.9); } .budgie-session-dialog .linked.horizontal > button.suggested-action:active, .budgie-polkit-dialog .linked.horizontal > button.suggested-action:active, .budgie-run-dialog .linked.horizontal > button.suggested-action:active, .budgie-session-dialog .linked.horizontal > button.suggested-action:checked, .budgie-polkit-dialog .linked.horizontal > button.suggested-action:checked, .budgie-run-dialog .linked.horizontal > button.suggested-action:checked { - background-color: rgba(0, 215, 254, 0.9); } + background-color: rgba(0, 237, 187, 0.9); } .budgie-session-dialog .linked.horizontal > button.destructive-action, .budgie-polkit-dialog .linked.horizontal > button.destructive-action, .budgie-run-dialog .linked.horizontal > button.destructive-action { + color: #fff; background-color: rgba(230, 19, 62, 0.9); } .budgie-session-dialog .linked.horizontal > button.destructive-action:hover, .budgie-polkit-dialog .linked.horizontal > button.destructive-action:hover, .budgie-run-dialog .linked.horizontal > button.destructive-action:hover { background-color: rgba(237, 37, 78, 0.9); } @@ -5453,7 +5481,7 @@ calendar.raven-calendar { margin: 4px; padding: 5px; border-radius: 0; - background-color: rgba(205, 205, 205, 0.95); } + background-color: rgba(15, 20, 25, 0.95); } .budgie-menubar menu menuitem:hover { background-color: #00D3A7; color: #fefefe; }