new tool timer & alert revamp
All checks were successful
Deploy Sokko G / deploy (push) Successful in 6s
All checks were successful
Deploy Sokko G / deploy (push) Successful in 6s
This commit is contained in:
parent
0c7ae46b4d
commit
68005ef918
38 changed files with 2048 additions and 111 deletions
|
|
@ -72,6 +72,41 @@
|
|||
-webkit-mask-image: url("/static/icons/calculator.svg");
|
||||
}
|
||||
|
||||
.ui-icon-clock {
|
||||
mask-image: url("/static/icons/clock.svg");
|
||||
-webkit-mask-image: url("/static/icons/clock.svg");
|
||||
}
|
||||
|
||||
.ui-icon-stopwatch {
|
||||
mask-image: url("/static/icons/stopwatch.svg");
|
||||
-webkit-mask-image: url("/static/icons/stopwatch.svg");
|
||||
}
|
||||
|
||||
.ui-icon-hourglass {
|
||||
mask-image: url("/static/icons/hourglass.svg");
|
||||
-webkit-mask-image: url("/static/icons/hourglass.svg");
|
||||
}
|
||||
|
||||
.ui-icon-play-circle {
|
||||
mask-image: url("/static/icons/play-circle.svg");
|
||||
-webkit-mask-image: url("/static/icons/play-circle.svg");
|
||||
}
|
||||
|
||||
.ui-icon-pause-circle {
|
||||
mask-image: url("/static/icons/pause-circle.svg");
|
||||
-webkit-mask-image: url("/static/icons/pause-circle.svg");
|
||||
}
|
||||
|
||||
.ui-icon-record-circle {
|
||||
mask-image: url("/static/icons/record-circle.svg");
|
||||
-webkit-mask-image: url("/static/icons/record-circle.svg");
|
||||
}
|
||||
|
||||
.ui-icon-stop-circle {
|
||||
mask-image: url("/static/icons/stop-circle.svg");
|
||||
-webkit-mask-image: url("/static/icons/stop-circle.svg");
|
||||
}
|
||||
|
||||
.ui-icon-map {
|
||||
mask-image: url("/static/icons/map.svg");
|
||||
-webkit-mask-image: url("/static/icons/map.svg");
|
||||
|
|
@ -82,6 +117,36 @@
|
|||
-webkit-mask-image: url("/static/icons/scrollable.svg");
|
||||
}
|
||||
|
||||
.ui-icon-sort-time {
|
||||
mask-image: url("/static/icons/sort-time.svg");
|
||||
-webkit-mask-image: url("/static/icons/sort-time.svg");
|
||||
}
|
||||
|
||||
.ui-icon-sound-mute {
|
||||
mask-image: url("/static/icons/sound-mute.svg");
|
||||
-webkit-mask-image: url("/static/icons/sound-mute.svg");
|
||||
}
|
||||
|
||||
.ui-icon-sound-min {
|
||||
mask-image: url("/static/icons/sound-min.svg");
|
||||
-webkit-mask-image: url("/static/icons/sound-min.svg");
|
||||
}
|
||||
|
||||
.ui-icon-sound-max {
|
||||
mask-image: url("/static/icons/sound-max.svg");
|
||||
-webkit-mask-image: url("/static/icons/sound-max.svg");
|
||||
}
|
||||
|
||||
.ui-icon-toast-left {
|
||||
mask-image: url("/static/icons/toast-left.svg");
|
||||
-webkit-mask-image: url("/static/icons/toast-left.svg");
|
||||
}
|
||||
|
||||
.ui-icon-toast-right {
|
||||
mask-image: url("/static/icons/toast-right.svg");
|
||||
-webkit-mask-image: url("/static/icons/toast-right.svg");
|
||||
}
|
||||
|
||||
.ui-icon-hide {
|
||||
mask-image: url("/static/icons/hide.svg");
|
||||
-webkit-mask-image: url("/static/icons/hide.svg");
|
||||
|
|
@ -142,6 +207,11 @@
|
|||
-webkit-mask-image: url("/static/icons/rubber.svg");
|
||||
}
|
||||
|
||||
.ui-icon-refresh {
|
||||
mask-image: url("/static/icons/refresh.svg");
|
||||
-webkit-mask-image: url("/static/icons/refresh.svg");
|
||||
}
|
||||
|
||||
.ui-icon-trash {
|
||||
mask-image: url("/static/icons/trashcan.svg");
|
||||
-webkit-mask-image: url("/static/icons/trashcan.svg");
|
||||
|
|
|
|||
|
|
@ -321,25 +321,135 @@ body.is-resizing-drawer * {
|
|||
gap: 10px;
|
||||
}
|
||||
|
||||
@property --notification-toast-angle {
|
||||
syntax: "<angle>";
|
||||
inherits: false;
|
||||
initial-value: 0deg;
|
||||
}
|
||||
|
||||
.notification-toast {
|
||||
--notification-toast-angle: 0deg;
|
||||
position: fixed;
|
||||
right: var(--space-5);
|
||||
bottom: var(--space-5);
|
||||
z-index: 360;
|
||||
max-width: min(360px, calc(100vw - 32px));
|
||||
padding: 11px 14px;
|
||||
border: 1px solid rgba(246, 196, 83, 0.34);
|
||||
border-radius: var(--radius-md);
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr) 34px;
|
||||
align-items: center;
|
||||
gap: var(--space-3);
|
||||
max-width: min(460px, calc(100vw - 32px));
|
||||
min-width: min(360px, calc(100vw - 32px));
|
||||
padding: 14px 14px 14px 18px;
|
||||
border: 2px solid transparent;
|
||||
border-radius: var(--radius-lg);
|
||||
background:
|
||||
linear-gradient(135deg, rgba(16, 20, 38, 0.94), rgba(24, 20, 42, 0.94)) padding-box,
|
||||
linear-gradient(135deg, rgba(246, 196, 83, 0.48), rgba(139, 92, 246, 0.28)) border-box;
|
||||
radial-gradient(circle at 100% 0%, rgba(246, 196, 83, 0.12), transparent 38%) padding-box,
|
||||
linear-gradient(135deg, rgba(16, 20, 38, 0.98), rgba(24, 20, 42, 0.98)) padding-box,
|
||||
conic-gradient(
|
||||
from var(--notification-toast-angle),
|
||||
rgba(246, 196, 83, 0.95),
|
||||
rgba(139, 92, 246, 0.8),
|
||||
rgba(56, 189, 248, 0.62),
|
||||
rgba(246, 196, 83, 0.95)
|
||||
) border-box;
|
||||
color: var(--color-text-primary);
|
||||
box-shadow:
|
||||
var(--shadow-sm),
|
||||
0 0 18px rgba(139, 92, 246, 0.16);
|
||||
font-size: var(--font-size-sm);
|
||||
font-weight: 800;
|
||||
pointer-events: none;
|
||||
var(--shadow-md),
|
||||
0 0 24px rgba(139, 92, 246, 0.22),
|
||||
0 0 18px rgba(246, 196, 83, 0.1);
|
||||
font-size: var(--font-size-md);
|
||||
font-weight: 900;
|
||||
pointer-events: auto;
|
||||
animation:
|
||||
notification-toast-border-spin 2.4s linear infinite,
|
||||
notification-toast-pulse 1.8s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.notification-toast.is-right {
|
||||
right: var(--space-5);
|
||||
animation:
|
||||
notification-toast-enter-right 320ms var(--ease-standard),
|
||||
notification-toast-border-spin 2.4s linear infinite,
|
||||
notification-toast-pulse 1.8s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.notification-toast.is-left {
|
||||
left: var(--space-5);
|
||||
animation:
|
||||
notification-toast-enter-left 320ms var(--ease-standard),
|
||||
notification-toast-border-spin 2.4s linear infinite,
|
||||
notification-toast-pulse 1.8s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.notification-toast span {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.notification-toast button {
|
||||
display: inline-grid;
|
||||
width: 34px;
|
||||
min-width: 34px;
|
||||
min-height: 34px;
|
||||
place-items: center;
|
||||
padding: 0;
|
||||
border-color: rgba(165, 180, 252, 0.12);
|
||||
background: rgba(5, 7, 17, 0.28);
|
||||
color: var(--color-text-secondary);
|
||||
}
|
||||
|
||||
.notification-toast button:hover {
|
||||
border-color: rgba(196, 181, 253, 0.26);
|
||||
background: rgba(21, 26, 48, 0.72);
|
||||
color: var(--color-text-primary);
|
||||
}
|
||||
|
||||
.notification-toast button .ui-icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
@keyframes notification-toast-border-spin {
|
||||
to { --notification-toast-angle: 360deg; }
|
||||
}
|
||||
|
||||
@keyframes notification-toast-enter-right {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateX(calc(100% + var(--space-5)));
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateX(0);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes notification-toast-enter-left {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateX(calc(-100% - var(--space-5)));
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateX(0);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes notification-toast-pulse {
|
||||
0%,
|
||||
100% {
|
||||
box-shadow:
|
||||
var(--shadow-md),
|
||||
0 0 24px rgba(139, 92, 246, 0.22),
|
||||
0 0 18px rgba(246, 196, 83, 0.1);
|
||||
}
|
||||
|
||||
50% {
|
||||
box-shadow:
|
||||
var(--shadow-md),
|
||||
0 0 34px rgba(139, 92, 246, 0.3),
|
||||
0 0 26px rgba(246, 196, 83, 0.18);
|
||||
}
|
||||
}
|
||||
|
||||
.tool-add-modal {
|
||||
|
|
|
|||
|
|
@ -200,7 +200,8 @@
|
|||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.calculator-module {
|
||||
.calculator-module,
|
||||
.timer-module {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
|
|
@ -218,6 +219,11 @@
|
|||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.toolbox-preferences-row {
|
||||
max-width: none;
|
||||
justify-self: stretch;
|
||||
}
|
||||
|
||||
.tool-add-modal {
|
||||
width: min(420px, calc(100vw - 32px));
|
||||
}
|
||||
|
|
|
|||
|
|
@ -272,7 +272,7 @@
|
|||
.topbar {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 20;
|
||||
z-index: 80;
|
||||
display: flex;
|
||||
min-height: 68px;
|
||||
align-items: center;
|
||||
|
|
|
|||
|
|
@ -296,6 +296,116 @@
|
|||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.toolbox-preferences-row {
|
||||
position: relative;
|
||||
isolation: isolate;
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr) auto;
|
||||
width: 100%;
|
||||
max-width: 520px;
|
||||
align-items: center;
|
||||
justify-self: end;
|
||||
gap: var(--space-4);
|
||||
margin-top: var(--space-4);
|
||||
padding: var(--space-4);
|
||||
overflow: hidden;
|
||||
border: 1px solid transparent;
|
||||
border-radius: var(--radius-lg);
|
||||
background:
|
||||
radial-gradient(circle at 100% 0%, rgba(246, 196, 83, 0.08), transparent 34%),
|
||||
linear-gradient(135deg, rgba(16, 20, 38, 0.84), rgba(5, 7, 17, 0.76));
|
||||
color: var(--color-text-muted);
|
||||
font-size: var(--font-size-sm);
|
||||
font-weight: 800;
|
||||
box-shadow: var(--shadow-sm);
|
||||
}
|
||||
|
||||
.toolbox-preferences-row::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
z-index: -1;
|
||||
padding: 1px;
|
||||
border-radius: inherit;
|
||||
background:
|
||||
radial-gradient(circle at 100% 0%, rgba(246, 196, 83, 0.38), transparent 30%),
|
||||
linear-gradient(135deg, rgba(246, 196, 83, 0.26), rgba(139, 92, 246, 0.16), rgba(56, 189, 248, 0.18));
|
||||
@include mixins.border-mask;
|
||||
}
|
||||
|
||||
.toolbox-preferences-row .eyebrow {
|
||||
margin-bottom: 4px;
|
||||
font-size: 0.68rem;
|
||||
}
|
||||
|
||||
.toolbox-preferences-row strong {
|
||||
display: block;
|
||||
color: var(--color-text-primary);
|
||||
font-size: var(--font-size-sm);
|
||||
}
|
||||
|
||||
.toolbox-preferences-row + .cards {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.toast-position-switch {
|
||||
position: relative;
|
||||
display: inline-grid;
|
||||
grid-template-columns: repeat(2, 32px);
|
||||
width: 74px;
|
||||
min-height: 38px;
|
||||
align-items: center;
|
||||
justify-items: center;
|
||||
gap: 0;
|
||||
padding: 3px 4px;
|
||||
border-color: rgba(165, 180, 252, 0.12);
|
||||
border-radius: var(--radius-pill);
|
||||
background: rgba(7, 10, 24, 0.32);
|
||||
color: var(--color-text-secondary);
|
||||
}
|
||||
|
||||
.toast-position-switch::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 3px;
|
||||
bottom: 3px;
|
||||
left: 4px;
|
||||
width: 30px;
|
||||
border: 1px solid rgba(246, 196, 83, 0.3);
|
||||
border-radius: 50%;
|
||||
background:
|
||||
linear-gradient(135deg, rgba(246, 196, 83, 0.1), rgba(139, 92, 246, 0.08)),
|
||||
rgba(21, 26, 48, 0.58);
|
||||
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
|
||||
transition: transform var(--duration-fast) var(--ease-standard);
|
||||
}
|
||||
|
||||
.toast-position-switch[data-position="right"]::before {
|
||||
transform: translateX(32px);
|
||||
}
|
||||
|
||||
.toast-position-switch span {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
display: inline-grid;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
place-items: center;
|
||||
justify-self: center;
|
||||
align-self: center;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.toast-position-switch .ui-icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.toast-position-switch:hover {
|
||||
border-color: rgba(196, 181, 253, 0.24);
|
||||
color: var(--color-text-primary);
|
||||
}
|
||||
|
||||
.modules {
|
||||
align-items: start;
|
||||
}
|
||||
|
|
@ -606,11 +716,71 @@
|
|||
-webkit-mask-image: url("/static/icons/calculator.svg");
|
||||
}
|
||||
|
||||
.module-icon-clock {
|
||||
mask-image: url("/static/icons/clock.svg");
|
||||
-webkit-mask-image: url("/static/icons/clock.svg");
|
||||
}
|
||||
|
||||
.module-icon-stopwatch {
|
||||
mask-image: url("/static/icons/stopwatch.svg");
|
||||
-webkit-mask-image: url("/static/icons/stopwatch.svg");
|
||||
}
|
||||
|
||||
.module-icon-hourglass {
|
||||
mask-image: url("/static/icons/hourglass.svg");
|
||||
-webkit-mask-image: url("/static/icons/hourglass.svg");
|
||||
}
|
||||
|
||||
.module-icon-map {
|
||||
mask-image: url("/static/icons/map.svg");
|
||||
-webkit-mask-image: url("/static/icons/map.svg");
|
||||
}
|
||||
|
||||
.tabs {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
|
||||
gap: 6px;
|
||||
padding: 5px;
|
||||
border: 1px solid rgba(165, 180, 252, 0.12);
|
||||
border-radius: var(--radius-md);
|
||||
background: rgba(5, 7, 17, 0.34);
|
||||
}
|
||||
|
||||
.tabs button {
|
||||
display: inline-flex;
|
||||
min-width: 0;
|
||||
min-height: 36px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 8px;
|
||||
padding: 0 10px;
|
||||
border: 1px solid transparent;
|
||||
border-radius: calc(var(--radius-md) - 2px);
|
||||
background: transparent;
|
||||
color: var(--color-text-secondary);
|
||||
font-size: var(--font-size-sm);
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.tabs button:hover {
|
||||
border-color: rgba(246, 196, 83, 0.28);
|
||||
background: rgba(246, 196, 83, 0.08);
|
||||
color: var(--color-text-primary);
|
||||
}
|
||||
|
||||
.tabs button.active {
|
||||
border-color: rgba(246, 196, 83, 0.56);
|
||||
background: rgba(246, 196, 83, 0.12);
|
||||
color: var(--color-accent-gold);
|
||||
box-shadow: 0 0 18px rgba(246, 196, 83, 0.08);
|
||||
}
|
||||
|
||||
.tabs .module-icon-svg {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
background: currentColor;
|
||||
}
|
||||
|
||||
.notepad {
|
||||
display: block;
|
||||
width: calc(100% - 32px);
|
||||
|
|
@ -809,7 +979,15 @@ textarea:focus {
|
|||
font-weight: 800;
|
||||
}
|
||||
|
||||
.checklist-complete-mode-button {
|
||||
.timer-alert-mode-switch {
|
||||
display: inline-flex;
|
||||
width: fit-content;
|
||||
align-items: center;
|
||||
opacity: 0.78;
|
||||
}
|
||||
|
||||
.checklist-complete-mode-button,
|
||||
.timer-alert-mode-button {
|
||||
display: inline-grid;
|
||||
width: 36px;
|
||||
min-width: 36px;
|
||||
|
|
@ -824,23 +1002,41 @@ textarea:focus {
|
|||
font-weight: 800;
|
||||
}
|
||||
|
||||
.checklist-complete-mode-button:first-child {
|
||||
.checklist-complete-mode-button:first-child,
|
||||
.timer-alert-mode-button:first-child {
|
||||
border-radius: var(--radius-pill) 0 0 var(--radius-pill);
|
||||
}
|
||||
|
||||
.checklist-complete-mode-button:last-child {
|
||||
.checklist-complete-mode-button:last-child,
|
||||
.timer-alert-mode-button:last-child {
|
||||
border-radius: 0 var(--radius-pill) var(--radius-pill) 0;
|
||||
}
|
||||
|
||||
.checklist-complete-mode-button + .checklist-complete-mode-button {
|
||||
.checklist-complete-mode-button + .checklist-complete-mode-button,
|
||||
.timer-alert-mode-button + .timer-alert-mode-button {
|
||||
margin-left: -1px;
|
||||
}
|
||||
|
||||
.checklist-complete-mode-button .ui-icon {
|
||||
.checklist-complete-mode-button .ui-icon,
|
||||
.timer-alert-mode-button .ui-icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.timer-alert-mode-button {
|
||||
width: 24px;
|
||||
min-width: 24px;
|
||||
min-height: 26px;
|
||||
border-color: rgba(165, 180, 252, 0.08);
|
||||
background: rgba(5, 7, 17, 0.26);
|
||||
color: var(--color-text-muted);
|
||||
}
|
||||
|
||||
.timer-alert-mode-button .ui-icon {
|
||||
width: 13px;
|
||||
height: 13px;
|
||||
}
|
||||
|
||||
.checklist-section-collapse-button {
|
||||
display: inline-grid;
|
||||
width: 30px;
|
||||
|
|
@ -1026,7 +1222,8 @@ textarea:focus {
|
|||
font-weight: 900;
|
||||
}
|
||||
|
||||
.calculator-module {
|
||||
.calculator-module,
|
||||
.timer-module {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 35fr) minmax(0, 65fr);
|
||||
column-gap: var(--space-6);
|
||||
|
|
@ -1046,7 +1243,9 @@ textarea:focus {
|
|||
}
|
||||
|
||||
.calculator-card,
|
||||
.calculator-saved {
|
||||
.tool-split-results,
|
||||
.timer-control-card,
|
||||
.timer-results-card {
|
||||
display: grid;
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
|
|
@ -1061,6 +1260,316 @@ textarea:focus {
|
|||
rgba(7, 10, 24, 0.3);
|
||||
}
|
||||
|
||||
.timer-control-card,
|
||||
.timer-results-card {
|
||||
align-self: start;
|
||||
gap: var(--space-3);
|
||||
}
|
||||
|
||||
.timer-tabs {
|
||||
width: fit-content;
|
||||
grid-template-columns: repeat(2, 40px);
|
||||
}
|
||||
|
||||
.timer-tabs button {
|
||||
width: 40px;
|
||||
min-width: 40px;
|
||||
min-height: 36px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.timer-control-panel {
|
||||
display: grid;
|
||||
min-height: 170px;
|
||||
align-content: center;
|
||||
gap: var(--space-2);
|
||||
padding: var(--space-4);
|
||||
border: 1px solid var(--color-border);
|
||||
border-radius: var(--radius-md);
|
||||
background:
|
||||
radial-gradient(circle at 100% 0%, rgba(246, 196, 83, 0.08), transparent 36%),
|
||||
rgba(5, 7, 17, 0.5);
|
||||
}
|
||||
|
||||
.timer-countdown-form {
|
||||
align-content: start;
|
||||
}
|
||||
|
||||
.timer-countdown-form label,
|
||||
.timer-control-panel > label {
|
||||
display: grid;
|
||||
gap: 7px;
|
||||
}
|
||||
|
||||
.timer-countdown-form input,
|
||||
.timer-countdown-form select,
|
||||
.timer-control-panel input {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.timer-countdown-form select {
|
||||
appearance: none;
|
||||
-webkit-appearance: none;
|
||||
overflow: hidden;
|
||||
padding-right: 34px;
|
||||
border: 1px solid var(--color-border);
|
||||
border-radius: var(--radius-md);
|
||||
color: var(--color-text-primary);
|
||||
text-overflow: ellipsis;
|
||||
background-image:
|
||||
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' viewBox='-6.5 0 32 32'%3E%3Cpath d='M18.813 11.406l-7.906 9.906c-.75.906-1.906.906-2.625 0L.376 11.406c-.75-.938-.375-1.656.781-1.656h16.875c1.188 0 1.531.719.781 1.656z'/%3E%3C/svg%3E"),
|
||||
linear-gradient(135deg, rgba(139, 92, 246, 0.08), rgba(31, 41, 78, 0.12)),
|
||||
linear-gradient(rgba(15, 23, 42, 0.72), rgba(15, 23, 42, 0.72));
|
||||
background-position:
|
||||
calc(100% - 14px) 50%,
|
||||
0 0,
|
||||
0 0;
|
||||
background-size:
|
||||
12px 12px,
|
||||
auto,
|
||||
auto;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
.timer-countdown-form select option {
|
||||
background: #11182f;
|
||||
color: var(--color-text-primary);
|
||||
}
|
||||
|
||||
.time-parts-input {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(34px, 1fr) 4px minmax(34px, 1fr) 4px minmax(34px, 1fr);
|
||||
align-items: center;
|
||||
min-height: 44px;
|
||||
border: 1px solid var(--color-border);
|
||||
border-radius: var(--radius-md);
|
||||
background: rgba(15, 23, 42, 0.64);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.time-parts-input:focus-within {
|
||||
border-color: var(--color-primary);
|
||||
box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.16);
|
||||
}
|
||||
|
||||
.time-parts-input input {
|
||||
width: auto;
|
||||
min-width: 0;
|
||||
min-height: 42px;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
background: transparent;
|
||||
text-align: center;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.time-parts-input input:focus {
|
||||
border-color: transparent;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.time-parts-input input:focus-visible {
|
||||
outline: 0;
|
||||
outline-offset: 0;
|
||||
}
|
||||
|
||||
.time-parts-input span {
|
||||
color: var(--color-text-muted);
|
||||
font-weight: 900;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.timer-control-panel > span,
|
||||
.timer-control-panel label span {
|
||||
color: var(--color-text-secondary);
|
||||
font-size: var(--font-size-sm);
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.timer-control-panel strong {
|
||||
color: var(--color-text-primary);
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
font-weight: 950;
|
||||
line-height: 0.95;
|
||||
}
|
||||
|
||||
.timer-value {
|
||||
display: inline-flex;
|
||||
min-width: 0;
|
||||
align-items: baseline;
|
||||
gap: 0.16em;
|
||||
font-variant-numeric: tabular-nums;
|
||||
letter-spacing: 0;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.timer-value > span {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.timer-control-panel .timer-value.is-compact {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.timer-value small {
|
||||
color: var(--color-text-secondary);
|
||||
font-size: inherit;
|
||||
font-weight: 900;
|
||||
line-height: 1;
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
|
||||
.timer-value.is-compact small {
|
||||
display: inline-block;
|
||||
font-size: 0.5em;
|
||||
transform: translateY(-0.08em);
|
||||
}
|
||||
|
||||
.timer-value.is-compact {
|
||||
font-size: clamp(1.45rem, 2.25vw, 2rem);
|
||||
}
|
||||
|
||||
.timer-control-panel p,
|
||||
.timer-results-card p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.timer-actions {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: var(--space-2);
|
||||
}
|
||||
|
||||
.timer-action-button,
|
||||
.timer-actions .danger {
|
||||
display: inline-flex;
|
||||
width: 40px;
|
||||
min-width: 40px;
|
||||
min-height: 40px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.timer-list-item.is-expired {
|
||||
opacity: 0.78;
|
||||
}
|
||||
|
||||
.timer-entry-meta {
|
||||
display: flex;
|
||||
grid-column: 1 / -2;
|
||||
flex-wrap: wrap;
|
||||
min-width: 0;
|
||||
gap: 4px 8px;
|
||||
margin: 0;
|
||||
padding: 1px 10px 0;
|
||||
opacity: 0.68;
|
||||
}
|
||||
|
||||
.timer-entry-summary .timer-value,
|
||||
.timer-entry-value .timer-value {
|
||||
color: var(--color-text-primary);
|
||||
font-size: var(--font-size-md);
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.timer-entry-summary {
|
||||
min-width: 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.timer-entry-line {
|
||||
display: grid;
|
||||
grid-template-columns: max-content minmax(0, 1fr);
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
min-width: 0;
|
||||
gap: var(--space-2);
|
||||
align-items: center;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.timer-entry.has-inline-reset .timer-entry-line {
|
||||
grid-template-columns: max-content minmax(0, 1fr) auto;
|
||||
}
|
||||
|
||||
.timer-entry.has-inline-controls .timer-entry-line {
|
||||
grid-template-columns: max-content minmax(0, 1fr) auto;
|
||||
}
|
||||
|
||||
.timer-entry.has-single-action {
|
||||
grid-template-columns: minmax(0, 1fr) 34px;
|
||||
}
|
||||
|
||||
.tool-split-entry-list li.is-editing > .timer-entry.has-single-action {
|
||||
grid-template-columns: auto minmax(0, 1fr) 34px;
|
||||
}
|
||||
|
||||
.timer-inline-reset {
|
||||
width: 26px;
|
||||
min-width: 26px;
|
||||
min-height: 26px;
|
||||
padding: 0;
|
||||
border-color: rgba(165, 180, 252, 0.08);
|
||||
border-radius: var(--radius-sm);
|
||||
background: rgba(5, 7, 17, 0.26);
|
||||
color: var(--color-text-muted);
|
||||
}
|
||||
|
||||
.timer-inline-reset .ui-icon {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
}
|
||||
|
||||
.timer-inline-controls {
|
||||
display: inline-flex;
|
||||
min-width: 0;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.timer-entry-line > span:nth-child(2) {
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
color: var(--color-text-secondary);
|
||||
font-weight: 600;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.timer-lap-label {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.timer-lap-label::placeholder {
|
||||
color: rgba(229, 235, 255, 0.72);
|
||||
}
|
||||
|
||||
.timer-entry-meta span {
|
||||
color: var(--color-text-muted);
|
||||
font-size: var(--font-size-xs);
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.timer-list-item em {
|
||||
color: var(--color-text-muted);
|
||||
font-size: var(--font-size-xs);
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.timer-results-card {
|
||||
min-height: 260px;
|
||||
}
|
||||
|
||||
.timer-results-card.is-scrollable {
|
||||
max-height: 450px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.calculator-card {
|
||||
gap: 10px;
|
||||
align-self: start;
|
||||
|
|
@ -1084,7 +1593,7 @@ textarea:focus {
|
|||
|
||||
.calculator-form label span,
|
||||
.calculator-result span,
|
||||
.calculator-root-button {
|
||||
.tool-split-root-button {
|
||||
color: var(--color-text-secondary);
|
||||
font-size: var(--font-size-sm);
|
||||
font-weight: 700;
|
||||
|
|
@ -1109,7 +1618,7 @@ textarea:focus {
|
|||
text-align: right;
|
||||
}
|
||||
|
||||
.calculator-saved {
|
||||
.tool-split-results {
|
||||
grid-template-rows: auto minmax(0, 1fr);
|
||||
gap: var(--space-3);
|
||||
overflow: visible;
|
||||
|
|
@ -1124,7 +1633,7 @@ textarea:focus {
|
|||
overflow: hidden;
|
||||
}
|
||||
|
||||
.calculator-result-actions {
|
||||
.tool-split-actions {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: var(--space-2);
|
||||
|
|
@ -1133,7 +1642,7 @@ textarea:focus {
|
|||
min-width: 0;
|
||||
}
|
||||
|
||||
.calculator-root-button {
|
||||
.tool-split-root-button {
|
||||
width: fit-content;
|
||||
min-height: 34px;
|
||||
padding: 0 12px;
|
||||
|
|
@ -1142,8 +1651,8 @@ textarea:focus {
|
|||
background: rgba(5, 7, 17, 0.24);
|
||||
}
|
||||
|
||||
.calculator-action-button,
|
||||
.calculator-entry > button:not(.calculator-entry-summary, .calculator-entry-value),
|
||||
.tool-split-action-button,
|
||||
.tool-split-entry > button:not(.tool-split-entry-summary, .tool-split-entry-value),
|
||||
.counter-actions button,
|
||||
.link-item button {
|
||||
display: inline-flex;
|
||||
|
|
@ -1159,17 +1668,17 @@ textarea:focus {
|
|||
color: var(--color-text-secondary);
|
||||
}
|
||||
|
||||
.calculator-action-button:disabled {
|
||||
.tool-split-action-button:disabled {
|
||||
cursor: not-allowed;
|
||||
opacity: 0.48;
|
||||
}
|
||||
|
||||
.calculator-action-button .ui-icon {
|
||||
.tool-split-action-button .ui-icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.calculator-scroll-toggle {
|
||||
.tool-split-scroll-toggle {
|
||||
display: inline-grid;
|
||||
grid-template-columns: 18px 34px;
|
||||
width: fit-content;
|
||||
|
|
@ -1185,12 +1694,12 @@ textarea:focus {
|
|||
font-weight: 800;
|
||||
}
|
||||
|
||||
.calculator-scroll-toggle .ui-icon {
|
||||
.tool-split-scroll-toggle .ui-icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.calculator-scroll-toggle i {
|
||||
.tool-split-scroll-toggle i {
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 34px;
|
||||
|
|
@ -1200,7 +1709,7 @@ textarea:focus {
|
|||
background: rgba(7, 10, 24, 0.72);
|
||||
}
|
||||
|
||||
.calculator-scroll-toggle i::before {
|
||||
.tool-split-scroll-toggle i::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
|
|
@ -1216,20 +1725,20 @@ textarea:focus {
|
|||
box-shadow var(--duration-fast) var(--ease-standard);
|
||||
}
|
||||
|
||||
.calculator-root-button {
|
||||
.tool-split-root-button {
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.calculator-root-button:hover,
|
||||
.calculator-action-button:hover:not(:disabled),
|
||||
.tool-split-root-button:hover,
|
||||
.tool-split-action-button:hover:not(:disabled),
|
||||
.checklist-qty-controls button:hover,
|
||||
.calculator-entry > button:not(.calculator-entry-summary, .calculator-entry-value, .danger):hover,
|
||||
.tool-split-entry > button:not(.tool-split-entry-summary, .tool-split-entry-value, .danger):hover,
|
||||
.counter-actions button:not(.danger):hover,
|
||||
.link-item button:not(.danger):hover,
|
||||
.module-scroll-button:hover,
|
||||
.module-scroll-button.active,
|
||||
.calculator-scroll-toggle:hover,
|
||||
.calculator-scroll-toggle.active,
|
||||
.tool-split-scroll-toggle:hover,
|
||||
.tool-split-scroll-toggle.active,
|
||||
.checklist-complete-mode-button:hover,
|
||||
.checklist-complete-mode-button.active {
|
||||
border-color: rgba(196, 181, 253, 0.32);
|
||||
|
|
@ -1242,6 +1751,52 @@ textarea:focus {
|
|||
inset 0 1px 0 rgba(255, 255, 255, 0.05);
|
||||
}
|
||||
|
||||
.timer-alert-mode-button:hover,
|
||||
.timer-alert-mode-button.active {
|
||||
border-color: rgba(196, 181, 253, 0.2);
|
||||
background: rgba(21, 26, 48, 0.42);
|
||||
color: var(--color-text-primary);
|
||||
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
|
||||
}
|
||||
|
||||
.timer-alert-mode-button.active {
|
||||
border-color: rgba(246, 196, 83, 0.26);
|
||||
background:
|
||||
linear-gradient(135deg, rgba(246, 196, 83, 0.08), rgba(139, 92, 246, 0.08)),
|
||||
rgba(21, 26, 48, 0.36);
|
||||
color: var(--color-accent-gold);
|
||||
}
|
||||
|
||||
.timer-alert-mode-button:disabled,
|
||||
.timer-alert-mode-button:disabled:hover,
|
||||
.timer-alert-mode-button.active:disabled {
|
||||
cursor: not-allowed;
|
||||
border-color: rgba(165, 180, 252, 0.025);
|
||||
background: rgba(5, 7, 17, 0.08);
|
||||
color: rgba(148, 163, 184, 0.22);
|
||||
opacity: 1;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.timer-alert-mode-button:disabled .ui-icon {
|
||||
opacity: 0.34;
|
||||
}
|
||||
|
||||
.timer-alert-mode-switch.is-blocked {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.timer-alert-mode-switch.is-blocked .timer-alert-mode-button:disabled,
|
||||
.timer-alert-mode-switch.is-blocked .timer-alert-mode-button:disabled:hover,
|
||||
.timer-alert-mode-switch.is-blocked .timer-alert-mode-button.active:disabled {
|
||||
cursor: not-allowed;
|
||||
border-color: rgba(165, 180, 252, 0.035);
|
||||
background: rgba(5, 7, 17, 0.1);
|
||||
color: rgba(148, 163, 184, 0.32);
|
||||
box-shadow: none;
|
||||
opacity: 0.2;
|
||||
}
|
||||
|
||||
.checklist-section-collapse-button:hover {
|
||||
border-color: rgba(246, 196, 83, 0.58);
|
||||
background:
|
||||
|
|
@ -1253,8 +1808,8 @@ textarea:focus {
|
|||
0 0 16px rgba(139, 92, 246, 0.08);
|
||||
}
|
||||
|
||||
.calculator-action-button.danger,
|
||||
.calculator-entry > button.danger,
|
||||
.tool-split-action-button.danger,
|
||||
.tool-split-entry > button.danger,
|
||||
.counter-actions button.danger,
|
||||
.link-item button.danger {
|
||||
border-color: rgba(251, 113, 133, 0.2);
|
||||
|
|
@ -1262,8 +1817,8 @@ textarea:focus {
|
|||
color: var(--color-danger);
|
||||
}
|
||||
|
||||
.calculator-action-button.danger:hover:not(:disabled),
|
||||
.calculator-entry > button.danger:hover,
|
||||
.tool-split-action-button.danger:hover:not(:disabled),
|
||||
.tool-split-entry > button.danger:hover,
|
||||
.counter-actions button.danger:hover,
|
||||
.link-item button.danger:hover {
|
||||
border-color: rgba(251, 113, 133, 0.56);
|
||||
|
|
@ -1276,8 +1831,8 @@ textarea:focus {
|
|||
inset 0 1px 0 rgba(255, 255, 255, 0.06);
|
||||
}
|
||||
|
||||
.calculator-action-button.danger:hover .ui-icon,
|
||||
.calculator-entry > button.danger:hover .ui-icon,
|
||||
.tool-split-action-button.danger:hover .ui-icon,
|
||||
.tool-split-entry > button.danger:hover .ui-icon,
|
||||
.counter-actions button.danger:hover .ui-icon,
|
||||
.link-item button.danger:hover .ui-icon {
|
||||
background-color: #fff;
|
||||
|
|
@ -1285,7 +1840,7 @@ textarea:focus {
|
|||
}
|
||||
|
||||
.module-scroll-button.active,
|
||||
.calculator-scroll-toggle.active,
|
||||
.tool-split-scroll-toggle.active,
|
||||
.checklist-complete-mode-button.active {
|
||||
border-color: rgba(246, 196, 83, 0.34);
|
||||
background:
|
||||
|
|
@ -1295,13 +1850,13 @@ textarea:focus {
|
|||
}
|
||||
|
||||
.module-scroll-button.active i,
|
||||
.calculator-scroll-toggle.active i {
|
||||
.tool-split-scroll-toggle.active i {
|
||||
border-color: rgba(246, 196, 83, 0.36);
|
||||
background: rgba(246, 196, 83, 0.12);
|
||||
}
|
||||
|
||||
.module-scroll-button.active i::before,
|
||||
.calculator-scroll-toggle.active i::before {
|
||||
.tool-split-scroll-toggle.active i::before {
|
||||
left: 17px;
|
||||
background: var(--color-accent-gold);
|
||||
box-shadow: 0 0 10px rgba(246, 196, 83, 0.28);
|
||||
|
|
@ -1311,7 +1866,7 @@ textarea:focus {
|
|||
left: 15px;
|
||||
}
|
||||
|
||||
.calculator-tree {
|
||||
.tool-split-tree {
|
||||
display: grid;
|
||||
align-content: start;
|
||||
gap: 8px;
|
||||
|
|
@ -1319,12 +1874,12 @@ textarea:focus {
|
|||
min-height: 0;
|
||||
}
|
||||
|
||||
.calculator-tree.is-scrollable {
|
||||
.tool-split-tree.is-scrollable {
|
||||
overflow-y: auto;
|
||||
padding-right: 8px;
|
||||
}
|
||||
|
||||
.calculator-entry-list {
|
||||
.tool-split-entry-list {
|
||||
display: grid;
|
||||
gap: 6px;
|
||||
margin: 0;
|
||||
|
|
@ -1332,13 +1887,13 @@ textarea:focus {
|
|||
list-style: none;
|
||||
}
|
||||
|
||||
.calculator-entry-list .calculator-entry-list {
|
||||
.tool-split-entry-list .tool-split-entry-list {
|
||||
position: relative;
|
||||
margin-top: 6px;
|
||||
padding-left: 22px;
|
||||
}
|
||||
|
||||
.calculator-entry-list .calculator-entry-list::before {
|
||||
.tool-split-entry-list .tool-split-entry-list::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: -3px;
|
||||
|
|
@ -1348,11 +1903,11 @@ textarea:focus {
|
|||
background: linear-gradient(180deg, rgba(246, 196, 83, 0.52), rgba(139, 92, 246, 0.2));
|
||||
}
|
||||
|
||||
.calculator-entry-list .calculator-entry-list > li {
|
||||
.tool-split-entry-list .tool-split-entry-list > li {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.calculator-entry-list .calculator-entry-list > li::before {
|
||||
.tool-split-entry-list .tool-split-entry-list > li::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 18px;
|
||||
|
|
@ -1362,25 +1917,26 @@ textarea:focus {
|
|||
background: rgba(246, 196, 83, 0.52);
|
||||
}
|
||||
|
||||
.calculator-entry {
|
||||
.tool-split-entry {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr) 34px 34px;
|
||||
gap: 7px;
|
||||
}
|
||||
|
||||
.calculator-entry-list li.is-editing > .calculator-entry {
|
||||
.tool-split-entry-list li.is-editing > .tool-split-entry {
|
||||
grid-template-columns: auto minmax(0, 1fr) 34px 34px;
|
||||
}
|
||||
|
||||
.calculator-entry > button {
|
||||
.tool-split-entry > button {
|
||||
min-width: 0;
|
||||
min-height: 36px;
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.calculator-entry-summary,
|
||||
.calculator-entry-value {
|
||||
.tool-split-entry-summary,
|
||||
.tool-split-entry-value {
|
||||
display: inline-flex;
|
||||
box-sizing: border-box;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
border: 1px solid rgba(165, 180, 252, 0.09);
|
||||
|
|
@ -1391,15 +1947,17 @@ textarea:focus {
|
|||
text-align: left;
|
||||
}
|
||||
|
||||
.calculator-entry-summary {
|
||||
.tool-split-entry-summary {
|
||||
width: 100%;
|
||||
min-height: 36px;
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.calculator-entry-value {
|
||||
.tool-split-entry-value {
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
.calculator-entry-value.is-readonly {
|
||||
.tool-split-entry-value.is-readonly {
|
||||
min-height: 36px;
|
||||
padding: 0 10px;
|
||||
background: rgba(21, 26, 48, 0.38);
|
||||
|
|
@ -1407,25 +1965,26 @@ textarea:focus {
|
|||
opacity: 0.72;
|
||||
}
|
||||
|
||||
.calculator-entry-summary:hover,
|
||||
.calculator-entry-value:not(.is-readonly):hover {
|
||||
.tool-split-entry-summary:hover,
|
||||
.tool-split-entry-value:not(.is-readonly):hover {
|
||||
border-color: rgba(196, 181, 253, 0.2);
|
||||
background: rgba(21, 26, 48, 0.72);
|
||||
}
|
||||
|
||||
.calculator-entry-summary span {
|
||||
.tool-split-entry-summary > span {
|
||||
overflow: hidden;
|
||||
color: var(--color-text-secondary);
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.calculator-entry-summary strong,
|
||||
.calculator-entry-value strong {
|
||||
.tool-split-entry-summary strong,
|
||||
.tool-split-entry-value strong {
|
||||
color: var(--color-text-primary);
|
||||
}
|
||||
|
||||
.calculator-entry-label {
|
||||
.tool-split-entry-label {
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
min-height: 36px;
|
||||
|
|
@ -1438,26 +1997,26 @@ textarea:focus {
|
|||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.calculator-entry-label:hover,
|
||||
.calculator-entry-label:focus {
|
||||
.tool-split-entry-label:hover,
|
||||
.tool-split-entry-label:focus {
|
||||
border-color: rgba(196, 181, 253, 0.22);
|
||||
background: rgba(21, 26, 48, 0.58);
|
||||
color: var(--color-text-primary);
|
||||
}
|
||||
|
||||
.calculator-entry .ui-icon {
|
||||
.tool-split-entry .ui-icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
opacity: 0.72;
|
||||
}
|
||||
|
||||
.calculator-entry > button:not(.calculator-entry-summary, .calculator-entry-value) {
|
||||
.tool-split-entry > button:not(.tool-split-entry-summary, .tool-split-entry-value) {
|
||||
min-height: 36px;
|
||||
}
|
||||
|
||||
.calculator-entry-list li.active > .calculator-entry > .calculator-entry-summary,
|
||||
.calculator-entry-list li.active > .calculator-entry > .calculator-entry-value,
|
||||
.calculator-entry-list li.active > .calculator-entry > .calculator-entry-label {
|
||||
.tool-split-entry-list li.active > .tool-split-entry > .tool-split-entry-summary,
|
||||
.tool-split-entry-list li.active > .tool-split-entry > .tool-split-entry-value,
|
||||
.tool-split-entry-list li.active > .tool-split-entry > .tool-split-entry-label {
|
||||
border-color: var(--color-accent-gold);
|
||||
background:
|
||||
linear-gradient(135deg, rgba(246, 196, 83, 0.09), rgba(139, 92, 246, 0.1)),
|
||||
|
|
@ -1602,7 +2161,7 @@ textarea:focus {
|
|||
gap: var(--space-2);
|
||||
}
|
||||
|
||||
.annotation-preview-actions .calculator-action-button {
|
||||
.annotation-preview-actions .tool-split-action-button {
|
||||
background: rgba(21, 26, 48, 0.94);
|
||||
box-shadow:
|
||||
0 6px 18px rgba(5, 7, 17, 0.28),
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue