update css
This commit is contained in:
3 files changed
+109
-102
No files matched your search
+8
-12
@@ -3,14 +3,14 @@
|
||||
}
|
||||
|
||||
#bar.start-container {
|
||||
padding-top: 4px;
|
||||
padding-bottom: 4px;
|
||||
padding-top: 2px;
|
||||
padding-bottom: 2px;
|
||||
border-bottom-right-radius: 15px;
|
||||
}
|
||||
|
||||
#bar.end-container {
|
||||
padding-top: 4px;
|
||||
padding-bottom: 4px;
|
||||
padding-top: 2px;
|
||||
padding-bottom: 2px;
|
||||
border-bottom-left-radius: 15px;
|
||||
}
|
||||
|
||||
@@ -25,15 +25,11 @@
|
||||
|
||||
#bar.hidden {
|
||||
opacity: 0;
|
||||
padding: 3px;
|
||||
margin-bottom: -52px;
|
||||
transition: all 0.5s cubic-bezier(0.5, 0.25, 0, 1);
|
||||
}
|
||||
|
||||
#bar.visible {
|
||||
opacity: 1;
|
||||
padding: 3px;
|
||||
margin-bottom: 0px;
|
||||
transition: all 0.5s cubic-bezier(0.5, 0.25, 0, 1);
|
||||
}
|
||||
|
||||
@@ -54,7 +50,7 @@
|
||||
|
||||
#button-bar-label {
|
||||
color: @primary;
|
||||
font-size: 24px;
|
||||
font-size: 20px;
|
||||
border-radius: 8px;
|
||||
transition: all 0.1s ease;
|
||||
}
|
||||
@@ -99,7 +95,7 @@
|
||||
#updated-icon {
|
||||
color: @primary;
|
||||
font-size: 20px;
|
||||
padding: 8px;
|
||||
padding: 4px;
|
||||
border-radius: 99px;
|
||||
transition: all 0.1s ease;
|
||||
}
|
||||
@@ -172,7 +168,7 @@
|
||||
#battery-balanced-label,
|
||||
#battery-performance-label {
|
||||
color: @outline;
|
||||
font-size: 24px;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
#battery-save:hover,
|
||||
@@ -317,7 +313,7 @@ menu > menuitem:hover > label {
|
||||
}
|
||||
|
||||
#system-indicator-icon {
|
||||
font-size: 24px;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
/*
|
||||
|
||||
+35
-41
@@ -6,10 +6,10 @@
|
||||
@import "./dashboard.css";
|
||||
|
||||
* {
|
||||
all: unset;
|
||||
color: @foreground;
|
||||
font-size: 16px;
|
||||
font-family: "Product Sans", sans-serif;
|
||||
all: unset;
|
||||
color: @foreground;
|
||||
font-size: 16px;
|
||||
font-family: "Product Sans", sans-serif;
|
||||
}
|
||||
|
||||
/*
|
||||
@@ -17,66 +17,60 @@
|
||||
*/
|
||||
|
||||
tooltip {
|
||||
background-color: @surfaceContainer;
|
||||
border-radius: 10px;
|
||||
padding: 6px 10px;
|
||||
outline: none;
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
animation: tooltipShow 0.25s cubic-bezier(0.5, 0.25, 0, 1);
|
||||
}
|
||||
|
||||
tooltip label {
|
||||
color: @onSurface;
|
||||
outline: none;
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
font-weight: normal;
|
||||
border: solid 1px;
|
||||
border-radius: 10px;
|
||||
border-color: @surface;
|
||||
background-color: @shadow;
|
||||
animation: tooltipShow 0.25s cubic-bezier(0.5, 0.25, 0, 1);
|
||||
}
|
||||
|
||||
@keyframes tooltipShow {
|
||||
from {
|
||||
opacity: 0;
|
||||
}
|
||||
from {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
tooltip > * {
|
||||
padding: 6px 10px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
/*
|
||||
* ── dock ──────────────────────────────────────────────────────────────
|
||||
*/
|
||||
#dock-icon {
|
||||
padding: 0px 2px 0px 2px;
|
||||
padding: 0px 2px 0px 2px;
|
||||
}
|
||||
|
||||
#dock {
|
||||
padding: 10px;
|
||||
background-color: alpha(@background, 0.8);
|
||||
box-shadow: inset 0 -0.5px 0 0.5px alpha(@outlineVariant, 0.4);
|
||||
border: 0.5px solid alpha(@outlineVariant, 0.4);
|
||||
border-radius: 12px;
|
||||
margin-bottom: 2px;
|
||||
padding: 10px;
|
||||
background-color: alpha(@shadow, 0.5);
|
||||
border: 0.5px solid alpha(@outlineVariant, 0.4);
|
||||
border-radius: 12px;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
|
||||
#dock-separator {
|
||||
border-right: 1px solid alpha(@foreground, 0.3);
|
||||
border-right: 1px solid alpha(@foreground, 0.5);
|
||||
}
|
||||
|
||||
#dock-app-button {
|
||||
padding: 2px;
|
||||
margin-left: 2px;
|
||||
margin-right: 2px;
|
||||
border-radius: 12px;
|
||||
padding: 2px;
|
||||
margin-left: 2px;
|
||||
margin-right: 2px;
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
.show-dock {
|
||||
opacity: 1;
|
||||
margin: 0;
|
||||
opacity: 1;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.hide-dock {
|
||||
opacity: 1;
|
||||
margin: -80px;
|
||||
opacity: 1;
|
||||
margin: -80px;
|
||||
}
|
||||
+66
-49
@@ -1,63 +1,80 @@
|
||||
#notification {
|
||||
padding: 16px;
|
||||
border: solid 1px @outlineVariant;
|
||||
#notification-action-buttons button.start-action {
|
||||
border-radius: 20px;
|
||||
margin-bottom: 12px;
|
||||
background-color: @surfaceContainerLow;
|
||||
min-width: 350px;
|
||||
}
|
||||
|
||||
.notification-header .summary {
|
||||
font-size: 0.92rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.notification-body .body {
|
||||
color: darker(@foreground);
|
||||
font-weight: 600;
|
||||
font-size: 0.92rem;
|
||||
}
|
||||
|
||||
#notification .close-button {
|
||||
border-radius: 100px;
|
||||
min-width: 40px;
|
||||
min-height: 40px;
|
||||
}
|
||||
|
||||
#notification .close-button:hover {
|
||||
background: alpha(@foreground, 0.2);
|
||||
transition: background 0.15s ease-in-out;
|
||||
border-radius: 100px;
|
||||
}
|
||||
|
||||
#notification-action-button button.start-action {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
#notification-action-button button.end-action {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
#notification-action-buttons button {
|
||||
padding: 0.6rem;
|
||||
font-weight: 600;
|
||||
border-radius: 100px;
|
||||
background-color: transparent;
|
||||
background-color: @surfaceContainer;
|
||||
padding: 8px;
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
#notification-action-buttons button:hover {
|
||||
background-color: lighter(@outlineVariant);
|
||||
background-color: @surfaceBright;
|
||||
}
|
||||
|
||||
#notification-icon {
|
||||
margin-right: 5px;
|
||||
#notification-action-buttons button:active {
|
||||
background-color: @primary;
|
||||
}
|
||||
|
||||
.image {
|
||||
border-radius: 30px;
|
||||
#notification-action-buttons button:active #button-label {
|
||||
color: @shadow;
|
||||
}
|
||||
|
||||
#notification-circular-progress-bar {
|
||||
border: solid 0px @outlineVariant;
|
||||
color: transparent;
|
||||
#notification-image image {
|
||||
border-radius: 16px;
|
||||
color: @onSurface;
|
||||
}
|
||||
|
||||
#notification-summary,
|
||||
#button-label {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#notification-summary {
|
||||
font-weight: bold;
|
||||
color: @primary;
|
||||
}
|
||||
|
||||
#notification-app-name {
|
||||
color: @outline;
|
||||
}
|
||||
|
||||
#action-button {
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
#notification-box {
|
||||
border-radius: 20px;
|
||||
padding: 16px;
|
||||
background-color: @surfaceContainerLow;
|
||||
margin: 4px;
|
||||
min-width: 336px;
|
||||
}
|
||||
|
||||
#boxed-notification-revealer {
|
||||
margin-top: -14px;
|
||||
}
|
||||
|
||||
#notif-close-button {
|
||||
background-color: @surface;
|
||||
border-radius: 16px;
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
#notif-close-button:hover,
|
||||
#notif-close-button:focus {
|
||||
background-color: @surfaceBright;
|
||||
}
|
||||
|
||||
#notif-close-button:active {
|
||||
background-color: @error;
|
||||
}
|
||||
|
||||
#notif-close-label {
|
||||
color: @error;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
#notif-close-button:active #notif-close-label {
|
||||
color: @shadow;
|
||||
}
|
||||
Reference in new issue
Block a user