Skip to content

Commit

Permalink
Improve Budgie DE support
Browse files Browse the repository at this point in the history
  • Loading branch information
@EliverLara
EliverLara committed Nov 23, 2018
1 parent d87d6be commit fa226da
Show file tree
Hide file tree
Showing 5 changed files with 323 additions and 268 deletions.
3 changes: 3 additions & 0 deletions gtk-3.0/_colors-public.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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};
112 changes: 63 additions & 49 deletions gtk-3.0/apps/_budgie.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,12 +9,13 @@ $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_color: $headerbar_fg_color;
$panel_border: transparentize(darken($headerbar_color, 7%), 0.08);
$panel_shadow: transparentize(black, 0.7);
$raven_bg: transparentize($bg_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_bg: transparentize($headerbar_color, 0.08);
$raven_expander_border: transparentize($dark_borders_color, 0.05);
$raven_border: transparentize($dark_borders_color, 0.08);
$raven_expander_bg: transparentize(lighten($panel_bg, 15%), 0.5);
$raven_background_bg: transparent;
$raven_background_border: transparent;

Expand Down Expand Up @@ -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: $panel_bg;
background-clip: border-box;
box-shadow: 0 2px 3px 1px transparentize(black, 0.65);
border: 1px solid #{"@borders"};
border: 1px solid $dark_borders_color;
list,
row {
&:hover { background: none; }
Expand All @@ -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 {
Expand All @@ -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; }
Expand All @@ -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 $dark_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; }
Expand All @@ -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 $dark_borders_color; }
&:dir(rtl) { border-left: 1px solid $dark_borders_color; }
}

.category-button {
Expand All @@ -136,24 +146,31 @@ $pos_list: ((top, bottom),(bottom,top),(left,right),(right,left));

label { color: transparentize($selected_fg_color, 0.3); }
}

}

scrollbar {
background-color: transparent;
border-color: transparent;
border-color: $dark_borders_color;
}

button:not(.category-button) {
padding-top: 5px;
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
Expand Down Expand Up @@ -194,7 +211,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
Expand Down Expand Up @@ -364,6 +381,14 @@ button.raven-trigger {
border-top-width: 0;
border-bottom-width: 0;
border-radius: 0;
&.flat {
background: transparent;
border: 1px solid $panel_bg;
&:hover, &:active, &:checked {
background: transparent;
color: $selected_bg_color;
}
}
}

popover list,
Expand Down Expand Up @@ -493,8 +518,8 @@ button.raven-trigger {
// Raven
.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%));
color: $red;
background: $panel_bg;
transition: 170ms ease-out;

.raven-header {
Expand All @@ -504,7 +529,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;
Expand Down Expand Up @@ -542,31 +567,18 @@ 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;
@include button(normal-header);
border-radius: 0;

&:hover {
@include button(hover-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%);

background-color: darken($main_dark_color, 2%);
}

&:disabled {
Expand All @@ -576,17 +588,20 @@ button.raven-trigger {
}

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;

Expand All @@ -605,38 +620,36 @@ 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;
border: none;
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;
Expand All @@ -651,7 +664,7 @@ button.raven-trigger {
// Calendar
calendar.raven-calendar {
padding: 6px;
color: $fg_color;
color: $panel_color;
background: transparent;
border-color: transparent;

Expand All @@ -666,7 +679,7 @@ calendar.raven-calendar {
&:backdrop { background-color: transparent; }

&.header {
color: $fg_color;
color: $panel_color;
border: none;
border-radius: 0;
background-color: transparent;
Expand Down Expand Up @@ -717,14 +730,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%); }
}
}

Expand Down Expand Up @@ -815,6 +828,7 @@ calendar.raven-calendar {
margin-bottom: 0;
min-height: 32px;
border-bottom: none;
border-color:$dark_borders_color;
border-radius: 0;
color: $headerbar_fg_color;
background-color: transparent;
Expand All @@ -830,7 +844,7 @@ 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} {
background-color: transparentize($b_color, 0.1);
Expand Down
Loading

0 comments on commit fa226da

Please sign in to comment.