Fixed #720
This commit is contained in:
parent
9442b7e4f5
commit
716ffe53f9
8 changed files with 175 additions and 131 deletions
|
@ -28,3 +28,71 @@ $cakeisalie: "This stylesheet is generated, DO NOT EDIT";
|
|||
//@include font(body-1);
|
||||
//color: $fg_color;
|
||||
//}
|
||||
|
||||
$popover_bubble_bg: if($variant == 'light', rgba(white, 0.95), rgba(lighten($base_color, 8%), 0.95));
|
||||
|
||||
%popover_bubble {
|
||||
color: $alt_fg_color;
|
||||
background-color: $popover_bubble_bg;
|
||||
border-radius: $mn_radius !important;
|
||||
border: none;
|
||||
box-shadow: 0 1px 2px rgba(black, 0.02) !important;
|
||||
text-shadow: none;
|
||||
|
||||
&:hover, &:focus {
|
||||
color: $fg_color;
|
||||
background-color: if($variant == 'light', rgba($popover_bubble_bg, 1), rgba(lighten($popover_bubble_bg, 5%), 1));
|
||||
box-shadow: 0 1px 3px rgba(black, 0.05) !important;
|
||||
}
|
||||
|
||||
&:active {
|
||||
color: $fg_color;
|
||||
background-color: if($variant == 'light', darken($popover_bubble_bg, 1%), lighten($popover_bubble_bg, 3%));
|
||||
box-shadow: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
%show_apps_bigsur {
|
||||
.show-apps-icon {
|
||||
color: transparent !important;
|
||||
background-image: url("assets/view-app-grid.svg");
|
||||
background-size: contain;
|
||||
}
|
||||
|
||||
&,
|
||||
&:hover,
|
||||
&:active,
|
||||
&:checked,
|
||||
&:focus {
|
||||
.overview-icon, .show-apps-icon { color: transparent !important; }
|
||||
}
|
||||
}
|
||||
|
||||
%osd_panel {
|
||||
color: $fg_color;
|
||||
background-color: $base_color;
|
||||
border-radius: $wm_radius;
|
||||
border: solid rgba(black, 0.75);
|
||||
border-width: if($variant=='light', 0, 1px);
|
||||
box-shadow: 0 3px 8px 0 rgba(black, 0.25);
|
||||
padding: $base_padding * 2;
|
||||
}
|
||||
|
||||
%search-section-content-item {
|
||||
border-radius: $bt_radius;
|
||||
padding: $base_padding;
|
||||
transition-duration: 100ms;
|
||||
text-align: center;
|
||||
|
||||
&:focus,
|
||||
&:hover,
|
||||
&:selected {
|
||||
background-color: $light_divider_color;
|
||||
transition-duration: 200ms;
|
||||
}
|
||||
|
||||
&:active,
|
||||
&:checked {
|
||||
background-color: $light_track_color;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -65,25 +65,25 @@
|
|||
// padding: 0;
|
||||
background-color: rgba(if($colorscheme == 'nord', #20242c, #262626), 0.9);
|
||||
|
||||
& .folder-name-container {
|
||||
.folder-name-container {
|
||||
padding: 24px 36px 0;
|
||||
spacing: 12px;
|
||||
|
||||
& .folder-name-label,
|
||||
& .folder-name-entry {
|
||||
.folder-name-label,
|
||||
.folder-name-entry {
|
||||
font-size: if($laptop == 'true', 16pt, 18pt);
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
& .folder-name-entry {
|
||||
.folder-name-entry {
|
||||
@extend %search-entry;
|
||||
width: if($laptop == 'true', 240px, 320px) !important;
|
||||
}
|
||||
|
||||
/* FIXME: this is to keep the label in sync with the entry */
|
||||
& .folder-name-label { padding: $base_padding; color: $light_alt_fg_color; }
|
||||
.folder-name-label { padding: $base_padding; color: $light_alt_fg_color; }
|
||||
|
||||
& .edit-folder-button {
|
||||
.edit-folder-button {
|
||||
background-color: $light_fill_color;
|
||||
color: $light_alt_fg_color;
|
||||
border: none;
|
||||
|
@ -92,14 +92,14 @@
|
|||
height: 36px;
|
||||
border-radius: $circular_radius;
|
||||
|
||||
& > StIcon { icon-size: $base_icon_size; }
|
||||
> StIcon { icon-size: $base_icon_size; }
|
||||
|
||||
&:hover { background-color: $light_divider_color; }
|
||||
&:checked, &:active { background-color: $light_track_color; }
|
||||
}
|
||||
}
|
||||
|
||||
& .icon-grid {
|
||||
.icon-grid {
|
||||
row-spacing: 12px;
|
||||
column-spacing: if($laptop == 'true', 12px, 18px);
|
||||
page-padding-top: 0;
|
||||
|
@ -147,10 +147,12 @@
|
|||
box-shadow: none;
|
||||
background-color: $light_alt_disabled_fg_color;
|
||||
}
|
||||
|
||||
&:hover .page-indicator-icon {
|
||||
background-image: none;
|
||||
background-color: $light_disabled_fg_color;
|
||||
}
|
||||
|
||||
&:active .page-indicator-icon {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
@ -160,10 +162,12 @@
|
|||
box-shadow: none;
|
||||
background-color: $light_alt_fg_color;
|
||||
}
|
||||
|
||||
&:checked .page-indicator-icon {
|
||||
background-image: none;
|
||||
background-color: $light_alt_fg_color;
|
||||
}
|
||||
|
||||
&:checked:active { background-image: none; }
|
||||
}
|
||||
|
||||
|
|
|
@ -1,72 +1,4 @@
|
|||
|
||||
$popover_bubble_bg: if($variant == 'light', rgba(white, 0.95), rgba(lighten($base_color, 8%), 0.95));
|
||||
|
||||
%popover_bubble {
|
||||
color: $alt_fg_color;
|
||||
background-color: $popover_bubble_bg;
|
||||
border-radius: $mn_radius;
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
text-shadow: none;
|
||||
|
||||
&:hover, &:focus {
|
||||
color: $fg_color;
|
||||
background-color: if($variant == 'light', rgba($popover_bubble_bg, 1), rgba(lighten($popover_bubble_bg, 5%), 1));
|
||||
box-shadow: 0 2px 3px rgba(black, 0.1) !important;
|
||||
}
|
||||
|
||||
&:active {
|
||||
color: $fg_color;
|
||||
background-color: if($variant == 'light', darken($popover_bubble_bg, 1%), lighten($popover_bubble_bg, 3%));
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
%show_apps_bigsur {
|
||||
.show-apps-icon {
|
||||
color: transparent !important;
|
||||
background-image: url("assets/view-app-grid.svg");
|
||||
background-size: contain;
|
||||
}
|
||||
|
||||
&,
|
||||
&:hover,
|
||||
&:active,
|
||||
&:checked,
|
||||
&:focus {
|
||||
.overview-icon, .show-apps-icon { color: transparent !important; }
|
||||
}
|
||||
}
|
||||
|
||||
%osd_panel {
|
||||
color: $fg_color;
|
||||
background-color: $base_color;
|
||||
border-radius: $wm_radius;
|
||||
border: solid rgba(black, 0.75);
|
||||
border-width: if($variant=='light', 0, 1px);
|
||||
box-shadow: 0 3px 8px 0 rgba(black, 0.25);
|
||||
padding: $base_padding * 2;
|
||||
}
|
||||
|
||||
%search-section-content-item {
|
||||
border-radius: $bt_radius;
|
||||
padding: $base_padding;
|
||||
transition-duration: 100ms;
|
||||
text-align: center;
|
||||
|
||||
&:focus,
|
||||
&:hover,
|
||||
&:selected {
|
||||
background-color: $light_divider_color;
|
||||
transition-duration: 200ms;
|
||||
}
|
||||
|
||||
&:active,
|
||||
&:checked {
|
||||
background-color: $light_track_color;
|
||||
}
|
||||
}
|
||||
|
||||
// links
|
||||
.shell-link {
|
||||
border-radius: $bt_radius;
|
||||
|
|
|
@ -1,18 +1,19 @@
|
|||
/* Buttons */
|
||||
|
||||
%button {
|
||||
@include button(flat-normal);
|
||||
&:hover { @include button(flat-hover); }
|
||||
&:active { @include button(flat-active); }
|
||||
&:insensitive { @include button(flat-insensitive); }
|
||||
&:focus { @include button(flat-focus); }
|
||||
}
|
||||
|
||||
.button {
|
||||
min-height: $small_size;
|
||||
padding: $container_padding $container_padding * 2;
|
||||
border-radius: $bt_radius;
|
||||
|
||||
&, .popup-menu & {
|
||||
@include button(flat-normal);
|
||||
&:hover { @include button(flat-hover); }
|
||||
&:active { @include button(flat-active); }
|
||||
&:insensitive { @include button(flat-insensitive); }
|
||||
&:focus { @include button(flat-focus); }
|
||||
border: none;
|
||||
}
|
||||
border: none;
|
||||
@extend %button;
|
||||
}
|
||||
|
||||
.icon-button {
|
||||
|
@ -20,12 +21,7 @@
|
|||
min-width: $small_size;
|
||||
padding: $container_padding;
|
||||
border-radius: $circular_radius;
|
||||
|
||||
@include button(flat-normal);
|
||||
&:hover { @include button(flat-hover); }
|
||||
&:active { @include button(flat-active); }
|
||||
&:insensitive { @include button(flat-insensitive); }
|
||||
&:focus { @include button(flat-focus); }
|
||||
@extend %button;
|
||||
}
|
||||
|
||||
%osd_button {
|
||||
|
|
|
@ -79,7 +79,7 @@
|
|||
/* Calendar */
|
||||
.calendar {
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
box-shadow: 0 1px 2px rgba(black, 0.02) !important;
|
||||
background-color: $popover_bubble_bg;
|
||||
padding: $base_padding !important;
|
||||
margin: 0 12px !important;
|
||||
|
|
|
@ -2,28 +2,43 @@
|
|||
|
||||
// Dialog
|
||||
#LookingGlassDialog {
|
||||
background-color: $base_color;
|
||||
spacing: 4px;
|
||||
background-color: $osd_bg_color !important;
|
||||
spacing: $base_padding;
|
||||
margin: $base_padding;
|
||||
padding: 0;
|
||||
border: none;
|
||||
border-radius: $bt_radius;
|
||||
box-shadow: 0 3px 8px 0 rgba(black, 0.25);
|
||||
color: $fg_color;
|
||||
box-shadow: 0 2px 6px 0 rgba(black, 0.15);
|
||||
color: $osd_fg_color !important;
|
||||
|
||||
& > #Toolbar {
|
||||
padding: 0 8px;
|
||||
> #Toolbar {
|
||||
padding: 0 $base_padding;
|
||||
spacing: $base_padding;
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
background-color: rgba($base_color, 0.01);
|
||||
box-shadow: inset 0 -1px 0 $borders_color;
|
||||
box-shadow: inset 0 -1px 0 $light_divider_color;
|
||||
|
||||
.lg-toolbar-button {
|
||||
padding: $base_padding $base_padding * 2;
|
||||
@extend %osd_button;
|
||||
border-radius: $bt_radius;
|
||||
margin: $base_padding / 2;
|
||||
|
||||
> StIcon { icon-size: $base_icon_size; }
|
||||
}
|
||||
}
|
||||
|
||||
.labels {
|
||||
spacing: $base_padding;
|
||||
color: $osd_fg_color !important;
|
||||
}
|
||||
|
||||
.labels { spacing: 0; }
|
||||
.notebook-tab {
|
||||
-natural-hpadding: 12px;
|
||||
-minimum-hpadding: 6px;
|
||||
-natural-hpadding: $base_padding * 2;
|
||||
-minimum-hpadding: $base_padding * 2;
|
||||
font-weight: bold;
|
||||
color: $hint_fg_color;
|
||||
color: $light_hint_fg_color !important;
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
min-height: $medium_size;
|
||||
|
@ -32,22 +47,22 @@
|
|||
border-bottom: 2px solid transparent;
|
||||
|
||||
&:hover {
|
||||
color: $fg_color;
|
||||
color: $light_fg_color !important;
|
||||
text-shadow: none;
|
||||
border-color: $track_color
|
||||
border-color: $light_track_color
|
||||
}
|
||||
|
||||
&:selected {
|
||||
background-color: rgba($base_color, 0.01);
|
||||
background-color: rgba($base_color, 0.01) !important;
|
||||
border-color: $primary_color;
|
||||
color: $fg_color;
|
||||
color: $light_fg_color !important;
|
||||
text-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
StBoxLayout#EvalBox { padding: 4px; spacing: 4px; }
|
||||
StBoxLayout#ResultsArea { spacing: 4px; }
|
||||
StBoxLayout#EvalBox,
|
||||
StBoxLayout#ResultsArea { padding: $base_padding; spacing: $base_padding; }
|
||||
}
|
||||
|
||||
.lg-dialog {
|
||||
|
@ -55,26 +70,33 @@
|
|||
min-height: 22px;
|
||||
selection-background-color: $primary_color;
|
||||
selected-color: $light_alt_fg_color;
|
||||
caret-color: $light_fg_color !important;
|
||||
color: $light_fg_color !important;
|
||||
background-color: $light_divider_color !important;
|
||||
}
|
||||
|
||||
.shell-link {
|
||||
color: $link_color;
|
||||
color: $link_color !important;
|
||||
&:hover { color: lighten($link_color, 10%); }
|
||||
&:active { color: darken($link_color, 10%); }
|
||||
}
|
||||
}
|
||||
|
||||
.actor-link {
|
||||
color: $alt_fg_color;
|
||||
&:hover { color: lighten($alt_fg_color, 20%); }
|
||||
&:active { color: darken($alt_fg_color, 20%); }
|
||||
}
|
||||
color: $light_alt_fg_color !important;
|
||||
&:hover { color: lighten($light_alt_fg_color, 20%); }
|
||||
&:active { color: darken($light_alt_fg_color, 20%); }
|
||||
|
||||
StIcon { icon-size: 12px; }
|
||||
}
|
||||
}
|
||||
|
||||
.lg-completions-text {
|
||||
font-size: .9em;
|
||||
font-style: italic;
|
||||
font-size: .9em;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.lg-obj-inspector-title {
|
||||
spacing: $base_spacing;
|
||||
spacing: $base_spacing;
|
||||
}
|
||||
|
||||
.lg-obj-inspector-button {
|
||||
|
@ -88,20 +110,21 @@
|
|||
|
||||
// Extensions
|
||||
#lookingGlassExtensions {
|
||||
padding: 4px;
|
||||
padding: $base_padding;
|
||||
}
|
||||
|
||||
.lg-extensions-list {
|
||||
padding: 4px;
|
||||
spacing: 6px;
|
||||
padding: $base_padding;
|
||||
spacing: $base_padding;
|
||||
}
|
||||
|
||||
.lg-extension {
|
||||
border: none;
|
||||
border-radius: $bt_radius;
|
||||
padding: 4px;
|
||||
background-color: $divider_color;
|
||||
color: $alt_fg_color;
|
||||
padding: $base_padding * 2;
|
||||
spacing: $base_padding;
|
||||
background-color: $light_divider_color !important;
|
||||
color: $light_alt_fg_color !important;
|
||||
}
|
||||
|
||||
.lg-extension-name {
|
||||
|
@ -109,14 +132,32 @@
|
|||
}
|
||||
|
||||
.lg-extension-meta {
|
||||
spacing: 6px;
|
||||
spacing: $base_padding;
|
||||
}
|
||||
|
||||
// Inspector
|
||||
#LookingGlassPropertyInspector {
|
||||
background: $base_color;
|
||||
background: $osd_bg_color !important;
|
||||
border: none;
|
||||
border-radius: $bt_radius;
|
||||
padding: 6px;
|
||||
padding: $base_padding;
|
||||
box-shadow: 0 3px 8px 0 rgba(black, 0.25);
|
||||
color: $osd_fg_color !important;
|
||||
}
|
||||
|
||||
.lg-debug-flag-button {
|
||||
color: $light_fg_color !important;
|
||||
spacing: $base_padding;
|
||||
|
||||
StLabel {
|
||||
padding: 2 * $base_padding;
|
||||
}
|
||||
|
||||
&:hover { color: lighten($light_fg_color, 20%) !important; }
|
||||
&:active { color: darken($light_fg_color, 20%) !important; }
|
||||
}
|
||||
|
||||
.lg-debug-flags-header {
|
||||
padding-top: 2 * $base_padding;
|
||||
padding: $base_padding;
|
||||
}
|
||||
|
|
|
@ -48,7 +48,7 @@
|
|||
|
||||
// message bubbles
|
||||
.message {
|
||||
margin: 0 4px 6px;
|
||||
margin: 3px 4px 4px;
|
||||
|
||||
.popup-menu & {
|
||||
@extend %popover_bubble;
|
||||
|
@ -138,6 +138,8 @@
|
|||
|
||||
&:last-child:ltr { margin-right: 16px; padding-right: 8px; }
|
||||
&:last-child:rtl { margin-left: 16px; padding-left: 8px; }
|
||||
|
||||
StIcon { icon-size: $base_icon_size !important; }
|
||||
}
|
||||
|
||||
// album-art
|
||||
|
|
|
@ -50,18 +50,19 @@
|
|||
}
|
||||
|
||||
.page-navigation-arrow {
|
||||
& > StIcon {
|
||||
> StIcon {
|
||||
margin: $base_padding;
|
||||
padding: $base_padding * 3;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
border-radius: $circular_radius;
|
||||
color: $light_fg_color !important;
|
||||
background-color: $light_fill_color !important;
|
||||
}
|
||||
|
||||
&:insensitive > StIcon {
|
||||
backround-color: transparent !important;
|
||||
color: transparent !important;
|
||||
backround-color: transparent;
|
||||
color: transparent;
|
||||
}
|
||||
|
||||
&:hover > StIcon {
|
||||
|
|
Loading…
Reference in a new issue