style: use shared WebUI foundation tokens

This commit is contained in:
2026-08-18 21:32:50 +02:00
parent e9561a87e1
commit 25140fb0b6
+20 -20
View File
@@ -113,7 +113,7 @@
min-width: 190px; min-width: 190px;
overflow: hidden; overflow: hidden;
border: var(--border-line-dark); border: var(--border-line-dark);
border-radius: 12px; border-radius: var(--radius-lg);
background: var(--panel); background: var(--panel);
box-shadow: var(--shadow-popover); box-shadow: var(--shadow-popover);
padding: 6px; padding: 6px;
@@ -125,7 +125,7 @@
gap: 9px; gap: 9px;
width: 100%; width: 100%;
border: 0; border: 0;
border-radius: 8px; border-radius: var(--radius-md);
background: transparent; background: transparent;
color: var(--text); color: var(--text);
cursor: pointer; cursor: pointer;
@@ -161,7 +161,7 @@
max-height: min(720px, calc(100vh - 44px)); max-height: min(720px, calc(100vh - 44px));
overflow: auto; overflow: auto;
border: var(--border-line-dark); border: var(--border-line-dark);
border-radius: 16px; border-radius: var(--radius-xl);
background: var(--panel); background: var(--panel);
box-shadow: var(--shadow-popover); box-shadow: var(--shadow-popover);
} }
@@ -236,7 +236,7 @@
scrollbar-gutter: stable; scrollbar-gutter: stable;
padding: 8px; padding: 8px;
border: var(--border-line); border: var(--border-line);
border-radius: 12px; border-radius: var(--radius-lg);
background: var(--panel-soft); background: var(--panel-soft);
} }
@@ -247,7 +247,7 @@
width: 100%; width: 100%;
min-width: 0; min-width: 0;
border: 0; border: 0;
border-radius: 9px; border-radius: var(--radius-md);
background: transparent; background: transparent;
color: var(--text); color: var(--text);
cursor: pointer; cursor: pointer;
@@ -308,7 +308,7 @@
gap: 1px; gap: 1px;
overflow: hidden; overflow: hidden;
border: var(--border-line); border: var(--border-line);
border-radius: 6px; border-radius: var(--radius-compact);
background: var(--line); background: var(--line);
} }
@@ -356,7 +356,7 @@
overflow: auto; overflow: auto;
scrollbar-gutter: stable; scrollbar-gutter: stable;
border: var(--border-line); border: var(--border-line);
border-radius: 6px; border-radius: var(--radius-compact);
background: var(--surface); background: var(--surface);
} }
@@ -430,7 +430,7 @@
} }
} }
@media (max-width: 620px) { @media (max-width: 680px) {
.archive-preview-summary { .archive-preview-summary {
grid-template-columns: minmax(0, 1fr); grid-template-columns: minmax(0, 1fr);
} }
@@ -453,7 +453,7 @@
min-height: 320px; min-height: 320px;
overflow: hidden; overflow: hidden;
border: var(--border-line); border: var(--border-line);
border-radius: 12px; border-radius: var(--radius-lg);
background: var(--panel); background: var(--panel);
} }
@@ -498,7 +498,7 @@
min-height: 48px; min-height: 48px;
width: 100%; width: 100%;
border: 0; border: 0;
border-radius: 8px; border-radius: var(--radius-md);
background: transparent; background: transparent;
color: var(--text); color: var(--text);
cursor: pointer; cursor: pointer;
@@ -568,7 +568,7 @@
min-width: 0; min-width: 0;
padding: 10px 12px; padding: 10px 12px;
border: var(--border-line); border: var(--border-line);
border-radius: 10px; border-radius: var(--radius-lg);
background: var(--panel-soft); background: var(--panel-soft);
} }
@@ -616,7 +616,7 @@
align-items: center; align-items: center;
padding: 10px 12px; padding: 10px 12px;
border: var(--border-line); border: var(--border-line);
border-radius: 8px; border-radius: var(--radius-md);
background: var(--panel-soft); background: var(--panel-soft);
} }
@@ -713,7 +713,7 @@
} }
} }
@media (max-width: 1050px) { @media (max-width: 1100px) {
.files-page .file-manager-shell { .files-page .file-manager-shell {
grid-template-columns: 1fr; grid-template-columns: 1fr;
} }
@@ -758,7 +758,7 @@
gap: 3px; gap: 3px;
padding: 12px 14px; padding: 12px 14px;
border: var(--border-line); border: var(--border-line);
border-radius: 12px; border-radius: var(--radius-lg);
background: var(--panel-soft); background: var(--panel-soft);
} }
@@ -781,7 +781,7 @@
align-items: center; align-items: center;
padding: 10px; padding: 10px;
border: var(--border-line); border: var(--border-line);
border-radius: 12px; border-radius: var(--radius-lg);
background: var(--panel-soft); background: var(--panel-soft);
} }
@@ -819,7 +819,7 @@
display: block; display: block;
width: 100%; width: 100%;
border: 1px dashed var(--line-dark); border: 1px dashed var(--line-dark);
border-radius: 6px; border-radius: var(--radius-compact);
background: var(--panel-soft); background: var(--panel-soft);
color: var(--muted); color: var(--muted);
cursor: pointer; cursor: pointer;
@@ -942,7 +942,7 @@
.managed-file-entry { .managed-file-entry {
width: 100%; width: 100%;
border: 1px solid transparent; border: 1px solid transparent;
border-radius: 9px; border-radius: var(--radius-md);
background: transparent; background: transparent;
color: var(--text-strong); color: var(--text-strong);
text-align: left; text-align: left;
@@ -1020,7 +1020,7 @@
gap: 5px; gap: 5px;
align-items: center; align-items: center;
border: 0; border: 0;
border-radius: 6px; border-radius: var(--radius-compact);
background: transparent; background: transparent;
color: var(--text-strong); color: var(--text-strong);
padding: 5px 6px; padding: 5px 6px;
@@ -1169,7 +1169,7 @@
gap: 4px; gap: 4px;
align-items: center; align-items: center;
border: 1px solid var(--success-line, var(--line)); border: 1px solid var(--success-line, var(--line));
border-radius: 999px; border-radius: var(--radius-pill);
padding: 3px 7px; padding: 3px 7px;
color: var(--success, var(--muted)); color: var(--success, var(--muted));
font-size: 11px; font-size: 11px;
@@ -1256,7 +1256,7 @@
color: var(--muted); color: var(--muted);
} }
@media (max-width: 850px) { @media (max-width: 900px) {
.managed-file-entry-head, .managed-file-entry-head,
.managed-file-entry { .managed-file-entry {
grid-template-columns: 22px minmax(0, 1fr) 100px; grid-template-columns: 22px minmax(0, 1fr) 100px;