PoliEcho/kaliish-orange-theme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Gnome-Shell: update upstream code to gnome 42

Browse Source
This commit is contained in:
Daniel Ruiz de Alegría
2022-02-28 21:10:37 +01:00
parent 8a0eda5a2d
commit 6463c6ddb0
38 changed files with 1412 additions and 916 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-high-contrast.scss
+3 -7
View File
@@ -11,9 +11,9 @@ stage {
}
.toggle-switch { width: 48px; }
.toggle-switch-us, .toggle-switch-intl {
background-image: url("assets/toggle-off-hc.svg");
&:checked { background-image: url("assets/toggle-on-hc.svg"); }
.toggle-switch {
background-image: url("assets/toggle-off-hc.svg");
&:checked { background-image: url("assets/toggle-on-hc.svg"); }
}
//force opaque panel
@@ -22,10 +22,6 @@ stage {
&.unlock-screen,
&:overview {
background-color: #000;
.panel-corner {
-panel-corner-opacity: 1;
}
}
.panel-button {
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/_colors.scss
+19 -17
View File
@@ -1,34 +1,36 @@
// When color definition differs for dark and light variant,
// it gets @if ed depending on $variant
// it gets @if-ed depending on $variant
$base_color: if($variant == 'light', #fff, lighten(desaturate(#241f31, 20%), 2%));
$bg_color: if($variant == 'light', #f6f5f4, darken(desaturate(#3d3846, 100%), 4%));
$fg_color: if($variant == 'light', #2e3436, #eeeeec);
$base_color: if($variant == 'light', #fff, darken(desaturate(#241f31, 100%), 2%));
$bg_color: if($variant == 'light', #f6f5f4, lighten($base_color, 5%));
$fg_color: if($variant == 'light', transparentize(black, .2), white);
$selected_fg_color: #fff;
$selected_bg_color: if($variant == 'light', #3584e4, darken(#3584e4, 10%));
$selected_bg_color: #3584e4;
$selected_borders_color: if($variant== 'light', darken($selected_bg_color, 15%), darken($selected_bg_color, 30%));
$borders_color: if($variant == 'light', darken($bg_color, 18%), darken($bg_color, 8%));
$borders_edge: if($variant == 'light', rgba(255,255,255,0.8), transparentize($fg_color, 0.93));
$borders_color: if($variant == 'light', transparentize($fg_color, .5), transparentize($fg_color, .9));
$borders_edge: if($variant == 'light', rgba(255,255,255,0.8), lighten($bg_color, 5%));
$link_color: if($variant == 'light', darken($selected_bg_color, 10%), lighten($selected_bg_color, 20%));
$link_visited_color: if($variant == 'light', darken($selected_bg_color, 20%), lighten($selected_bg_color, 10%));
$top_hilight: $borders_edge;
$warning_color: #f57900;
$error_color: #ff8080;
$success_color: if($variant == 'light', #33d17a, darken(#33d17a, 10%));
$warning_color: if($variant == 'light', #e5a50a, #f5c211);;
$error_color: if($variant == 'light', #e01b24, #c01c28);
$success_color: if($variant == 'light', #2ec27e, #26a269);
$destructive_color: if($variant == 'light', #e01b24, darken(#e01b24, 10%));
$osd_fg_color: #eeeeec;
$osd_text_color: white;
$osd_bg_color: transparentize(darken(desaturate(#3d3846, 100%), 12%),0.04);
$osd_fg_color: white;
$osd_bg_color: transparentize(desaturate($bg_color, 100%),0.04);
$osd_insensitive_bg_color: transparentize(mix($osd_fg_color, opacify($osd_bg_color, 1), 10%), 0.5);
$osd_insensitive_fg_color: mix($osd_fg_color, opacify($osd_bg_color, 1), 50%);
$osd_insensitive_fg_color: if($variant == 'light', mix($osd_fg_color, $osd_bg_color, 80%), mix($osd_fg_color, $osd_bg_color, 70%));
$osd_borders_color: transparentize(black, 0.3);
$osd_outer_borders_color: transparentize(white, 0.84);
$osd_outer_borders_color: transparentize($osd_fg_color, 0.98);
$shadow_color: if($variant == 'light', rgba(0,0,0,0.1), rgba(0,0,0,0.2));
$system_bg_color: desaturate(#241f31,100%); //neutralize the HIG color
// overview background color
$system_bg_color: $base_color;
//insensitive state derived colors
$insensitive_fg_color: mix($fg_color, $bg_color, 50%);
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/_common.scss
+115 -74
View File
@@ -28,33 +28,32 @@ $cakeisalie: "This stylesheet is generated, DO NOT EDIT";
// padding, margin and spacing
$base_padding: 6px;
$base_margin: 4px;
$base_spacing: 6px;
// border radii
$base_border_radius: 8px;
$modal_radius:$base_border_radius * 2;
// radii of things that display over other things, e.g. popovers
$modal_radius: $base_border_radius*2; // 24px
// non-standard colors
$bubble_borders_color: lighten($borders_color, if($variant=='light', 0%, 5%));
// $bubble_borders_color: if($variant == 'light', rgba(255,255,255,0.1), rgba(0,0,0,0.3));
// derived hover colors
$hover_bg_color: if($variant=='light', darken($bg_color, 3%), lighten($bg_color, 4%));
$hover_fg_color: if($variant=='light', darken($fg_color, 5%), lighten($fg_color, 4%));
// hover
$hover_bg_color: if($variant=='light', darken($bg_color, 3%), lighten($bg_color, 5%));
$hover_fg_color: if($variant=='light', darken($fg_color, 5%), lighten($fg_color, 5%));
$hover_borders_color: lighten($borders_color,if($variant=='light', 5%, 3%));
// derived active colors
$active_bg_color: if($variant=='light', darken($bg_color, 5%), lighten($bg_color, 6%));
$active_fg_color: if($variant=='light', darken($fg_color, 5%), lighten($fg_color, 6%));
// active
$active_bg_color: if($variant == 'light', darken($bg_color, 7%), darken($bg_color, 9%));
$active_fg_color: darken($fg_color,if($variant=='light', 5%, 3%));
$active_borders_color: darken($borders_color,if($variant=='light', 5%, 3%));
// derived checked colors
$checked_bg_color: if($variant=='light', darken($bg_color, 7%), lighten($bg_color, 9%));
$checked_fg_color: if($variant=='light', darken($fg_color, 7%), lighten($fg_color, 9%));
// fonts
$base_font_size: 10;
$base_font_size: 11;
$text_shadow_color: if($variant == 'light', rgba(255,255,255,0.3), rgba(0,0,0,0.2));
// icons
$base_icon_size: 1.09em;
$large_icon_size: $base_icon_size*2; // 32px
// $base_icon_size: 16px;
// Stage
@@ -65,20 +64,13 @@ stage {
/* Common Stylings */
// Text
%status_text {
font-size: 2em;
font-weight: bold;
color: $osd_fg_color;
}
// osd panels
%osd_panel {
color: $osd_fg_color;
background-color: $osd_bg_color;
//border: 1px solid $osd_outer_borders_color;
border-radius: $base_border_radius * 2 + 4px;
padding: $base_padding * 2;
border: 1px solid $osd_outer_borders_color;
border-radius: 999px;
padding: $base_padding*2;
}
// Overview panels
@@ -89,8 +81,8 @@ stage {
}
// icon tiles
%icon_tile {
border-radius: $base_border_radius + 4px;
%tile {
border-radius: $base_border_radius * 2; // 16px
padding: $base_padding;
border: 2px solid transparent;
transition-duration: 100ms;
@@ -101,76 +93,125 @@ stage {
%bubble_panel {
color: $fg_color;
background-color: $bg_color;
border: 1px solid if($variant=='light', rgba(0,0,0, 0.6), $borders_color);
border-radius: $base_border_radius*1.25 + 1px;
border: 1px solid $borders_edge;
}
// button styling
// normal button styling
%button {
border-radius: $base_border_radius;
border-radius: $base_border_radius - 2px; // 6px
border-style: solid;
border-width: 1px;
min-height: 22px;
padding: $base_padding * 0.5 $base_padding * 4;
font-weight: bold;
padding: $base_padding*.5 $base_padding*4;
@include button(normal);
&:focus { @include button(focus);}
&:hover { @include button(hover);}
&:insensitive { @include button(insensitive);}
&:active { @include button(active);}
&:checked { @include button(checked);}
}
// buttons in dialogs
// buttons in dialogs/notifications
// lighter in color and have a greater radius
$bubble_button_radius:$base_border_radius*1.25;
$bubble_buttons_color: if($variant == 'light', darken($bg_color, 12%), lighten($bg_color, 7%));
%bubble_button {
@include button(normal, $shadow: none);
padding: $base_padding * 2;
border-style: solid;
border-width: 1px;
border-left-width: 0;
border-bottom-width: 0;
font-weight: bold !important;
margin-right: 1px;
&:insensitive { @include button(insensitive, $shadow: none); }
&:focus { @include button(focus, $shadow: none); }
&:hover { @include button(hover, $shadow: none); }
&:active { @include button(active, $shadow: none); }
// radius is 2 pixel less to fit in bubble
&:first-child {
border-radius: 0 0 0 $modal_radius - 2px;
@include button(normal, $c:$bubble_buttons_color);
&:insensitive { @include button(insensitive, $c:$bubble_buttons_color);}
&:focus { @include button(focus, $c:$bubble_buttons_color);}
&:hover { @include button(hover, $c:$bubble_buttons_color);}
&:active { @include button(active, $c:$bubble_buttons_color);}
&:checked { @include button(checked, $c:$bubble_buttons_color);}
&:first-child:ltr {
border-radius: 0 0 0 $bubble_button_radius;
}
&:last-child {
border-right-width: 0;
border-radius: 0 0 $modal_radius - 2px 0;
&:last-child:ltr {
border-radius: 0 0 $bubble_button_radius 0;
margin-right: 0 !important;
}
&:first-child:rtl {
border-radius: 0 0 $bubble_button_radius 0;
}
&:last-child:rtl {
border-radius: 0 0 0 $bubble_button_radius;
margin-right: 0 !important;
}
&:first-child:last-child {
border-radius: 0 0 $modal_radius - 2px $modal_radius - 2px;
border-radius: 0 0 $bubble_button_radius $bubble_button_radius !important;
margin-right: 0 !important;
}
}
// notification styling
@mixin notification_bubble($flat: false) {
border-width: 1px;
border-style: solid;
border-radius: $base_border_radius + 2px;
margin: $base_margin;
@if $flat {
@include button(undecorated);
} @else {
@include button(normal);
}
&:focus {
@include button(focus);
}
&:hover {
@include button(hover);
}
&:active {
@include button(active);
}
// buttons on OSD elements
// that are undecorated by default and use OSD colors
%osd_button {
@include button(undecorated);
&:insensitive { @include button(undecorated, $c:$osd_bg_color);}
&:focus { @include button(focus, $c:$osd_bg_color);}
&:hover { @include button(hover, $c:$osd_bg_color);}
&:active { @include button(active, $c:$osd_bg_color);}
&:outlined,&:checked { @include button(checked, $c:$osd_bg_color);}
}
/* General Typography */
%large_title {
font-weight: 300;
@include fontsize(24);
}
%title_1 {
font-weight: 800;
@include fontsize(20);
}
%title_2 {
font-weight: 800;
@include fontsize(15);
}
%title_3 {
font-weight: 700;
@include fontsize(15);
}
%title_4 {
font-weight: 700;
@include fontsize(13);
}
%heading {
font-weight: 700;
@include fontsize(11);
}
%caption_heading {
font-weight: 700;
@include fontsize(9);
}
%caption {
font-weight: 400;
@include fontsize(9);
}
%smaller {
font-weight: 400;
@include fontsize(8);
}
%monospace {font-family: monospace;}
%numeric { font-feature-settings: "tnum";}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/_common.scss.patch
-4
View File
@@ -1,4 +0,0 @@
53c53
< $base_font_size: 11;
---
> $base_font_size: 10;
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/_drawing.scss
+213 -133
View File
@@ -25,103 +25,51 @@
// entries
@mixin entry($t, $fc:$selected_bg_color, $edge: $borders_edge) {
@mixin entry($t, $fc:$selected_bg_color) {
//
// Entries drawing function
//
// $t: entry type
// $fc: focus color
// $edge: set to none to not draw the bottom edge or specify a color to not use the default one
//
// possible $t values:
// normal, focus, insensitive
//
@if $t==normal {
background-color: $base_color;
border-color: $borders_color;
background-color: lighten($bg_color, 5%);
color: transparentize($fg_color,0.3);
border: 2px solid lighten($bg_color, 5%);
}
@if $t==focus {
border-color: if($fc==$selected_bg_color,
$selected_borders_color,
darken($fc,35%));
box-shadow: inset 0 0 0 2px $fc;
background-color: mix(lighten($bg_color, 5%), $selected_bg_color, 95%);
border-color: $fc;
color: $fg_color;
&:hover {}
}
@if $t==hover { }
@if $t==hover {
background-color:lighten($hover_bg_color, 5%);
border-color:lighten($hover_bg_color, 5%);
color: transparentize($fg_color,0.3);
}
@if $t==insensitive {
background-color:lighten($insensitive_bg_color, 5%);
border-color: lighten($insensitive_bg_color, 5%);
color: $insensitive_fg_color;
border-color: $insensitive_bg_color;
box-shadow: none;
}
}
// buttons
@function draw_border_color ($c) {
//
// colored buttons want the border form the base color
//
@return if($variant == 'light', darken($c, 18%), darken($c, 4%));
}
@function draw_text_shadow_color ($tc:$fg_color, $bg:$bg_color) {
// On-screen Keyboard
@mixin keyboard_key($t, $c:$osd_bg_color, $tc:$osd_fg_color) {
//
// calculate the color of text shadows
// Keyboard key drawing function
//
// $tc is the text color
// $bg is the background color
//
$lbg: lightness($bg)/100%;
@if lightness($tc)<50% { @return rgba(255,255,255,$lbg/($lbg*1.3)); }
@else { @return rgba(0,0,0,1-$lbg*0.8); }
}
@function draw_button_hilight_color($c) {
//
// calculate the right top highlight color for buttons
//
// $c: base color;
//
@if lightness($c)>90% { @return white; }
@else if lightness($c)>80% { @return rgba(255,255,255, 0.7); }
@else if lightness($c)>50% { @return rgba(255,255,255, 0.5); }
@else if lightness($c)>40% { @return rgba(255,255,255, 0.3); }
@else { @return rgba(255,255,255, 0.1); }
}
@mixin draw_button_text_shadow ($tc:$fg_color, $bg:$bg_color) {
//
// helper function for the text emboss effect
//
// $tc is the optional text color, not the shadow color
//
// TODO: this functions needs a way to deal with special cases
//
$shadow: draw_text_shadow_color($tc, $bg);
@if lightness($tc)<50% {
text-shadow: 0 1px $shadow;
icon-shadow: 0 1px $shadow;
}
@else {
text-shadow: 0 -1px $shadow;
icon-shadow: 0 -1px $shadow;
}
}
@mixin button($t, $c:$bg_color, $tc:$fg_color, $edge: $borders_edge, $shadow: $shadow_color) {
//
// Button drawing function
//
// $t: button type,
// $c: base button color for colored* types
// $t: key type,
// $c: base key color for colored* types
// $tc: optional text color for colored* types
// $edge: set to none to not draw the bottom edge or specify a color to not
// use the default one
// $shadow: set to none to not draw the drop shadow or specify a color to not
// use the default one
//
// possible $t values:
// normal, hover, active, insensitive, insensitive-active,
@@ -129,104 +77,236 @@
// osd, osd-hover, osd-active, osd-insensitive, osd-backdrop, undecorated
//
$hilight_color: draw_button_hilight_color($c);
$button_edge: if($edge == none, none, draw_widget_edge($edge));
$blank_edge: if($edge == none, none, draw_widget_edge(transparentize($edge,1)));
$button_shadow: if($shadow == none, none, 0 1px 1px 0 $shadow);
// normal key
@if $t==normal {
color: $tc;
background-color: lighten($c, 3%);
}
// focused key
@if $t==focus {
color: $tc;
background-color: mix(lighten($c, 3%), $selected_bg_color, 90%);
box-shadow: inset 0 0 0 2px transparentize($selected_bg_color, 0.4);
&:hover {
background-color: mix(lighten($c, 8%), $selected_bg_color, 90%);
box-shadow: inset 0 0 0 2px transparentize($selected_bg_color, 0.3);
}
&:active {
background-color: mix(lighten($c, 10%), $selected_bg_color, 90%);
box-shadow: inset 0 0 0 2px transparentize($selected_bg_color, 0.3);
}
}
// hover key
@else if $t==hover {
color: $tc;
background-color: lighten($c, 7%);
}
// active key
@else if $t==active {
color: $tc;
background-color: lighten($c, 10%);
}
// checked key
@else if $t==checked {
color: $tc;
background-color: lighten($c, 15%);
}
// insensitive key
@else if $t==insensitive {
color: $insensitive_fg_color;
background-color: $insensitive_bg_color;
}
// reset
@else if $t==undecorated {
background-color: transparent;
background-image: none;
}
}
// buttons
// since buttons are all flat an borderless now the mixin is simpler
@mixin button($t, $tc:$fg_color, $c:$bg_color) {
$button_bg_color: mix($tc, $c, 5%);
//
// Button drawing function
//
// $t: button type,
// $c: base button colors, derived from fg_color
// $tc: base button colors, derived from fg_color
//
// possible $t values:
// normal, hover, active, insensitive, insensitive-active,
// backdrop, backdrop-active, backdrop-insensitive, backdrop-insensitive-active,
// osd, osd-hover, osd-active, osd-insensitive, osd-backdrop, undecorated
//
// normal button
@if $t==normal {
color: $tc;
background-color: lighten($c, 3%);
border-color: draw_border_color($c);
@include draw_shadows($button_shadow);
// box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1);
text-shadow: 0 1px $text_shadow_color;
icon-shadow: 0 1px $text_shadow_color;
background-color: $button_bg_color;
}
// focused button
@if $t==focus {
color: $tc;
text-shadow: 0 1px $text_shadow_color;
icon-shadow: 0 1px $text_shadow_color;
background-color: mix($button_bg_color, $selected_bg_color, 90%);
box-shadow: inset 0 0 0 2px transparentize($selected_bg_color, 0.4);
//border-color: $selected_bg_color;
&:hover {
background-color: mix(lighten($button_bg_color, 3%), $selected_bg_color, 90%);
box-shadow: inset 0 0 0 2px transparentize($selected_bg_color, 0.3);
}
&:active {
background-color: mix(lighten($button_bg_color, 6%), $selected_bg_color, 90%);
box-shadow: inset 0 0 0 2px transparentize($selected_bg_color, 0.3);
}
}
// hover button
@else if $t==hover {
color: $tc;
background-color: lighten($c, if($variant == 'light', 8%, 5%));
border-color: if($variant == 'light', draw_border_color(lighten($c, 7%)), draw_border_color($c));
@include draw_shadows($button_shadow);
text-shadow: 0 1px $text_shadow_color;
icon-shadow: 0 1px $text_shadow_color;
background-color: lighten($button_bg_color, 3%);
}
// active button
@else if $t==active {
color: $tc;
background-color: darken($c,3%);
border-color: draw_border_color(if($variant == 'light', $c, darken($c,7%)));
text-shadow: none;
icon-shadow: none;
box-shadow: none;
background-color: lighten($button_bg_color, 6%);
}
// checked button
@else if $t==checked {
color: $tc;
background-color: lighten($button_bg_color, 9%);
&:hover { background-color: lighten($button_bg_color, 12%);}
&:active { background-color: lighten($button_bg_color, 15%);}
}
// insensitive button
@else if $t==insensitive {
color: $insensitive_fg_color;
border-color: $insensitive_borders_color;
background-color: $insensitive_bg_color;
box-shadow: none;
text-shadow: none;
icon-shadow: none;
color: transparentize($tc, 0.5);
background-color: transparentize($tc, .95);
}
// default/suggested button
@else if $t==default {
background-color: $selected_bg_color;
color: $selected_fg_color;
&:focus {
box-shadow: inset 0 0 0 2px transparentize($selected_bg_color, 0.4);
}
&:hover, &:focus {
background-color: lighten($selected_bg_color, 5%);
color: lighten($selected_fg_color, 5%);
}
&:active {
background-color: darken($selected_bg_color, 7%);
color: darken($selected_fg_color, 7%);
}
&:insensitive {
@include button(insensitive);
background-color: transparentize($selected_bg_color, .5);
color: transparentize($selected_fg_color, .5);
}
}
// reset
@else if $t==undecorated {
border-color: transparent;
background-color: transparent;
background-image: none;
@include draw_shadows(inset 0 1px rgba(255,255,255,0),$blank_edge);
text-shadow: none;
icon-shadow: none;
background-color: none;
&:insensitive {
@include button(insensitive);
background-color: transparent;
color: transparentize($selected_fg_color, .5);
}
}
}
// overview icons
@mixin overview-icon($color) {
.overview-icon {
@extend %icon_tile;
color: $color;
// tile
@mixin tile_button($color, $flat: true) {
@extend %tile;
@if $flat {
background-color: transparent;
} @else {
background-color: transparentize($color, .84);
}
&:hover { background-color: transparentize($color, .9);}
&:selected, &:focus {
background-color: transparentize($color, .87);
&:hover { background-color: transparentize($color, .84);}
&:active { background-color: transparentize($color, .87);}
}
&:active { background-color: transparentize($color, .84);}
&:outlined, &:checked {
background-color: transparentize($color, .81);
&:active { background-color: transparentize($color, .78);}
&:hover { background-color: transparentize($color, .75);}
}
&:drop {
border: 2px solid transparentize($selected_bg_color, .2); //already 2px transparent so no jumping
background-color: transparentize($selected_bg_color, .8);
}
}
&:hover,
&:selected {
.overview-icon {
background-color: transparentize($color, .9);
}
// overview icon, dash, app grid
@mixin overview_icon($color, $flat: true) {
.overview-icon { @extend %tile; }
@if $flat {
.overview-icon { background-color: transparent;}
} @else {
.overview-icon { background-color: transparentize($color, .81);}
}
&:hover .overview-icon { background-color: transparentize($color, .9);}
&:selected .overview-icon,
&:focus .overview-icon {
background-color: transparentize($color, .87);
&:hover .overview-icon { background-color: transparentize($color, .84);}
&:active .overview-icon { background-color: transparentize($color, .87);}
}
&:active .overview-icon { background-color: transparentize($color, .84);}
&:outlined .overview-icon,
&:checked .overview-icon {
background-color: transparentize($color, .81);
&:active .overview-icon { background-color: transparentize($color, .78);}
&:hover .overview-icon { background-color: transparentize($color, .75);}
}
&:drop .overview-icon {
border: 2px solid transparentize($selected_bg_color, .2); //already 2px transparent so no jumping
background-color: transparentize($selected_bg_color, .8);
}
}
// styling for elements within popovers that look like notifications
@mixin card($flat: false) {
border-radius: $base_border_radius;
margin: $base_margin;
box-shadow: 0 1px 1px 0 rgba(0,0,0,.1);
@if $flat {
@include button(undecorated);
box-shadow: none !important;
} @else {
@include button(normal);
}
&:focus {
.overview-icon {
background-color: transparentize($color, .7);
// border-color: $selected_bg_color;
}
@include button(focus);
}
&:drop {
.overview-icon {
border: 2px solid $selected_bg_color; //already 2px transparent so no jumping
background-color: transparentize($selected_bg_color, .8);
}
&:hover {
@include button(hover);
}
&:active,
&:checked {
.overview-icon {
background-color: transparentize(darken($osd_bg_color, 10%), .5);
}
&:active {
@include button(active);
}
}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/_widgets.scss
+1 -1
View File
@@ -29,6 +29,7 @@
@import 'widgets/osd';
@import 'widgets/switcher-popup';
@import 'widgets/workspace-switcher';
@import 'widgets/screenshot';
// Panel
@import 'widgets/panel';
@import 'widgets/corner-ripple';
@@ -43,7 +44,6 @@
// A11y / misc
@import 'widgets/a11y';
@import 'widgets/misc';
@import 'widgets/tiled-previews';
@import 'widgets/keyboard';
@import 'widgets/looking-glass';
// Lock / login screens
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_app-grid.scss
+29 -35
View File
@@ -4,10 +4,10 @@ $app_icon_size: 96px;
// app icons
.icon-grid {
row-spacing: $base_spacing * 2;
column-spacing: $base_spacing * 2;
max-row-spacing: $base_spacing * 12;
max-column-spacing: $base_spacing * 12;
row-spacing: $base_padding * 2;
column-spacing: $base_padding * 2;
max-row-spacing: $base_padding * 12;
max-column-spacing: $base_padding * 12;
page-padding-top: $base_padding * 4;
page-padding-bottom: $base_padding * 4;
page-padding-left: $base_padding * 2;
@@ -16,31 +16,28 @@ $app_icon_size: 96px;
/* App Icons */
$app_grid_fg_color: #fff;
// Icon tiles in the app grid
.app-well-app,
%app-well-app {
@include overview-icon($app_grid_fg_color);
.app-well-app {
@include overview_icon($osd_fg_color);
.overview-icon {
padding: $base_padding*2;
}
.overview-icon.overview-icon-with-label {
padding: 10px 8px 5px 8px;
> StBoxLayout {
spacing: $base_spacing;
spacing: $base_padding;
}
}
}
/* App Folders */
// app folders
.app-well-app.app-folder {
background-color: $dash_background_color;
border-radius: $base_border_radius + 4px; // same as %icon_tile
@include overview_icon($osd_fg_color, $flat: false);
}
// expanded folder
.app-folder-dialog { //style like the dash
border-radius: $modal_radius * 1.5;
.app-folder-dialog {
border-radius: $modal_radius*2;
background-color: $dash_background_color;
padding: 12px 0px 12px 0px;
@@ -50,8 +47,7 @@ $app_grid_fg_color: #fff;
& .folder-name-label,
& .folder-name-entry {
font-size: 18pt;
font-weight: 800;
@extend %title_1;
}
& .folder-name-entry { width: 300px }
@@ -60,20 +56,22 @@ $app_grid_fg_color: #fff;
& .folder-name-label { padding: 5px 7px; color: $osd_fg_color; }
& .edit-folder-button {
@extend %button;
padding: 0;
@include button(undecorated);
width: 36px;
height: 36px;
border-radius: 18px;
& > StIcon { icon-size: 16px }
&:focus {@include button(focus);}
&:hover {@include button(hover);}
&:active {@include button(active);}
& > StIcon { icon-size: $base_icon_size }
}
}
& .icon-grid {
row-spacing: $base_spacing * 2;
column-spacing: $base_spacing * 5;
row-spacing: $base_padding * 2;
column-spacing: $base_padding * 5;
page-padding-top: 0;
page-padding-bottom: 0;
page-padding-left: 0;
@@ -84,8 +82,9 @@ $app_grid_fg_color: #fff;
margin-bottom: 18px;
}
}
.app-folder-dialog-container {
padding: 12px;
padding: $base_padding*2;
width: 620px;
height: 620px;
}
@@ -95,23 +94,18 @@ $app_grid_fg_color: #fff;
height: 5px;
width: 5px;
border-radius:5px;
margin-bottom: 8px;
background-color: $osd_fg_color;
margin-bottom: 1px;
}
// Rename popup for app folders
.rename-folder-popup {
.rename-folder-popup-item {
spacing: $base_spacing;
spacing: $base_padding;
&:ltr, &:rtl { padding: 0 $base_padding * 2; }
}
}
// right-click app menu
.app-menu {
max-width: 27.25em;
}
// App Grid pagination indicators
.page-indicator {
padding: $base_padding $base_padding * 2 0;
@@ -148,7 +142,7 @@ $app_grid_fg_color: #fff;
background-gradient-start: rgba(255, 255, 255, 0.05);
background-gradient-end: transparent;
background-gradient-direction: horizontal;
border-radius: 15px 0px 0px 15px;
border-radius: $modal_radius*1.5 0px 0px $modal_radius*1.5;
}
&.previous:ltr,
@@ -156,7 +150,7 @@ $app_grid_fg_color: #fff;
background-gradient-start: transparent;
background-gradient-end: rgba(255, 255, 255, 0.05);
background-gradient-direction: horizontal;
border-radius: 0px 15px 15px 0px;
border-radius: 0px $modal_radius*1.5 $modal_radius*1.5 0px;
}
}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_buttons.scss
+1
View File
@@ -2,4 +2,5 @@
.button {
@extend %button; // that's it
min-height: 22px;
}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_calendar.scss
+107 -142
View File
@@ -1,291 +1,256 @@
/* Date/Time Menu */
.clock-display-box {
spacing: 2px;
.clock {
padding-left: $base_padding * 2;
padding-right: $base_padding * 2;
}
}
// overall menu
#calendarArea {
padding:0;
padding: $base_padding - 2px;
}
// Calendar menu side column
.datemenu-calendar-column {
spacing: $base_spacing;
border: 0 solid $bubble_borders_color;
padding: 0 $base_padding * 2;
&:ltr {margin-right: $base_margin * 2; border-left-width: 1px; }
&:rtl {margin-left: $base_margin * 2; border-right-width: 1px; }
.datemenu-displays-section {
}
.datemenu-displays-box {
spacing: $base_spacing;
}
}
.events-section-title {
@include notification_bubble($flat: true);
color: desaturate(darken($fg_color,40%), 10%);
font-weight: bold;
padding: .4em;
spacing: $base_padding;
&:ltr {padding-left: $base_padding;}
&:rtl {padding-right: $base_padding;}
.datemenu-displays-box {spacing: $base_padding;}
}
/* today button (the date) */
.datemenu-today-button {
@include notification_bubble($flat: true);
@include card($flat: true);
padding: $base_padding * 1.5;
// weekday label
.day-label {
@include fontsize($base_font_size+1);
font-weight: bold;
@extend %heading;
}
// date label
.date-label {
@include fontsize($base_font_size+7);
font-weight: 1000;
@extend %title_2;
}
}
/* Calendar */
.calendar {
@include notification_bubble;
padding: $base_padding;
@include card(flat);
margin-top: 0;
// month
.calendar-month-label {
color: lighten($fg_color,5%);
font-weight: bold;
padding: 8px 0;
&:focus {}
// month header
.calendar-month-header {
// prev/next month icons
.calendar-change-month-back StIcon,
.calendar-change-month-forward StIcon {
icon-size: $base_icon_size;
}
// month label
.calendar-month-label {
color: lighten($fg_color,5%);
@extend %heading;
padding: 8px 0;
}
.pager-button {
background-color: transparent;
height: 32px;
width: 32px;
margin: 2px;
border-radius: $base_border_radius - 2px;
&:hover, &:focus {background-color: $hover_bg_color;}
&:active {background-color: $active_bg_color;}
}
}
// prev/next month icons
.calendar-change-month-back StIcon,
.calendar-change-month-forward StIcon {
icon-size: $base_icon_size;
}
.pager-button {
background-color: transparent;
height: 32px;
width: 32px;
border-radius: $base_border_radius;
&:hover, &:focus { background-color: lighten($hover_bg_color, 5%); }
&:active { background-color: $active_bg_color; }
}
$calendar_day_size: 32px;
.calendar-day-base {
@include fontsize($base_font_size - 3);
text-align: center;
width: $calendar_day_size;
height: $calendar_day_size;
padding: 0;
margin: 2px;
border-radius: $calendar_day_size * 0.5 + 2px;
border: 1px solid transparent; //avoid jumparound due to today
font-feature-settings: "tnum";
&:hover, &:focus { background-color: $hover_bg_color; }
padding: 0 !important;
height: $calendar_day_size !important;
width: $calendar_day_size !important;
border-radius: 99px;
@extend %numeric;
@extend %smaller;
&:hover {background-color: $hover_bg_color;}
&:focus {
background-color: mix($bg_color, $selected_bg_color, 80%);
color: $selected_fg_color;
box-shadow:inset 0 0 0 2px transparentize($selected_bg_color, 0.4);
}
&:active,&:selected {
color: lighten($fg_color,10%);
background-color: darken($bg_color,5%);
color: $active_fg_color;
background-color: $active_bg_color;
&:focus {
background-color: mix($active_bg_color, $selected_bg_color, 80%);
}
}
// day of week heading
&.calendar-day-heading {
color: lighten($fg_color,10%);
margin-top: 1em;
@include fontsize($base_font_size - 4);
color: $insensitive_fg_color;
padding-top: $base_padding;
height: 16px !important; // force heading to be smaller height
font-weight: bold;
@extend %smaller;
}
}
.calendar-day { //border collapse hack - see calendar.js
border-width: 0;
}
.calendar-day-top {
border-top-width: 1px;
}
.calendar-day-left {
border-left-width: 1px;
}
.calendar-day {}
.calendar-work-day {}
.calendar-nonwork-day {
color: $insensitive_fg_color;
.calendar-nonwork-day {color: $insensitive_fg_color;}
.calendar-other-month-day {
color: transparentize($fg_color, 0.5);
&.calendar-nonwork-day {
color: transparentize($insensitive_fg_color, 0.5);
}
}
// Today
.calendar-today {
font-weight: bold;
border: 1px solid transparent;
background-color: $selected_bg_color;
color: $selected_fg_color;
font-weight: 800;
color: $selected_fg_color !important;
&:hover,&:focus {
background-color:lighten($selected_bg_color, 3%);
color: $selected_fg_color;
color: inherit;
}
&:active,&:selected {
background-color: $selected_bg_color;
color: $selected_fg_color;
color: inherit;
&:hover,&:focus {
background-color:lighten($selected_bg_color, 3%);
color: $selected_fg_color;
color: inherit;
}
}
}
.calendar-day-with-events {
background-image: url("assets/calendar-today.svg");
&.calendar-work-day {
color: lighten($fg_color,10%);
font-weight: bold;
}
}
.calendar-other-month-day {
color: transparentize($fg_color ,0.5);
background-image: if($variant == 'light', url("assets/calendar-today-light.svg"),url("assets/calendar-today.svg"));
background-size: contain;
}
.calendar-week-number {
@include fontsize($base_font_size - 4);
font-weight: bold;
height: 1.8em;
width: 2.3em;
border-radius: 2px;
font-feature-settings: "tnum";
margin: 6px;
padding: 0 $base_padding;
border-radius: 3px;
background-color: darken($bg_color, 2%);
color: lighten($fg_color, 5%);
color: $insensitive_fg_color
}
}
/* Events */
.events-button {
@include notification_bubble;
@include card;
padding: $base_padding * 2;
.events-box {
spacing: $base_spacing;
spacing: $base_padding;
}
.events-list {
spacing: 2 * $base_spacing;
spacing: 2 * $base_padding;
}
.events-title {
color: desaturate(darken($fg_color,40%), 10%);
font-weight: bold;
@extend %heading;
color: $insensitive_fg_color;
margin-bottom: $base_margin;
}
.event-time {
color: darken($fg_color,20%);
font-feature-settings: "tnum";
@include fontsize($base_font_size - 1);
@extend %numeric;
@extend %caption;
color: $insensitive_fg_color;
}
}
/* World clocks */
.world-clocks-button {
@include notification_bubble;
@include card;
padding: $base_padding * 2;
.world-clocks-grid {
spacing-rows: $base_spacing;
spacing-columns: $base_spacing * 2;
spacing-rows: $base_padding;
spacing-columns: $base_padding * 2;
}
// title
.world-clocks-header {
color: desaturate(darken($fg_color,40%), 10%);
font-weight: bold;
@extend %heading;
color: $insensitive_fg_color;
}
// city label
.world-clocks-city {
color: $fg_color;
@include fontsize($base_font_size);
font-weight: normal;
}
// timezone time
.world-clocks-time {
font-weight: bold;
@extend %heading;
@extend %numeric;
color: $fg_color;
font-feature-settings: "tnum";
@include fontsize($base_font_size);
&:ltr { text-align: right; }
&:rtl { text-align: left; }
&:ltr {text-align: right;}
&:rtl {text-align: left;}
}
// timezone offset label
.world-clocks-timezone {
color: darken($fg_color,20%);
font-feature-settings: "tnum";
@include fontsize($base_font_size - 1);
@extend %numeric;
@extend %caption;
color: $insensitive_fg_color;
}
}
/* Weather */
.weather-button {
@include notification_bubble;
@include card;
padding: $base_padding * 2;
.weather-box {
spacing: $base_spacing + $base_margin;
spacing: $base_padding + $base_margin;
}
.weather-header-box {
spacing: $base_spacing;
spacing: $base_padding;
}
.weather-header {
color: desaturate(darken($fg_color,40%), 10%);
font-weight: bold;
color: $insensitive_fg_color;
@extend %heading;
&.location {
font-weight: normal;
@include fontsize($base_font_size - 1);
}
}
.weather-grid {
spacing-rows: $base_spacing;
spacing-columns: $base_spacing * 2;
spacing-rows: $base_padding;
spacing-columns: $base_padding * 2;
}
.weather-forecast-time {
@extend %numeric;
@extend %caption;
color: darken($fg_color,30%);
font-feature-settings: "tnum";
@include fontsize($base_font_size - 2);
font-weight: normal;
padding-top: 0.2em;
padding-bottom: 0.4em;
}
.weather-forecast-icon {
icon-size: $base_icon_size * 2;
icon-size: $large_icon_size;
}
.weather-forecast-temp {
font-weight: bold;
@extend %heading;
}
}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_check-box.scss
+4 -4
View File
@@ -1,7 +1,7 @@
/* Check Boxes */
// these are equal to the size of the SVG assets
$check_height: 22px;
$check_height: 24px;
$check_width: 24px;
@@ -10,9 +10,9 @@ $check_width: 24px;
StBin {
width: $check_width;
height: $check_height;
background-image: url("assets/checkbox-off.svg");
background-image: if($variant == 'light', url("assets/checkbox-off-light.svg"), url("assets/checkbox-off.svg"));
}
&:focus StBin { background-image: url("assets/checkbox-off-focused.svg"); }
&:focus StBin { background-image: if($variant == 'light', url("assets/checkbox-off-focused-light.svg"), url("assets/checkbox-off-focused.svg"));; }
&:checked StBin { background-image: url("assets/checkbox.svg"); }
&:focus:checked StBin { background-image: url("assets/checkbox-focused.svg"); }
}
}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_dash.scss
+25 -33
View File
@@ -1,18 +1,14 @@
/* Dash */
$dash_background_color: #3b3b3b;
$dash_background_color: lighten($system_bg_color, 5%);
$dash_placeholder_size: 32px;
$dash_padding: $base_padding + 4px; // 10px
$dash_spacing: $base_padding / 4;
$dash_bottom_margin: $base_margin * 4;
$dash_border_radius: $modal_radius * 1.5;
$dash_padding: $base_padding*2; // 12px
$dash_border_radius: $modal_radius + $dash_padding;
// container for the dash
#dash {
@include fontsize($base_font_size - 2);
margin-top: $base_spacing * 3;
padding: 0 $dash_padding;
@extend %caption;
margin: 2em;
.placeholder {
// background-image: url("assets/dash-placeholder.svg");
@@ -26,27 +22,36 @@ $dash_border_radius: $modal_radius * 1.5;
height: $dash_placeholder_size;
}
.overview-icon {
padding: $dash_padding / 2;
// Running app indicator (also shown in app grid)
.app-well-app-running-dot {
margin-bottom: 15px; // hardcoded
}
}
// background of the dash behind app icons
.dash-background {
background-color: $dash_background_color;
margin-bottom: $dash_bottom_margin;
padding: $dash_padding;
border-radius: $dash_border_radius;
padding: $dash_padding;
spacing: $base_padding;
}
// Dash Items
.dash-item-container .app-well-app, .show-apps {
padding: $dash_padding $dash_spacing $dash_padding + $dash_bottom_margin;
// items on the dash
.dash-item-container {
// each app item on the dash
.app-well-app .overview-icon {
margin: 0 4px;
padding: $base_padding;
}
// show apps button
.show-apps { @include overview_icon($osd_fg_color);}
}
// separator between favourites and running apps
.dash-separator {
width: 1px;
margin: 0 ($dash_spacing + ($dash_padding / 2)) $dash_bottom_margin;
background-color: transparentize($osd_fg_color,0.7);
background-color: $borders_color;
}
// OSD Tooltip
@@ -56,18 +61,5 @@ $dash_border_radius: $modal_radius * 1.5;
border-radius: 99px;
padding: $base_padding $base_padding * 2;
text-align: center;
-y-offset: $base_margin * 3; // distance from the dash edge
}
// Show apps button
.show-apps {
@include overview-icon($osd_fg_color);
&:focus,
&:checked {
.overview-icon {
background-color: transparentize($osd_bg_color,0.5);
color: $fg_color;
}
}
-y-offset: $base_margin * 2; // distance from the dash edge
}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_dialogs.scss
+8 -14
View File
@@ -1,11 +1,10 @@
/* Modal Dialogs */
.headline {
@include fontsize($base_font_size + 1);
@extend %title_4;
}
.modal-dialog {
border-radius: $modal_radius;
@extend %bubble_panel;
.modal-dialog-content-box {
@@ -35,13 +34,9 @@
.message-dialog-title {
text-align: center;
font-size: 18pt;
font-weight: 800;
@extend %title_2;
&.lightweight {
font-size: 13pt;
font-weight: 800;
}
&.lightweight { @extend %title_4;}
}
.message-dialog-description { text-align: center; }
}
@@ -52,7 +47,7 @@
.dialog-list-title {
text-align: center;
font-weight: bold;
@extend %heading;
}
.dialog-list-scrollview { max-height: 200px; }
@@ -65,7 +60,7 @@
.dialog-list-item-title { font-weight: bold; }
.dialog-list-item-description {
color: darken($fg_color,5%);
@include fontsize($base_font_size - 1);
@extend %caption;
}
}
}
@@ -79,7 +74,7 @@
}
.run-dialog-entry { width: 20em; }
.run-dialog-description {
@include fontsize($base_font_size - 1);
@extend %caption;
text-align: center;
color: darken($fg_color, 20%);
}
@@ -120,7 +115,7 @@
.prompt-dialog-info-label,
.prompt-dialog-null-label {
text-align: center;
@include fontsize($base_font_size - 1);
@extend %caption;
}
.prompt-dialog-error-label {
@@ -145,8 +140,7 @@
}
.audio-selection-device {
border: 1px solid $bubble_borders_color;
border-radius: 12px;
border-radius: $base_border_radius*2;
&:hover,&:focus { background-color: $hover_bg_color; }
&:active {
background-color: $selected_bg_color;
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_entries.scss
+6 -2
View File
@@ -3,23 +3,27 @@
StEntry {
border-radius: $base_border_radius;
padding: 8px;
border-width: 0;
color: $fg_color;
@include entry(normal);
//&:hover { @include entry(hover);}
&:hover { @include entry(hover);}
&:focus { @include entry(focus);}
&:insensitive { @include entry(insensitive);}
selection-background-color: $selected_bg_color;
selected-color: $selected_fg_color;
StIcon.capslock-warning {
icon-size: 16px;
warning-color: $warning_color;
padding: 0 4px;
}
StIcon.peek-password {
icon-size: $base_icon_size;
padding: 0 4px;
}
StLabel.hint-text {
margin-left: 2px;
color: transparentize($fg_color, 0.3);
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_ibus-popup.scss
+15 -14
View File
@@ -5,31 +5,32 @@
}
.candidate-popup-content {
padding: 0.5em;
spacing: 0.3em;
padding: $base_padding;
spacing: $base_padding;
@extend .popup-menu-content;
}
.candidate-index {
padding: 0 0.5em 0 0;
color: darken($fg_color,10%);
padding: 0;
padding-right: $base_padding;
color: $insensitive_fg_color;
}
.candidate-box {
padding: 0.3em 0.5em 0.3em 0.5em;
padding: $base_padding $base_padding*2 $base_padding $base_padding*2;
border-radius: $base_border_radius;
&:selected,&:hover { background-color: $selected_bg_color; color: $selected_fg_color; }
&:selected { background-color: $selected_bg_color; color: $selected_fg_color; }
&:hover { background-color: $hover_bg_color; color: $hover_fg_color; }
}
.candidate-page-button-box {
height: 2em;
.vertical & { padding-top: 0.5em; }
.horizontal & { padding-left: 0.5em; }
.vertical & { padding-top: $base_padding*2; }
.horizontal & { padding-left: $base_padding*2; }
}
.candidate-page-button {
padding: 4px;
}
.candidate-page-button { padding: $base_padding;}
.candidate-page-button-previous { border-radius: $base_border_radius 0px 0px $base_border_radius; border-right-width: 0; }
.candidate-page-button-next { border-radius: 0px $base_border_radius $base_border_radius 0px; }
.candidate-page-button-icon { icon-size: 1em; }
.candidate-page-button-previous { border-radius: $base_border_radius 0px 0px $base_border_radius; border-right-width: 0;box-shadow: none;}
.candidate-page-button-next { border-radius: 0px $base_border_radius $base_border_radius 0px;box-shadow: none;}
.candidate-page-button-icon { icon-size: $base_icon_size; }
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_keyboard.scss
+64 -26
View File
@@ -1,15 +1,16 @@
/* On-screen Keyboard */
$key_size: 1.2em;
$key_border_radius: $base_border_radius + 3px;
$key_bg_color: $bg_color;
$key_border_radius: $base_border_radius + 4px; // 12px
$key_bg_color: darken($osd_fg_color, 70%);
// $default_key_bg_color: darken($key_bg_color, 4%);
$default_key_bg_color: if($variant=='light', darken($osd_bg_color, 11%), lighten($osd_bg_color, 2%));
$default_key_bg_color: if($variant=='light', darken($key_bg_color, 11%), darken($key_bg_color, 10%));
// draw keys using button function
#keyboard {
background-color: transparentize(if($variant=='light', darken($bg_color, 5%), darken($bg_color, 8%)), 0.1);
// background-color: transparentize(if($variant=='light', darken($bg_color, 5%), darken($bg_color, 8%)), 0.1);
background-color: $osd_bg_color;
box-shadow: inset 0 1px 0 0 $osd_outer_borders_color;
.page-indicator {
@@ -31,18 +32,21 @@ $default_key_bg_color: if($variant=='light', darken($osd_bg_color, 11%), lighten
// the keys
.keyboard-key {
@include button(normal, $c:$key_bg_color);
&:focus { @include button(focus);}
&:hover, &:checked { @include button(hover, $c: $key_bg_color);}
&:active { @include button(active, $c: $key_bg_color); }
@include fontsize($base_font_size + 5);
font-weight: bold;
min-height: $key_size;
min-width: $key_size;
border-width: 1px;
border-style: solid;
border-radius: $key_border_radius;
box-shadow: 0 1px 0 0 $shadow_color;
@include keyboard_key(normal, $key_bg_color, $osd_fg_color);
&:focus { @include keyboard_key(focus);}
&:hover { @include keyboard_key(hover, $key_bg_color, $osd_fg_color);}
&:active { @include keyboard_key(active, $key_bg_color, $osd_fg_color); }
&:checked { @include keyboard_key(checked, $key_bg_color, $osd_fg_color); }
&:grayed { //FIXMEy
background-color: darken($bg_color, 3%);
@@ -52,42 +56,59 @@ $default_key_bg_color: if($variant=='light', darken($osd_bg_color, 11%), lighten
// non-character keys
&.default-key {
@include button(normal, $c:$default_key_bg_color);
&:hover, &:checked {@include button(hover, $c: $default_key_bg_color);}
&:active { @include button(active, $c: $default_key_bg_color);}
@include keyboard_key(normal, $default_key_bg_color, $osd_fg_color);
&:hover {@include keyboard_key(hover, $default_key_bg_color, $osd_fg_color);}
&:active { @include keyboard_key(active, $default_key_bg_color, $osd_fg_color);}
&:checked { @include keyboard_key(checked, $default_key_bg_color, $osd_fg_color);}
border-radius: $key_border_radius;
}
// enter key is suggested-action
&.enter-key {
@include button(normal, $c:$selected_bg_color, $tc:$selected_fg_color);
&:hover, &:checked { @include button(hover, $c: lighten($selected_bg_color, 3%));}
&:active {@include button(active, $c: darken($selected_bg_color, 2%));}
@include keyboard_key(normal, $selected_bg_color, $selected_fg_color);
&:hover { @include keyboard_key(hover, $selected_bg_color, $selected_fg_color);}
&:active {@include keyboard_key(active, $selected_bg_color, $selected_fg_color);}
&:checked {@include keyboard_key(checked, $selected_bg_color, $selected_fg_color);}
border-radius: $key_border_radius;
color: $osd_fg_color;
}
&.shift-key-uppercase { color: $selected_bg_color }
&.shift-key-lowercase {}
// pressed shift has different style
&.shift-key-uppercase {
background-color: lighten($key_bg_color, 20%);
color: $osd_bg_color;
&:hover {
background-color: lighten($key_bg_color, 25%);
color: lighten($osd_bg_color, 5%);
}
}
StIcon { icon-size: 1.125em; }
// size of icons on keys
StIcon { icon-size: 24px; }
}
// long press on a key popup
.keyboard-subkeys {
color: $osd_fg_color;
-arrow-border-radius: $modal_radius;
-arrow-border-radius: $base_border_radius*2;
-arrow-background-color: $osd_bg_color;
-arrow-border-width: 1px;
-arrow-border-color: lighten($osd_bg_color, 9%);
-arrow-base: 20px;
-arrow-rise: 10px;
-boxpointer-gap: $base_spacing;
-boxpointer-gap: $base_padding;
padding: $base_padding;
.keyboard-key {
@include button(normal, $c:$key_bg_color);
@include keyboard_key(normal, $key_bg_color, $osd_fg_color);
&:focus { @include button(focus);}
&:hover, &:checked { @include button(hover, $c: $key_bg_color);}
&:active { @include button(active, $c: $key_bg_color); }
&:focus { @include keyboard_key(focus);}
&:hover { @include keyboard_key(hover, $key_bg_color, $osd_fg_color);}
&:active { @include keyboard_key(active, $key_bg_color, $osd_fg_color); }
&:checked { @include keyboard_key(checked, $key_bg_color, $osd_fg_color); }
border-radius:$base_border_radius;
border-radius:$key_border_radius;
}
}
@@ -112,4 +133,21 @@ $default_key_bg_color: if($variant=='light', darken($osd_bg_color, 11%), lighten
@include fontsize($base_font_size + 3);
spacing: 12px;
min-height: 20pt;
padding: $base_padding*2;
color: $osd_fg_color;
// each suggestion
StButton {
margin: 0 3px;
min-width: 32px;
border-radius: $base_border_radius - 2px;
padding: $base_padding $base_padding*3;
@include keyboard_key(undecorated, $key_bg_color, $osd_fg_color);
&:focus { @include keyboard_key(focus);}
&:hover { @include keyboard_key(hover, $key_bg_color, $osd_fg_color);}
&:active { @include keyboard_key(active, $key_bg_color, $osd_fg_color); }
&:checked { @include keyboard_key(checked, $key_bg_color, $osd_fg_color); }
}
}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_login-dialog.scss
+62 -32
View File
@@ -13,14 +13,6 @@
$_gdm_bg: $system_bg_color;
StEntry {
@if $variant=='dark' {
$_gdm_entry_bg: darken($system_bg_color, 3%);
background-color: $_gdm_entry_bg;
color: $fg_color;
}
}
.modal-dialog-button-box { spacing: 3px; }
.modal-dialog-button {
padding: 4px 18px;
@@ -47,26 +39,7 @@
color: transparentize($osd_fg_color, 0.3);
}
&:default {
@include button(normal, $c:$selected_bg_color, $tc:$selected_fg_color);
border-color: $selected_bg_color;
&:hover, &:focus {
@include button(hover,$c:$selected_bg_color, $tc:$selected_fg_color);
$_def_hover_c: lighten($selected_bg_color, 5%);
background-color: $_def_hover_c;
border-color: $_def_hover_c;
}
&:active {
@include button(active,$c:$selected_bg_color, $tc:$selected_fg_color);
$_def_active_c: darken($selected_bg_color, 5%);
background-color: $_def_active_c;
border-color: $_def_active_c;
}
&:insensitive {
@include button(insensitive);
border-color: darken($selected_bg_color, 10%);
background-color: darken($selected_bg_color, 10%);
color: transparentize($selected_fg_color, 0.3);
}
@include button(default);
}
}
@@ -75,8 +48,8 @@
.login-dialog-session-list-button {
padding: 0;
border-radius: 99px;
width: $base_icon_size * 2;
height: $base_icon_size * 2;
width: $large_icon_size;
height: $large_icon_size;
border-color: darken($system_bg_color, 3%);
background-color: darken($system_bg_color, 3%);
@@ -103,12 +76,38 @@
}
.login-dialog-not-listed-label {
@include fontsize($base_font_size - 1);
@extend %caption;
font-weight: bold;
color: darken($osd_fg_color,30%);
padding-top: 1em;
}
.login-dialog-auth-list-view { -st-vfade-offset: 1em; }
.login-dialog-auth-list {
spacing: 6px;
margin-left: 2em;
}
.login-dialog-auth-list-title {
margin-left: 2em;
}
.login-dialog-auth-list-item {
border-radius: $base_border_radius + 4px;
padding: 6px;
color: darken($osd_fg_color,30%);
&:focus, &:selected { background-color: $selected_bg_color; color: $selected_fg_color; }
}
.login-dialog-auth-list-label {
@include fontsize($base_font_size + 2);
font-weight: bold;
padding-left: 15px;
&:ltr { padding-left: 14px; text-align: left; }
&:rtl { padding-right: 14px; text-align: right; }
}
.login-dialog-user-list-view { -st-vfade-offset: 1em; }
.login-dialog-user-list {
spacing: 12px;
@@ -159,7 +158,7 @@
.login-dialog-prompt-layout {
padding-top: 24px;
padding-bottom: 12px;
spacing: $base_spacing * 2;
spacing: $base_padding * 2;
width: 23em;
}
@@ -172,3 +171,34 @@
@include fontsize($base_font_size + 1);
padding-top: 1em;
}
.login-dialog {
StEntry {
@if $variant=='dark' {
$_gdm_entry_bg: darken($system_bg_color, 3%);
background-color: $_gdm_entry_bg;
color: $fg_color;
}
}
}
// Custom styling for unlock entry
.unlock-dialog {
StEntry {
border:none !important;
&:focus {
background-color: transparentize($fg_color, 0.9);
}
&:insensitive {
color: transparentize($fg_color, 0.5);
background-color: transparentize($fg_color, 0.95);
}
}
.cancel-button,
.switch-user-button,
.login-dialog-session-list-button {
border-color: transparent;
background-color: transparentize($fg_color, 0.9);
}
}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_looking-glass.scss
+72 -39
View File
@@ -1,46 +1,65 @@
/* Looking Glass */
$text_fg_color: #ccc;
// Dialog
#LookingGlassDialog {
background-color: $osd_bg_color;
spacing: $base_spacing;
padding: 4px;
border: 1px solid transparentize($osd_fg_color, 0.8);
border-radius: $base_border_radius;
border-radius: 0 0 $modal_radius $modal_radius;
border-top-width: 0;
border: 1px solid $osd_outer_borders_color;
color: $osd_fg_color;
padding: $base_padding;
spacing: $base_padding;
box-shadow: 0 2px 4px 0 rgba(0,0,0,0.1);
& > #Toolbar {
border: none;
border-radius: $base_border_radius;
background-color: $osd_bg_color;
padding: $base_padding;
border-radius: 0;
background-color: transparent;
spacing: $base_padding;
.lg-toolbar-button {
padding: $base_padding $base_padding*2;
@extend %button;
& > StIcon { icon-size: $base_icon_size; }
}
}
.labels {
spacing: $base_padding;
}
.labels { spacing: $base_spacing; }
.notebook-tab {
-natural-hpadding: $base_padding * 2;
-minimum-hpadding: 6px;
-natural-hpadding: $base_padding*2;
-minimum-hpadding: $base_padding*2;
font-weight: bold;
padding: $base_padding $base_padding*2;
color: darken($osd_fg_color, 15%);
transition-duration: 100ms;
padding-left: .3em;
padding-right: .3em;
border-bottom-width: 2px;
box-shadow:none;
border:none;
border-radius: $base_border_radius - 2px;
background-color: transparent;
&:hover {
color: $osd_fg_color;
background-color: transparentize($osd_fg_color, 0.95);
}
&:selected {
border-bottom-width: 2px;
box-shadow: inset 0 -2px 0 0 lighten($selected_bg_color, 5%);
color: $osd_fg_color;
background-color: transparentize($osd_fg_color, 0.9);
}
}
StBoxLayout#EvalBox { padding: 4px; spacing: $base_spacing; }
StBoxLayout#ResultsArea { spacing: $base_spacing; }
StBoxLayout#EvalBox { padding: 4px; spacing: $base_padding; padding: $base_padding; }
StBoxLayout#ResultsArea { spacing: $base_padding; padding: $base_padding; }
}
.lg-dialog {
StEntry {
background-color: transparentize(lighten($osd_bg_color, 5%), 0.4);
color: $osd_fg_color;
@@ -49,55 +68,55 @@ $text_fg_color: #ccc;
selection-background-color: $selected_bg_color;
selected-color: $selected_fg_color;
}
.shell-link {
color: $link_color;
&:hover { color: lighten($link_color, 10%); }
&:active { color: darken($link_color, 10%); }
}
.actor-link {
color: $text_fg_color;
&:hover { color: lighten($text_fg_color, 20%); }
&:active { color: darken($text_fg_color, 20%); }
color: $insensitive_fg_color;
&:hover { color: lighten($insensitive_fg_color, 20%); }
&:active { color: darken($insensitive_fg_color, 20%); }
}
}
.lg-completions-text {
font-size: .9em;
font-style: italic;
@extend %caption;
font-style: italic;
}
.lg-obj-inspector-title {
spacing: $base_spacing;
spacing: $base_padding;
}
.lg-obj-inspector-button {
border: 1px solid $osd_borders_color;
padding: 4px;
border-radius: $base_border_radius;
&:hover { border: 1px solid #ffffff; }
border: 1px solid $osd_borders_color;
padding: 4px;
border-radius: $base_border_radius;
&:hover { border: 1px solid #ffffff; }
}
// Extensions
#lookingGlassExtensions { padding: 4px; }
#lookingGlassExtensions { padding: $base_padding; }
.lg-extensions-list {
padding: 4px;
spacing: 6px;
padding: $base_padding;
spacing: $base_padding;
}
.lg-extension {
border: 1px solid lighten($osd_borders_color, 5%);
background-color: lighten($osd_bg_color, 5%);
border-radius: $base_border_radius;
padding: 4px;
padding: $base_padding*2;
@include card;
}
.lg-extension-name {
font-weight: bold;
@extend %heading;
}
.lg-extension-meta {
spacing: 6px;
spacing: $base_padding;
}
// Inspector
@@ -105,5 +124,19 @@ $text_fg_color: #ccc;
background: $osd_bg_color;
border: 1px solid $osd_borders_color;
border-radius: $base_border_radius;
padding: 6px;
}
padding: $base_padding;
}
.lg-debug-flag-button {
StLabel { padding: $base_padding, 2 * $base_padding; }
color: $fg_color;
&:hover { color: lighten($fg_color, 20%); }
&:active { color: darken($fg_color, 20%); }
}
.lg-debug-flags-header {
padding-top: 2 * $base_padding;
padding: $base_padding;
@extend %title_2;
}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_message-list.scss
+59 -31
View File
@@ -3,28 +3,47 @@
// main list
.message-list {
width: 31.5em;
padding: 0 $base_padding * 2;
width: 32em;
border: solid $borders_color;
.message-list-placeholder { spacing: 12px; }
// padding and margins to account for scrollbar
&:ltr {margin-left: 0; margin-right: $base_margin; padding-right: $base_padding; border-right-width: 1px; }
&:rtl {margin-right: 0; margin-left: $base_margin; padding-left: $base_padding; border-left-width: 1px; }
.message-list-placeholder {
@extend %title_2;
color: transparentize($insensitive_fg_color, .5);
// icon size and color
> StIcon {
icon-size: $base_icon_size*3; // 48px
margin-bottom: $base_margin*3;
-st-icon-style: symbolic;
}
}
}
.message-list-sections {
spacing: $base_spacing;
margin: 0 $base_margin * 4; // to account for scrollbar
spacing: $base_padding;
margin: 0;
padding-bottom: $base_padding;
// to account for scrollbar
&:ltr {margin-right: $base_margin * 3; }
&:rtl {margin-left: $base_margin * 3;}
}
.message-list-section,
.message-list-section-list {
spacing: $base_spacing;
spacing: $base_padding;
}
// do-not-disturb + clear button
.message-list-controls {
margin: ($base_margin * 2) ($base_margin * 4) 0;
// NOTE: remove the padding if notification_bubble could remove margin for drop shadow
padding: $base_margin;
spacing: $base_spacing * 2;
padding: $base_padding;
spacing: $base_padding;
@extend %heading;
.dnd-button {
// We need this because the focus outline isn't inset like for the buttons
@@ -32,7 +51,7 @@
// its color when focusing.
border-width: 2px;
border-color: transparent;
border-radius: 99px;
border-radius: 32px;
border-style: solid;
&:focus {
@@ -43,19 +62,20 @@
// message bubbles
.message {
@include notification_bubble;
@include card;
// icon container
.message-icon-bin {
padding: ($base_padding * 3) 0 ($base_padding * 3) ($base_padding * 2);
padding: ($base_padding * 3);
padding-right:$base_padding;
&:rtl {
padding: ($base_padding * 3) ($base_padding * 2) ($base_padding * 3) 0;
padding-right:$base_padding;
}
// icon size and color
> StIcon {
icon-size: $base_icon_size*2; // 32px
icon-size: $large_icon_size; // 32px
-st-icon-style: symbolic;
}
@@ -68,13 +88,16 @@
// content
.message-content {
padding: $base_padding + $base_margin * 2;
spacing: 4px;
padding: ($base_padding*1.5);
margin-bottom: $base_margin*2;
}
// title
.message-title {
font-weight: bold;
/* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */
padding-top: 0.57em;
}
// secondary container in title box
@@ -95,15 +118,17 @@
// close button
.message-close-button {
color: lighten($fg_color, 15%);
&:hover { color: if($variant=='light', lighten($fg_color, 30%), darken($fg_color, 10%)); }
&:active { color: if($variant=='light', lighten($fg_color, 40%), darken($fg_color, 20%)); }
color: $fg_color;
background-color: transparentize($fg_color, 0.9);
border-radius: 99px;
padding: $base_padding - 1px;
margin: 1px;
&:hover {background-color: transparentize($fg_color, 0.8);}
&:active {background-color: transparentize($fg_color, 0.9);}
}
// body
.message-body {
color: darken($fg_color, 10%);
}
.message-body {color: darken($fg_color, 10%);}
}
// URLs in messages
@@ -113,30 +138,32 @@
/* Media Controls */
.message-media-control {
padding: $base_padding * 2 1.64em; // $base_padding * 4 = 24px
color: darken($fg_color, 15%);
padding: 0 $base_padding*3;
margin: $base_padding*2 0;
border-radius: $base_border_radius;
color: $fg_color;
// uses $hover_bg_color since the media controls are in a notification_bubble
// colors are lightened since the media controls are in a card
&:hover {
background-color: lighten($hover_bg_color, 5%);
color: $fg_color;
}
&:active {
background-color: darken($hover_bg_color, 2%);
background-color: lighten($active_bg_color, 5%);
color: $fg_color;
}
&:insensitive { color: darken($fg_color,40%); }
&:insensitive { color: lighten($insensitive_fg_color, 5%); }
// fix border-radius for last button
&:last-child:ltr { border-radius: 0 $base_border_radius+2 $base_border_radius+2 0; }
&:last-child:rtl { border-radius: $base_border_radius+2 0 0 $base_border_radius+2; }
// fix margin for last button
&:last-child:ltr { margin-right: $base_margin*3; }
&:last-child:rtl { margin-left: $base_margin*3; }
}
// album-art
.media-message-cover-icon {
icon-size: $base_icon_size*2 !important; // 48px
icon-size: $base_icon_size*3 !important; // 48px
border-radius: $base_border_radius;
// when there is no artwork
@@ -145,6 +172,7 @@
background-color: $bg_color;
border: 1px solid transparent;
border-radius: $base_border_radius;
icon-size: $base_icon_size * 2 !important;
icon-size: $large_icon_size !important; // 32px
padding: ($base_padding*2 + 2); // 16px
}
}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_misc.scss
+7 -1
View File
@@ -48,7 +48,7 @@
.caps-lock-warning-label {
text-align: center;
padding-bottom: 8px;
@include fontsize($base_font_size - 1);
@extend %caption;
color: $warning_color;
}
@@ -57,3 +57,9 @@
.workspace-animation {
background-color: $system_bg_color;
}
/* Tiled window previews */
.tile-preview {
background-color: transparentize($selected_bg_color,0.5);
border: 1px solid $selected_bg_color;
}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_network-dialog.scss
+20 -28
View File
@@ -1,4 +1,4 @@
/* Network Dialogs */
/* Select Network dialogs */
.nm-dialog {
max-height: 34em;
min-height: 31em;
@@ -10,47 +10,39 @@
padding: 24px;
}
.nm-dialog-airplane-box { spacing: 12px; }
.nm-dialog-airplane-headline {
font-weight: bold;
text-align: center;
}
.nm-dialog-airplane-text { color: $fg_color; }
// header
.nm-dialog-header {
font-weight: bold;
}
.nm-dialog-header-icon {
icon-size: $base_icon_size * 2;
}
.nm-dialog-header { @extend %heading; }
.nm-dialog-subheader { color: $insensitive_fg_color;}
.nm-dialog-header-icon { icon-size: $large_icon_size;}
.nm-dialog-header-hbox { spacing: 10px; }
// list of networks
.nm-dialog-scroll-view {
border: 1px solid $borders_color;
padding:0;
background-color: darken($bg_color, 3%);
padding:$base_padding;
border-radius: $base_border_radius;
background-color: $base_color;
}
// list item
.nm-dialog-item {
@include fontsize($base_font_size);
border-bottom: 1px solid $borders_color;
padding: $base_padding * 2;
spacing: 0px;
&:selected {
background-color: $selected_bg_color;
border-radius: $base_border_radius - 3px;
color: $selected_fg_color;
}
&:hover { background-color:$hover_bg_color;}
}
// icons in list
.nm-dialog-icon { icon-size: $base_icon_size; }
.nm-dialog-icons { spacing: $base_spacing * 2; }
.nm-dialog-icons { spacing: $base_padding * 2; }
// no networks
.no-networks-box { spacing: $base_padding; }
.no-networks-label { color: $insensitive_fg_color; }
.no-networks-box { spacing: $base_padding; }
// airplane mode
.nm-dialog-airplane-box {
text-align: center;
spacing: 12px;
}
.nm-dialog-airplane-headline { @extend %title_3;}
.nm-dialog-airplane-text { color: $insensitive_fg_color;}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_notifications.scss
+4
View File
@@ -2,11 +2,15 @@
$notification_banner_height: 64px;
$notification_banner_width: 34em;
$notification_banner_radius: $base_border_radius*1.5;
// Banner notifications
.notification-banner {
min-height: $notification_banner_height;
width: $notification_banner_width;
box-shadow: 0 2px 4px 2px rgba(0,0,0,0.1);
border-radius: $notification_banner_radius;
margin: $base_margin;
.notification-actions {
spacing: 0;
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_osd.scss
+19 -9
View File
@@ -1,29 +1,39 @@
/* OSD */
$osd_levelbar_height:8px;
$osd_levelbar_height:6px;
.osd-window {
@extend %osd_panel;
@extend %heading;
text-align: center;
font-weight: bold;
spacing: $base_spacing * 2; // 12px
margin: $base_margin * 8; // 32px
min-width: 64px;
min-height: 64px;
spacing: $base_padding * 2; // 12px
padding: $base_padding * 2 $base_padding * 3;
& > * { spacing: 8px; }
margin-bottom: 4em;
StIcon {
icon-size:$base_icon_size * 6;
}
StIcon { icon-size:$large_icon_size;}
.osd-monitor-label { font-size: 3em; }
StLabel {
&:ltr { margin-right: 6px; }
&:rtl { margin-left: 6px; }
}
.level {
margin-bottom: 4px;
&:first-child { margin-bottom: 0px; }
height: $osd_levelbar_height;
min-width:$base_icon_size * 10;
-barlevel-height: $osd_levelbar_height;
-barlevel-background-color: transparentize($osd_fg_color, if($variant=='light', 0.7, 0.9));
-barlevel-active-background-color: $osd_fg_color;
-barlevel-overdrive-color: $destructive_color;
-barlevel-overdrive-separator-width: 3px;
&:ltr { margin-right: 6px; }
&:rtl { margin-left: 6px; }
}
}
@@ -42,4 +52,4 @@ $osd_levelbar_height:8px;
.resize-popup {
@extend %osd_panel;
}
}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_overview.scss
+1 -1
View File
@@ -1,7 +1,7 @@
/* OVERVIEW */
.controls-manager, .secondary-monitor-workspaces {
spacing: $base_spacing * 2;
spacing: $base_padding * 2;
}
#overviewGroup {
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_panel.scss
+98 -25
View File
@@ -1,9 +1,8 @@
/* Top Bar */
// a.k.a. the panel
$panel_corner_radius: $base_border_radius+1;
$panel_bg_color: #000;
$panel_fg_color: #ddd;
$panel_fg_color: if($variant == 'light', lighten($bg_color, 10%), darken($fg_color, 5%));
$panel_height: 2.2em;
$panel_transition_duration: 250ms; // same as the overview transition duration
@@ -11,7 +10,7 @@ $panel_transition_duration: 250ms; // same as the overview transition duration
background-color: $panel_bg_color;
font-weight: bold;
height: $panel_height;
font-feature-settings: "tnum";
@extend %numeric;
transition-duration: $panel_transition_duration;
// transparent panel on lock & login screens
@@ -19,20 +18,6 @@ $panel_transition_duration: 250ms; // same as the overview transition duration
&.login-screen,
&:overview {
background-color: transparent;
.panel-corner {
-panel-corner-opacity: 0;
}
}
// the rounded outset corners
.panel-corner {
-panel-corner-radius: $panel_corner_radius;
-panel-corner-background-color: $panel_bg_color;
-panel-corner-border-width: 2px;
-panel-corner-border-color: transparent;
-panel-corner-opacity: 1;
transition-duration: $panel_transition_duration;
}
// panel menus
@@ -53,8 +38,20 @@ $panel_transition_duration: 250ms; // same as the overview transition duration
}
}
&:hover, &:active, &:overview, &:focus, &:checked {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.20);
&.screen-recording-indicator {
box-shadow: inset 0 0 0 100px $screenshot_ui_button_red;
StBoxLayout {
spacing: $base_padding;
}
StIcon {
icon-size: $base_icon_size;
}
}
&:active, &:overview, &:focus, &:checked {
box-shadow: inset 0 0 0 100px transparentize($panel_fg_color, 0.8);
// The clock display needs to have the background on .clock because
// we want to exclude the do-not-disturb indicator from the background
@@ -62,9 +59,41 @@ $panel_transition_duration: 250ms; // same as the overview transition duration
box-shadow: none;
.clock {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.20);
box-shadow: inset 0 0 0 100px transparentize($panel_fg_color, 0.8);
}
}
&.screen-recording-indicator {
box-shadow: inset 0 0 0 100px transparentize($screenshot_ui_button_red, 0.15);
}
}
&:hover {
box-shadow: inset 0 0 0 100px transparentize($panel_fg_color, 0.85);
&.clock-display {
box-shadow: none;
.clock {
box-shadow: inset 0 0 0 100px transparentize($panel_fg_color, 0.85);
}
}
&.screen-recording-indicator {
box-shadow: inset 0 0 0 100px transparentize($screenshot_ui_button_red, 0.1);
}
}
&:active:hover, &:overview:hover, &:focus:hover, &:checked:hover {
box-shadow: inset 0 0 0 100px transparentize($panel_fg_color, 0.75);
&.clock-display {
box-shadow: none;
.clock {
box-shadow: inset 0 0 0 100px transparentize($panel_fg_color, 0.75);
}
}
&.screen-recording-indicator {
box-shadow: inset 0 0 0 100px transparentize($screenshot_ui_button_red, 0.2);
}
}
// status area icons
@@ -94,16 +123,48 @@ $panel_transition_duration: 250ms; // same as the overview transition duration
&.login-screen,
&:overview {
.panel-button {
&:hover, &:active, &:overview, &:focus, &:checked {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.15);
&:active, &:overview, &:focus, &:checked {
box-shadow: inset 0 0 0 100px rgba(255,255,255, 0.15);
&.clock-display {
box-shadow: none;
.clock {
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.15);
box-shadow: inset 0 0 0 100px rgba(255,255,255, 0.15);
}
}
&.screen-recording-indicator {
box-shadow: inset 0 0 0 100px transparentize($screenshot_ui_button_red, 0.15);
}
}
&:hover {
box-shadow: inset 0 0 0 100px rgba(255,255,255, 0.10);
&.clock-display {
box-shadow: none;
.clock {
box-shadow: inset 0 0 0 100px rgba(255,255,255, 0.10);
}
}
&.screen-recording-indicator {
box-shadow: inset 0 0 0 100px transparentize($screenshot_ui_button_red, 0.1);
}
}
&:active:hover, &:overview:hover, &:focus:hover, &:checked:hover {
box-shadow: inset 0 0 0 100px rgba(255,255,255, 0.2);
&.clock-display {
box-shadow: none;
.clock {
box-shadow: inset 0 0 0 100px rgba(255,255,255, 0.2);
}
}
&.screen-recording-indicator {
box-shadow: inset 0 0 0 100px transparentize($screenshot_ui_button_red, 0.2);
}
}
}
}
@@ -125,11 +186,23 @@ $panel_transition_duration: 250ms; // same as the overview transition duration
// App Menu
#appMenu {
spacing: $base_spacing;
spacing: $base_padding;
.label-shadow { color: transparent; }
}
#appMenu .panel-status-menu-box {
padding: 0 $base_padding;
spacing: $base_spacing;
spacing: $base_padding;
}
// Clock
.clock-display-box {
spacing: 2px;
.clock {
padding-left: $base_padding * 2;
padding-right: $base_padding * 2;
}
}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_popovers.scss
+127 -60
View File
@@ -1,16 +1,8 @@
/* Popovers/Menus */
$popover_arrow_height: 12px;
//.the popover itself
// the popover itself
.popup-menu-boxpointer {
-arrow-border-radius: $base_border_radius+4;
-arrow-background-color: $bg_color;
-arrow-border-width: 1px;
-arrow-border-color: $borders_color;
-arrow-base: $popover_arrow_height * 2;
-arrow-rise: $popover_arrow_height;
-arrow-box-shadow: 0 1px 3px rgba(0,0,0,0.5); // dreaming bugzilla #689995
margin: $base_margin; // used as distance from the screen edge
}
// container of the popover menu
@@ -18,84 +10,139 @@ $popover_arrow_height: 12px;
min-width: 15em;
color: $fg_color;
//.popup-status-menu-item { font-weight: normal; color: pink; } //dunno what that is
//.popup-status-menu-item {font-weight: normal; color: pink;} //dunno what that is
&.panel-menu {
-boxpointer-gap: $base_margin; // distance from the panel
margin-bottom: 1.75em;
-boxpointer-gap: $base_margin+2px; // distance from the panel
margin-bottom: 1.75em; // so it doesn't touch the bottom of the screen
}
}
// popover content
.popup-menu-content {
padding: $base_padding * 2 + $base_margin 0;
padding: $base_padding;
// account for margin oddities
border-radius: $modal_radius - 2px;
border: 1px solid $borders_edge;
box-shadow: 0 2px 4px 0 rgba(0,0,0,0.1);
background-color: $bg_color;
}
// menu items
.popup-menu-item {
spacing: $base_padding;
padding: $base_padding;
padding: $base_padding*1.5 $base_padding*2;
border-radius: $base_border_radius;
transition: 0.2s all ease;
background-color: transparent;
&:ltr { padding-right:1.75em; padding-left: 0; }
&:rtl { padding-right: 0; padding-left:1.75em; }
&:focus, &:hover {
background-color: $hover_bg_color !important;
&:active { background-color: $active_bg_color !important;}
}
&:checked {background-color: $checked_bg_color !important;}
&:checked {
background-color: lighten($bg_color, 2%);
box-shadow: none;
margin-bottom: 0;
box-shadow: inset 0 -1px 0 0 darken($checked_bg_color, 5%);
border-radius: $base_border_radius $base_border_radius 0 0;
&:focus,&:hover { background-color: lighten($checked_bg_color, 3%) !important;}
&:active { background-color: lighten($checked_bg_color, 5%) !important;}
}
&.selected {
background-color: transparentize(white, if($variant=='light', 0.2, 0.9));
color: $fg_color;
&:active {
background-color: lighten($active_bg_color, 5%);
color: $active_fg_color;
}
&:active {
background-color: $selected_bg_color;
color: $selected_fg_color;
}
&:insensitive { color: transparentize($fg_color,0.5);}
&:insensitive {color: transparentize($fg_color,0.5);}
}
// all icons and other graphical elements
// all other graphical elements (sliders)
.popup-inactive-menu-item {
color: $fg_color;
&:insensitive { color: transparentize($fg_color,0.5); }
&:insensitive { color: $insensitive_fg_color; }
}
// symbolic icons in popover
.popup-menu-arrow,
.popup-menu-icon { icon-size: $base_icon_size; }
.popup-menu-icon {
icon-size: 16px !important; // for some reason the variable doesn't work here
}
.popup-menu-arrow {
&:ltr {margin-right: $base_margin;}
&:rtl {margin-left: $base_margin;}
}
// popover submenus
.popup-sub-menu {
background-color: darken($bg_color, 3%);
box-shadow: none;
border-top: 1px solid transparentize($borders_color, 0.2);
border-bottom: 1px solid transparentize($borders_color, 0.2);
background-color: $checked_bg_color;
border-radius: 0 0 $base_border_radius $base_border_radius;
.popup-menu-ornament {
min-width: $base_icon_size !important;
}
// submenu specific styles
.popup-menu-item {
border-radius: 0;
margin: 0;
&:last-child {
border-radius: 0 0 $base_border_radius $base_border_radius;
}
&:focus,&:hover { background-color: lighten($hover_bg_color, 10%) !important;}
&:checked {
background-color: lighten($checked_bg_color, 10%) !important;
&:focus,&:hover { background-color: lighten($checked_bg_color, 8%) !important;}
}
&:active { background-color: lighten($active_bg_color, 10%) !important;}
}
.popup-menu-section {
.popup-menu-item:last-child {
&:hover,&:focus {border-radius: 0;}
}
&:last-child .popup-menu-item:last-child {
border-radius: 0 0 $base_border_radius $base_border_radius;
}
}
}
// container for radio and check boxes
.popup-menu-ornament {
@extend %heading;
width: 1.2em;
text-align: center !important;
&:ltr { text-align: right };
&:rtl { text-align: left };
&:ltr {text-align: right;};
&:rtl {text-align: left;};
}
// separator
.popup-separator-menu-item {
padding: 0;
padding:0;
margin: 6px 0;
.popup-separator-menu-item-separator {
//-margin-horizontal: 24px;
height: 1px; //not really the whole box
margin: 6px 64px;
background-color: lighten($borders_color, 2%);
.popup-sub-menu & { //submenu separators
margin: 0 64px 0 32px;
@if $variant == 'dark' {
background-color: lighten($bg_color,10%);
}
background-color: $borders_color;
}
.popup-menu-ornament {
width: 0 !important;
}
.popup-sub-menu & {
padding: 0;
margin-right: 2.5em !important; // account for ornament
background-color: transparent;
.popup-separator-menu-item-separator {
background-color: lighten($borders_color, 7%);
}
}
}
@@ -108,24 +155,44 @@ $popover_arrow_height: 12px;
// system status menu
.aggregate-menu {
min-width: 21em;
min-width: 22em;
// this is unneeded at the top-level in this menu, hide it
.popup-menu-ornament { width: 0 !important; }
// lock screen, shutdown, etc. buttons
.popup-menu-icon {
padding:0;
margin: 0 $base_margin;
.popup-menu-icon {
-st-icon-style: symbolic;
&:ltr {margin-right: $base_margin*2;}
&:rtl {margin-left: $base_margin*2;}
}
// account for ornaments in submenus with padding
.popup-sub-menu .popup-menu-item > :first-child {
// account for icons in submenus with padding
&:ltr {
padding-left: $base_padding + $base_margin * 2;
margin-left: $base_icon_size;
}
&:rtl {
padding-right: $base_padding + $base_margin * 2; ;
margin-right: $base_icon_size;
// this value is hardcoded for visual effect
&:ltr { margin-left: $base_margin*2;}
&:rtl { margin-right: $base_margin*2;}
}
}
// right-click (and panel) app menu
.app-menu {
max-width: 27.25em;
.popup-menu-content { margin: $base_margin;}
&.panel-menu {
.popup-menu-content { margin: 0;} // avoid doubling up margin
}
// this is unneeded at the top-level in this menu, hide it
.popup-menu-ornament { width: 0 !important; }
.popup-inactive-menu-item:first-child {
// "Open Windows" label
> StLabel {
@extend %caption_heading;
&:ltr {margin-right: $base_margin*2;}
&:rtl {margin-left: $base_margin*2;}
}
}
}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_screen-shield.scss
+12 -14
View File
@@ -11,7 +11,7 @@
.unlock-dialog-clock-time {
font-size: 64pt;
padding-top: 42px;
font-feature-settings: "tnum";
@extend %numeric;
}
.unlock-dialog-clock-date {
@@ -25,10 +25,11 @@
}
.unlock-dialog-notifications-container {
margin: 12px 0;
margin: 12px;
spacing: 6px;
width: 23em;
background-color: transparent;
.summary-notification-stack-scrollview {
padding-top: 0;
padding-bottom: 0;
@@ -36,39 +37,36 @@
.notification,
.unlock-dialog-notification-source {
padding: 12px 6px;
padding: 12px 16px;
border: none;
background-color: transparentize($osd_bg_color,0.7);
background-color: transparentize($osd_fg_color,0.9);
color: $osd_fg_color;
border-radius: $modal_radius;
&.critical { background-color: transparentize($osd_bg_color,0.1) }
&.critical { background-color: transparentize($osd_fg_color,0.8) }
}
}
.unlock-dialog-notification-label {
padding: 0px 0px 0px 12px;
padding: 0 0 0 12px;
}
.unlock-dialog-notification-count-text {
weight: bold;
padding: 0 6px;
color: $osd_bg_color;
background-color: transparentize($osd_fg_color, 0.7);
font-weight: bold;
padding: 0 12px;
color: $osd_fg_color;
background-color: transparentize($osd_fg_color, 0.9);
border-radius: 99px;
margin-right: 12px;
}
.screen-shield-background { //just the shadow, really
background: black;
box-shadow: 0px 2px 4px rgba(0,0,0,0.6);
box-shadow: 0 2px 4px rgba(0,0,0,0.6);
}
#lockDialogGroup {
background-color: $system_bg_color;
}
#unlockDialogNotifications {
StButton#vhandle, StButton#hhandle {
background-color: transparentize($bg_color,0.7);
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_screenshot.scss
+202
View File
@@ -0,0 +1,202 @@
// Screenshot UI
.icon-label-button-container {
spacing: $base_padding;
@extend %caption;
StIcon { icon-size: 32px;}
}
$screenshot_ui_panel_padding: $base_padding*3;
$screenshot_ui_shot_cast_margin: 21px;
$screenshot_ui_panel_border_radius: $modal_radius + $screenshot_ui_shot_cast_margin;
$screenshot_ui_shot_cast_spacing: 3px;
$screenshot_ui_button_red: $error_color;
.screenshot-ui-panel {
@extend %osd_panel;
border-radius: $screenshot_ui_panel_border_radius;
padding: $screenshot_ui_panel_padding;
// Reduce the bottom padding a little to accommodate the large capture button.
padding-bottom: $screenshot_ui_panel_padding - 6px;
margin-bottom: 4em;
spacing: $base_padding * 2;
}
.screenshot-ui-close-button {
@extend .window-close; // copy window close button
padding: $base_padding; // but with more padding
&.left { margin-left: 8px; }
&.right { margin-right: 8px; }
}
.screenshot-ui-type-button {
@extend %osd_button;
padding: $base_padding * 2 $base_padding * 3 !important;
border-radius: $screenshot_ui_panel_border_radius - $screenshot_ui_panel_padding;
}
.screenshot-ui-capture-button {
width: 36px;
height: 36px;
border-radius: 99px;
border: 4px $osd_fg_color;
padding: 4px;
.screenshot-ui-capture-button-circle {
background-color: $osd_fg_color;
transition-duration: 200ms;
&:hover, &:focus { background-color: $hover_bg_color; }
border-radius: 99px;
}
&:hover, &:focus {
.screenshot-ui-capture-button-circle {
background-color: darken($osd_fg_color, 15%);
}
}
&:active {
.screenshot-ui-capture-button-circle {
background-color: darken($osd_fg_color, 50%);
}
}
&:cast {
.screenshot-ui-capture-button-circle {
background-color: $screenshot_ui_button_red;
}
&:hover, &:focus {
.screenshot-ui-capture-button-circle {
background-color: darken($screenshot_ui_button_red, 15%);
}
}
&:active {
.screenshot-ui-capture-button-circle {
background-color: darken($screenshot_ui_button_red, 30%);
}
}
}
}
.screenshot-ui-shot-cast-container {
background-color: $hover_bg_color;
border-radius: $modal_radius;
padding: $screenshot_ui_shot_cast_spacing;
spacing: $screenshot_ui_shot_cast_spacing;
&:ltr { margin-left: $screenshot_ui_shot_cast_margin - $screenshot_ui_panel_padding; }
&:rtl { margin-right: $screenshot_ui_shot_cast_margin - $screenshot_ui_panel_padding; }
}
.screenshot-ui-shot-cast-button {
padding: $base_padding $base_padding*2;
background-color: transparent;
&:hover, &:focus { background-color: lighten($hover_bg_color, 5%); }
&:active { background-color: lighten($active_bg_color,5%); }
&:checked { background-color: white; color: black; }
border-radius: $modal_radius - $screenshot_ui_shot_cast_spacing;
StIcon { icon-size: $base_icon_size; }
}
.screenshot-ui-show-pointer-button {
@extend %osd_button;
border-radius: 99px;
padding: $base_padding * 2 !important;
StIcon { icon-size: $base_icon_size; }
}
.screenshot-ui-area-indicator-shade {
background-color: rgba(0,0,0,.3);
}
.screenshot-ui-area-selector {
.screenshot-ui-area-indicator-shade {
background-color: rgba(0,0,0,.5);
}
.screenshot-ui-area-indicator-selection {
border: 2px white;
}
}
.screenshot-ui-area-selector-handle {
border-radius: 99px;
background-color: white;
box-shadow: 0 1px 3px 2px rgba(0,0,0,0.2);
width: 24px;
height: 24px;
}
.screenshot-ui-window-selector {
background-color: $system_bg_color;
.screenshot-ui-window-selector-window-container {
margin: 100px;
}
&:primary-monitor {
.screenshot-ui-window-selector-window-container {
// Make some room for the panel.
margin-bottom: 200px;
}
}
}
.screenshot-ui-window-selector-window-border {
transition-duration: 200ms;
border-radius: $modal_radius;
border: 6px transparent;
}
.screenshot-ui-window-selector-check {
transition-duration: 200ms;
color: transparent;
border-radius: 99px;
border-width: 12px;
icon-size: 24px;
}
.screenshot-ui-window-selector-window {
&:hover {
.screenshot-ui-window-selector-window-border {
border-color: darken($selected_bg_color, 15%);
}
}
&:checked {
.screenshot-ui-window-selector-window-border {
border-color: $selected_bg_color;
background-color: transparentize($selected_bg_color, 0.8);
}
.screenshot-ui-window-selector-check {
color: white;
background-color: $selected_bg_color;
}
}
}
.screenshot-ui-screen-selector {
transition-duration: 200ms;
background-color: rgba(0,0,0,.5);
&:hover { background-color: rgba(0,0,0,.3); }
&:active { background-color: rgba(0,0,0,.7); }
&:checked {
background-color: transparent;
border: 2px white;
}
}
.screenshot-ui-tooltip {
color: $osd_fg_color;
background-color: $osd_bg_color;
border-radius: 99px;
padding: $base_padding $base_padding * 2;
text-align: center;
-y-offset: 24px;
}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_scrollbars.scss
+8 -8
View File
@@ -9,8 +9,8 @@ StScrollBar {
padding: 0;
StScrollView & {
min-width: 14px;
min-height: 14px;
min-width: 8px;
min-height: 8px;
}
StBin#trough {
@@ -20,10 +20,10 @@ StScrollBar {
StButton#vhandle, StButton#hhandle {
border-radius: 8px;
background-color: mix($fg_color, $bg_color, 60%);
//border: 3px solid transparent; //would be nice to margin or at least to transparent
margin: 3px;
&:hover { background-color: mix($fg_color, $bg_color, 80%); }
&:active { background-color: $selected_bg_color; }
background-color: mix($fg_color, $bg_color, 30%);
border: 3px solid transparent; //would be nice to margin or at least to transparent
transition: 500ms all ease;
&:hover {background-color: mix($fg_color, $bg_color, 50%);}
&:active {background-color: mix($fg_color, $bg_color, 40%);}
}
}
}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_search-entry.scss
+13 -21
View File
@@ -5,30 +5,22 @@ $search_entry_height: 36px;
%search_entry,
.search-entry {
width: $search_entry_width;
padding: $base_padding+1 $base_padding+3;
border-radius: $search_entry_height * 0.5; // half the height
color: transparentize($fg_color,0.3);
background-color: $bg_color;
margin-top: $base_spacing * 2;
margin-bottom: $base_spacing;
border-width: 2px;
border-color: transparent;
&:hover {
background-color: $hover_bg_color;
color: $hover_fg_color;
}
&:focus {
border-style: solid;
border-color: $selected_bg_color;
color: $fg_color;
box-shadow: inset 0 1px 2px 1px rgba(0,0,0,0.2);
}
margin-top: $base_padding * 2;
margin-bottom: $base_padding;
padding: $base_padding+1 $base_padding+3;
width: $search_entry_width;
.search-entry-icon {
icon-size: $base_icon_size;
padding: 0 4px;
@include entry(normal);
&:hover { @include entry(hover);}
&:focus { @include entry(focus);}
&:insensitive { @include entry(insensitive);}
.search-entry-icon {
color: inherit;
icon-size: $base_icon_size;
margin-top: 2px; // center vertically
padding: 0 4px;
}
}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_search-results.scss
+22 -36
View File
@@ -11,84 +11,70 @@
// This should be equal to #searchResultsContent spacing
spacing: $base_margin * 2;
// separator
// separator (unstyled)
.search-section-separator {
// height: 1px;
// background-color: $osd_outer_borders_color;
height: 0;
height: $base_margin*2; // use it as a spacer
background-color: transparent;
}
}
// content
.search-section-content {
background-color: transparentize(lighten($osd_bg_color, 5%), 0.2);
border-radius: $modal_radius+3;
background-color: lighten($system_bg_color, 5%);
border-radius: $modal_radius*1.5;
border: 1px solid $osd_outer_borders_color;
box-shadow: 0 2px 4px 0 $shadow_color;
text-shadow: 0 1px if($variant == 'light', rgba(255,255,255,0.2), rgba(0,0,0,0.2));
box-shadow: none;
text-shadow: none;
color: $osd_fg_color;
padding: $base_padding * 3;
padding: $base_padding*2;
margin: $base_margin;
// This is the space between the provider icon and the results container
spacing: $base_margin * 2;
}
%search-section-content-item {
@extend %icon_tile;
&:focus,
&:hover,
&:selected {
background-color: transparentize($osd_fg_color, .9);
transition-duration: 200ms;
}
&:active,
&:checked {
background-color: transparentize(darken($osd_bg_color, 10%), .1);
}
%search_section_content_item {
@include tile_button($osd_fg_color);
margin: $base_margin;
border-radius: $base_border_radius !important;
}
// "no results" text
.search-statustext {
@extend %status_text;
@extend %large_title;
}
.grid-search-results {
spacing: $base_spacing * 6;
spacing: $base_padding * 6;
}
// Search results with icons
.grid-search-result {
@extend %app-well-app;
@extend .app-well-app;
}
// search result provider
.search-provider-icon {
@extend %search-section-content-item;
@extend %search_section_content_item;
// content
.list-search-provider-content {
spacing: $base_spacing * 2;
spacing: $base_padding * 2;
// provider labels
.list-search-provider-details {
width: 120px;
margin-top: 0;
color: darken($osd_fg_color, 8%);
// font-weight: bold;
color: $osd_fg_color;
}
}
}
// search results list
.list-search-results {
spacing: $base_spacing;
spacing: $base_padding;
}
// search result listitem
.list-search-result {
@extend %search-section-content-item;
@extend %search_section_content_item;
// content
.list-search-result-content {
@@ -97,12 +83,12 @@
// list item title (with leading icon)
.list-search-result-title {
spacing: $base_spacing * 2;
spacing: $base_padding * 2;
// font-weight: bold;
}
// list item description
.list-search-result-description {
color: darken($osd_fg_color, 30%);
color: $osd_insensitive_fg_color;
}
}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_slider.scss
+11 -16
View File
@@ -1,27 +1,22 @@
/* Slider */
$slider_size: 15px;
$slider_size: 16px;
.slider {
height: $slider_size;
// slider trough
-barlevel-height: 3px; // has to be an odd number
-barlevel-background-color: $borders_color; //background of the trough
-barlevel-border-width: 1px;
-barlevel-border-color: $borders_color; // trough border color
-barlevel-height: 4px;
-barlevel-background-color: if($variant == 'light', transparentize($fg_color, 0.6), transparentize($fg_color, 0.8)); //background of the trough
-barlevel-border-width: 2px;
-barlevel-border-color: transparent; // trough border color
// fill style
-barlevel-active-background-color: $selected_bg_color; //active trough fill
-barlevel-active-border-color: if($variant == 'light', darken($selected_bg_color, 4%), lighten($selected_bg_color, 2%)); //active trough border
-barlevel-active-background-color: $selected_bg_color;
-barlevel-active-border-color: transparent;
// overfill style (red in this case)
-barlevel-overdrive-color: $destructive_color;
-barlevel-overdrive-border-color: if($variant == 'light', darken($destructive_color, 4%), lighten($destructive_color, 2%)); //trough border when red;
-barlevel-overdrive-border-color: transparent; //trough border when red;
-barlevel-overdrive-separator-width:1px;
// slider handler
-slider-handle-radius: $slider_size * 0.5; // half the size of the size
-slider-handle-border-width: 1px;
-slider-handle-border-color: if($variant == 'light', $borders_color, $fg_color);
color: if($variant == 'light', lighten($bg_color, 10%), $fg_color);
&:hover { color: $hover_bg_color; }
&:active { color: $active_bg_color; }
}
-slider-handle-border-width: 0;
-slider-handle-border-color: transparent; // because 0 width
}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_switcher-popup.scss
+34 -28
View File
@@ -1,37 +1,32 @@
/* App Switcher */
// same as dash
$switcher_padding: $base_padding + 4px; // 10px
$switcher_border_radius: $modal_radius + 8px;
// the full screen container of the switcher
.switcher-popup {
padding: 8px;
spacing: $base_spacing * 4;
padding: 0;
spacing: $base_padding * 4;
}
// switcher onscreen panel
.switcher-list {
@extend %osd_panel;
padding: $switcher_padding;
border-radius: $switcher_border_radius;
box-shadow: 0 8px 8px 0 rgba(0,0,0,0.1);
// container for items in list
.switcher-list-item-container {
spacing: $base_padding * 2;
}
// each item in the list
.item-box {
padding: 8px;
border-radius: $base_border_radius + 1px;
border: 1px solid transparent;
&:outlined {
background-color: transparentize($osd_fg_color, 0.7);
}
&:selected {
background-color: transparentize($osd_fg_color, 0.7);
color: $osd_fg_color;
}
}
// window thumbnails
.thumbnail-box {
padding: 2px;
spacing: $base_spacing;
}
.thumbnail {
width: 256px;
@include tile_button($osd_fg_color);
}
.separator {
@@ -39,16 +34,27 @@
background: $borders_color;
}
.switcher-list-item-container {
spacing: $base_spacing * 2;
// container of thumbnails
.thumbnail-box {
padding: 2px;
spacing: $base_padding;
}
// window thumbnail itself
.thumbnail {
width: 256px; // equal to THUMBNAIL_DEFAULT_SIZE in altTab.js
border-radius:$base_border_radius;
}
}
// arrow if app has multiple windows
.switcher-arrow {
border-color: rgba(0,0,0,0);
color: transparentize($fg_color,0.2);
border-color: transparentize($osd_fg_color, 0.2);
color: transparentize($osd_fg_color, 0.2);
&:highlighted {
color: $fg_color;
border-color: $osd_fg_color;
color: $osd_fg_color;
}
}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_switches.scss
+5 -5
View File
@@ -1,16 +1,16 @@
/* Switches */
// these are equal to the size of the SVG assets
$switch_height: 22px;
$switch_width: 46px;
$switch_height: 26px;
$switch_width: 48px;
.toggle-switch {
color: $fg_color;
height: $switch_height;
width: $switch_width;
background-size: contain;
background-image: if($variant == 'light', url("assets/toggle-off.svg"),url("assets/toggle-off-dark.svg"));
background-image: if($variant == 'light', url("assets/toggle-off-light.svg"),url("assets/toggle-off.svg"));
&:checked {
background-image: if($variant == 'light', url("assets/toggle-on.svg"),url("assets/toggle-on-dark.svg"));
background-image: if($variant == 'light', url("assets/toggle-on-light.svg"),url("assets/toggle-on.svg"));
}
}
}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_tiled-previews.scss
-19
View File
@@ -1,19 +0,0 @@
/* Tiled window previews */
$tile_corner_radius: $base_border_radius + 1px;
.tile-preview {
background-color: transparentize($selected_bg_color,0.5);
border: 1px solid $selected_bg_color;
}
.tile-preview-left.on-primary {
border-radius: $tile_corner_radius 0 0 0;
}
.tile-preview-right.on-primary {
border-radius: 0 $tile_corner_radius 0 0;
}
.tile-preview-left.tile-preview-right.on-primary {
border-radius: $tile_corner_radius $tile_corner_radius 0 0;
}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_window-picker.scss
+6 -6
View File
@@ -1,10 +1,11 @@
/* Window Picker */
$window_picker_spacing: $base_spacing; // 6px
$window_picker_spacing: $base_padding; // 6px
$window_picker_padding: $base_padding * 2; // 12px
$window_thumbnail_label_color: transparentize($osd_bg_color, 0.4);
$window_close_button_color: darken(transparentize($osd_bg_color, .05), 3%);
$window_close_button_size: 30px;
$window_close_button_padding: 3px;
@@ -24,24 +25,23 @@ $window_close_button_padding: 3px;
// Close button
.window-close {
background-color: $osd_bg_color;
background-color: $window_close_button_color;
color: $osd_fg_color;
border-radius: $window_close_button_size * 0.5 + $window_close_button_padding * 2;
padding: $window_close_button_padding;
height: $window_close_button_size;
width: $window_close_button_size;
box-shadow: -1px 1px 5px 0px rgba(0,0,0,0.5);
transition-duration: 300ms;
& StIcon { icon-size: 24px; }
& StIcon { icon-size: 24px; } // uses non standard icon size
&:hover {
background-color: lighten($osd_bg_color, 15%);
background-color: mix($osd_fg_color, $window_close_button_color, 15%);
}
&:active {
color: transparentize($osd_fg_color, 0.2);
background-color: darken($osd_bg_color, 5%);
background-color: darken($window_close_button_color, 5%);
}
}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_workspace-switcher.scss
+17 -28
View File
@@ -1,36 +1,25 @@
/* Workspace Switcher */
.workspace-switcher-group {
padding: $base_padding * 2;
}
.workspace-switcher-container {
@extend %osd_panel;
}
$ws_indicator_height: $large_icon_size;
$ws_dot_active: $ws_indicator_height / 3;
$ws_dot_inactive: $ws_indicator_height / 6;
.workspace-switcher {
background: transparent;
border: none;
border-radius: 0;
padding: 0;
spacing: $base_spacing * 2;
@extend %osd_panel;
margin-bottom: 4em;
spacing: $base_padding * 2;
padding: $base_padding * 2 $base_padding * 3;
}
.ws-switcher-box {
background: transparent;
height: 50px;
background-size: 32px;
border: 1px solid transparentize($osd_fg_color,0.9);
border-radius: $base_border_radius + 3px;
}
.ws-switcher-indicator {
background-color: transparentize($osd_fg_color,0.5);
padding: $ws_dot_inactive / 2;
margin: ($ws_indicator_height - $ws_dot_inactive) / 2;
border-radius: $ws_indicator_height;
// active workspace in the switcher
.ws-switcher-active-up,
.ws-switcher-active-down,
.ws-switcher-active-left,
.ws-switcher-active-right {
height: 52px;
background-color: $selected_bg_color;
border: 1px solid if($variant=='light', darken($selected_bg_color, 8%), lighten($selected_bg_color, 5%));
border-radius: $base_border_radius + 3px;
color: $selected_fg_color;
&:active {
background-color: $osd_fg_color;
padding: $ws_dot_active / 2;
margin: ($ws_indicator_height - $ws_dot_active) / 2;
}
}
src/themes/Kali/sass/gnome-shell/upstream/gnome-shell-sass/widgets/_workspace-thumbnails.scss
+1 -1
View File
@@ -3,7 +3,7 @@
// thumbnails in overview
.workspace-thumbnails {
visible-width: 32px; //amount visible before hover
spacing: $base_spacing;
spacing: $base_padding;
padding: $base_padding;
.workspace-thumbnail {
src/themes/Kali/sass/gnome-shell/upstream/sync.sh
+2 -2
View File
@@ -4,7 +4,7 @@ GREEN='\033[0;32m'
YELLOW='\033[0;33m'
RESET='\033[0m'
VERSION=41.0
VERSION=6b60a189fded722ae37a7d3e94d51a509a7d2df1
echo
printf " $YELLOW[ i ]$RESET Upstream version $VERSION\n"
@@ -53,13 +53,13 @@ done <<- EOF
gnome-shell-sass/widgets/_panel.scss
gnome-shell-sass/widgets/_popovers.scss
gnome-shell-sass/widgets/_screen-shield.scss
gnome-shell-sass/widgets/_screenshot.scss
gnome-shell-sass/widgets/_scrollbars.scss
gnome-shell-sass/widgets/_search-entry.scss
gnome-shell-sass/widgets/_search-results.scss
gnome-shell-sass/widgets/_slider.scss
gnome-shell-sass/widgets/_switcher-popup.scss
gnome-shell-sass/widgets/_switches.scss
gnome-shell-sass/widgets/_tiled-previews.scss
gnome-shell-sass/widgets/_window-picker.scss
gnome-shell-sass/widgets/_workspace-switcher.scss
gnome-shell-sass/widgets/_workspace-thumbnails.scss