updated dark theme and window corner radius
This commit is contained in:
parent
11edd2603c
commit
a9e85799d6
@ -12,7 +12,7 @@
|
|||||||
// Base colors
|
// Base colors
|
||||||
$base_color: if($variant == 'light', #ffffff, #242424);
|
$base_color: if($variant == 'light', #ffffff, #242424);
|
||||||
$text_color: if($variant == 'light', #363636, #dadada);
|
$text_color: if($variant == 'light', #363636, #dadada);
|
||||||
$bg_color: if($variant == 'light', #f5f5f5, #333333);
|
$bg_color: if($variant == 'light', #f5f5f5, #272727);
|
||||||
$fg_color: if($variant == 'light', #242424, #dedede);
|
$fg_color: if($variant == 'light', #242424, #dedede);
|
||||||
$alt_fg_color: if($variant == 'light', #424242, #afafaf);
|
$alt_fg_color: if($variant == 'light', #424242, #afafaf);
|
||||||
$hint_fg_color: if($variant == 'light', #565656, #999999);
|
$hint_fg_color: if($variant == 'light', #565656, #999999);
|
||||||
@ -102,9 +102,9 @@ $alt_disabled_fg_color: if($variant == 'light', transparentize($alt_
|
|||||||
$disabled_bg_color: if($variant == 'light', mix($bg_color, $base_color, 40%), lighten($bg_color, 2%));
|
$disabled_bg_color: if($variant == 'light', mix($bg_color, $base_color, 40%), lighten($bg_color, 2%));
|
||||||
|
|
||||||
// Headerbar colors
|
// Headerbar colors
|
||||||
$header_bg: if($variant == 'light', #ffffff, #373737);
|
$header_bg: if($variant == 'light', #ffffff, #242424); //default #373737
|
||||||
$dark_header_bg: if($trans == 'true', rgba($base_color, 0.95), $base_color);
|
$dark_header_bg: if($trans == 'true', rgba($base_color, 0.95), $base_color);
|
||||||
$header_highlight: if($variant == 'dark', #434343, #f5f5f5); // For metacity
|
$header_highlight: if($variant == 'dark', #373737, #f5f5f5); // For metacity //default #434343
|
||||||
|
|
||||||
$header_bg_backdrop: if($variant == 'light', darken($header_bg, 0%), darken($header_bg, 0%));
|
$header_bg_backdrop: if($variant == 'light', darken($header_bg, 0%), darken($header_bg, 0%));
|
||||||
$header_border: if($variant == 'light', mix(black, $header_bg, 12%), mix(black, $header_bg, 75%));
|
$header_border: if($variant == 'light', mix(black, $header_bg, 12%), mix(black, $header_bg, 75%));
|
||||||
|
@ -5,7 +5,7 @@ $asset_suffix: if($variant == 'dark', '-dark', '');
|
|||||||
$con_asset_suffix: if($variant=='dark', '', '-dark');
|
$con_asset_suffix: if($variant=='dark', '', '-dark');
|
||||||
$extra_background_clip: if($variant == 'light', padding-box, border-box);
|
$extra_background_clip: if($variant == 'light', padding-box, border-box);
|
||||||
|
|
||||||
$panel-corner-radius: 0;
|
$panel-corner-radius: 8px;
|
||||||
|
|
||||||
// font families
|
// font families
|
||||||
$font-family: "M+ 1c", Roboto, Cantarell, Sans-Serif;
|
$font-family: "M+ 1c", Roboto, Cantarell, Sans-Serif;
|
||||||
@ -27,11 +27,11 @@ $disabled_opacity: 0.45;
|
|||||||
|
|
||||||
// sizes
|
// sizes
|
||||||
$small_size: if($laptop == 'false', 24px, 20px);
|
$small_size: if($laptop == 'false', 24px, 20px);
|
||||||
$medium_size: if($laptop == 'false', 36px, 32px);
|
$medium_size: if($laptop == 'false', 28px, 26px);
|
||||||
$large_size: if($laptop == 'false', 48px, 44px);
|
$large_size: if($laptop == 'false', 48px, 28px); // 44px
|
||||||
$menuitem_size: if($laptop == 'false', 32px, 28px);
|
$menuitem_size: if($laptop == 'false', 32px, 28px);
|
||||||
$container_padding: if($laptop == 'false', 8px, 6px);
|
$container_padding: if($laptop == 'false', 8px, 6px);
|
||||||
$headerbar_size: if($laptop == 'false', 42px, 38px);
|
$headerbar_size: if($laptop == 'false', 28px, 28px);
|
||||||
|
|
||||||
// padding, margin and spacing
|
// padding, margin and spacing
|
||||||
$base_padding: if($laptop == 'false', 6px, 4px);
|
$base_padding: if($laptop == 'false', 6px, 4px);
|
||||||
@ -41,13 +41,13 @@ $base_spacing: if($laptop == 'false', 6px, 4px);
|
|||||||
// radiuses
|
// radiuses
|
||||||
$circular_radius: 9999px;
|
$circular_radius: 9999px;
|
||||||
$bt_radius: if($laptop == 'false', 6px, 6px);
|
$bt_radius: if($laptop == 'false', 6px, 6px);
|
||||||
$bd_radius: if($laptop == 'false', 8px, 8px);
|
$bd_radius: if($laptop == 'false', 6px, 6px); // 8 radius
|
||||||
$wm_radius: if($laptop == 'false', 12px, 12px);
|
$wm_radius: if($laptop == 'false', 8px, 8px); // 12 radius
|
||||||
$mn_radius: if($laptop == 'false', 10px, 10px);
|
$mn_radius: if($laptop == 'false', 5px, 5px); // 10 radius
|
||||||
$dash_radius: if($laptop == 'false', 24px, 18px);
|
$dash_radius: if($laptop == 'false', 24px, 18px);
|
||||||
$base_border_radius: if($laptop == 'false', 8px, 8px);
|
$base_border_radius: if($laptop == 'false', 6px, 6px); // 8 radius
|
||||||
$modal_radius: $base_border_radius * 2;
|
$modal_radius: $base_border_radius * 2;
|
||||||
$maximized_radius: 0;
|
$maximized_radius: 8px;
|
||||||
|
|
||||||
@if $max_window_style == 'round' {
|
@if $max_window_style == 'round' {
|
||||||
$maximized_radius: $wm_radius;
|
$maximized_radius: $wm_radius;
|
||||||
|
@ -44,6 +44,7 @@
|
|||||||
|
|
||||||
.dash-background {
|
.dash-background {
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
|
background-color: transparent; //remove this
|
||||||
border-width: 0;
|
border-width: 0;
|
||||||
border-#{$b_pos}-width: 1px;
|
border-#{$b_pos}-width: 1px;
|
||||||
margin: 0 !important;
|
margin: 0 !important;
|
||||||
@ -70,7 +71,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
#dash { // default-mode
|
#dash { // default-mode
|
||||||
background: none;
|
background: transparent;
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
|
|
||||||
StWidget.focused .app-well-app-running-dot {
|
StWidget.focused .app-well-app-running-dot {
|
||||||
@ -93,16 +94,18 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.dash-background {
|
.dash-background {
|
||||||
background-color: $dash_bg;
|
// background-color: $dash_bg;
|
||||||
|
background-color: transparent; //remove this
|
||||||
border: 1px solid if($variant == 'light', rgba(black, 0.08), rgba(black, 0.75));
|
border: 1px solid if($variant == 'light', rgba(black, 0.08), rgba(black, 0.75));
|
||||||
box-shadow: inset 0 0 0 1px rgba(white, 0.05);
|
box-shadow: inset 0 0 0 1px rgba(white, 0.05);
|
||||||
}
|
}
|
||||||
|
|
||||||
&:overview #dash { // overview-mode #1
|
&:overview #dash { // overview-mode #1
|
||||||
background: none;
|
background: transparent;
|
||||||
|
|
||||||
.dash-background {
|
.dash-background {
|
||||||
background-color: $light_divider_color;
|
// background-color: $light_divider_color;
|
||||||
|
background-color: transparent; //remove this
|
||||||
border: 1px solid rgba(black, 0.08);
|
border: 1px solid rgba(black, 0.08);
|
||||||
box-shadow: inset 0 0 0 1px rgba(white, 0.05);
|
box-shadow: inset 0 0 0 1px rgba(white, 0.05);
|
||||||
}
|
}
|
||||||
@ -146,7 +149,7 @@
|
|||||||
&.opaque.extended:overview,
|
&.opaque.extended:overview,
|
||||||
&.transparent.extended:overview {
|
&.transparent.extended:overview {
|
||||||
#dash {
|
#dash {
|
||||||
background: none;
|
background: transparent;
|
||||||
}
|
}
|
||||||
|
|
||||||
.dash-background {
|
.dash-background {
|
||||||
|
@ -26,7 +26,7 @@ $dash_border_radius: $dash_padding * 1.5 + 12px;
|
|||||||
}
|
}
|
||||||
|
|
||||||
.dash-background {
|
.dash-background {
|
||||||
background-color: $dash_background_color;
|
background-color: transparent;
|
||||||
margin-bottom: $dash_bottom_margin;
|
margin-bottom: $dash_bottom_margin;
|
||||||
padding: $dash_padding;
|
padding: $dash_padding;
|
||||||
border-radius: $dash_border_radius;
|
border-radius: $dash_border_radius;
|
||||||
|
@ -142,7 +142,7 @@ $list_shadow: if($variant == 'light',
|
|||||||
border-right-style: solid;
|
border-right-style: solid;
|
||||||
}
|
}
|
||||||
&:only-child {
|
&:only-child {
|
||||||
border-radius: $bt_radius $bt_radius 0 0;
|
border-radius: $bt_radius $bt_radius; // 0 0
|
||||||
border-style: solid;
|
border-style: solid;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -826,7 +826,7 @@ button {
|
|||||||
.linked:not(.vertical) > & {
|
.linked:not(.vertical) > & {
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
|
|
||||||
&:first-child { border-radius: $circular_radius 0 0 $circular_radius; }
|
&:first-child { border-radius: $circular_radius $circular_radius; }
|
||||||
&:last-child { border-radius: 0 $circular_radius $circular_radius 0; }
|
&:last-child { border-radius: 0 $circular_radius $circular_radius 0; }
|
||||||
&:only-child { border-radius: $circular_radius; }
|
&:only-child { border-radius: $circular_radius; }
|
||||||
}
|
}
|
||||||
@ -1486,6 +1486,7 @@ actionbar {
|
|||||||
|
|
||||||
headerbar {
|
headerbar {
|
||||||
min-height: $headerbar_size;
|
min-height: $headerbar_size;
|
||||||
|
max-height: $headerbar_size;
|
||||||
padding: 0 $container_padding + 10px;
|
padding: 0 $container_padding + 10px;
|
||||||
color: $header_fg;
|
color: $header_fg;
|
||||||
background-color: $header_bg;
|
background-color: $header_bg;
|
||||||
@ -1787,9 +1788,9 @@ headerbar {
|
|||||||
|
|
||||||
button.titlebutton {
|
button.titlebutton {
|
||||||
border: none;
|
border: none;
|
||||||
min-width: 16px;
|
min-width: 14px;
|
||||||
min-height: 16px;
|
min-height: 14px;
|
||||||
margin: 0;
|
margin: 0 2px 0 -5px;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -4251,7 +4252,7 @@ decoration {
|
|||||||
// server-side decorations as used by mutter
|
// server-side decorations as used by mutter
|
||||||
.ssd & {
|
.ssd & {
|
||||||
margin: -6px;
|
margin: -6px;
|
||||||
border-radius: $wm_radius $wm_radius 0 0;
|
border-radius: $wm_radius $wm_radius;
|
||||||
|
|
||||||
&, &.backdrop { box-shadow: $wm_outline; }
|
&, &.backdrop { box-shadow: $wm_outline; }
|
||||||
&.maximized, &.tiled { border-radius: 0; }
|
&.maximized, &.tiled { border-radius: 0; }
|
||||||
@ -4286,13 +4287,13 @@ decoration {
|
|||||||
headerbar {
|
headerbar {
|
||||||
button.titlebutton {
|
button.titlebutton {
|
||||||
&.close, &.maximize, &.minimize {
|
&.close, &.maximize, &.minimize {
|
||||||
min-width: 16px;
|
min-width: 14px;
|
||||||
min-height: 16px;
|
min-height: 14px;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
background-position: center;
|
background-position: center;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
background-size: 16px 16px;
|
background-size: 14px 14px;
|
||||||
|
|
||||||
&, &:hover, &:focus, &:active, &:backdrop {
|
&, &:hover, &:focus, &:active, &:backdrop {
|
||||||
@include button(undecorated);
|
@include button(undecorated);
|
||||||
|
@ -119,7 +119,7 @@ $list_shadow: if($variant == 'light',
|
|||||||
border-right-style: solid;
|
border-right-style: solid;
|
||||||
}
|
}
|
||||||
&:only-child {
|
&:only-child {
|
||||||
border-radius: $bt_radius $bt_radius 0 0;
|
border-radius: $bt_radius $bt_radius ; // 0 0-
|
||||||
border-style: solid;
|
border-style: solid;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -4430,13 +4430,13 @@ windowcontrols {
|
|||||||
padding: 0;
|
padding: 0;
|
||||||
|
|
||||||
&.close, &.maximize, &.minimize {
|
&.close, &.maximize, &.minimize {
|
||||||
min-width: 16px;
|
min-width: 14px;
|
||||||
min-height: 16px;
|
min-height: 14px;
|
||||||
margin: 0;
|
margin: 0 4px 0 -4px;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
background-position: center;
|
background-position: center;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
background-size: 16px 16px;
|
background-size: 14px 14px;
|
||||||
|
|
||||||
&, &:hover, &:focus, &:active, &:backdrop {
|
&, &:hover, &:focus, &:active, &:backdrop {
|
||||||
@include button(undecorated);
|
@include button(undecorated);
|
||||||
|
@ -586,11 +586,11 @@ $disk_space_free: darken($bg_color, 3%);
|
|||||||
|
|
||||||
terminal-window {
|
terminal-window {
|
||||||
&.background.csd {
|
&.background.csd {
|
||||||
border-radius: 0 0 0 0;
|
border-radius: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
decoration {
|
decoration {
|
||||||
border-radius: $wm_radius $wm_radius 0 0;
|
border-radius: $wm_radius $wm_radius;
|
||||||
}
|
}
|
||||||
|
|
||||||
notebook {
|
notebook {
|
||||||
@ -598,7 +598,7 @@ terminal-window {
|
|||||||
// }
|
// }
|
||||||
}
|
}
|
||||||
|
|
||||||
&.background.csd.maximized { border-radius: 0 0 0 0; } // Fixed gnome 3.32 issue: Unable to restore window size after maximization
|
&.background.csd.maximized { border-radius: 0; } // Fixed gnome 3.32 issue: Unable to restore window size after maximization
|
||||||
}
|
}
|
||||||
|
|
||||||
window.background.csd { // gnome-terminal 3.32 setting
|
window.background.csd { // gnome-terminal 3.32 setting
|
||||||
@ -1050,7 +1050,7 @@ workbench.csd > stack.titlebar:not(headerbar) {
|
|||||||
&,
|
&,
|
||||||
&:first-child,
|
&:first-child,
|
||||||
&:last-child {
|
&:last-child {
|
||||||
border-radius: $wm_radius $wm_radius 0 0;
|
border-radius: $wm_radius $wm_radius;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -2926,11 +2926,11 @@ window.background.csd {
|
|||||||
> border {
|
> border {
|
||||||
border: 1px solid $borders_color;
|
border: 1px solid $borders_color;
|
||||||
border-bottom: none;
|
border-bottom: none;
|
||||||
border-radius: $bt_radius $bt_radius 0 0;
|
border-radius: $bt_radius $bt_radius;
|
||||||
}
|
}
|
||||||
|
|
||||||
> stack > list {
|
> stack > list {
|
||||||
border-radius: $bt_radius $bt_radius 0 0;
|
border-radius: $bt_radius $bt_radius;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user