Consistency audit: shared input/button/heading tokens across pages (#18)
- One text-input treatment (size, color, placeholder) for .search input, .pw-field input, #title, #custom, .row text inputs - Icon-only buttons (.iconbtn, .btn-icon) share .btn radius + focus ring - Unified heading letter-spacing with .side-section h3 pattern - Normalized settings card padding to the 12/18px wide-card scale - Verified visually: before/after screenshots for new/history/settings/unlock Closes #18
This commit is contained in:
+39
-1
@@ -339,8 +339,46 @@ th.sorted.asc .sort-ind { border-bottom: 6px solid var(--accent); }
|
||||
th.sorted.desc .sort-ind { border-top: 6px solid var(--accent); }
|
||||
|
||||
/* ============================================================
|
||||
Mobile responsiveness (#45) — desktop above is unchanged
|
||||
Consistency audit (#18) — shared tokens across inputs, buttons,
|
||||
headings. Visual-only, no behavior change.
|
||||
============================================================ */
|
||||
|
||||
/* shared text-input treatment: .search input, .pw-field input, #title, #custom */
|
||||
.search input,
|
||||
.pw-field input,
|
||||
.editor-head input#title,
|
||||
.custom-input,
|
||||
.row input[type="text"] {
|
||||
font-size: 21.6px;
|
||||
color: var(--fg);
|
||||
}
|
||||
.search input::placeholder,
|
||||
.pw-field input::placeholder,
|
||||
.editor-head input#title::placeholder,
|
||||
.custom-input::placeholder {
|
||||
color: var(--muted);
|
||||
}
|
||||
.custom-input { border-radius: var(--radius); }
|
||||
|
||||
/* buttons (incl. icon-only variants) share one radius + focus ring */
|
||||
.btn-icon, .iconbtn {
|
||||
border-radius: var(--radius);
|
||||
transition: color .12s ease, border-color .12s ease, background .12s ease;
|
||||
}
|
||||
.iconbtn:focus-visible, .btn:focus-visible, .btn-icon:focus-visible, .pager button:focus-visible {
|
||||
outline: 2px solid var(--accent);
|
||||
outline-offset: 1px;
|
||||
}
|
||||
|
||||
/* headings: unified treatment (mirrors .side-section h3) */
|
||||
.settings-head h1, .paste-title-bar h1, .head-row h1, .inner h1 {
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
|
||||
/* consistent card padding scale: 12px 18px for wide card heads/bodies */
|
||||
.settings-head { padding: 12px 18px; }
|
||||
.settings-body { padding: 16px 18px; }
|
||||
|
||||
@media (max-width: 640px) {
|
||||
body { font-size: 16px; }
|
||||
|
||||
|
||||
Reference in New Issue
Block a user