feat(update): huge changes
This commit is contained in:
98 files changed
+9636
-5575
No files matched your search
+479
-242
@@ -7,8 +7,8 @@
|
||||
|
||||
#launcher {
|
||||
margin: 18px;
|
||||
border: 1px solid @outlineVariant;
|
||||
background-color: lighter(@background);
|
||||
border: 1px solid var(--outline-variant);
|
||||
background-color: var(--surface);
|
||||
border-radius: 24px;
|
||||
padding: 18px;
|
||||
transition: all 0.5s cubic-bezier(0.5, 0.25, 0, 1);
|
||||
@@ -19,7 +19,7 @@
|
||||
border-radius: 11px;
|
||||
padding: 10px;
|
||||
margin: 12px;
|
||||
box-shadow: inset 0 0 0 1px @outlineVariant;
|
||||
box-shadow: inset 0 0 0 1px var(--outline-variant);
|
||||
}
|
||||
|
||||
#launcher-content.wallpapers {
|
||||
@@ -28,11 +28,6 @@
|
||||
min-width: 620px;
|
||||
}
|
||||
|
||||
.cliphist {
|
||||
min-height: 464px;
|
||||
min-width: 300px;
|
||||
}
|
||||
|
||||
.applauncher-scrolled-window {
|
||||
transition: min-height 0.2s ease;
|
||||
}
|
||||
@@ -45,9 +40,8 @@
|
||||
min-height: 464px;
|
||||
}
|
||||
|
||||
#launcher-content.todo {
|
||||
min-width: 460px;
|
||||
min-height: 300px;
|
||||
#launcher-content.tools {
|
||||
min-width: 308px;
|
||||
}
|
||||
|
||||
#launcher-content.calendar {
|
||||
@@ -59,20 +53,24 @@
|
||||
min-width: 485px;
|
||||
}
|
||||
|
||||
#app-launcher,
|
||||
#wallpapers,
|
||||
#todo,
|
||||
#bluetooth,
|
||||
#sh,
|
||||
#cliphist,
|
||||
#emoji,
|
||||
#power {
|
||||
transition: all 0.25s cubic-bezier(0.5, 0.25, 0, 1);
|
||||
#launcher-content.power {
|
||||
min-width: 200px;
|
||||
min-height: 52px;
|
||||
}
|
||||
|
||||
#launcher-content.kanban {
|
||||
min-width: 1000px;
|
||||
min-height: 478px;
|
||||
}
|
||||
|
||||
#launcher-content.tmux {
|
||||
min-height: 220px;
|
||||
min-width: 480px;
|
||||
}
|
||||
|
||||
#scrolled-window scrollbar {
|
||||
border-radius: 10px;
|
||||
background-color: lighter(@background);
|
||||
background-color: var(--surface);
|
||||
padding: 4px;
|
||||
margin-left: 6px;
|
||||
}
|
||||
@@ -81,85 +79,161 @@
|
||||
border-radius: 8px;
|
||||
min-width: 10px;
|
||||
min-height: 48px;
|
||||
background-color: @primary;
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
#config-button:active,
|
||||
#new-session-button:active {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
#config-label,
|
||||
#clear-label,
|
||||
#new-session-label {
|
||||
color: var(--primary);
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
#config-button:active #config-label,
|
||||
#clear-button:active
|
||||
#clear-label
|
||||
#new-session-button:active
|
||||
#new-session-label {
|
||||
color: var(--shadow);
|
||||
}
|
||||
|
||||
#config-button,
|
||||
#clear-button,
|
||||
#new-session-button {
|
||||
background-color: var(--surface-variant);
|
||||
border-radius: 16px;
|
||||
padding: 8px;
|
||||
margin-bottom: 12px;
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
#config-button:hover,
|
||||
#config-button:focus,
|
||||
#clear-button:hover,
|
||||
#clear-button:focus,
|
||||
#new-session-button:hover,
|
||||
#new-session-button:focus {
|
||||
background-color: var(--surface-bright);
|
||||
}
|
||||
|
||||
#clear-button:active {
|
||||
background-color: var(--red-dim);
|
||||
}
|
||||
|
||||
/*
|
||||
* ── applauncher ───────────────────────────────────────────────────────
|
||||
*/
|
||||
#app-desc {
|
||||
color: var(--outline);
|
||||
font-size: 12px;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
#launcher-app {
|
||||
#slot-button {
|
||||
border-radius: 16px;
|
||||
padding: 16px;
|
||||
min-height: 0;
|
||||
transition: padding 0.25s cubic-bezier(0.5, 0.25, 0, 1);
|
||||
animation: loadSlot 0.5s ease;
|
||||
}
|
||||
|
||||
#launcher-app:hover image,
|
||||
#launcher-app:active image,
|
||||
#launcher-app:selected image,
|
||||
#launcher-app.selected image,
|
||||
#launcher-app:focus image {
|
||||
-gtk-icon-shadow: 2px 2px @primary;
|
||||
@keyframes loadSlot {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
#launcher-app:hover,
|
||||
#launcher-app:active,
|
||||
#launcher-app.selected,
|
||||
#launcher-app:selected,
|
||||
#launcher-app:focus {
|
||||
text-shadow: 2pt 2pt 2pt @primary;
|
||||
#slot-button:hover,
|
||||
#slot-button:focus,
|
||||
#slot-button:selected,
|
||||
#slot-button.selected {
|
||||
background-color: var(--surface-bright);
|
||||
padding-left: 24px;
|
||||
}
|
||||
|
||||
#launcher-app-icon {
|
||||
#slot-button:active {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
#app-icon {
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
#app-label {
|
||||
color: var(--foreground);
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#slot-button:hover #app-label,
|
||||
#slot-button:focus #app-label,
|
||||
#slot-button:selected #app-label,
|
||||
#slot-button.selected #app-label {
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
#slot-button:active #app-label {
|
||||
color: var(--shadow);
|
||||
}
|
||||
|
||||
/*
|
||||
* ── wallpaper ─────────────────────────────────────────────────────────
|
||||
*/
|
||||
#search-entry-walls {
|
||||
min-width: 300px;
|
||||
}
|
||||
|
||||
#entry-custom-color {
|
||||
min-width: 10px;
|
||||
min-width: 512px;
|
||||
}
|
||||
|
||||
#wallpaper-icons:selected {
|
||||
background-color: @surfaceBright;
|
||||
border-radius: 8px;
|
||||
background-color: var(--surface-bright);
|
||||
border-radius: 0px;
|
||||
}
|
||||
|
||||
#wallpaper-icons:hover {
|
||||
background-color: @surfaceBright;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
#dropdown-box {
|
||||
background-color: lighter(@background);
|
||||
box-shadow: inset 0 0 0 1px @outlineVariant;
|
||||
border-radius: 11px;
|
||||
padding: 10px;
|
||||
margin: 12px;
|
||||
background-color: var(--surface-bright);
|
||||
border-radius: 0px;
|
||||
}
|
||||
|
||||
#scheme-dropdown {
|
||||
background-color: var(--surface-container);
|
||||
padding: 8px;
|
||||
border-radius: 11px;
|
||||
margin-top: 12px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
#scheme-dropdown > * > * {
|
||||
font-weight: bold;
|
||||
color: var(--shadow);
|
||||
}
|
||||
|
||||
#scheme-dropdown.box button.box.cellview {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
#scheme-dropdown.box button.box.cellview:selected {
|
||||
background-color: var(--surface-bright);
|
||||
}
|
||||
|
||||
/* Customize the overall switch appearance */
|
||||
#materialyoucolor-switcher {
|
||||
#matugen-switcher {
|
||||
min-width: 40px;
|
||||
min-height: 20px;
|
||||
background-color: @surface;
|
||||
background-color: var(--surface-variant);
|
||||
border-radius: 15px;
|
||||
padding: 2px;
|
||||
transition: background-color 0.3s ease;
|
||||
}
|
||||
|
||||
/* Style the switch's slider */
|
||||
#materialyoucolor-switcher slider {
|
||||
#matugen-switcher slider {
|
||||
background-color: var(--primary);
|
||||
border-radius: 16px;
|
||||
min-width: 20px;
|
||||
@@ -170,13 +244,17 @@
|
||||
}
|
||||
|
||||
/* When the switch is active (checked) */
|
||||
#materialyoucolor-switcher:checked {
|
||||
background-color: @primary;
|
||||
#matugen-switcher:checked {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
/* Optional: additional styling for the slider when active */
|
||||
#materialyoucolor-switcher:checked slider {
|
||||
background-color: @shadow;
|
||||
#matugen-switcher:checked slider {
|
||||
background-color: var(--surface);
|
||||
}
|
||||
|
||||
#matugen-switcher:checked image {
|
||||
color: var(--surface);
|
||||
}
|
||||
|
||||
#mat-label {
|
||||
@@ -188,21 +266,107 @@
|
||||
* ── emoji ─────────────────────────────────────────────────────────────
|
||||
*/
|
||||
|
||||
#launcher button#emoji-item {
|
||||
border-radius: 11px;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
box-shadow: none;
|
||||
padding: 0px;
|
||||
#emoji #search-entry {
|
||||
font-weight: bold;
|
||||
background-color: var(--surface);
|
||||
color: var(--foreground);
|
||||
border-radius: 16px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
#launcher button#emoji-item label {
|
||||
#emoji #search-entry selection {
|
||||
color: var(--background);
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
#emoji #close-button {
|
||||
background-color: var(--surface);
|
||||
border-radius: 16px;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
#emoji #close-button:hover,
|
||||
#emoji #close-button:focus {
|
||||
background-color: var(--surface-bright);
|
||||
}
|
||||
|
||||
#emoji #close-button:active {
|
||||
background-color: var(--red-dim);
|
||||
}
|
||||
|
||||
#emoji #close-label {
|
||||
color: var(--red-dim);
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
#launcher button#emoji-item:hover,
|
||||
#launcher button#emoji-item:focus {
|
||||
text-shadow: 2px 2px 2px @primary;
|
||||
#emoji #close-button:active #close-label {
|
||||
color: var(--shadow);
|
||||
}
|
||||
|
||||
#emoji #emoji-slot-button {
|
||||
border-radius: 16px;
|
||||
padding: 16px;
|
||||
transition: padding 0.1s ease;
|
||||
}
|
||||
|
||||
@keyframes loadEmojiSlot {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
#emoji #emoji-slot-button:hover,
|
||||
#emoji #emoji-slot-button:focus,
|
||||
#emoji #emoji-slot-button:selected,
|
||||
#emoji #emoji-slot-button.selected {
|
||||
background-color: var(--surface-bright);
|
||||
text-shadow: 0 0 4px var(--shadow);
|
||||
animation: highlightEmojiSlot 0.25s cubic-bezier(0, 0, 0.5, 1);
|
||||
}
|
||||
|
||||
@keyframes highlightEmojiSlot {
|
||||
0% {
|
||||
padding: 16px;
|
||||
text-shadow: 0 4px 4px var(--shadow);
|
||||
}
|
||||
|
||||
50% {
|
||||
padding: 8px 16px 24px 16px;
|
||||
text-shadow: 0 12px 4px var(--shadow);
|
||||
}
|
||||
|
||||
100% {
|
||||
padding: 16px;
|
||||
text-shadow: 0 4px 4px var(--shadow);
|
||||
}
|
||||
}
|
||||
|
||||
#emoji #emoji-slot-button:active {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
#emoji #emoji-name-label {
|
||||
color: var(--foreground);
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#emoji #emoji-slot-button:hover #emoji-name-label,
|
||||
#emoji #emoji-slot-button:focus #emoji-name-label,
|
||||
#emoji #emoji-slot-button:selected #emoji-name-label,
|
||||
#emoji #emoji-slot-button.selected #emoji-name-label {
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
#emoji #emoji-slot-button:active #emoji-name-label {
|
||||
color: var(--shadow);
|
||||
}
|
||||
|
||||
#emoji #emoji-char-label {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
/*
|
||||
@@ -213,141 +377,37 @@
|
||||
border-radius: 20px;
|
||||
min-width: 52px;
|
||||
min-height: 52px;
|
||||
padding: 20px;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
#power-menu-button label {
|
||||
font-size: 49px;
|
||||
color: @foreground;
|
||||
font-size: 35px;
|
||||
color: var(--foreground);
|
||||
}
|
||||
|
||||
#power-menu-button:hover,
|
||||
#power-menu-button:focus {
|
||||
background-color: @surfaceBright;
|
||||
background-color: var(--surface-bright);
|
||||
}
|
||||
|
||||
#power-menu-button:hover label,
|
||||
#power-menu-button:focus label {
|
||||
color: @primary;
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
#power-menu-button:active {
|
||||
background-color: @primary;
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
#power-menu-button:active label {
|
||||
color: @shadow;
|
||||
}
|
||||
|
||||
/*
|
||||
* ── cliphist ──────────────────────────────────────────────────────────
|
||||
*/
|
||||
|
||||
button#clip-img-item {
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
border-radius: 8px;
|
||||
min-width: 70px;
|
||||
min-height: 70px;
|
||||
}
|
||||
|
||||
button#clip-img-item:hover,
|
||||
button#clip-img-item:focus {
|
||||
box-shadow: 2px 2px 2px @primary;
|
||||
}
|
||||
|
||||
button#clip-item {
|
||||
border-radius: 11px;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
box-shadow: none;
|
||||
padding: 6px;
|
||||
}
|
||||
|
||||
button#clip-item {
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
button#clip-item:hover,
|
||||
button#clip-item:focus {
|
||||
text-shadow: 2px 2px 2px @primary;
|
||||
}
|
||||
|
||||
#clear-button {
|
||||
margin: 11px;
|
||||
margin-left: 0px;
|
||||
min-width: 44px;
|
||||
min-height: 44px;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
#clear-button:hover {
|
||||
background-color: mix(@onSurface, @surface, 0.92);
|
||||
}
|
||||
|
||||
#cliphist-clear-button {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
/*
|
||||
* ── todo ──────────────────────────────────────────────────────────────
|
||||
*/
|
||||
#todo-launcher {
|
||||
padding: 10px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
#todo-item {
|
||||
padding: 8px;
|
||||
border-radius: 4px;
|
||||
background-color: alpha(@background, 0.3);
|
||||
}
|
||||
|
||||
#todo-label {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
#todo-label-completed {
|
||||
color: alpha(@outlineVariant, 1);
|
||||
text-decoration: line-through;
|
||||
}
|
||||
|
||||
#add-button {
|
||||
margin: 11px;
|
||||
margin-left: 0px;
|
||||
margin-right: 0px;
|
||||
min-width: 44px;
|
||||
min-height: 44px;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
#delete-button,
|
||||
#checkbox {
|
||||
margin-left: 0px;
|
||||
margin-right: 0px;
|
||||
min-width: 44px;
|
||||
min-height: 44px;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
#add-button:hover,
|
||||
#delete-button:hover,
|
||||
#checkbox:hover {
|
||||
background-color: mix(@onSurface, @surface, 0.92);
|
||||
}
|
||||
|
||||
#todo-add-button,
|
||||
#todo-checkbox,
|
||||
#todo-delete-button {
|
||||
font-size: 24px;
|
||||
color: var(--shadow);
|
||||
}
|
||||
|
||||
/*
|
||||
* ── sh runner ─────────────────────────────────────────────────────────
|
||||
*/
|
||||
|
||||
#launcher button#sh-item {
|
||||
#sh-item {
|
||||
border-radius: 11px;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
@@ -355,13 +415,13 @@ button#clip-item:focus {
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
#launcher button#sh-item {
|
||||
#sh-item {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
#launcher button#sh-item:hover,
|
||||
#launcher button#sh-item:focus {
|
||||
text-shadow: 2px 2px 2px @primary;
|
||||
#sh-item:hover,
|
||||
#sh-item:focus {
|
||||
text-shadow: 2px 2px 2px var(--primary);
|
||||
}
|
||||
|
||||
/*
|
||||
@@ -369,35 +429,33 @@ button#clip-item:focus {
|
||||
*/
|
||||
|
||||
#bluetooth-header {
|
||||
background-color: @surfaceContainer;
|
||||
border: 2px solid var(--shadow);
|
||||
padding: 4px;
|
||||
border-radius: 20px;
|
||||
background-color: var(--surface-container);
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
#bluetooth-device {
|
||||
background-color: @secondaryContainer;
|
||||
border-radius: 16px;
|
||||
border: 2px solid var(--shadow);
|
||||
background-color: var(--surface-container);
|
||||
border-radius: 12px;
|
||||
padding: 4px;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
#bluetooth-scan-button,
|
||||
#bluetooth-toggle-button {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
#bluetooth-scan,
|
||||
#bluetooth-toggle {
|
||||
background-color: @secondaryContainer;
|
||||
margin-left: 0px;
|
||||
min-width: 44px;
|
||||
min-height: 44px;
|
||||
border-radius: 100%;
|
||||
#bluetooth-back {
|
||||
background-color: var(--surface);
|
||||
border-radius: 8px;
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
#bluetooth-back-label {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
#bluetooth-scan:hover,
|
||||
#bluetooth-toggle:hover {
|
||||
background-color: @surfaceBright;
|
||||
#bluetooth-back:hover {
|
||||
background-color: var(--surface-bright);
|
||||
}
|
||||
|
||||
#bluetooth-scan label,
|
||||
@@ -410,8 +468,10 @@ button#clip-item:focus {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#bluetooth-text {
|
||||
color: @primary;
|
||||
#bluetooth-section {
|
||||
background-color: var(--surface-container);
|
||||
border-radius: 12px;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
#bluetooth-connection {
|
||||
@@ -419,20 +479,54 @@ button#clip-item:focus {
|
||||
}
|
||||
|
||||
#bluetooth-connect {
|
||||
background-color: lighter(@background);
|
||||
border-radius: 16px;
|
||||
padding: 8px 16px;
|
||||
background-color: var(--surface);
|
||||
border-radius: 8px;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
#bluetooth-connect:hover {
|
||||
background-color: @surfaceBright;
|
||||
background-color: var(--surface-bright);
|
||||
}
|
||||
|
||||
#bluetooth-paired,
|
||||
#bluetooth-available {
|
||||
background-color: @surfaceContainer;
|
||||
padding: 4px;
|
||||
background-color: var(--surface-container);
|
||||
border-radius: 20px;
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
#bt-sep {
|
||||
border-radius: 16px;
|
||||
}
|
||||
|
||||
#bluetooth-scan-label {
|
||||
font-size: 20px;
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
#bluetooth-scan.scanning {
|
||||
animation: blink 0.5s ease infinite;
|
||||
}
|
||||
|
||||
#bluetooth-scan-label.scanning {
|
||||
animation: blink 0.5s ease infinite;
|
||||
}
|
||||
|
||||
@keyframes blink {
|
||||
0% {
|
||||
background-color: var(--blue);
|
||||
color: var(--shadow);
|
||||
}
|
||||
|
||||
50% {
|
||||
background-color: var(--shadow);
|
||||
color: var(--blue);
|
||||
}
|
||||
|
||||
100% {
|
||||
background-color: var(--blue);
|
||||
color: var(--shadow);
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
@@ -440,13 +534,13 @@ button#clip-item:focus {
|
||||
*/
|
||||
|
||||
#wifi-header {
|
||||
background-color: @surfaceContainer;
|
||||
background-color: var(--surface-container);
|
||||
padding: 4px;
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
#wifi-device {
|
||||
background-color: @secondaryContainer;
|
||||
background-color: var(--secondary-container);
|
||||
border-radius: 16px;
|
||||
padding: 4px;
|
||||
margin-bottom: 4px;
|
||||
@@ -458,7 +552,7 @@ button#clip-item:focus {
|
||||
|
||||
#wifi-scan,
|
||||
#wifi-toggle {
|
||||
background-color: @secondaryContainer;
|
||||
background-color: var(--surface-container);
|
||||
margin-left: 0px;
|
||||
min-width: 44px;
|
||||
min-height: 44px;
|
||||
@@ -467,7 +561,7 @@ button#clip-item:focus {
|
||||
|
||||
#wifi-scan:hover,
|
||||
#wifi-toggle:hover {
|
||||
background-color: @surfaceBright;
|
||||
background-color: var(--surface-bright);
|
||||
}
|
||||
|
||||
#wifi-scan label,
|
||||
@@ -481,7 +575,7 @@ button#clip-item:focus {
|
||||
}
|
||||
|
||||
#wifi-text {
|
||||
color: @primary;
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
#wifi-connection {
|
||||
@@ -489,17 +583,17 @@ button#clip-item:focus {
|
||||
}
|
||||
|
||||
#wifi-connect {
|
||||
background-color: lighter(@background);
|
||||
background-color: var(--surface);
|
||||
border-radius: 16px;
|
||||
padding: 8px 16px;
|
||||
}
|
||||
|
||||
#wifi-connect:hover {
|
||||
background-color: @surfaceBright;
|
||||
background-color: var(--surface-bright);
|
||||
}
|
||||
|
||||
#wifi-available {
|
||||
background-color: @surfaceContainer;
|
||||
/*background-color: var(--surface-container);*/
|
||||
padding: 4px;
|
||||
border-radius: 20px;
|
||||
}
|
||||
@@ -509,11 +603,12 @@ button#clip-item:focus {
|
||||
*/
|
||||
|
||||
#header {
|
||||
border-radius: 16px;
|
||||
border-radius: 12px;
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
#weekday-row {
|
||||
background-color: var(--surface);
|
||||
border-radius: 8px;
|
||||
padding: 4px;
|
||||
}
|
||||
@@ -526,16 +621,16 @@ button#clip-item:focus {
|
||||
|
||||
#day-label,
|
||||
#day-empty {
|
||||
min-width: 42px;
|
||||
min-height: 36px;
|
||||
min-width: 38px;
|
||||
min-height: 22px;
|
||||
}
|
||||
|
||||
#day-empty {
|
||||
color: @surfaceBright;
|
||||
color: var(--surface-bright);
|
||||
}
|
||||
|
||||
#weekday-label {
|
||||
color: @primary;
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
#calendar-grid {
|
||||
@@ -544,47 +639,189 @@ button#clip-item:focus {
|
||||
}
|
||||
|
||||
#day-label.current-day {
|
||||
background-color: @primary;
|
||||
color: @onPrimary;
|
||||
min-height: 36px;
|
||||
min-width: 42px;
|
||||
border-radius: 99px;
|
||||
background-color: var(--primary);
|
||||
color: var(--shadow);
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
#prev-month-button,
|
||||
#next-month-button {
|
||||
background-color: var(--surface);
|
||||
border-radius: 8px;
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
#prev-month-button:hover,
|
||||
#next-month-button:hover {
|
||||
background-color: @surfaceBright;
|
||||
background-color: var(--surface-bright);
|
||||
}
|
||||
|
||||
#prev-month-button:active,
|
||||
#next-month-button:active {
|
||||
background-color: @primary;
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
#month-button-label {
|
||||
color: @primary;
|
||||
color: var(--primary);
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
#prev-month-button:active #month-button-label,
|
||||
#next-month-button:active #month-button-label {
|
||||
color: @surface;
|
||||
}
|
||||
|
||||
#day-box {
|
||||
padding: 5px;
|
||||
border-radius: 5px;
|
||||
min-width: 30px;
|
||||
min-height: 30px;
|
||||
color: var(--shadow);
|
||||
}
|
||||
|
||||
#prev-month-day,
|
||||
#next-month-day {
|
||||
color: mix(@onSurfaceVariant, transparent, 0.6);
|
||||
color: mix(var(--on-surface), transparent, 0.6);
|
||||
}
|
||||
|
||||
/*
|
||||
* ── tools ─────────────────────────────────────────────────────────────
|
||||
*/
|
||||
|
||||
#toolbox-button {
|
||||
border-radius: 20px;
|
||||
min-width: 52px;
|
||||
min-height: 52px;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
#toolbox-button label {
|
||||
font-size: 35px;
|
||||
color: var(--foreground);
|
||||
}
|
||||
|
||||
#toolbox-button.recording label {
|
||||
color: var(--red-dim);
|
||||
}
|
||||
|
||||
#toolbox-button:hover,
|
||||
#toolbox-button:focus {
|
||||
background-color: var(--surface-bright);
|
||||
}
|
||||
|
||||
#toolbox-button:hover label,
|
||||
#toolbox-button:focus label {
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
#toolbox-button.recording:hover label,
|
||||
#toolbox-button.recording:focus label {
|
||||
color: var(--red-dim);
|
||||
}
|
||||
|
||||
#toolbox-button:active {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
#toolbox-button:active label {
|
||||
color: var(--shadow);
|
||||
}
|
||||
|
||||
#toolbox-button.recording:active {
|
||||
background-color: var(--red-dim);
|
||||
}
|
||||
|
||||
#toolbox-button.recording:active label {
|
||||
color: var(--shadow);
|
||||
}
|
||||
|
||||
#tool-sep {
|
||||
min-width: 4px;
|
||||
min-height: 4px;
|
||||
margin: 0px 4px;
|
||||
border-radius: 16px;
|
||||
background-color: var(--surface-bright);
|
||||
}
|
||||
|
||||
/*
|
||||
* ── kanban ────────────────────────────────────────────────────────────
|
||||
*/
|
||||
|
||||
#kanban-header {
|
||||
border: 2px solid var(--outline);
|
||||
border-radius: 12px;
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
#column-header {
|
||||
padding: 4px;
|
||||
font-weight: bold;
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
#kanban-note {
|
||||
background-color: var(--surface-container);
|
||||
border-radius: 4px;
|
||||
padding: 8px;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
#kanban-row:first-child > * > * {
|
||||
border-radius: 16px 16px 4px 4px;
|
||||
}
|
||||
|
||||
#kanban-row:last-child > * > * {
|
||||
border-radius: 4px 4px 16px 16px;
|
||||
}
|
||||
|
||||
#inline-editor {
|
||||
border: 2px solid var(--surface-bright);
|
||||
border-radius: 12px;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
#kanban-btn,
|
||||
#kanban-btn-add {
|
||||
background-color: var(--surface-container);
|
||||
border-radius: 8px;
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
#kanban-btn {
|
||||
background-color: var(--surface);
|
||||
}
|
||||
|
||||
#kanban-btn:hover,
|
||||
#kanban-btn-add:hover {
|
||||
background-color: var(--surface-bright);
|
||||
}
|
||||
|
||||
#kanban-btn:active,
|
||||
#kanban-btn-add:active {
|
||||
background-color: var(--primary);
|
||||
}
|
||||
|
||||
#kanban-btn-label,
|
||||
#kanban-btn-neg {
|
||||
font-size: 20px;
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
#kanban-btn-neg {
|
||||
color: var(--red-dim);
|
||||
}
|
||||
|
||||
#kanban-btn:active #kanban-btn-label,
|
||||
#kanban-btn-add:active #kanban-btn-label {
|
||||
color: var(--surface);
|
||||
}
|
||||
|
||||
/* tmux */
|
||||
#no-notif,
|
||||
#no-tmux,
|
||||
#no-clip {
|
||||
font-size: 96px;
|
||||
color: var(--surface-container);
|
||||
}
|
||||
|
||||
#clip-label {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#tmux-icon,
|
||||
#clip-icon {
|
||||
font-size: 20px;
|
||||
color: var(--primary);
|
||||
}
|
||||
Reference in new issue
Block a user