Gnome-Shell: update theme tweaks for search-entry, search-results, and window-picker
This commit is contained in:
Daniel Ruiz de Alegría
parent
886215c7cd
commit
eb8d00f902
@ -2561,71 +2561,109 @@ StScrollBar {
|
||||
background-color: rgba(39, 119, 255, 0.5); }
|
||||
|
||||
/* OSD */
|
||||
.osd-window, .resize-popup, .switcher-list, .workspace-switcher, .screenshot-ui-panel {
|
||||
/*
|
||||
$_osd_color: if($variant=='light', black, $fg_color);
|
||||
%osd_panel {
|
||||
font-weight: bold;
|
||||
background-color: #23252e;
|
||||
color: #eeeeec;
|
||||
border: 1px solid #0d0e11;
|
||||
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); }
|
||||
.osd-window StIcon, .resize-popup StIcon, .switcher-list StIcon, .workspace-switcher StIcon, .screenshot-ui-panel StIcon {
|
||||
color: #eeeeec;
|
||||
icon-shadow: 0 0 6px rgba(0, 0, 0, 0.4); }
|
||||
background-color: $bg_color;
|
||||
color: $fg_color;
|
||||
border: 1px solid if($variant=='light', transparentize(black, 0.85), $borders_color);
|
||||
box-shadow: 0 4px 10px transparentize(black, .8);
|
||||
|
||||
.osd-window .level {
|
||||
-barlevel-background-color: rgba(238, 238, 236, 0.1);
|
||||
-barlevel-active-background-color: #eeeeec; }
|
||||
StIcon {
|
||||
color: $_osd_color;
|
||||
icon-shadow: 0 0 6px transparentize(black, .6);
|
||||
}
|
||||
}
|
||||
|
||||
.osd-window {
|
||||
.level {
|
||||
-barlevel-background-color: transparentize($_osd_color, if($variant=='light', 0.7, 0.9));
|
||||
-barlevel-active-background-color: $_osd_color;
|
||||
}
|
||||
}
|
||||
|
||||
/* Slider */
|
||||
/*
|
||||
.slider {
|
||||
height: 1.1em;
|
||||
-barlevel-height: .35em;
|
||||
-barlevel-background-color: #0d0e11;
|
||||
-barlevel-border-color: #2777ff;
|
||||
-barlevel-active-background-color: #2777ff;
|
||||
-barlevel-overdrive-color: #a61414;
|
||||
-barlevel-background-color: $borders_color;
|
||||
-barlevel-border-color: $selected_bg_color;
|
||||
-barlevel-active-background-color: $selected_bg_color;
|
||||
-barlevel-overdrive-color: $destructive_color;
|
||||
-barlevel-overdrive-separator-width: 0.1em;
|
||||
-barlevel-border-width: 0;
|
||||
-slider-handle-radius: 0; }
|
||||
|
||||
-slider-handle-radius: 0;
|
||||
}
|
||||
|
||||
/* Check Boxes */
|
||||
.check-box StBin {
|
||||
background-image: url("assets/checkbox-off-dark.svg"); }
|
||||
/*
|
||||
.check-box {
|
||||
StBin {
|
||||
background-image: if($variant == 'light', url("assets/checkbox-off.svg"),
|
||||
url("assets/checkbox-off-dark.svg"));
|
||||
}
|
||||
|
||||
.check-box:focus StBin {
|
||||
background-image: url("assets/checkbox-off-focused-dark.svg"); }
|
||||
|
||||
.check-box:checked StBin {
|
||||
background-image: url("assets/checkbox-dark.svg"); }
|
||||
|
||||
.check-box:focus:checked StBin {
|
||||
background-image: url("assets/checkbox-focused-dark.svg"); }
|
||||
&:focus StBin { background-image: if($variant == 'light', url("assets/checkbox-off-focused.svg"),
|
||||
url("assets/checkbox-off-focused-dark.svg")); }
|
||||
&:checked StBin { background-image: if($variant == 'light', url("assets/checkbox.svg"),
|
||||
url("assets/checkbox-dark.svg")); }
|
||||
&:focus:checked StBin { background-image: if($variant == 'light', url("assets/checkbox-focused.svg"),
|
||||
url("assets/checkbox-focused-dark.svg")); }
|
||||
}
|
||||
|
||||
/* Switches */
|
||||
/*
|
||||
.toggle-switch {
|
||||
background-image: url("assets/toggle-off-dark.svg"); }
|
||||
.toggle-switch:checked {
|
||||
background-image: url("assets/toggle-on-dark.svg"); }
|
||||
background-image: if($variant == 'light', url("assets/toggle-off.svg"),
|
||||
url("assets/toggle-off-dark.svg"));
|
||||
&:checked {
|
||||
background-image: if($variant == 'light', url("assets/toggle-on.svg"),
|
||||
url("assets/toggle-on-dark.svg"));
|
||||
}
|
||||
}
|
||||
|
||||
.popup-menu-item.selected, .popup-menu-item:active {
|
||||
background-color: #3b3e46;
|
||||
color: #eeeeec; }
|
||||
// menu items
|
||||
.popup-menu-item {
|
||||
&.selected, &:active {
|
||||
background-color: $popover_hover_color;
|
||||
color: $fg_color;
|
||||
}
|
||||
}
|
||||
|
||||
/* App Switcher */
|
||||
.switcher-list .item-box:outlined {
|
||||
padding: 6px;
|
||||
border: 3px solid #2777ff; }
|
||||
/*
|
||||
// switcher onscreen panel
|
||||
.switcher-list {
|
||||
.item-box {
|
||||
&:outlined {
|
||||
padding: 6px;
|
||||
border: 3px solid $selected_bg_color;
|
||||
}
|
||||
|
||||
.switcher-list .item-box:selected {
|
||||
background-color: #2777ff;
|
||||
color: #ffffff;
|
||||
text-shadow: 0 1px 4px rgba(0, 0, 0, 0.4); }
|
||||
&:selected {
|
||||
background-color: $selected_bg_color;
|
||||
color: $selected_fg_color;
|
||||
text-shadow: 0 1px 4px transparentize(black, 0.6);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Workspace Switcher */
|
||||
.ws-switcher-box {
|
||||
border: none; }
|
||||
/*
|
||||
.ws-switcher-box { border: none }
|
||||
|
||||
.workspace-switcher-container {
|
||||
padding: 7px; }
|
||||
.workspace-switcher-container { padding: 7px; }
|
||||
|
||||
// active workspace in the switcher
|
||||
.ws-switcher-active-up,
|
||||
.ws-switcher-active-down,
|
||||
.ws-switcher-active-left,
|
||||
.ws-switcher-active-right {
|
||||
//box-shadow: 0 0px 6px transparentize(black, .5);
|
||||
}
|
||||
|
||||
/* Window Picker */
|
||||
.window-caption {
|
||||
@ -2651,222 +2689,158 @@ StScrollBar {
|
||||
color: transparent;
|
||||
transition-duration: 0s; }
|
||||
|
||||
/* Tiled window previews */
|
||||
.tile-preview-left.on-primary,
|
||||
.tile-preview-right.on-primary,
|
||||
.tile-preview-left.tile-preview-right.on-primary {
|
||||
border-radius: 0; }
|
||||
|
||||
/* TOP BAR */
|
||||
/*
|
||||
#panel {
|
||||
background: rgba(35, 37, 46, 0.8);
|
||||
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); }
|
||||
#panel .popup-menu-arrow {
|
||||
width: 0; }
|
||||
#panel StIcon {
|
||||
icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); }
|
||||
#panel.unlock-screen, #panel.login-screen, #panel.lock-screen, #panel:overview {
|
||||
background-color: transparent; }
|
||||
#panel.unlock-screen .panel-button, #panel.unlock-screen .panel-button:hover, #panel.unlock-screen .panel-button:active, #panel.unlock-screen .panel-button:focus, #panel.unlock-screen .panel-button:overview, #panel.unlock-screen .panel-button:checked, #panel.login-screen .panel-button, #panel.login-screen .panel-button:hover, #panel.login-screen .panel-button:active, #panel.login-screen .panel-button:focus, #panel.login-screen .panel-button:overview, #panel.login-screen .panel-button:checked, #panel.lock-screen .panel-button, #panel.lock-screen .panel-button:hover, #panel.lock-screen .panel-button:active, #panel.lock-screen .panel-button:focus, #panel.lock-screen .panel-button:overview, #panel.lock-screen .panel-button:checked, #panel:overview .panel-button, #panel:overview .panel-button:hover, #panel:overview .panel-button:active, #panel:overview .panel-button:focus, #panel:overview .panel-button:overview, #panel:overview .panel-button:checked {
|
||||
color: white; }
|
||||
#panel .panel-corner {
|
||||
-panel-corner-radius: 0; }
|
||||
#panel .panel-button {
|
||||
color: white; }
|
||||
#panel .panel-button:active, #panel .panel-button:focus, #panel .panel-button:overview, #panel .panel-button:checked {
|
||||
color: white;
|
||||
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.2); }
|
||||
#panel .panel-button.clock-display:active, #panel .panel-button.clock-display:overview, #panel .panel-button.clock-display:focus, #panel .panel-button.clock-display:checked {
|
||||
box-shadow: none; }
|
||||
#panel .panel-button.clock-display:active .clock, #panel .panel-button.clock-display:overview .clock, #panel .panel-button.clock-display:focus .clock, #panel .panel-button.clock-display:checked .clock {
|
||||
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, 0.2); }
|
||||
#panel #panelActivities.panel-button {
|
||||
margin-left: .4em; }
|
||||
#panel #panelActivities.panel-button StLabel {
|
||||
background-image: url("assets/view-grid-symbolic-dark.svg");
|
||||
$_panel_bg: transparentize($bg_color, .2);
|
||||
$_panel_fg: if($variant=='light', black, white);
|
||||
$_panel_text_shadow: 0 1px 2px transparentize(black, 0.5);
|
||||
background: $_panel_bg;
|
||||
text-shadow: $_panel_text_shadow;
|
||||
|
||||
.popup-menu-arrow { width: 0; }
|
||||
|
||||
StIcon { icon-shadow: $_panel_text_shadow; }
|
||||
|
||||
&.unlock-screen,
|
||||
&.login-screen,
|
||||
&.lock-screen,
|
||||
&:overview {
|
||||
background-color: transparent;
|
||||
.panel-button {
|
||||
&, &:hover, &:active, &:focus, &:overview, &:checked { color: white; }
|
||||
}
|
||||
}
|
||||
|
||||
.panel-corner { -panel-corner-radius: 0; }
|
||||
|
||||
.panel-button {
|
||||
color: $_panel_fg;
|
||||
&:active, &:focus, &:overview, &:checked {
|
||||
color: $_panel_fg;
|
||||
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, if($variant == 'light', 1, .2));
|
||||
}
|
||||
}
|
||||
|
||||
.panel-button.clock-display {
|
||||
// Move highlight from .panel-button to .clock
|
||||
&:active, &:overview, &:focus, &:checked {
|
||||
box-shadow: none;
|
||||
|
||||
.clock {
|
||||
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, if($variant == 'light', 1, .2));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#panelActivities.panel-button {
|
||||
margin-left: .4em;
|
||||
StLabel {
|
||||
background-image: if($variant == 'light', url("assets/view-grid-symbolic.svg"),
|
||||
url("assets/view-grid-symbolic-dark.svg"));
|
||||
background-size: contain;
|
||||
width: 1.5em;
|
||||
height: 1.5em;
|
||||
color: transparent; }
|
||||
#panel #panelActivities.panel-button:overview StLabel {
|
||||
background-image: url("assets/view-grid-symbolic-dark.svg"); }
|
||||
color: transparent;
|
||||
}
|
||||
|
||||
&:overview StLabel {
|
||||
background-image: url("assets/view-grid-symbolic-dark.svg");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Date/Time Menu */
|
||||
#calendarArea {
|
||||
background-image: url("assets/kali-dragon-dark.svg");
|
||||
background-size: contain; }
|
||||
/*
|
||||
@mixin notification_bubble($flat: false) {
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
border-radius: $base_border_radius + 2px;
|
||||
margin: $base_margin;
|
||||
|
||||
.events-section-title {
|
||||
padding: 1em; }
|
||||
@if $flat {
|
||||
@include button(undecorated);
|
||||
} @else {
|
||||
@include button(normal);
|
||||
}
|
||||
|
||||
&:focus {
|
||||
@include button(focus);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
@include button(hover);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
&:active {
|
||||
@include button(active);
|
||||
}
|
||||
}
|
||||
|
||||
// overall menu
|
||||
#calendarArea {
|
||||
background-image: if($variant == 'light', url("assets/kali-dragon.svg"),
|
||||
url("assets/kali-dragon-dark.svg"));
|
||||
background-size: contain;
|
||||
}
|
||||
|
||||
.events-section-title { padding: 1em; }
|
||||
|
||||
.datemenu-today-button {
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
border-radius: 10px;
|
||||
margin: 4px;
|
||||
background-color: transparent;
|
||||
background-color: none; }
|
||||
.datemenu-today-button:insensitive {
|
||||
color: rgba(238, 238, 236, 0.5);
|
||||
background-color: rgba(238, 238, 236, 0.05);
|
||||
background-color: transparent;
|
||||
color: rgba(255, 255, 255, 0.5); }
|
||||
.datemenu-today-button:focus {
|
||||
color: #eeeeec;
|
||||
background-color: #2c364c;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6); }
|
||||
.datemenu-today-button:focus:hover {
|
||||
background-color: #333d54;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); }
|
||||
.datemenu-today-button:focus:active {
|
||||
background-color: #39435b;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); }
|
||||
.datemenu-today-button:hover {
|
||||
color: #eeeeec;
|
||||
background-color: #343640;
|
||||
box-shadow: none; }
|
||||
.datemenu-today-button:active {
|
||||
color: #eeeeec;
|
||||
background-color: #3b3d49; }
|
||||
.datemenu-today-button .date-label {
|
||||
@include notification_bubble($flat: true);
|
||||
|
||||
.date-label {
|
||||
font-size: 1.5em;
|
||||
font-weight: 300; }
|
||||
font-weight: 300;
|
||||
}
|
||||
}
|
||||
|
||||
.calendar {
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
border-radius: 10px;
|
||||
margin: 4px;
|
||||
background-color: transparent;
|
||||
background-color: none; }
|
||||
.calendar:insensitive {
|
||||
color: rgba(238, 238, 236, 0.5);
|
||||
background-color: rgba(238, 238, 236, 0.05);
|
||||
background-color: transparent;
|
||||
color: rgba(255, 255, 255, 0.5); }
|
||||
.calendar:focus {
|
||||
color: #eeeeec;
|
||||
background-color: #2c364c;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6); }
|
||||
.calendar:focus:hover {
|
||||
background-color: #333d54;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); }
|
||||
.calendar:focus:active {
|
||||
background-color: #39435b;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); }
|
||||
.calendar:hover {
|
||||
color: #eeeeec;
|
||||
background-color: #343640;
|
||||
box-shadow: none; }
|
||||
.calendar:active {
|
||||
color: #eeeeec;
|
||||
background-color: #3b3d49; }
|
||||
.calendar .pager-button:hover, .calendar .pager-button:focus {
|
||||
background-color: #3b3e46; }
|
||||
.calendar .calendar-day-base:hover, .calendar .calendar-day-base:focus, .calendar .calendar-day-base:active, .calendar .calendar-day-base:selected {
|
||||
color: #eeeeec;
|
||||
background-color: #3b3e46; }
|
||||
.calendar .calendar-today:hover, .calendar .calendar-today:focus {
|
||||
background-color: #3b3e46;
|
||||
color: #eeeeec; }
|
||||
.calendar .calendar-today:active, .calendar .calendar-today:selected {
|
||||
background: #2777ff;
|
||||
color: #ffffff; }
|
||||
.calendar .calendar-today:active:hover, .calendar .calendar-today:active:focus, .calendar .calendar-today:selected:hover, .calendar .calendar-today:selected:focus {
|
||||
background-color: #3b3e46;
|
||||
color: #eeeeec; }
|
||||
@include notification_bubble($flat: true);
|
||||
|
||||
.pager-button {
|
||||
&:hover, &:focus { background-color: $popover_hover_color }
|
||||
}
|
||||
|
||||
.calendar-day-base {
|
||||
&:hover, &:focus,
|
||||
&:active,&:selected {
|
||||
color: $fg_color;
|
||||
background-color: $popover_hover_color;
|
||||
}
|
||||
}
|
||||
|
||||
.calendar-today {
|
||||
&:hover,&:focus {
|
||||
background-color: $popover_hover_color;
|
||||
color: $fg_color;
|
||||
}
|
||||
&:active,&:selected {
|
||||
background: $selected_bg_color;
|
||||
color: $selected_fg_color;
|
||||
&:hover,&:focus {
|
||||
background-color: $popover_hover_color;
|
||||
color: $fg_color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Events */
|
||||
.events-button {
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
border-radius: 10px;
|
||||
margin: 4px;
|
||||
background-color: transparent;
|
||||
background-color: none; }
|
||||
.events-button:insensitive {
|
||||
color: rgba(238, 238, 236, 0.5);
|
||||
background-color: rgba(238, 238, 236, 0.05);
|
||||
background-color: transparent;
|
||||
color: rgba(255, 255, 255, 0.5); }
|
||||
.events-button:focus {
|
||||
color: #eeeeec;
|
||||
background-color: #2c364c;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6); }
|
||||
.events-button:focus:hover {
|
||||
background-color: #333d54;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); }
|
||||
.events-button:focus:active {
|
||||
background-color: #39435b;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); }
|
||||
.events-button:hover {
|
||||
color: #eeeeec;
|
||||
background-color: #343640;
|
||||
box-shadow: none; }
|
||||
.events-button:active {
|
||||
color: #eeeeec;
|
||||
background-color: #3b3d49; }
|
||||
/*
|
||||
.events-button { @include notification_bubble($flat: true); }
|
||||
|
||||
/* World clocks */
|
||||
/*
|
||||
.world-clocks-button {
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
border-radius: 10px;
|
||||
margin: 4px;
|
||||
background-color: transparent;
|
||||
background-color: none; }
|
||||
.world-clocks-button:insensitive {
|
||||
color: rgba(238, 238, 236, 0.5);
|
||||
background-color: rgba(238, 238, 236, 0.05);
|
||||
background-color: transparent;
|
||||
color: rgba(255, 255, 255, 0.5); }
|
||||
.world-clocks-button:focus {
|
||||
color: #eeeeec;
|
||||
background-color: #2c364c;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6); }
|
||||
.world-clocks-button:focus:hover {
|
||||
background-color: #333d54;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); }
|
||||
.world-clocks-button:focus:active {
|
||||
background-color: #39435b;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); }
|
||||
.world-clocks-button:hover {
|
||||
color: #eeeeec;
|
||||
background-color: #343640;
|
||||
box-shadow: none; }
|
||||
.world-clocks-button:active {
|
||||
color: #eeeeec;
|
||||
background-color: #3b3d49; }
|
||||
@include notification_bubble($flat: true);
|
||||
}
|
||||
|
||||
.weather-button {
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
border-radius: 10px;
|
||||
margin: 4px;
|
||||
background-color: transparent;
|
||||
background-color: none; }
|
||||
.weather-button:insensitive {
|
||||
color: rgba(238, 238, 236, 0.5);
|
||||
background-color: rgba(238, 238, 236, 0.05);
|
||||
background-color: transparent;
|
||||
color: rgba(255, 255, 255, 0.5); }
|
||||
.weather-button:focus {
|
||||
color: #eeeeec;
|
||||
background-color: #2c364c;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6); }
|
||||
.weather-button:focus:hover {
|
||||
background-color: #333d54;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); }
|
||||
.weather-button:focus:active {
|
||||
background-color: #39435b;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); }
|
||||
.weather-button:hover {
|
||||
color: #eeeeec;
|
||||
background-color: #343640;
|
||||
box-shadow: none; }
|
||||
.weather-button:active {
|
||||
color: #eeeeec;
|
||||
background-color: #3b3d49; }
|
||||
@include notification_bubble($flat: true);
|
||||
}
|
||||
|
||||
|
||||
/* Search */
|
||||
.search-entry {
|
||||
@ -2874,7 +2848,6 @@ StScrollBar {
|
||||
text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.9);
|
||||
font-weight: bold;
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
border-radius: 999px;
|
||||
font-size: 1.1em;
|
||||
transition-duration: 200ms; }
|
||||
.search-entry StLabel.hint-text {
|
||||
@ -2899,46 +2872,66 @@ StScrollBar {
|
||||
icon-shadow: 0px 1px 2px rgba(0, 0, 0, 0.9); }
|
||||
|
||||
.search-section-content {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
box-shadow: none;
|
||||
border: none; }
|
||||
background-color: rgba(255, 255, 255, 0.1); }
|
||||
|
||||
.search-provider-icon .list-search-provider-content .list-search-provider-details {
|
||||
font-weight: bold; }
|
||||
|
||||
/* DASHBOARD */
|
||||
/*
|
||||
#dash {
|
||||
color: white;
|
||||
color: $osd_fg_color;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
border-color: transparent; }
|
||||
#dash .overview-icon StIcon {
|
||||
border-color: transparent;
|
||||
|
||||
.overview-icon StIcon {
|
||||
color: white;
|
||||
icon-shadow: 0 2px 6px rgba(0, 0, 0, 0.4); }
|
||||
icon-shadow: 0 2px 6px transparentize(black, .6);
|
||||
}
|
||||
}
|
||||
|
||||
.dash-background {
|
||||
background: rgba(255, 255, 255, 0.1); }
|
||||
background: $overview_transparent_bg;
|
||||
//box-shadow: 0 2px 8px 0 transparentize(black, .2);
|
||||
}
|
||||
|
||||
.dash-separator {
|
||||
background: rgba(255, 255, 255, 0.1); }
|
||||
.dash-separator { background: $overview_transparent_bg; }
|
||||
|
||||
.show-apps:focus .overview-icon, .show-apps:checked .overview-icon {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
color: black; }
|
||||
.show-apps {
|
||||
&:focus,
|
||||
&:checked {
|
||||
.overview-icon {
|
||||
background-color: $overview_transparent_bg;
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* App Folders */
|
||||
.app-well-app.app-folder, .app-folder.grid-search-result, .app-well-app.app-folder .overview-icon.overview-icon-with-label, .app-folder.grid-search-result .overview-icon.overview-icon-with-label {
|
||||
background-color: rgba(255, 255, 255, 0.1); }
|
||||
/*
|
||||
.app-well-app.app-folder {
|
||||
&, & .overview-icon.overview-icon-with-label {
|
||||
background-color: $overview_transparent_bg
|
||||
}
|
||||
//box-shadow: 0 2px 5px black;
|
||||
|
||||
.app-well-app.app-folder:checked, .app-folder.grid-search-result:checked {
|
||||
background: black; }
|
||||
&:checked { background: black; }
|
||||
}
|
||||
|
||||
.app-folder-dialog {
|
||||
background: black;
|
||||
box-shadow: 0 0 20px #030303; }
|
||||
.app-folder-dialog .folder-name-container .edit-folder-button, .app-folder-dialog .folder-name-container .edit-folder-button:hover, .app-folder-dialog .folder-name-container .edit-folder-button:active {
|
||||
background: white;
|
||||
color: black; }
|
||||
box-shadow: 0 0 20px lighten(black, 1%);
|
||||
|
||||
.app-folder-dialog-container {
|
||||
width: 720px; }
|
||||
& .folder-name-container {
|
||||
& .edit-folder-button {
|
||||
&, &:hover, &:active {
|
||||
background: white;
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.app-folder-dialog-container { width: 720px; }
|
||||
*/
|
||||
|
||||
@ -2557,71 +2557,109 @@ StScrollBar {
|
||||
background-color: rgba(39, 119, 255, 0.5); }
|
||||
|
||||
/* OSD */
|
||||
.osd-window, .resize-popup, .switcher-list, .workspace-switcher, .screenshot-ui-panel {
|
||||
/*
|
||||
$_osd_color: if($variant=='light', black, $fg_color);
|
||||
%osd_panel {
|
||||
font-weight: bold;
|
||||
background-color: #ffffff;
|
||||
color: #5c616c;
|
||||
border: 1px solid rgba(0, 0, 0, 0.15);
|
||||
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); }
|
||||
.osd-window StIcon, .resize-popup StIcon, .switcher-list StIcon, .workspace-switcher StIcon, .screenshot-ui-panel StIcon {
|
||||
color: black;
|
||||
icon-shadow: 0 0 6px rgba(0, 0, 0, 0.4); }
|
||||
background-color: $bg_color;
|
||||
color: $fg_color;
|
||||
border: 1px solid if($variant=='light', transparentize(black, 0.85), $borders_color);
|
||||
box-shadow: 0 4px 10px transparentize(black, .8);
|
||||
|
||||
.osd-window .level {
|
||||
-barlevel-background-color: rgba(0, 0, 0, 0.3);
|
||||
-barlevel-active-background-color: black; }
|
||||
StIcon {
|
||||
color: $_osd_color;
|
||||
icon-shadow: 0 0 6px transparentize(black, .6);
|
||||
}
|
||||
}
|
||||
|
||||
.osd-window {
|
||||
.level {
|
||||
-barlevel-background-color: transparentize($_osd_color, if($variant=='light', 0.7, 0.9));
|
||||
-barlevel-active-background-color: $_osd_color;
|
||||
}
|
||||
}
|
||||
|
||||
/* Slider */
|
||||
/*
|
||||
.slider {
|
||||
height: 1.1em;
|
||||
-barlevel-height: .35em;
|
||||
-barlevel-background-color: #d9d9d9;
|
||||
-barlevel-border-color: #2777ff;
|
||||
-barlevel-active-background-color: #2777ff;
|
||||
-barlevel-overdrive-color: #d41919;
|
||||
-barlevel-background-color: $borders_color;
|
||||
-barlevel-border-color: $selected_bg_color;
|
||||
-barlevel-active-background-color: $selected_bg_color;
|
||||
-barlevel-overdrive-color: $destructive_color;
|
||||
-barlevel-overdrive-separator-width: 0.1em;
|
||||
-barlevel-border-width: 0;
|
||||
-slider-handle-radius: 0; }
|
||||
|
||||
-slider-handle-radius: 0;
|
||||
}
|
||||
|
||||
/* Check Boxes */
|
||||
.check-box StBin {
|
||||
background-image: url("assets/checkbox-off.svg"); }
|
||||
/*
|
||||
.check-box {
|
||||
StBin {
|
||||
background-image: if($variant == 'light', url("assets/checkbox-off.svg"),
|
||||
url("assets/checkbox-off-dark.svg"));
|
||||
}
|
||||
|
||||
.check-box:focus StBin {
|
||||
background-image: url("assets/checkbox-off-focused.svg"); }
|
||||
|
||||
.check-box:checked StBin {
|
||||
background-image: url("assets/checkbox.svg"); }
|
||||
|
||||
.check-box:focus:checked StBin {
|
||||
background-image: url("assets/checkbox-focused.svg"); }
|
||||
&:focus StBin { background-image: if($variant == 'light', url("assets/checkbox-off-focused.svg"),
|
||||
url("assets/checkbox-off-focused-dark.svg")); }
|
||||
&:checked StBin { background-image: if($variant == 'light', url("assets/checkbox.svg"),
|
||||
url("assets/checkbox-dark.svg")); }
|
||||
&:focus:checked StBin { background-image: if($variant == 'light', url("assets/checkbox-focused.svg"),
|
||||
url("assets/checkbox-focused-dark.svg")); }
|
||||
}
|
||||
|
||||
/* Switches */
|
||||
/*
|
||||
.toggle-switch {
|
||||
background-image: url("assets/toggle-off.svg"); }
|
||||
.toggle-switch:checked {
|
||||
background-image: url("assets/toggle-on.svg"); }
|
||||
background-image: if($variant == 'light', url("assets/toggle-off.svg"),
|
||||
url("assets/toggle-off-dark.svg"));
|
||||
&:checked {
|
||||
background-image: if($variant == 'light', url("assets/toggle-on.svg"),
|
||||
url("assets/toggle-on-dark.svg"));
|
||||
}
|
||||
}
|
||||
|
||||
.popup-menu-item.selected, .popup-menu-item:active {
|
||||
background-color: #eaebec;
|
||||
color: #5c616c; }
|
||||
// menu items
|
||||
.popup-menu-item {
|
||||
&.selected, &:active {
|
||||
background-color: $popover_hover_color;
|
||||
color: $fg_color;
|
||||
}
|
||||
}
|
||||
|
||||
/* App Switcher */
|
||||
.switcher-list .item-box:outlined {
|
||||
padding: 6px;
|
||||
border: 3px solid #2777ff; }
|
||||
/*
|
||||
// switcher onscreen panel
|
||||
.switcher-list {
|
||||
.item-box {
|
||||
&:outlined {
|
||||
padding: 6px;
|
||||
border: 3px solid $selected_bg_color;
|
||||
}
|
||||
|
||||
.switcher-list .item-box:selected {
|
||||
background-color: #2777ff;
|
||||
color: #ffffff;
|
||||
text-shadow: 0 1px 4px rgba(0, 0, 0, 0.4); }
|
||||
&:selected {
|
||||
background-color: $selected_bg_color;
|
||||
color: $selected_fg_color;
|
||||
text-shadow: 0 1px 4px transparentize(black, 0.6);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Workspace Switcher */
|
||||
.ws-switcher-box {
|
||||
border: none; }
|
||||
/*
|
||||
.ws-switcher-box { border: none }
|
||||
|
||||
.workspace-switcher-container {
|
||||
padding: 7px; }
|
||||
.workspace-switcher-container { padding: 7px; }
|
||||
|
||||
// active workspace in the switcher
|
||||
.ws-switcher-active-up,
|
||||
.ws-switcher-active-down,
|
||||
.ws-switcher-active-left,
|
||||
.ws-switcher-active-right {
|
||||
//box-shadow: 0 0px 6px transparentize(black, .5);
|
||||
}
|
||||
|
||||
/* Window Picker */
|
||||
.window-caption {
|
||||
@ -2647,222 +2685,158 @@ StScrollBar {
|
||||
color: transparent;
|
||||
transition-duration: 0s; }
|
||||
|
||||
/* Tiled window previews */
|
||||
.tile-preview-left.on-primary,
|
||||
.tile-preview-right.on-primary,
|
||||
.tile-preview-left.tile-preview-right.on-primary {
|
||||
border-radius: 0; }
|
||||
|
||||
/* TOP BAR */
|
||||
/*
|
||||
#panel {
|
||||
background: rgba(255, 255, 255, 0.8);
|
||||
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); }
|
||||
#panel .popup-menu-arrow {
|
||||
width: 0; }
|
||||
#panel StIcon {
|
||||
icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); }
|
||||
#panel.unlock-screen, #panel.login-screen, #panel.lock-screen, #panel:overview {
|
||||
background-color: transparent; }
|
||||
#panel.unlock-screen .panel-button, #panel.unlock-screen .panel-button:hover, #panel.unlock-screen .panel-button:active, #panel.unlock-screen .panel-button:focus, #panel.unlock-screen .panel-button:overview, #panel.unlock-screen .panel-button:checked, #panel.login-screen .panel-button, #panel.login-screen .panel-button:hover, #panel.login-screen .panel-button:active, #panel.login-screen .panel-button:focus, #panel.login-screen .panel-button:overview, #panel.login-screen .panel-button:checked, #panel.lock-screen .panel-button, #panel.lock-screen .panel-button:hover, #panel.lock-screen .panel-button:active, #panel.lock-screen .panel-button:focus, #panel.lock-screen .panel-button:overview, #panel.lock-screen .panel-button:checked, #panel:overview .panel-button, #panel:overview .panel-button:hover, #panel:overview .panel-button:active, #panel:overview .panel-button:focus, #panel:overview .panel-button:overview, #panel:overview .panel-button:checked {
|
||||
color: white; }
|
||||
#panel .panel-corner {
|
||||
-panel-corner-radius: 0; }
|
||||
#panel .panel-button {
|
||||
color: black; }
|
||||
#panel .panel-button:active, #panel .panel-button:focus, #panel .panel-button:overview, #panel .panel-button:checked {
|
||||
color: black;
|
||||
box-shadow: inset 0 0 0 100px white; }
|
||||
#panel .panel-button.clock-display:active, #panel .panel-button.clock-display:overview, #panel .panel-button.clock-display:focus, #panel .panel-button.clock-display:checked {
|
||||
box-shadow: none; }
|
||||
#panel .panel-button.clock-display:active .clock, #panel .panel-button.clock-display:overview .clock, #panel .panel-button.clock-display:focus .clock, #panel .panel-button.clock-display:checked .clock {
|
||||
box-shadow: inset 0 0 0 100px white; }
|
||||
#panel #panelActivities.panel-button {
|
||||
margin-left: .4em; }
|
||||
#panel #panelActivities.panel-button StLabel {
|
||||
background-image: url("assets/view-grid-symbolic.svg");
|
||||
$_panel_bg: transparentize($bg_color, .2);
|
||||
$_panel_fg: if($variant=='light', black, white);
|
||||
$_panel_text_shadow: 0 1px 2px transparentize(black, 0.5);
|
||||
background: $_panel_bg;
|
||||
text-shadow: $_panel_text_shadow;
|
||||
|
||||
.popup-menu-arrow { width: 0; }
|
||||
|
||||
StIcon { icon-shadow: $_panel_text_shadow; }
|
||||
|
||||
&.unlock-screen,
|
||||
&.login-screen,
|
||||
&.lock-screen,
|
||||
&:overview {
|
||||
background-color: transparent;
|
||||
.panel-button {
|
||||
&, &:hover, &:active, &:focus, &:overview, &:checked { color: white; }
|
||||
}
|
||||
}
|
||||
|
||||
.panel-corner { -panel-corner-radius: 0; }
|
||||
|
||||
.panel-button {
|
||||
color: $_panel_fg;
|
||||
&:active, &:focus, &:overview, &:checked {
|
||||
color: $_panel_fg;
|
||||
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, if($variant == 'light', 1, .2));
|
||||
}
|
||||
}
|
||||
|
||||
.panel-button.clock-display {
|
||||
// Move highlight from .panel-button to .clock
|
||||
&:active, &:overview, &:focus, &:checked {
|
||||
box-shadow: none;
|
||||
|
||||
.clock {
|
||||
box-shadow: inset 0 0 0 100px rgba(255, 255, 255, if($variant == 'light', 1, .2));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#panelActivities.panel-button {
|
||||
margin-left: .4em;
|
||||
StLabel {
|
||||
background-image: if($variant == 'light', url("assets/view-grid-symbolic.svg"),
|
||||
url("assets/view-grid-symbolic-dark.svg"));
|
||||
background-size: contain;
|
||||
width: 1.5em;
|
||||
height: 1.5em;
|
||||
color: transparent; }
|
||||
#panel #panelActivities.panel-button:overview StLabel {
|
||||
background-image: url("assets/view-grid-symbolic-dark.svg"); }
|
||||
color: transparent;
|
||||
}
|
||||
|
||||
&:overview StLabel {
|
||||
background-image: url("assets/view-grid-symbolic-dark.svg");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Date/Time Menu */
|
||||
#calendarArea {
|
||||
background-image: url("assets/kali-dragon.svg");
|
||||
background-size: contain; }
|
||||
/*
|
||||
@mixin notification_bubble($flat: false) {
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
border-radius: $base_border_radius + 2px;
|
||||
margin: $base_margin;
|
||||
|
||||
.events-section-title {
|
||||
padding: 1em; }
|
||||
@if $flat {
|
||||
@include button(undecorated);
|
||||
} @else {
|
||||
@include button(normal);
|
||||
}
|
||||
|
||||
&:focus {
|
||||
@include button(focus);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
@include button(hover);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
&:active {
|
||||
@include button(active);
|
||||
}
|
||||
}
|
||||
|
||||
// overall menu
|
||||
#calendarArea {
|
||||
background-image: if($variant == 'light', url("assets/kali-dragon.svg"),
|
||||
url("assets/kali-dragon-dark.svg"));
|
||||
background-size: contain;
|
||||
}
|
||||
|
||||
.events-section-title { padding: 1em; }
|
||||
|
||||
.datemenu-today-button {
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
border-radius: 10px;
|
||||
margin: 4px;
|
||||
background-color: transparent;
|
||||
background-color: none; }
|
||||
.datemenu-today-button:insensitive {
|
||||
color: rgba(92, 97, 108, 0.5);
|
||||
background-color: rgba(92, 97, 108, 0.05);
|
||||
background-color: transparent;
|
||||
color: rgba(255, 255, 255, 0.5); }
|
||||
.datemenu-today-button:focus {
|
||||
color: #5c616c;
|
||||
background-color: #e2eaf9;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6); }
|
||||
.datemenu-today-button:focus:hover {
|
||||
background-color: #e9f1ff;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); }
|
||||
.datemenu-today-button:focus:active {
|
||||
background-color: #e9f1ff;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); }
|
||||
.datemenu-today-button:hover {
|
||||
color: #5c616c;
|
||||
background-color: white;
|
||||
box-shadow: none; }
|
||||
.datemenu-today-button:active {
|
||||
color: #5c616c;
|
||||
background-color: white; }
|
||||
.datemenu-today-button .date-label {
|
||||
@include notification_bubble($flat: true);
|
||||
|
||||
.date-label {
|
||||
font-size: 1.5em;
|
||||
font-weight: 300; }
|
||||
font-weight: 300;
|
||||
}
|
||||
}
|
||||
|
||||
.calendar {
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
border-radius: 10px;
|
||||
margin: 4px;
|
||||
background-color: transparent;
|
||||
background-color: none; }
|
||||
.calendar:insensitive {
|
||||
color: rgba(92, 97, 108, 0.5);
|
||||
background-color: rgba(92, 97, 108, 0.05);
|
||||
background-color: transparent;
|
||||
color: rgba(255, 255, 255, 0.5); }
|
||||
.calendar:focus {
|
||||
color: #5c616c;
|
||||
background-color: #e2eaf9;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6); }
|
||||
.calendar:focus:hover {
|
||||
background-color: #e9f1ff;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); }
|
||||
.calendar:focus:active {
|
||||
background-color: #e9f1ff;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); }
|
||||
.calendar:hover {
|
||||
color: #5c616c;
|
||||
background-color: white;
|
||||
box-shadow: none; }
|
||||
.calendar:active {
|
||||
color: #5c616c;
|
||||
background-color: white; }
|
||||
.calendar .pager-button:hover, .calendar .pager-button:focus {
|
||||
background-color: #eaebec; }
|
||||
.calendar .calendar-day-base:hover, .calendar .calendar-day-base:focus, .calendar .calendar-day-base:active, .calendar .calendar-day-base:selected {
|
||||
color: #5c616c;
|
||||
background-color: #eaebec; }
|
||||
.calendar .calendar-today:hover, .calendar .calendar-today:focus {
|
||||
background-color: #eaebec;
|
||||
color: #5c616c; }
|
||||
.calendar .calendar-today:active, .calendar .calendar-today:selected {
|
||||
background: #2777ff;
|
||||
color: #ffffff; }
|
||||
.calendar .calendar-today:active:hover, .calendar .calendar-today:active:focus, .calendar .calendar-today:selected:hover, .calendar .calendar-today:selected:focus {
|
||||
background-color: #eaebec;
|
||||
color: #5c616c; }
|
||||
@include notification_bubble($flat: true);
|
||||
|
||||
.pager-button {
|
||||
&:hover, &:focus { background-color: $popover_hover_color }
|
||||
}
|
||||
|
||||
.calendar-day-base {
|
||||
&:hover, &:focus,
|
||||
&:active,&:selected {
|
||||
color: $fg_color;
|
||||
background-color: $popover_hover_color;
|
||||
}
|
||||
}
|
||||
|
||||
.calendar-today {
|
||||
&:hover,&:focus {
|
||||
background-color: $popover_hover_color;
|
||||
color: $fg_color;
|
||||
}
|
||||
&:active,&:selected {
|
||||
background: $selected_bg_color;
|
||||
color: $selected_fg_color;
|
||||
&:hover,&:focus {
|
||||
background-color: $popover_hover_color;
|
||||
color: $fg_color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Events */
|
||||
.events-button {
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
border-radius: 10px;
|
||||
margin: 4px;
|
||||
background-color: transparent;
|
||||
background-color: none; }
|
||||
.events-button:insensitive {
|
||||
color: rgba(92, 97, 108, 0.5);
|
||||
background-color: rgba(92, 97, 108, 0.05);
|
||||
background-color: transparent;
|
||||
color: rgba(255, 255, 255, 0.5); }
|
||||
.events-button:focus {
|
||||
color: #5c616c;
|
||||
background-color: #e2eaf9;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6); }
|
||||
.events-button:focus:hover {
|
||||
background-color: #e9f1ff;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); }
|
||||
.events-button:focus:active {
|
||||
background-color: #e9f1ff;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); }
|
||||
.events-button:hover {
|
||||
color: #5c616c;
|
||||
background-color: white;
|
||||
box-shadow: none; }
|
||||
.events-button:active {
|
||||
color: #5c616c;
|
||||
background-color: white; }
|
||||
/*
|
||||
.events-button { @include notification_bubble($flat: true); }
|
||||
|
||||
/* World clocks */
|
||||
/*
|
||||
.world-clocks-button {
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
border-radius: 10px;
|
||||
margin: 4px;
|
||||
background-color: transparent;
|
||||
background-color: none; }
|
||||
.world-clocks-button:insensitive {
|
||||
color: rgba(92, 97, 108, 0.5);
|
||||
background-color: rgba(92, 97, 108, 0.05);
|
||||
background-color: transparent;
|
||||
color: rgba(255, 255, 255, 0.5); }
|
||||
.world-clocks-button:focus {
|
||||
color: #5c616c;
|
||||
background-color: #e2eaf9;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6); }
|
||||
.world-clocks-button:focus:hover {
|
||||
background-color: #e9f1ff;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); }
|
||||
.world-clocks-button:focus:active {
|
||||
background-color: #e9f1ff;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); }
|
||||
.world-clocks-button:hover {
|
||||
color: #5c616c;
|
||||
background-color: white;
|
||||
box-shadow: none; }
|
||||
.world-clocks-button:active {
|
||||
color: #5c616c;
|
||||
background-color: white; }
|
||||
@include notification_bubble($flat: true);
|
||||
}
|
||||
|
||||
.weather-button {
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
border-radius: 10px;
|
||||
margin: 4px;
|
||||
background-color: transparent;
|
||||
background-color: none; }
|
||||
.weather-button:insensitive {
|
||||
color: rgba(92, 97, 108, 0.5);
|
||||
background-color: rgba(92, 97, 108, 0.05);
|
||||
background-color: transparent;
|
||||
color: rgba(255, 255, 255, 0.5); }
|
||||
.weather-button:focus {
|
||||
color: #5c616c;
|
||||
background-color: #e2eaf9;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6); }
|
||||
.weather-button:focus:hover {
|
||||
background-color: #e9f1ff;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); }
|
||||
.weather-button:focus:active {
|
||||
background-color: #e9f1ff;
|
||||
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.7); }
|
||||
.weather-button:hover {
|
||||
color: #5c616c;
|
||||
background-color: white;
|
||||
box-shadow: none; }
|
||||
.weather-button:active {
|
||||
color: #5c616c;
|
||||
background-color: white; }
|
||||
@include notification_bubble($flat: true);
|
||||
}
|
||||
|
||||
|
||||
/* Search */
|
||||
.search-entry {
|
||||
@ -2870,7 +2844,6 @@ StScrollBar {
|
||||
text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.9);
|
||||
font-weight: bold;
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
border-radius: 999px;
|
||||
font-size: 1.1em;
|
||||
transition-duration: 200ms; }
|
||||
.search-entry StLabel.hint-text {
|
||||
@ -2895,46 +2868,66 @@ StScrollBar {
|
||||
icon-shadow: 0px 1px 2px rgba(0, 0, 0, 0.9); }
|
||||
|
||||
.search-section-content {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
box-shadow: none;
|
||||
border: none; }
|
||||
background-color: rgba(255, 255, 255, 0.1); }
|
||||
|
||||
.search-provider-icon .list-search-provider-content .list-search-provider-details {
|
||||
font-weight: bold; }
|
||||
|
||||
/* DASHBOARD */
|
||||
/*
|
||||
#dash {
|
||||
color: white;
|
||||
color: $osd_fg_color;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
border-color: transparent; }
|
||||
#dash .overview-icon StIcon {
|
||||
border-color: transparent;
|
||||
|
||||
.overview-icon StIcon {
|
||||
color: white;
|
||||
icon-shadow: 0 2px 6px rgba(0, 0, 0, 0.4); }
|
||||
icon-shadow: 0 2px 6px transparentize(black, .6);
|
||||
}
|
||||
}
|
||||
|
||||
.dash-background {
|
||||
background: rgba(255, 255, 255, 0.1); }
|
||||
background: $overview_transparent_bg;
|
||||
//box-shadow: 0 2px 8px 0 transparentize(black, .2);
|
||||
}
|
||||
|
||||
.dash-separator {
|
||||
background: rgba(255, 255, 255, 0.1); }
|
||||
.dash-separator { background: $overview_transparent_bg; }
|
||||
|
||||
.show-apps:focus .overview-icon, .show-apps:checked .overview-icon {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
color: black; }
|
||||
.show-apps {
|
||||
&:focus,
|
||||
&:checked {
|
||||
.overview-icon {
|
||||
background-color: $overview_transparent_bg;
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* App Folders */
|
||||
.app-well-app.app-folder, .app-folder.grid-search-result, .app-well-app.app-folder .overview-icon.overview-icon-with-label, .app-folder.grid-search-result .overview-icon.overview-icon-with-label {
|
||||
background-color: rgba(255, 255, 255, 0.1); }
|
||||
/*
|
||||
.app-well-app.app-folder {
|
||||
&, & .overview-icon.overview-icon-with-label {
|
||||
background-color: $overview_transparent_bg
|
||||
}
|
||||
//box-shadow: 0 2px 5px black;
|
||||
|
||||
.app-well-app.app-folder:checked, .app-folder.grid-search-result:checked {
|
||||
background: black; }
|
||||
&:checked { background: black; }
|
||||
}
|
||||
|
||||
.app-folder-dialog {
|
||||
background: black;
|
||||
box-shadow: 0 0 20px #030303; }
|
||||
.app-folder-dialog .folder-name-container .edit-folder-button, .app-folder-dialog .folder-name-container .edit-folder-button:hover, .app-folder-dialog .folder-name-container .edit-folder-button:active {
|
||||
background: white;
|
||||
color: black; }
|
||||
box-shadow: 0 0 20px lighten(black, 1%);
|
||||
|
||||
.app-folder-dialog-container {
|
||||
width: 720px; }
|
||||
& .folder-name-container {
|
||||
& .edit-folder-button {
|
||||
&, &:hover, &:active {
|
||||
background: white;
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.app-folder-dialog-container { width: 720px; }
|
||||
*/
|
||||
|
||||
@ -2,6 +2,7 @@ $overview_transparent_bg: transparentize(white, .9);
|
||||
$dialog_box_shadow: 0 2px 8px 0 transparentize(black, .6);
|
||||
|
||||
/* OSD */
|
||||
/*
|
||||
$_osd_color: if($variant=='light', black, $fg_color);
|
||||
%osd_panel {
|
||||
font-weight: bold;
|
||||
@ -24,7 +25,7 @@ $_osd_color: if($variant=='light', black, $fg_color);
|
||||
}
|
||||
|
||||
/* Slider */
|
||||
|
||||
/*
|
||||
.slider {
|
||||
height: 1.1em;
|
||||
-barlevel-height: .35em;
|
||||
@ -39,7 +40,7 @@ $_osd_color: if($variant=='light', black, $fg_color);
|
||||
}
|
||||
|
||||
/* Check Boxes */
|
||||
|
||||
/*
|
||||
.check-box {
|
||||
StBin {
|
||||
background-image: if($variant == 'light', url("assets/checkbox-off.svg"),
|
||||
@ -55,6 +56,7 @@ $_osd_color: if($variant=='light', black, $fg_color);
|
||||
}
|
||||
|
||||
/* Switches */
|
||||
/*
|
||||
.toggle-switch {
|
||||
background-image: if($variant == 'light', url("assets/toggle-off.svg"),
|
||||
url("assets/toggle-off-dark.svg"));
|
||||
@ -73,6 +75,7 @@ $_osd_color: if($variant=='light', black, $fg_color);
|
||||
}
|
||||
|
||||
/* App Switcher */
|
||||
/*
|
||||
// switcher onscreen panel
|
||||
.switcher-list {
|
||||
.item-box {
|
||||
@ -90,6 +93,7 @@ $_osd_color: if($variant=='light', black, $fg_color);
|
||||
}
|
||||
|
||||
/* Workspace Switcher */
|
||||
/*
|
||||
.ws-switcher-box { border: none }
|
||||
|
||||
.workspace-switcher-container { padding: 7px; }
|
||||
@ -135,13 +139,8 @@ $_osd_color: if($variant=='light', black, $fg_color);
|
||||
}
|
||||
}
|
||||
|
||||
/* Tiled window previews */
|
||||
|
||||
.tile-preview-left.on-primary,
|
||||
.tile-preview-right.on-primary,
|
||||
.tile-preview-left.tile-preview-right.on-primary{ border-radius: 0; }
|
||||
|
||||
/* TOP BAR */
|
||||
/*
|
||||
#panel {
|
||||
$_panel_bg: transparentize($bg_color, .2);
|
||||
$_panel_fg: if($variant=='light', black, white);
|
||||
@ -203,6 +202,7 @@ $_osd_color: if($variant=='light', black, $fg_color);
|
||||
|
||||
/* Date/Time Menu */
|
||||
// notification styling
|
||||
/*
|
||||
@mixin notification_bubble($flat: false) {
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
@ -279,10 +279,11 @@ $_osd_color: if($variant=='light', black, $fg_color);
|
||||
}
|
||||
|
||||
/* Events */
|
||||
/*
|
||||
.events-button { @include notification_bubble($flat: true); }
|
||||
|
||||
/* World clocks */
|
||||
|
||||
/*
|
||||
.world-clocks-button {
|
||||
@include notification_bubble($flat: true);
|
||||
}
|
||||
@ -300,7 +301,6 @@ $_osd_color: if($variant=='light', black, $fg_color);
|
||||
text-shadow: 0px 1px 2px rgba(black, 0.9);
|
||||
font-weight: bold;
|
||||
background-color: $overview_transparent_bg;
|
||||
border-radius: 999px;
|
||||
font-size: 1.1em;
|
||||
transition-duration: 200ms;
|
||||
|
||||
@ -334,11 +334,7 @@ $_osd_color: if($variant=='light', black, $fg_color);
|
||||
}
|
||||
|
||||
// search results
|
||||
.search-section-content {
|
||||
background-color: $overview_transparent_bg;
|
||||
box-shadow: none;
|
||||
border: none;
|
||||
}
|
||||
.search-section-content { background-color: $overview_transparent_bg; }
|
||||
|
||||
// search result provider
|
||||
.search-provider-icon {
|
||||
@ -348,7 +344,7 @@ $_osd_color: if($variant=='light', black, $fg_color);
|
||||
}
|
||||
|
||||
/* DASHBOARD */
|
||||
|
||||
/*
|
||||
#dash {
|
||||
color: $osd_fg_color;
|
||||
background-color: transparent;
|
||||
@ -379,6 +375,7 @@ $_osd_color: if($variant=='light', black, $fg_color);
|
||||
}
|
||||
|
||||
/* App Folders */
|
||||
/*
|
||||
.app-well-app.app-folder {
|
||||
&, & .overview-icon.overview-icon-with-label {
|
||||
background-color: $overview_transparent_bg
|
||||
@ -403,3 +400,4 @@ $_osd_color: if($variant=='light', black, $fg_color);
|
||||
}
|
||||
|
||||
.app-folder-dialog-container { width: 720px; }
|
||||
*/
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user