Improve admin UX and autosave handling

This commit is contained in:
nmemmert
2026-06-01 12:56:26 -04:00
parent b9ed8761db
commit 1d536827e3
5 changed files with 1504 additions and 416 deletions
+595 -175
View File
File diff suppressed because it is too large Load Diff
+137 -13
View File
@@ -4994,6 +4994,37 @@
flex-wrap: wrap;
}
.admin-view-picker {
display: inline-flex;
align-items: center;
gap: 0.45rem;
padding: 0.35rem 0.7rem;
border: 1px solid rgba(201,168,76,0.22);
border-radius: 999px;
background: rgba(201,168,76,0.06);
}
.admin-view-picker-label {
font-size: 0.72rem;
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
color: rgba(240,234,216,0.6);
white-space: nowrap;
}
.admin-view-picker-select {
border: none;
background: transparent;
color: var(--brand-warm-white);
font-family: var(--brand-font-body);
font-size: 0.86rem;
font-weight: 600;
letter-spacing: 0.03em;
min-width: 11rem;
outline: none;
}
.admin-topbar-meta {
font-size: 0.78rem;
color: rgba(240,234,216,0.45);
@@ -5065,18 +5096,64 @@
color: var(--brand-warm-white);
}
.admin-nav-search {
display: grid;
gap: 0.4rem;
padding: 0 1.1rem 1rem;
}
.admin-nav-search label {
font-size: 0.72rem;
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
color: rgba(240,234,216,0.6);
}
.admin-nav-search input {
width: 100%;
border: 1px solid rgba(201,168,76,0.18);
border-radius: 10px;
background: rgba(201,168,76,0.05);
color: var(--brand-warm-white);
padding: 0.65rem 0.8rem;
font-size: 0.88rem;
}
.admin-nav-search input::placeholder {
color: rgba(240,234,216,0.34);
}
.admin-nav-empty {
padding: 0 1.1rem;
}
.admin-nav-group {
margin-bottom: 1.25rem;
margin-bottom: 1.15rem;
padding-top: 0.55rem;
border-top: 1px solid rgba(201, 168, 76, 0.14);
}
.admin-nav-group:first-of-type {
padding-top: 0;
border-top: 0;
}
.admin-nav-label {
display: block;
font-size: 0.68rem;
letter-spacing: 0.16em;
display: inline-flex;
align-items: center;
font-size: 0.76rem;
font-weight: 700;
letter-spacing: 0.1em;
text-transform: uppercase;
color: rgba(201,168,76,0.45);
padding: 0 1.1rem;
margin-bottom: 0.25rem;
color: #ffe3a3;
background: rgba(201, 168, 76, 0.22);
border: 1px solid rgba(201, 168, 76, 0.45);
border-radius: 999px;
text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5);
padding: 0.2rem 0.62rem;
margin-left: 1.1rem;
margin-bottom: 0.42rem;
}
.admin-nav-item {
@@ -5088,9 +5165,10 @@
background: none;
border: none;
border-left: 2px solid transparent;
color: rgba(240,234,216,0.6);
color: rgba(240,234,216,0.84);
padding: 0.4rem 1.1rem;
font-size: 0.88rem;
font-size: 0.9rem;
font-weight: 500;
cursor: pointer;
transition: color 150ms, background 150ms;
line-height: 1.4;
@@ -5118,13 +5196,13 @@
}
.admin-nav-item:hover {
color: var(--brand-warm-white);
background: rgba(201,168,76,0.06);
color: #fff6de;
background: rgba(201,168,76,0.11);
}
.admin-nav-item--active {
color: var(--brand-gold) !important;
background: rgba(201,168,76,0.1);
color: #ffe4a8 !important;
background: rgba(201,168,76,0.18);
border-left-color: var(--brand-gold);
}
@@ -5169,6 +5247,11 @@
border-bottom: 1px solid rgba(201,168,76,0.08);
}
.admin-panel-subhead[id],
.admin-section-header[id] {
scroll-margin-top: 6rem;
}
.admin-panel-subhead h3 {
font-family: var(--brand-font-heading);
font-size: 1.05rem;
@@ -5202,6 +5285,47 @@
margin: 0;
}
.admin-section-jump-nav {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 0.65rem;
margin: -0.4rem 0 1.5rem;
}
.admin-section-jump-nav-label {
font-size: 0.72rem;
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
color: rgba(240,234,216,0.55);
}
.admin-section-jump-nav-links {
display: flex;
flex-wrap: wrap;
gap: 0.55rem;
}
.admin-section-jump-nav-btn {
border: 1px solid rgba(201,168,76,0.22);
border-radius: 999px;
background: rgba(201,168,76,0.07);
color: var(--brand-warm-white);
padding: 0.45rem 0.9rem;
font-size: 0.8rem;
font-weight: 600;
letter-spacing: 0.03em;
cursor: pointer;
transition: background 150ms, border-color 150ms, color 150ms;
}
.admin-section-jump-nav-btn:hover {
background: rgba(201,168,76,0.14);
border-color: rgba(201,168,76,0.4);
color: #fff6de;
}
.admin-archive-helper {
background: rgba(201,168,76,0.05);
border: 1px solid rgba(201,168,76,0.15);