update
vinceliuice
3 years ago
parent
7b025255d3
commit
907112aaaf
@ -1,267 +0,0 @@
|
||||
//
|
||||
// Dash to Dock
|
||||
//
|
||||
|
||||
$icon_padding: 9px;
|
||||
|
||||
#dashtodockContainer {
|
||||
background: transparent;
|
||||
|
||||
#dash,
|
||||
&:overview #dash,
|
||||
&.extended #dash,
|
||||
&.extended:overview #dash {
|
||||
padding: 0;
|
||||
border: none;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@each $_dock, $_radius in (top, 16px 16px 16px 16px),
|
||||
(bottom, 16px 16px 16px 16px),
|
||||
(left, 16px 16px 16px 16px),
|
||||
(right, 16px 16px 16px 16px) {
|
||||
&.#{$_dock} #dash,
|
||||
&.#{$_dock}:overview #dash { border-radius: #{$_radius}; }
|
||||
|
||||
&.#{$_dock}.extended #dash,
|
||||
&.#{$_dock}.extended:overview #dash { border-radius: #{$_radius}; }
|
||||
}
|
||||
|
||||
#dash { // default-mode
|
||||
background-color: $panel_bg_color;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
&.opaque #dash { // solid-mode
|
||||
background-color: $panel_bg;
|
||||
}
|
||||
|
||||
&.transparent #dash { // translucent-mode
|
||||
background-color: $panel_bg_color; // does not work
|
||||
}
|
||||
|
||||
&:overview #dash { // overview-mode #1
|
||||
background-color: $panel_bg_color;
|
||||
}
|
||||
|
||||
&.opaque:overview,
|
||||
&.transparent:overview { // overview-mode #2
|
||||
#dash {
|
||||
background-color: transparent !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
&.extended:overview, // overview-mode #3
|
||||
&.opaque.extended:overview,
|
||||
&.transparent.extended:overview {
|
||||
#dash {
|
||||
background-color: $panel_bg_color;
|
||||
}
|
||||
}
|
||||
|
||||
.app-well-app,
|
||||
.show-apps {
|
||||
.overview-icon {
|
||||
padding: $icon_padding;
|
||||
background-size: contain;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//
|
||||
// Dash to Panel
|
||||
//
|
||||
|
||||
$dash_to_panel_item_radius: 5px;
|
||||
|
||||
.dashtopanelMainPanel {
|
||||
border-radius: 0 !important;
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
|
||||
.dash-background {
|
||||
background-color: $panel_bg_color;
|
||||
margin-bottom: 0 !important;
|
||||
padding: 0 !important;
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
|
||||
.show-apps .overview-icon {
|
||||
margin: 0 !important;
|
||||
border-radius: $dash_to_panel_item_radius !important;
|
||||
}
|
||||
|
||||
.panel-button {
|
||||
&, &.clock-display .clock {
|
||||
border-radius: $dash_to_panel_item_radius + $container_padding / 2 !important;
|
||||
margin: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button,
|
||||
Gjs_arcmenu_arcmenu_com_menuButton_ArcMenu_MenuButton.panel-button {
|
||||
border-radius: $dash_to_panel_item_radius !important;
|
||||
|
||||
> * {
|
||||
padding: 8px 6px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.popup-menu.panel-menu, .popup-menu.panel-menu.quick-settings {
|
||||
.popup-menu-content {
|
||||
margin-bottom: $container_padding / 2 !important;
|
||||
}
|
||||
}
|
||||
|
||||
$dash_to_panel_menu_radius: 12px;
|
||||
|
||||
.dashtopanelSecondaryMenu {
|
||||
border-radius: $dash_to_panel_menu_radius !important;
|
||||
}
|
||||
|
||||
#preview-menu {
|
||||
margin: $container_padding !important;
|
||||
box-shadow: 0 3px 8px rgba(black, 0.2) !important;
|
||||
border-radius: $dash_to_panel_menu_radius !important;
|
||||
padding: 0 !important;
|
||||
|
||||
// .preview-header-box {
|
||||
// border-radius: $dash_to_panel_item_radius !important;
|
||||
// }
|
||||
}
|
||||
|
||||
#dashtopanelPreviewScrollview {
|
||||
padding: $dash_to_panel_menu_radius 0 !important;
|
||||
border-radius: $dash_to_panel_menu_radius !important;
|
||||
}
|
||||
|
||||
//
|
||||
// Simple Dock
|
||||
//
|
||||
|
||||
#dash:desktop {
|
||||
background-color: $panel_bg_color;
|
||||
}
|
||||
|
||||
//
|
||||
// OpenWeather
|
||||
//
|
||||
|
||||
.openweather {
|
||||
&-button,
|
||||
&-button-action,
|
||||
&-menu-button-container,
|
||||
&-button-box {
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
&-provider {
|
||||
// generic text buttons are allocated with y-expand-ed
|
||||
padding: 0 16px;
|
||||
font-weight: 500;
|
||||
@include button(flat-normal);
|
||||
&:hover { @include button(flat-hover); }
|
||||
&:focus { @include button(flat-focus); }
|
||||
&:active { @include button(flat-active); }
|
||||
&:insensitive { @include button(flat-disabled); }
|
||||
}
|
||||
|
||||
&-current {
|
||||
&-icon,
|
||||
&-summary,
|
||||
&-summarybox {
|
||||
background: none;
|
||||
color: $fg_color;
|
||||
}
|
||||
|
||||
&-databox-values {
|
||||
background: none;
|
||||
color: $hint_fg_color;
|
||||
}
|
||||
|
||||
&-databox-captions {
|
||||
background: none;
|
||||
color: $hint_fg_color;
|
||||
}
|
||||
}
|
||||
|
||||
&-forecast {
|
||||
&-icon,
|
||||
&-summary {
|
||||
background: none;
|
||||
color: $secondary_fg_color;
|
||||
}
|
||||
|
||||
&-day,
|
||||
&-temperature {
|
||||
background: none;
|
||||
color: $hint_fg_color;
|
||||
}
|
||||
}
|
||||
|
||||
&-sunrise-icon,
|
||||
&-sunset-icon,
|
||||
&-build-icon { color: $secondary_fg_color; }
|
||||
}
|
||||
|
||||
//
|
||||
// GPaste
|
||||
//
|
||||
|
||||
.popup-menu {
|
||||
.search-entry {
|
||||
color: $fg_color;
|
||||
selection-background-color: $primary_color;
|
||||
selected-color: $inverse_fg_color;
|
||||
@include entry(normal);
|
||||
|
||||
&:focus {
|
||||
@include entry(focus);
|
||||
color: $fg_color;
|
||||
}
|
||||
|
||||
.search-entry-icon { color: $hint_fg_color; }
|
||||
|
||||
&:hover, &:focus {
|
||||
.search-entry-icon { color: $fg_color; }
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//
|
||||
// Pop_OS cosmic widget styling
|
||||
//
|
||||
|
||||
.cosmic-solid-bg {
|
||||
background-color: $system_bg_color;
|
||||
}
|
||||
|
||||
.cosmic-dock {
|
||||
#dock {
|
||||
background-color: transparent;
|
||||
|
||||
.dash-background {
|
||||
background-color: $panel_bg_color;
|
||||
}
|
||||
}
|
||||
|
||||
&.extended {
|
||||
#dash {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
padding: 0 0;
|
||||
|
||||
.dash-background {
|
||||
border-radius: 0;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,477 +0,0 @@
|
||||
//
|
||||
// Dash to Dock
|
||||
//
|
||||
|
||||
// Scrollview style
|
||||
.bottom #dashtodockDashScrollview,
|
||||
.top #dashtodockDashScrollview {
|
||||
-st-hfade-offset: 24px;
|
||||
}
|
||||
|
||||
.left #dashtodockDashScrollview,
|
||||
.right #dashtodockDashScrollview {
|
||||
-st-vfade-offset: 24px;
|
||||
}
|
||||
|
||||
#dashtodockContainer {
|
||||
background: transparent;
|
||||
|
||||
.number-overlay {
|
||||
color: white;
|
||||
background-color: rgba(black, 0.75);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.notification-badge {
|
||||
color: $light_fg_color;
|
||||
background-color: $primary_color;
|
||||
box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.25);
|
||||
border-radius: $circular_radius;
|
||||
margin: 2px 3px 5px;
|
||||
padding: 0.2em 0.6em;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@each $_pos, $b_pos in (top, bottom),
|
||||
(bottom, top),
|
||||
(left, right),
|
||||
(right, left) {
|
||||
&.#{$_pos} #dash .dash-background {
|
||||
border-radius: $dash_border_radius !important;
|
||||
}
|
||||
|
||||
&.#{$_pos}.straight-corner,
|
||||
&.#{$_pos}.shrink.straight-corner,
|
||||
&.#{$_pos}.extended,
|
||||
&.#{$_pos}.shrink.extended {
|
||||
#dash {
|
||||
margin: 0 !important;
|
||||
margin-top: 0 !important;
|
||||
padding: 0 !important;
|
||||
|
||||
.dash-background {
|
||||
margin: 0 !important;
|
||||
margin-bottom: 0 !important;
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
|
||||
.dash-item-container .app-well-app, .show-apps {
|
||||
margin: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.extended,
|
||||
&.straight-corner {
|
||||
.dash-background {
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
&.shrink {
|
||||
.dash-background {
|
||||
padding: $dash_spacing !important;
|
||||
// border-radius: $buttons_radius + $container_padding / 2;
|
||||
}
|
||||
|
||||
.dash-item-container .app-well-app, .show-apps {
|
||||
margin: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
&.shrink.extended {
|
||||
.dash-background {
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
#dash,
|
||||
&:overview #dash {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
&.left,
|
||||
&.right {
|
||||
.dash-item-container .app-well-app, .show-apps {
|
||||
padding: $dash_spacing $container_padding !important;
|
||||
}
|
||||
|
||||
.dash-background {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
|
||||
&.shrink, &.shrink.extended {
|
||||
.dash-background {
|
||||
padding: $container_margin / 2 $container_margin !important;
|
||||
}
|
||||
|
||||
.dash-item-container .app-well-app, .show-apps {
|
||||
margin: 0 !important;
|
||||
padding: $container_margin / 2 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
&.extended,
|
||||
&.straight-corner {
|
||||
.dash-item-container .app-well-app {
|
||||
padding: $dash_spacing $dash_padding !important;
|
||||
}
|
||||
|
||||
.show-apps {
|
||||
padding: $dash_spacing $dash_padding $dash_padding * 2 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.top,
|
||||
&.bottom {
|
||||
.dash-background {
|
||||
padding: $dash_padding ($dash_padding - $dash_spacing) !important;
|
||||
}
|
||||
|
||||
&.shrink {
|
||||
.dash-background {
|
||||
padding: $container_margin $container_margin / 2 !important;
|
||||
}
|
||||
|
||||
.dash-item-container .app-well-app, .show-apps {
|
||||
margin: 0 !important;
|
||||
padding: 0 $container_margin / 2 $dash_padding !important;
|
||||
}
|
||||
}
|
||||
|
||||
&.extended,
|
||||
&.straight-corner {
|
||||
.dash-separator {
|
||||
margin: 0 ($dash_spacing + ($dash_padding / 2)) !important;
|
||||
}
|
||||
|
||||
.dash-item-container .app-well-app, .show-apps {
|
||||
padding: $dash_padding $dash_spacing !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#dash {
|
||||
.dash-background {
|
||||
background-color: $panel_bg_color;
|
||||
}
|
||||
|
||||
.app-well-app-running-dot {
|
||||
margin-bottom: 3px !important;
|
||||
}
|
||||
|
||||
StWidget.focused .app-well-app-running-dot {
|
||||
background-color: $primary_color;
|
||||
}
|
||||
}
|
||||
|
||||
&.opaque #dash .dash-background { // solid-mode
|
||||
background-color: $panel_bg;
|
||||
}
|
||||
|
||||
&.transparent #dash .dash-background { // translucent-mode
|
||||
background-color: $panel_bg_color; // does not work
|
||||
}
|
||||
|
||||
&:overview #dash { // overview-mode #1
|
||||
background: none;
|
||||
|
||||
.dash-background {
|
||||
background-color: $inverse_divider_color;
|
||||
}
|
||||
|
||||
StWidget.focused .app-well-app-running-dot {
|
||||
background-color: $primary_color;
|
||||
}
|
||||
}
|
||||
|
||||
&.opaque:overview,
|
||||
&.transparent:overview { // overview-mode #2
|
||||
#dash {
|
||||
background-color: transparent !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.dash-background {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
}
|
||||
|
||||
&.extended:overview, // overview-mode #3
|
||||
&.opaque.extended:overview,
|
||||
&.transparent.extended:overview {
|
||||
#dash {
|
||||
background: none;
|
||||
}
|
||||
}
|
||||
|
||||
&.running-dots,
|
||||
&.dashtodock {
|
||||
.dash-item-container > StButton {
|
||||
transition-duration: 250ms;
|
||||
background-size: contain;
|
||||
}
|
||||
}
|
||||
|
||||
&.shrink,
|
||||
&.dashtodock {
|
||||
.dash-item-container > StButton {
|
||||
padding: 1px 2px;
|
||||
}
|
||||
}
|
||||
|
||||
&.extended,
|
||||
&.extended:overview {
|
||||
.app-well-app,
|
||||
.show-apps {
|
||||
.overview-icon {
|
||||
border-radius: $buttons_radius;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.metro .overview-icon {
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.dashtodock-app-well-preview-menu-item {
|
||||
padding: 1em 1em 0.5em 1em;
|
||||
}
|
||||
|
||||
#dashtodockPreviewSeparator.popup-separator-menu-item-horizontal {
|
||||
width: 1px;
|
||||
height: auto;
|
||||
border-right-width: 1px;
|
||||
margin: 32px 0;
|
||||
}
|
||||
|
||||
//
|
||||
// Dash to Panel
|
||||
//
|
||||
|
||||
$dash_to_panel_item_radius: 5px;
|
||||
|
||||
.dashtopanelMainPanel {
|
||||
border-radius: 0 !important;
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
|
||||
.dash-background {
|
||||
background-color: $dash_background_color;
|
||||
margin-bottom: 0 !important;
|
||||
padding: 0 !important;
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
|
||||
.show-apps .overview-icon {
|
||||
margin: 0 !important;
|
||||
border-radius: $dash_to_panel_item_radius !important;
|
||||
}
|
||||
|
||||
.panel-button {
|
||||
&, &.clock-display .clock {
|
||||
border-radius: $dash_to_panel_item_radius + $container_padding / 2 !important;
|
||||
margin: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
Gjs_arcmenu_arcmenu_com_menuButton_Arc_Menu_MenuButton.panel-button,
|
||||
Gjs_arcmenu_arcmenu_com_menuButton_ArcMenu_MenuButton.panel-button {
|
||||
border-radius: $dash_to_panel_item_radius !important;
|
||||
|
||||
> * {
|
||||
padding: 8px 6px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.popup-menu.panel-menu, .popup-menu.panel-menu.quick-settings {
|
||||
.popup-menu-content {
|
||||
margin-bottom: $container_padding / 2 !important;
|
||||
}
|
||||
}
|
||||
|
||||
$dash_to_panel_menu_radius: 12px;
|
||||
|
||||
.dashtopanelSecondaryMenu {
|
||||
border-radius: $dash_to_panel_menu_radius !important;
|
||||
}
|
||||
|
||||
#preview-menu {
|
||||
margin: $container_padding !important;
|
||||
box-shadow: 0 3px 8px rgba(black, 0.2) !important;
|
||||
border-radius: $dash_to_panel_menu_radius !important;
|
||||
padding: 0 !important;
|
||||
|
||||
// .preview-header-box {
|
||||
// border-radius: $dash_to_panel_item_radius !important;
|
||||
// }
|
||||
}
|
||||
|
||||
#dashtopanelPreviewScrollview {
|
||||
padding: $dash_to_panel_menu_radius 0 !important;
|
||||
border-radius: $dash_to_panel_menu_radius !important;
|
||||
}
|
||||
|
||||
//
|
||||
// OpenWeather
|
||||
//
|
||||
|
||||
.openweather {
|
||||
&-button,
|
||||
&-button-action,
|
||||
&-menu-button-container,
|
||||
&-button-box {
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
&-provider {
|
||||
// generic text buttons are allocated with y-expand-ed
|
||||
padding: 0 16px;
|
||||
font-weight: 500;
|
||||
@include button(flat-normal);
|
||||
&:hover { @include button(flat-hover); }
|
||||
&:focus { @include button(flat-focus); }
|
||||
&:active { @include button(flat-active); }
|
||||
&:insensitive { @include button(flat-disabled); }
|
||||
}
|
||||
|
||||
&-current {
|
||||
&-icon,
|
||||
&-summary,
|
||||
&-summarybox {
|
||||
background: none;
|
||||
color: $fg_color;
|
||||
}
|
||||
|
||||
&-databox-values {
|
||||
background: none;
|
||||
color: $hint_fg_color;
|
||||
}
|
||||
|
||||
&-databox-captions {
|
||||
background: none;
|
||||
color: $hint_fg_color;
|
||||
}
|
||||
}
|
||||
|
||||
&-forecast {
|
||||
&-icon,
|
||||
&-summary {
|
||||
background: none;
|
||||
color: $secondary_fg_color;
|
||||
}
|
||||
|
||||
&-day,
|
||||
&-temperature {
|
||||
background: none;
|
||||
color: $hint_fg_color;
|
||||
}
|
||||
}
|
||||
|
||||
&-sunrise-icon,
|
||||
&-sunset-icon,
|
||||
&-build-icon { color: $secondary_fg_color; }
|
||||
}
|
||||
|
||||
.popup-sub-menu .openweather {
|
||||
&-current {
|
||||
&-icon,
|
||||
&-summary,
|
||||
&-summarybox {
|
||||
background: none;
|
||||
color: rgba(black, 0.95);
|
||||
}
|
||||
|
||||
&-databox-values {
|
||||
color: rgba(black, 0.75);
|
||||
}
|
||||
|
||||
&-databox-captions {
|
||||
color: rgba(black, 0.75);
|
||||
}
|
||||
}
|
||||
|
||||
&-forecast {
|
||||
&-icon,
|
||||
&-summary {
|
||||
color: rgba(black, 0.85);
|
||||
}
|
||||
|
||||
&-day,
|
||||
&-temperature {
|
||||
color: rgba(black, 0.75);
|
||||
}
|
||||
}
|
||||
|
||||
&-sunrise-icon,
|
||||
&-sunset-icon,
|
||||
&-build-icon { color: rgba(black, 0.85); }
|
||||
}
|
||||
|
||||
//
|
||||
// Arcmenu
|
||||
//
|
||||
.arcmenu-menu-button,
|
||||
.arcmenu-button {
|
||||
border-width: 0 !important;
|
||||
border-radius: $circular_radius !important;
|
||||
}
|
||||
|
||||
//
|
||||
// Pop_OS cosmic widget styling
|
||||
//
|
||||
|
||||
.cosmic-solid-bg {
|
||||
background-color: $system_bg_color;
|
||||
}
|
||||
|
||||
.cosmic-dock {
|
||||
#dock {
|
||||
background-color: transparent;
|
||||
|
||||
.dash-background {
|
||||
background-color: $panel_bg_color;
|
||||
}
|
||||
}
|
||||
|
||||
&.extended {
|
||||
#dash {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
padding: 0 0;
|
||||
|
||||
.dash-background {
|
||||
border-radius: 0;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//
|
||||
// Blur my shell
|
||||
//
|
||||
|
||||
.overview-components-transparent .search-entry,
|
||||
.overview-components-light .search-entry,
|
||||
.overview-components-dark .search-entry {
|
||||
caret-color: rgba(white, 0.75) !important;
|
||||
|
||||
.search-entry-icon {
|
||||
color: rgba(white, 0.65);
|
||||
}
|
||||
|
||||
StLabel.hint-text {
|
||||
color: rgba(white, 0.35) !important;
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue