intermittent commit
This commit is contained in:
@@ -19,9 +19,9 @@
|
||||
display: inline-block;
|
||||
width: 18px;
|
||||
height: 13px;
|
||||
border: 2px solid #8c8881;
|
||||
border: 2px solid var(--loading-line);
|
||||
border-radius: 3px;
|
||||
background: rgba(255,255,255,.7);
|
||||
background: var(--loading-envelope-bg);
|
||||
animation: loading-envelope-float .74s ease-in-out infinite alternate;
|
||||
}
|
||||
.loading-envelope::before,
|
||||
@@ -31,7 +31,7 @@
|
||||
top: 1px;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-top: 2px solid #8c8881;
|
||||
border-top: 2px solid var(--loading-line);
|
||||
}
|
||||
.loading-envelope::before {
|
||||
left: 1px;
|
||||
@@ -64,19 +64,19 @@
|
||||
align-items: center;
|
||||
gap: 7px;
|
||||
max-width: 100%;
|
||||
border: 1px solid #c9c5bd;
|
||||
border: 1px solid var(--control-border);
|
||||
border-radius: 999px;
|
||||
background: linear-gradient(#ffffff, #f2f1ef);
|
||||
box-shadow: inset 0 1px 0 rgba(255,255,255,.85), 0 1px 1px rgba(0,0,0,.05);
|
||||
background: linear-gradient(var(--control-gradient-start), var(--control-gradient-end));
|
||||
box-shadow: var(--shadow-control-strong);
|
||||
padding: 5px 8px 5px 11px;
|
||||
color: var(--text-strong);
|
||||
font-size: 13px;
|
||||
line-height: 1.2;
|
||||
}
|
||||
.email-chip.invalid {
|
||||
border-color: #c96b63;
|
||||
background: #f6e3df;
|
||||
color: #873c35;
|
||||
border-color: var(--danger-border);
|
||||
background: var(--danger-soft);
|
||||
color: var(--danger-text-deep);
|
||||
}
|
||||
.email-chip-main {
|
||||
overflow: hidden;
|
||||
@@ -99,14 +99,14 @@
|
||||
height: 18px;
|
||||
border: 0;
|
||||
border-radius: 999px;
|
||||
background: rgba(0,0,0,.08);
|
||||
color: #57534d;
|
||||
background: var(--hover-tint);
|
||||
color: var(--control-text-muted);
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
line-height: 1;
|
||||
padding: 0;
|
||||
}
|
||||
.email-chip-remove:hover { background: rgba(0,0,0,.15); }
|
||||
.email-chip-remove:hover { background: var(--hover-tint-strong); }
|
||||
.email-chip-empty {
|
||||
color: var(--muted);
|
||||
font-size: 13px;
|
||||
@@ -148,7 +148,7 @@
|
||||
align-items: center;
|
||||
gap: 8px 10px;
|
||||
padding: 8px 10px;
|
||||
border: 1px solid var(--line);
|
||||
border: var(--border-line);
|
||||
border-radius: var(--radius-sm);
|
||||
background: var(--surface);
|
||||
color: var(--muted);
|
||||
@@ -224,14 +224,40 @@
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
.password-field-toggle:hover {
|
||||
background: rgba(0, 0, 0, .06);
|
||||
background: var(--hover-tint-soft);
|
||||
color: var(--text-strong);
|
||||
}
|
||||
.password-field-toggle:focus-visible {
|
||||
outline: 2px solid color-mix(in srgb, var(--blue) 55%, #fff);
|
||||
outline: var(--focus-outline);
|
||||
outline-offset: 1px;
|
||||
}
|
||||
|
||||
.credential-panel {
|
||||
display: grid;
|
||||
gap: 12px;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.credential-panel-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
gap: 18px;
|
||||
align-items: start;
|
||||
}
|
||||
|
||||
.credential-panel-heading {
|
||||
grid-column: 1 / -1;
|
||||
margin: 2px 0 -4px;
|
||||
color: var(--text-strong);
|
||||
font-size: 13px;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.credential-panel-extra {
|
||||
display: grid;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.color-picker-field,
|
||||
.date-field,
|
||||
.time-field {
|
||||
@@ -261,9 +287,9 @@
|
||||
z-index: 1;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
border: 1px solid var(--line-dark);
|
||||
border: var(--border-line-dark);
|
||||
border-radius: 4px;
|
||||
box-shadow: inset 0 1px 0 rgba(255,255,255,.45);
|
||||
box-shadow: var(--shadow-inset-highlight);
|
||||
}
|
||||
|
||||
.color-picker-trigger,
|
||||
@@ -287,7 +313,7 @@
|
||||
.color-picker-trigger:focus-visible,
|
||||
.date-field-trigger:hover:not(:disabled),
|
||||
.date-field-trigger:focus-visible {
|
||||
background: rgba(0,0,0,.08);
|
||||
background: var(--hover-tint);
|
||||
color: var(--text-strong);
|
||||
}
|
||||
|
||||
@@ -307,10 +333,10 @@
|
||||
width: max-content;
|
||||
min-width: 220px;
|
||||
padding: 10px;
|
||||
border: 1px solid var(--line-dark);
|
||||
border: var(--border-line-dark);
|
||||
border-radius: 8px;
|
||||
background: var(--panel);
|
||||
box-shadow: 0 16px 34px rgba(0,0,0,.18);
|
||||
box-shadow: var(--shadow-menu);
|
||||
}
|
||||
|
||||
.color-picker-grid {
|
||||
@@ -322,10 +348,10 @@
|
||||
.color-picker-grid button {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
border: 1px solid rgba(0,0,0,.2);
|
||||
border: 1px solid var(--black-border-soft);
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
box-shadow: inset 0 1px 0 rgba(255,255,255,.45);
|
||||
box-shadow: var(--shadow-inset-highlight);
|
||||
}
|
||||
|
||||
.color-picker-grid button.is-selected {
|
||||
@@ -355,7 +381,7 @@
|
||||
justify-content: center;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
border: 1px solid var(--line);
|
||||
border: var(--border-line);
|
||||
border-radius: 4px;
|
||||
background: var(--surface);
|
||||
color: var(--text);
|
||||
@@ -401,9 +427,9 @@
|
||||
}
|
||||
|
||||
.date-field-grid button.is-selected {
|
||||
border-color: #5aa99b;
|
||||
border-color: var(--success-border);
|
||||
background: var(--green);
|
||||
color: #fff;
|
||||
color: var(--on-accent);
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
@@ -426,7 +452,7 @@
|
||||
}
|
||||
|
||||
.admin-overview-link {
|
||||
border: 1px solid var(--line);
|
||||
border: var(--border-line);
|
||||
border-radius: 6px;
|
||||
background: var(--panel-soft);
|
||||
padding: 14px;
|
||||
@@ -436,7 +462,7 @@
|
||||
}
|
||||
|
||||
.admin-overview-link:hover {
|
||||
background: #fff;
|
||||
background: var(--surface);
|
||||
border-color: var(--line-dark);
|
||||
}
|
||||
|
||||
@@ -467,7 +493,7 @@
|
||||
grid-template-columns: minmax(0, 1fr) 170px;
|
||||
align-items: center;
|
||||
gap: 18px;
|
||||
border: 1px solid var(--line);
|
||||
border: var(--border-line);
|
||||
border-radius: 6px;
|
||||
background: var(--panel);
|
||||
box-shadow: var(--shadow);
|
||||
@@ -551,7 +577,7 @@
|
||||
grid-template-columns: minmax(0, 1fr) auto;
|
||||
align-items: center;
|
||||
gap: 14px;
|
||||
border: 1px solid var(--line);
|
||||
border: var(--border-line);
|
||||
border-radius: 6px;
|
||||
background: var(--panel);
|
||||
box-shadow: var(--shadow);
|
||||
@@ -616,7 +642,7 @@
|
||||
.module-install-preflight {
|
||||
display: grid;
|
||||
gap: 10px;
|
||||
border: 1px solid var(--line);
|
||||
border: var(--border-line);
|
||||
border-radius: 6px;
|
||||
background: var(--panel-soft);
|
||||
padding: 12px 14px;
|
||||
@@ -657,7 +683,7 @@
|
||||
min-height: 30px;
|
||||
padding: 6px 8px;
|
||||
border-radius: 4px;
|
||||
background: rgba(255,255,255,.58);
|
||||
background: var(--panel-glass);
|
||||
}
|
||||
|
||||
.module-install-preflight-issue strong {
|
||||
@@ -686,9 +712,9 @@
|
||||
gap: 4px;
|
||||
align-content: start;
|
||||
min-height: 86px;
|
||||
border: 1px solid var(--line);
|
||||
border: var(--border-line);
|
||||
border-radius: 6px;
|
||||
background: rgba(255,255,255,.6);
|
||||
background: var(--panel-glass);
|
||||
padding: 9px 10px;
|
||||
}
|
||||
|
||||
@@ -743,7 +769,7 @@
|
||||
grid-template-columns: 130px 150px 170px minmax(260px, 1fr);
|
||||
gap: 12px;
|
||||
align-items: end;
|
||||
border: 1px solid var(--line);
|
||||
border: var(--border-line);
|
||||
border-radius: 6px;
|
||||
background: var(--panel);
|
||||
box-shadow: var(--shadow);
|
||||
@@ -818,7 +844,7 @@
|
||||
grid-template-columns: minmax(0, 1fr) minmax(220px, 34%);
|
||||
align-items: center;
|
||||
gap: 14px;
|
||||
border: 1px solid var(--line);
|
||||
border: var(--border-line);
|
||||
border-radius: 6px;
|
||||
background: var(--panel);
|
||||
box-shadow: var(--shadow);
|
||||
@@ -976,9 +1002,9 @@
|
||||
max-height: 300px;
|
||||
overflow: auto;
|
||||
padding: 8px;
|
||||
border: 1px solid var(--line);
|
||||
border: var(--border-line);
|
||||
border-radius: var(--radius-sm);
|
||||
background: var(--surface-muted, #f6f7f9);
|
||||
background: var(--surface-muted);
|
||||
}
|
||||
|
||||
.admin-selection-item {
|
||||
@@ -992,7 +1018,7 @@
|
||||
}
|
||||
|
||||
.admin-selection-item:hover {
|
||||
background: var(--surface, #fff);
|
||||
background: var(--surface);
|
||||
}
|
||||
|
||||
.admin-selection-item.disabled {
|
||||
@@ -1036,8 +1062,8 @@
|
||||
|
||||
.guided-config-sidebar {
|
||||
min-width: 0;
|
||||
border-right: 1px solid var(--line);
|
||||
background: #f6f5f3;
|
||||
border-right: var(--border-line);
|
||||
background: var(--panel-soft);
|
||||
}
|
||||
|
||||
.guided-config-sidebar .stepper {
|
||||
@@ -1109,7 +1135,7 @@
|
||||
gap: 14px;
|
||||
min-width: 0;
|
||||
padding: 15px;
|
||||
border: 1px solid var(--line);
|
||||
border: var(--border-line);
|
||||
border-radius: 7px;
|
||||
background: var(--panel);
|
||||
}
|
||||
@@ -1134,7 +1160,7 @@
|
||||
}
|
||||
|
||||
.advanced-options-panel {
|
||||
border: 1px solid var(--line);
|
||||
border: var(--border-line);
|
||||
border-radius: 7px;
|
||||
background: var(--panel);
|
||||
}
|
||||
@@ -1248,7 +1274,7 @@
|
||||
}
|
||||
|
||||
.action-blocker-technical {
|
||||
background: rgba(255,255,255,.56);
|
||||
background: var(--panel-glass);
|
||||
}
|
||||
|
||||
.guided-review-list {
|
||||
@@ -1271,7 +1297,7 @@
|
||||
align-items: start;
|
||||
min-width: 0;
|
||||
padding: 10px 12px;
|
||||
border: 1px solid var(--line);
|
||||
border: var(--border-line);
|
||||
border-left-width: 4px;
|
||||
border-left-color: var(--line-dark);
|
||||
border-radius: 7px;
|
||||
@@ -1327,7 +1353,7 @@
|
||||
|
||||
.guided-config-sidebar {
|
||||
border-right: 0;
|
||||
border-bottom: 1px solid var(--line);
|
||||
border-bottom: var(--border-line);
|
||||
}
|
||||
|
||||
.guided-config-sidebar .stepper {
|
||||
@@ -1350,19 +1376,19 @@
|
||||
flex-wrap: wrap;
|
||||
gap: 7px;
|
||||
min-height: 44px;
|
||||
border: 1px solid var(--line);
|
||||
border: var(--border-line);
|
||||
border-radius: 8px;
|
||||
background: #fff;
|
||||
box-shadow: inset 0 1px 0 rgba(255,255,255,.75), 0 1px 2px rgba(0,0,0,.035);
|
||||
background: var(--surface);
|
||||
box-shadow: var(--shadow-control-surface);
|
||||
padding: 7px 8px;
|
||||
}
|
||||
.email-address-editor:focus-within {
|
||||
border-color: #9bb7d3;
|
||||
box-shadow: 0 0 0 3px rgba(82, 130, 177, .14), inset 0 1px 0 rgba(255,255,255,.8);
|
||||
border-color: var(--input-border-focus);
|
||||
box-shadow: var(--focus-ring), var(--shadow-inset-highlight-strong);
|
||||
}
|
||||
.email-address-editor.has-error {
|
||||
border-color: #c96b63;
|
||||
box-shadow: 0 0 0 3px rgba(201, 107, 99, .13);
|
||||
border-color: var(--danger-border);
|
||||
box-shadow: var(--danger-focus-ring-soft);
|
||||
}
|
||||
.email-address-editor .email-chip-list {
|
||||
display: flex;
|
||||
@@ -1402,10 +1428,10 @@
|
||||
justify-content: center;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
border: 1px solid #c7c2b8;
|
||||
border: 1px solid var(--control-border);
|
||||
border-radius: 999px;
|
||||
background: linear-gradient(#fff, #f0efec);
|
||||
color: #4f4b46;
|
||||
background: linear-gradient(var(--control-gradient-start), var(--control-gradient-end-muted));
|
||||
color: var(--control-text);
|
||||
cursor: pointer;
|
||||
font-size: 19px;
|
||||
font-weight: 800;
|
||||
@@ -1413,8 +1439,8 @@
|
||||
padding: 0;
|
||||
}
|
||||
.email-address-plus:hover {
|
||||
border-color: #aaa49a;
|
||||
background: linear-gradient(#fff, #e9e7e3);
|
||||
border-color: var(--control-border-hover);
|
||||
background: linear-gradient(var(--control-gradient-start), var(--control-gradient-end-hover));
|
||||
}
|
||||
.email-address-popover {
|
||||
position: absolute;
|
||||
@@ -1424,9 +1450,9 @@
|
||||
width: min(360px, calc(100vw - 64px));
|
||||
display: grid;
|
||||
gap: 10px;
|
||||
border: 1px solid var(--line-dark);
|
||||
border: var(--border-line-dark);
|
||||
border-radius: 8px;
|
||||
background: #fff;
|
||||
background: var(--surface);
|
||||
box-shadow: var(--shadow-popover);
|
||||
padding: 14px;
|
||||
}
|
||||
@@ -1449,10 +1475,10 @@
|
||||
display: grid;
|
||||
gap: 4px;
|
||||
max-width: 560px;
|
||||
border: 1px solid var(--line);
|
||||
border: var(--border-line);
|
||||
border-radius: 8px;
|
||||
background: #fff;
|
||||
box-shadow: 0 8px 24px rgba(0,0,0,.08);
|
||||
background: var(--surface);
|
||||
box-shadow: 0 8px 24px var(--hover-tint);
|
||||
padding: 6px;
|
||||
}
|
||||
.email-address-suggestions button {
|
||||
@@ -1521,10 +1547,10 @@
|
||||
flex: 0 0 auto;
|
||||
width: 42px;
|
||||
height: 24px;
|
||||
border: 1px solid #aeb4bb;
|
||||
border: 1px solid var(--toggle-track-border);
|
||||
border-radius: 999px;
|
||||
background: #cfd4da;
|
||||
box-shadow: inset 0 1px 2px rgba(0,0,0,.12);
|
||||
background: var(--toggle-track-bg);
|
||||
box-shadow: var(--shadow-control-inset-strong);
|
||||
transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease;
|
||||
}
|
||||
.toggle-switch-thumb {
|
||||
@@ -1534,19 +1560,19 @@
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
border-radius: 999px;
|
||||
background: #fff;
|
||||
box-shadow: 0 1px 2px rgba(0,0,0,.22);
|
||||
background: var(--surface);
|
||||
box-shadow: var(--shadow-thumb);
|
||||
transition: transform .16s ease;
|
||||
}
|
||||
.toggle-switch-input:checked + .toggle-switch-track {
|
||||
border-color: #0d6efd;
|
||||
background: #0d6efd;
|
||||
border-color: var(--primary);
|
||||
background: var(--primary);
|
||||
}
|
||||
.toggle-switch-input:checked + .toggle-switch-track .toggle-switch-thumb {
|
||||
transform: translateX(18px);
|
||||
}
|
||||
.toggle-switch-input:focus-visible + .toggle-switch-track {
|
||||
box-shadow: 0 0 0 3px rgba(13,110,253,.2), inset 0 1px 2px rgba(0,0,0,.12);
|
||||
box-shadow: var(--primary-focus-ring-soft), var(--shadow-control-inset-strong);
|
||||
}
|
||||
.toggle-switch-input:disabled + .toggle-switch-track {
|
||||
filter: grayscale(.15);
|
||||
@@ -1604,7 +1630,7 @@
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
border-radius: 999px;
|
||||
color: #686560;
|
||||
color: var(--text-subtle);
|
||||
background: var(--line-dark);
|
||||
font-size: 11px;
|
||||
font-weight: 800;
|
||||
@@ -1627,7 +1653,7 @@
|
||||
.policy-table {
|
||||
display: grid;
|
||||
gap: 0;
|
||||
border: 1px solid var(--line);
|
||||
border: var(--border-line);
|
||||
border-radius: var(--radius-sm);
|
||||
overflow: hidden;
|
||||
}
|
||||
@@ -1646,7 +1672,7 @@
|
||||
gap: 14px;
|
||||
padding: 12px 14px;
|
||||
background: var(--surface);
|
||||
border-top: 1px solid var(--line);
|
||||
border-top: var(--border-line);
|
||||
}
|
||||
.policy-row:first-child {
|
||||
border-top: 0;
|
||||
@@ -1712,7 +1738,7 @@
|
||||
width: max-content;
|
||||
max-width: min(320px, calc(100vw - 48px));
|
||||
transform: translate(-50%, 3px);
|
||||
border: 1px solid var(--line-dark);
|
||||
border: var(--border-line-dark);
|
||||
border-radius: 7px;
|
||||
background: var(--surface);
|
||||
box-shadow: var(--shadow-popover);
|
||||
@@ -1734,8 +1760,8 @@
|
||||
top: 100%;
|
||||
width: 9px;
|
||||
height: 9px;
|
||||
border-right: 1px solid var(--line-dark);
|
||||
border-bottom: 1px solid var(--line-dark);
|
||||
border-right: var(--border-line-dark);
|
||||
border-bottom: var(--border-line-dark);
|
||||
background: var(--surface);
|
||||
transform: translate(-50%, -5px) rotate(45deg);
|
||||
}
|
||||
@@ -1767,8 +1793,8 @@
|
||||
}
|
||||
|
||||
.field-input-missing {
|
||||
border-color: #b42318 !important;
|
||||
box-shadow: 0 0 0 3px rgba(180, 35, 24, .14) !important;
|
||||
border-color: var(--danger-border-deep) !important;
|
||||
box-shadow: var(--danger-focus-ring) !important;
|
||||
}
|
||||
|
||||
.disabled-action-tooltip {
|
||||
@@ -1776,19 +1802,27 @@
|
||||
display: inline-flex;
|
||||
}
|
||||
|
||||
.disabled-action-tooltip:focus-visible {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.disabled-action-tooltip:focus-visible > .btn {
|
||||
box-shadow: var(--focus-ring);
|
||||
}
|
||||
|
||||
.disabled-action-tooltip[data-tooltip]:not([data-tooltip=""]):hover::after,
|
||||
.disabled-action-tooltip[data-tooltip]:not([data-tooltip=""]):focus-within::after {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: calc(100% + 10px);
|
||||
z-index: 80;
|
||||
z-index: 20000;
|
||||
width: min(280px, 72vw);
|
||||
padding: 9px 11px;
|
||||
border: 1px solid rgba(180, 35, 24, .24);
|
||||
border: 1px solid var(--border-danger-soft);
|
||||
border-radius: var(--radius-sm, 8px);
|
||||
color: #7a241c;
|
||||
background: #fff7f5;
|
||||
box-shadow: var(--shadow-popover, 0 16px 32px rgba(15, 23, 42, .18));
|
||||
color: var(--danger-text-tooltip);
|
||||
background: var(--danger-muted-bg);
|
||||
box-shadow: var(--shadow-popover);
|
||||
content: attr(data-tooltip);
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
@@ -1819,7 +1853,7 @@
|
||||
min-height: 120px;
|
||||
padding: 1.25rem;
|
||||
border-radius: var(--radius-lg, 18px);
|
||||
background: rgba(255, 255, 255, 0.00);
|
||||
background: var(--transparent-surface);
|
||||
backdrop-filter: blur(1.5px);
|
||||
margin: -10px;
|
||||
}
|
||||
@@ -1829,11 +1863,11 @@
|
||||
align-items: center;
|
||||
gap: 0.65rem;
|
||||
padding: 0.75rem 1rem;
|
||||
border: 1px solid var(--border-soft, rgba(15, 23, 42, 0.12));
|
||||
border: 1px solid var(--border-soft);
|
||||
border-radius: 999px;
|
||||
color: var(--text, #172033);
|
||||
background: rgba(255, 255, 255, 0.86);
|
||||
box-shadow: var(--shadow-soft, 0 10px 28px rgba(15, 23, 42, 0.12));
|
||||
color: var(--text);
|
||||
background: var(--panel-glass-strong);
|
||||
box-shadow: var(--shadow-soft);
|
||||
font-size: 0.9rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
@@ -1853,21 +1887,21 @@
|
||||
justify-content: center;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border: 1px solid #c9c3b9;
|
||||
border: 1px solid var(--control-border);
|
||||
border-radius: 999px;
|
||||
background: linear-gradient(#ffffff, #f1efeb);
|
||||
color: #4f4a43;
|
||||
background: linear-gradient(var(--control-gradient-start), var(--control-gradient-end-muted));
|
||||
color: var(--control-text);
|
||||
cursor: pointer;
|
||||
box-shadow: inset 0 1px 0 rgba(255,255,255,.75), 0 1px 1px rgba(0,0,0,.05);
|
||||
box-shadow: var(--shadow-control);
|
||||
transition: transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
|
||||
}
|
||||
.card-collapse-toggle:hover {
|
||||
border-color: #aaa299;
|
||||
background: linear-gradient(#ffffff, #e8e5df);
|
||||
box-shadow: inset 0 1px 0 rgba(255,255,255,.82), 0 2px 5px rgba(0,0,0,.08);
|
||||
border-color: var(--control-border-pressed);
|
||||
background: linear-gradient(var(--control-gradient-start), var(--control-gradient-end-pressed));
|
||||
box-shadow: var(--shadow-control-hover);
|
||||
}
|
||||
.card-collapse-toggle:focus-visible {
|
||||
outline: 3px solid rgba(82, 130, 177, .22);
|
||||
outline: 3px solid var(--focus-ring-color);
|
||||
outline-offset: 2px;
|
||||
}
|
||||
.card-collapse-toggle svg {
|
||||
@@ -1907,7 +1941,7 @@
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
position: relative;
|
||||
box-shadow: 0 12px 24px rgba(15, 23, 42, 0.08);
|
||||
box-shadow: var(--shadow-dismissible);
|
||||
}
|
||||
|
||||
.alert-dismissible .alert-message {
|
||||
@@ -1932,9 +1966,9 @@
|
||||
top: auto;
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
border: 1px solid rgba(15, 23, 42, 0.14);
|
||||
border: 1px solid var(--border-soft);
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 16px 38px rgba(15, 23, 42, 0.2);
|
||||
box-shadow: var(--shadow-floating);
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
@@ -1953,7 +1987,7 @@
|
||||
.alert-dismiss:hover,
|
||||
.alert-dismiss:focus-visible {
|
||||
opacity: 1;
|
||||
background: rgba(255, 255, 255, 0.45);
|
||||
background: var(--panel-glass-muted);
|
||||
}
|
||||
|
||||
|
||||
@@ -2015,7 +2049,7 @@
|
||||
.explorer-tree-node-wrap:hover,
|
||||
.explorer-tree-node-wrap:focus-within,
|
||||
.explorer-tree-node-wrap.is-active {
|
||||
background: rgba(13, 110, 253, .08);
|
||||
background: var(--primary-soft);
|
||||
outline: none;
|
||||
}
|
||||
|
||||
@@ -2029,14 +2063,14 @@
|
||||
flex-direction: column;
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
border-right: 1px solid var(--line);
|
||||
border-right: var(--border-line);
|
||||
background: linear-gradient(180deg, var(--panel-soft), var(--panel));
|
||||
}
|
||||
|
||||
.file-tree-heading {
|
||||
flex: 0 0 auto;
|
||||
padding: 13px 14px;
|
||||
border-bottom: 1px solid var(--line);
|
||||
border-bottom: var(--border-line);
|
||||
color: var(--muted);
|
||||
font-size: 12px;
|
||||
font-weight: 800;
|
||||
@@ -2054,7 +2088,7 @@
|
||||
.file-tree-space + .file-tree-space {
|
||||
margin-top: 10px;
|
||||
padding-top: 10px;
|
||||
border-top: 1px solid var(--line);
|
||||
border-top: var(--border-line);
|
||||
}
|
||||
|
||||
.file-tree-node-wrap {
|
||||
@@ -2143,8 +2177,8 @@
|
||||
}
|
||||
|
||||
.file-tree-node-wrap.is-selected .file-tree-select {
|
||||
background: #0d6efd;
|
||||
color: #fff;
|
||||
background: var(--primary);
|
||||
color: var(--on-accent);
|
||||
}
|
||||
|
||||
.file-tree-children {
|
||||
@@ -2159,10 +2193,10 @@
|
||||
justify-content: start;
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
border: 1px solid #c9c3b9;
|
||||
border: var(--border-line-dark);
|
||||
border-radius: 8px;
|
||||
background: #c9c3b9;
|
||||
box-shadow: inset 0 1px 0 rgba(255,255,255,.75), 0 1px 1px rgba(0,0,0,.05);
|
||||
background: var(--line-dark);
|
||||
box-shadow: var(--shadow-control);
|
||||
}
|
||||
|
||||
.segmented-control-size-content {
|
||||
@@ -2186,18 +2220,18 @@
|
||||
min-height: 32px;
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
background: linear-gradient(#ffffff, #f1efeb);
|
||||
color: #4f4a43;
|
||||
background: linear-gradient(var(--surface), var(--panel));
|
||||
color: var(--text);
|
||||
cursor: pointer;
|
||||
font: inherit;
|
||||
font-size: 13px;
|
||||
font-weight: 800;
|
||||
box-shadow: inset 0 1px 0 rgba(255,255,255,.75), 0 1px 1px rgba(0,0,0,.05);
|
||||
box-shadow: var(--shadow-control);
|
||||
transition: background .18s ease, box-shadow .18s ease, color .18s ease;
|
||||
}
|
||||
|
||||
.segmented-control-option + .segmented-control-option {
|
||||
border-left: 1px solid #c9c3b9;
|
||||
border-left: var(--border-line-dark);
|
||||
}
|
||||
|
||||
.segmented-control-option:first-child {
|
||||
@@ -2210,13 +2244,13 @@
|
||||
|
||||
.segmented-control-option:hover,
|
||||
.segmented-control-option:focus-visible {
|
||||
background: linear-gradient(#ffffff, #e8e5df);
|
||||
color: #4f4a43;
|
||||
box-shadow: inset 0 1px 0 rgba(255,255,255,.82), 0 2px 5px rgba(0,0,0,.08);
|
||||
background: linear-gradient(var(--surface), var(--bar));
|
||||
color: var(--text-strong);
|
||||
box-shadow: var(--shadow-control-hover);
|
||||
}
|
||||
|
||||
.segmented-control-option:focus-visible {
|
||||
outline: 3px solid rgba(82, 130, 177, .22);
|
||||
outline: 3px solid var(--focus-ring-color);
|
||||
outline-offset: -1px;
|
||||
}
|
||||
|
||||
@@ -2224,7 +2258,7 @@
|
||||
.segmented-control-option.active {
|
||||
background: var(--line);
|
||||
color: var(--text-strong);
|
||||
box-shadow: inset 0 2px 5px rgba(0,0,0,.12), inset 0 -1px 0 rgba(255,255,255,.45);
|
||||
box-shadow: inset 0 2px 5px rgba(var(--shadow-color-rgb), .12), var(--shadow-inset-highlight);
|
||||
}
|
||||
|
||||
.segmented-control-option.is-active:hover,
|
||||
@@ -2232,7 +2266,7 @@
|
||||
.segmented-control-option.active:hover,
|
||||
.segmented-control-option.active:focus-visible {
|
||||
background: var(--line);
|
||||
box-shadow: inset 0 2px 5px rgba(0,0,0,.14), inset 0 -1px 0 rgba(255,255,255,.45);
|
||||
box-shadow: inset 0 2px 5px rgba(var(--shadow-color-rgb), .14), var(--shadow-inset-highlight);
|
||||
}
|
||||
|
||||
.segmented-control-option:disabled {
|
||||
@@ -2240,6 +2274,84 @@
|
||||
opacity: .55;
|
||||
}
|
||||
|
||||
.theme-preview-list {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.theme-preview {
|
||||
--preview-bg: var(--theme-preview-light-bg);
|
||||
--preview-bar: var(--theme-preview-light-bar);
|
||||
--preview-surface: var(--theme-preview-light-surface);
|
||||
--preview-line: var(--theme-preview-light-line);
|
||||
--preview-text: var(--theme-preview-light-text);
|
||||
--preview-muted: var(--theme-preview-light-muted);
|
||||
display: grid;
|
||||
gap: 0;
|
||||
min-height: 112px;
|
||||
overflow: hidden;
|
||||
border: var(--border-line);
|
||||
border-radius: var(--radius-sm);
|
||||
background: var(--preview-bg);
|
||||
}
|
||||
|
||||
.theme-preview[data-preview-theme="dark"] {
|
||||
--preview-bg: var(--theme-preview-dark-bg);
|
||||
--preview-bar: var(--theme-preview-dark-bar);
|
||||
--preview-surface: var(--theme-preview-dark-surface);
|
||||
--preview-line: var(--theme-preview-dark-line);
|
||||
--preview-text: var(--theme-preview-dark-text);
|
||||
--preview-muted: var(--theme-preview-dark-muted);
|
||||
}
|
||||
|
||||
.theme-preview-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 10px;
|
||||
padding: 10px 12px;
|
||||
border-bottom: 1px solid var(--preview-line);
|
||||
background: var(--preview-bar);
|
||||
color: var(--preview-text);
|
||||
font-size: 12px;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.theme-preview-header i {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
border-radius: 50%;
|
||||
background: var(--accent);
|
||||
box-shadow: 0 0 0 3px var(--accent-soft);
|
||||
}
|
||||
|
||||
.theme-preview-body {
|
||||
display: grid;
|
||||
align-content: start;
|
||||
gap: 8px;
|
||||
padding: 12px;
|
||||
background: var(--preview-surface);
|
||||
color: var(--preview-text);
|
||||
}
|
||||
|
||||
.theme-preview-body strong {
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.theme-preview-body span {
|
||||
display: block;
|
||||
height: 8px;
|
||||
border-radius: 4px;
|
||||
background: var(--preview-line);
|
||||
}
|
||||
|
||||
.theme-preview-body span:last-child {
|
||||
width: 68%;
|
||||
background: var(--preview-muted);
|
||||
opacity: .45;
|
||||
}
|
||||
|
||||
.message-display-panel {
|
||||
display: grid;
|
||||
gap: 14px;
|
||||
@@ -2327,7 +2439,7 @@
|
||||
max-height: 420px;
|
||||
margin: 0;
|
||||
overflow: auto;
|
||||
border: 1px solid var(--line);
|
||||
border: var(--border-line);
|
||||
border-radius: var(--radius-sm);
|
||||
background: var(--surface-subtle);
|
||||
color: var(--text);
|
||||
@@ -2342,7 +2454,7 @@
|
||||
|
||||
.message-display-html-frame {
|
||||
height: 420px;
|
||||
background: #fff;
|
||||
background: var(--white);
|
||||
}
|
||||
|
||||
.message-display-attachments {
|
||||
@@ -2372,7 +2484,7 @@
|
||||
gap: 8px;
|
||||
align-items: start;
|
||||
padding: 8px 10px;
|
||||
border: 1px solid var(--line);
|
||||
border: var(--border-line);
|
||||
border-radius: var(--radius-sm);
|
||||
background: var(--surface);
|
||||
}
|
||||
@@ -2413,7 +2525,7 @@
|
||||
display: grid;
|
||||
gap: 8px;
|
||||
padding: 10px;
|
||||
border: 1px solid var(--line);
|
||||
border: var(--border-line);
|
||||
border-radius: var(--radius-sm);
|
||||
background: var(--surface-subtle);
|
||||
}
|
||||
@@ -2514,7 +2626,7 @@
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
.mail-server-toggle-row {
|
||||
border: 1px solid var(--line);
|
||||
border: var(--border-line);
|
||||
border-radius: 8px;
|
||||
background: var(--panel-soft);
|
||||
}
|
||||
@@ -2544,7 +2656,7 @@
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
min-height: 24px;
|
||||
border: 1px solid var(--line);
|
||||
border: var(--border-line);
|
||||
border-radius: 99px;
|
||||
background: var(--panel-soft);
|
||||
padding: 3px 9px;
|
||||
@@ -2559,6 +2671,7 @@
|
||||
.form-grid.compact.mail-server-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
|
||||
}
|
||||
@media (max-width: 720px) {
|
||||
.credential-panel-grid { grid-template-columns: 1fr; }
|
||||
.form-grid.compact.mail-server-form-grid { grid-template-columns: 1fr; }
|
||||
.mail-server-section-heading.split { align-items: flex-start; flex-direction: column; }
|
||||
.mail-server-segmented-control { width: 100%; }
|
||||
@@ -2588,20 +2701,20 @@
|
||||
.file-drop-zone:hover,
|
||||
.file-drop-zone:focus-visible,
|
||||
.file-drop-zone.is-active {
|
||||
border-color: #0d6efd;
|
||||
background: rgba(13, 110, 253, .08);
|
||||
border-color: var(--primary);
|
||||
background: var(--primary-soft);
|
||||
}
|
||||
.file-drop-zone:focus-visible {
|
||||
outline: none;
|
||||
box-shadow: 0 0 0 3px rgba(13, 110, 253, .18);
|
||||
box-shadow: var(--primary-focus-ring);
|
||||
}
|
||||
.file-drop-zone[aria-disabled="true"] {
|
||||
cursor: not-allowed;
|
||||
opacity: .65;
|
||||
}
|
||||
.file-drop-zone.is-busy {
|
||||
border-color: #0d6efd;
|
||||
background: rgba(13, 110, 253, .08);
|
||||
border-color: var(--primary);
|
||||
background: var(--primary-soft);
|
||||
cursor: progress;
|
||||
opacity: 1;
|
||||
}
|
||||
@@ -2613,7 +2726,7 @@
|
||||
width: 58px;
|
||||
height: 58px;
|
||||
border-radius: 50%;
|
||||
background: conic-gradient(#0d6efd var(--file-drop-progress), rgba(13, 110, 253, .16) 0);
|
||||
background: conic-gradient(var(--primary) var(--file-drop-progress), var(--primary-soft-strong) 0);
|
||||
color: var(--text-strong);
|
||||
font-size: 12px;
|
||||
font-weight: 800;
|
||||
@@ -2625,14 +2738,14 @@
|
||||
inset: 6px;
|
||||
border-radius: 50%;
|
||||
background: var(--panel-soft);
|
||||
box-shadow: inset 0 0 0 1px rgba(13, 110, 253, .12);
|
||||
box-shadow: var(--primary-inset-ring);
|
||||
}
|
||||
.file-drop-progress > span {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.file-drop-progress.is-indeterminate {
|
||||
background: conic-gradient(#0d6efd 0 32%, rgba(13, 110, 253, .16) 32% 100%);
|
||||
background: conic-gradient(var(--primary) 0 32%, var(--primary-soft-strong) 32% 100%);
|
||||
animation: file-drop-progress-spin .85s linear infinite;
|
||||
}
|
||||
@keyframes file-drop-progress-spin {
|
||||
|
||||
Reference in New Issue
Block a user