R3ap3r/aurora-wordpress-admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Round corners a notch; tokenize all radii onto an sm/md/lg/xl scale

Browse Source 
Consolidate ~140 scattered hardcoded border-radius values (and the old
--aurora-radius/--aurora-radius-lg vars) onto one four-step scale defined in
shell-frame.css:
  --aurora-radius-sm 10px  (chips, small/icon controls; was 5-8px)
  --aurora-radius-md 14px  (buttons, inputs, search, list rows; was 9-14px)
  --aurora-radius-lg 20px  (cards, panels, larger buttons; was 15-20px)
  --aurora-radius-xl 28px  (page frames: content card, dashboard, sidebar,
                            editor; was the 24px --aurora-radius-lg)
Everything is one notch rounder, and the whole UI's roundness is now tunable
from four lines instead of 35 files.

Co-Authored-By: Claude Opus 4.8 <[email protected]>
This commit is contained in:
NixReaper
2026-07-12 13:21:22 -05:00
co-authored by Claude Opus 4.8
parent 53ca6f62b9
commit b3ff365483
35 changed files with 149 additions and 145 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/src/pages/_shared/AppListItem.vue
+2 -2
View File
@@ -36,7 +36,7 @@ defineEmits(['click']);
border: none;
background: none;
cursor: pointer;
border-radius: 12px;
border-radius: var(--aurora-radius-md);
text-align: left;
}
.app-list-item:hover {
@@ -49,7 +49,7 @@ defineEmits(['click']);
width: 32px;
height: 32px;
flex-shrink: 0;
border-radius: 9px;
border-radius: var(--aurora-radius-md);
background: var(--aurora-bg-subtle);
color: var(--aurora-text-muted);
display: flex;
app/src/pages/_shared/AppListShell.vue
+5 -5
View File
@@ -94,7 +94,7 @@ const search = defineModel('search', { type: String, default: '' });
flex-shrink: 0;
height: 100%;
overflow-y: auto;
border-radius: 16px;
border-radius: var(--aurora-radius-lg);
padding: 24px 20px;
box-sizing: border-box;
}
@@ -106,7 +106,7 @@ const search = defineModel('search', { type: String, default: '' });
.app-list-shell__actions { display: flex; gap: 6px; align-items: center; }
.app-list-shell__actions :deep(button) {
display: inline-flex; align-items: center; justify-content: center;
height: 30px; padding: 0 10px; border: none; border-radius: 7px;
height: 30px; padding: 0 10px; border: none; border-radius: var(--aurora-radius-sm);
background: var(--aurora-bg-subtle); color: var(--aurora-text-muted);
font-size: 0.75rem; font-weight: 500; cursor: pointer; gap: 6px;
}
@@ -119,7 +119,7 @@ const search = defineModel('search', { type: String, default: '' });
display: flex; align-items: center; gap: 8px;
background: var(--aurora-bg-subtle);
border: 1px solid var(--aurora-border);
border-radius: 10px; padding: 8px 12px; margin-bottom: 14px;
border-radius: var(--aurora-radius-md); padding: 8px 12px; margin-bottom: 14px;
color: var(--aurora-text-muted);
}
.app-list-shell__search input {
@@ -161,7 +161,7 @@ const search = defineModel('search', { type: String, default: '' });
flex: 1; min-width: 0;
height: 100%;
overflow-y: auto;
border-radius: 16px;
border-radius: var(--aurora-radius-lg);
padding: 28px 32px;
min-height: 480px;
box-sizing: border-box;
@@ -174,7 +174,7 @@ const search = defineModel('search', { type: String, default: '' });
text-align: center; gap: 6px;
}
.app-list-shell__empty-icon {
width: 56px; height: 56px; border-radius: 14px;
width: 56px; height: 56px; border-radius: var(--aurora-radius-md);
background: var(--aurora-bg-subtle); color: var(--aurora-text-muted);
display: flex; align-items: center; justify-content: center;
font-size: 22px; margin-bottom: 10px;
app/src/pages/activity-log/ActivityLog.vue
+2 -2
View File
@@ -139,7 +139,7 @@ const formatDate = (s) => (s ? new Date(s.replace(' ', 'T')).toLocaleString() :
<style scoped>
.activity-log__select {
padding: 5px 10px; border-radius: 8px; border: 1px solid var(--aurora-border);
padding: 5px 10px; border-radius: var(--aurora-radius-sm); border: 1px solid var(--aurora-border);
background: var(--aurora-bg-subtle); color: var(--aurora-text); font-size: 0.75rem;
}
.activity-detail h2 { margin: 0 0 16px; font-size: 1.1rem; color: var(--aurora-text); }
@@ -148,6 +148,6 @@ const formatDate = (s) => (s ? new Date(s.replace(' ', 'T')).toLocaleString() :
.activity-detail dd { margin: 0; color: var(--aurora-text); }
.activity-detail pre {
margin-top: 18px; padding: 12px; background: var(--aurora-bg-subtle);
border-radius: 8px; font-size: 0.75rem; overflow-x: auto; color: var(--aurora-text);
border-radius: var(--aurora-radius-sm); font-size: 0.75rem; overflow-x: auto; color: var(--aurora-text);
}
</style>
app/src/pages/admin-notices/AdminNotices.vue
+3 -3
View File
@@ -190,11 +190,11 @@ const remove = async () => {
.notice-editor__row { display: flex; gap: 10px; }
.notice-editor__title {
flex: 1; font-size: 1.05rem; font-weight: 700; padding: 8px 10px;
border: 1px solid var(--aurora-border); border-radius: 8px;
border: 1px solid var(--aurora-border); border-radius: var(--aurora-radius-sm);
background: var(--aurora-bg-subtle); color: var(--aurora-text);
}
.notice-editor select, .notice-editor input[type='text'], .notice-editor textarea {
padding: 8px 10px; border-radius: 8px; border: 1px solid var(--aurora-border);
padding: 8px 10px; border-radius: var(--aurora-radius-sm); border: 1px solid var(--aurora-border);
background: var(--aurora-bg-subtle); color: var(--aurora-text); font-size: 0.8125rem;
font-family: inherit; width: 100%; box-sizing: border-box;
}
@@ -208,7 +208,7 @@ const remove = async () => {
.notice-editor__toggles label { display: flex; align-items: center; gap: 6px; }
.notice-editor__actions { display: flex; justify-content: flex-end; gap: 8px; }
.notice-editor__actions button {
border: none; border-radius: 8px; padding: 9px 18px; font-size: 0.875rem; cursor: pointer;
border: none; border-radius: var(--aurora-radius-sm); padding: 9px 18px; font-size: 0.875rem; cursor: pointer;
background: var(--aurora-bg-subtle); color: var(--aurora-text);
}
.notice-editor__actions .is-primary { background: var(--aurora-accent); color: #fff; }
app/src/pages/bug-report/BugReport.vue
+3 -3
View File
@@ -98,7 +98,7 @@ const send = async () => {
.bug-report-page h1 { margin: 0; font-size: 1.6rem; font-weight: 700; color: var(--aurora-text); }
.bug-report-page__sub { margin: 8px 0 0; font-size: 0.875rem; color: var(--aurora-text-muted); }
.bug-report-notice { padding: 10px 14px; border-radius: 8px; margin-bottom: 16px; font-size: 0.875rem; }
.bug-report-notice { padding: 10px 14px; border-radius: var(--aurora-radius-sm); margin-bottom: 16px; font-size: 0.875rem; }
.bug-report-notice--success { background: rgba(34, 197, 94, 0.12); color: #22c55e; }
.bug-report-notice--error { background: rgba(239, 68, 68, 0.12); color: #ef4444; }
@@ -106,14 +106,14 @@ const send = async () => {
.bug-report-field { display: flex; flex-direction: column; gap: 6px; }
.bug-report-field span { font-size: 0.8125rem; font-weight: 600; color: var(--aurora-text); }
.bug-report-field textarea {
padding: 10px 12px; border-radius: 8px; border: 1px solid var(--aurora-border);
padding: 10px 12px; border-radius: var(--aurora-radius-sm); border: 1px solid var(--aurora-border);
background: var(--aurora-bg-subtle); color: var(--aurora-text); font-size: 0.875rem;
font-family: inherit; resize: vertical;
}
.bug-report-diagnostics {
background: var(--aurora-bg-subtle); border: 1px solid var(--aurora-border);
border-radius: 10px; padding: 14px 16px;
border-radius: var(--aurora-radius-md); padding: 14px 16px;
}
.bug-report-diagnostics h2 {
margin: 0 0 10px; font-size: 0.75rem; text-transform: uppercase;
app/src/pages/comments/Comments.vue
+5 -5
View File
@@ -398,7 +398,7 @@ const rowRange = computed(() => {
width: min(320px, 100%);
min-height: 38px;
border: 1px solid var(--aurora-border);
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-bg-subtle);
display: flex;
align-items: center;
@@ -423,7 +423,7 @@ const rowRange = computed(() => {
width: 42px;
min-height: 42px;
border: 1px solid var(--aurora-border);
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
color: var(--aurora-text);
background: var(--aurora-bg-subtle);
display: inline-flex;
@@ -451,7 +451,7 @@ const rowRange = computed(() => {
.comments-notice {
margin: 0 0 12px;
padding: 10px 12px;
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-bg-subtle);
color: var(--aurora-text);
font-size: 0.78rem;
@@ -460,7 +460,7 @@ const rowRange = computed(() => {
.comments-table {
overflow: hidden;
border: 1px solid var(--aurora-frame-border);
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-frame-bg);
}
.comments-table__head,
@@ -636,7 +636,7 @@ const rowRange = computed(() => {
width: 28px;
height: 28px;
border: 0;
border-radius: 6px;
border-radius: var(--aurora-radius-sm);
background: transparent;
color: var(--aurora-text-muted);
cursor: pointer;
app/src/pages/dashboard/Dashboard.vue
+5 -5
View File
@@ -176,7 +176,7 @@ onMounted(() => reload(range.value[0], range.value[1]));
background: var(--aurora-card-bg);
border: 1px solid var(--aurora-card-border);
color: var(--aurora-text);
border-radius: 10px;
border-radius: var(--aurora-radius-md);
padding: 8px 12px;
font-size: 0.8125rem;
cursor: pointer;
@@ -186,7 +186,7 @@ onMounted(() => reload(range.value[0], range.value[1]));
position: absolute; right: 0; top: calc(100% + 6px);
background: var(--aurora-card-bg);
border: 1px solid var(--aurora-card-border);
border-radius: 10px;
border-radius: var(--aurora-radius-md);
padding: 6px;
z-index: 10;
min-width: 160px;
@@ -195,14 +195,14 @@ onMounted(() => reload(range.value[0], range.value[1]));
.dash__presets button {
display: block; width: 100%; text-align: left;
background: none; border: none; color: var(--aurora-text);
padding: 8px 10px; border-radius: 6px; cursor: pointer; font-size: 0.8125rem;
padding: 8px 10px; border-radius: var(--aurora-radius-sm); cursor: pointer; font-size: 0.8125rem;
}
.dash__presets button:hover { background: var(--aurora-bg-subtle); }
.dash__tabs {
display: inline-flex;
gap: 2px;
background: var(--aurora-bg-subtle);
border-radius: 10px;
border-radius: var(--aurora-radius-md);
padding: 3px;
margin-bottom: 20px;
}
@@ -214,7 +214,7 @@ onMounted(() => reload(range.value[0], range.value[1]));
}
.dash__tab {
border: none; background: none; cursor: pointer;
padding: 6px 16px; border-radius: 8px;
padding: 6px 16px; border-radius: var(--aurora-radius-sm);
font-size: 0.8125rem; font-weight: 500;
color: var(--aurora-text-muted);
}
app/src/pages/dashboard/cards/MediaAnalytics.vue
+1 -1
View File
@@ -52,7 +52,7 @@ defineProps({ data: { type: Object, default: () => ({}) } });
.ma__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ma__box {
background: var(--aurora-bg-subtle);
border-radius: 14px;
border-radius: var(--aurora-radius-md);
padding: 14px;
text-align: center;
}
app/src/pages/dashboard/cards/ScheduledContent.vue
+3 -3
View File
@@ -102,7 +102,7 @@ const onDayClick = (cell) => {
border: 1px solid var(--aurora-card-border);
background: var(--aurora-bg-subtle);
color: var(--aurora-text-muted);
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
cursor: pointer;
line-height: 1;
}
@@ -120,7 +120,7 @@ const onDayClick = (cell) => {
position: relative;
width: 100%; height: 100%;
display: flex; align-items: center; justify-content: center;
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
border: 1px solid var(--aurora-card-border);
background: transparent;
padding: 0;
@@ -156,7 +156,7 @@ const onDayClick = (cell) => {
background: var(--aurora-card-bg, #1f1f23);
color: var(--aurora-text, #f4f4f5);
border: 1px solid var(--aurora-border, #2e2e33);
border-radius: 10px;
border-radius: var(--aurora-radius-md);
padding: 12px 18px;
font-size: 0.875rem;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
app/src/pages/dashboard/cards/ServerHealth.vue
+1 -1
View File
@@ -58,7 +58,7 @@ defineProps({ data: { type: Object, default: () => ({}) } });
.sh__versions { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 14px; }
.sh__ver {
background: var(--aurora-bg-subtle);
border-radius: 12px;
border-radius: var(--aurora-radius-md);
padding: 12px 14px;
}
.sh__ver-label { font-size: 0.6875rem; color: var(--aurora-text-muted); }
app/src/pages/dashboard/components/AuroraCard.vue
+1 -1
View File
@@ -36,7 +36,7 @@ defineProps({
for most presets, so cards would nearly disappear into it otherwise. */
background: var(--aurora-card-bg-deep, var(--aurora-card-bg));
border: 1px solid var(--aurora-card-border);
border-radius: 20px;
border-radius: var(--aurora-radius-lg);
padding: 20px;
box-sizing: border-box;
}
app/src/pages/dashboard/components/ProgressBar.vue
+1 -1
View File
@@ -30,7 +30,7 @@ defineProps({
<style scoped>
.pbar {
background: var(--aurora-bg-subtle);
border-radius: 12px;
border-radius: var(--aurora-radius-md);
padding: 12px 14px;
}
.pbar__top {
app/src/pages/dashboard/components/StatRow.vue
+1 -1
View File
@@ -24,7 +24,7 @@ defineProps({
}
.statrow--boxed {
background: var(--aurora-bg-subtle);
border-radius: 14px;
border-radius: var(--aurora-radius-md);
padding: 16px 8px;
}
.statrow__value {
app/src/pages/media-upload/MediaUpload.vue
+2 -2
View File
@@ -122,7 +122,7 @@ const clearDone = () => {
display: flex; flex-direction: column; align-items: center; justify-content: center;
gap: 10px; padding: 48px 24px; text-align: center; cursor: pointer;
border: 2px dashed var(--aurora-border);
border-radius: 14px;
border-radius: var(--aurora-radius-md);
color: var(--aurora-text-muted);
transition: border-color 0.15s, color 0.15s;
}
@@ -135,7 +135,7 @@ const clearDone = () => {
.media-upload-item {
display: flex; align-items: center; justify-content: space-between;
padding: 10px 14px; border-radius: 8px;
padding: 10px 14px; border-radius: var(--aurora-radius-sm);
background: var(--aurora-bg-subtle);
border: 1px solid var(--aurora-border);
margin-bottom: 6px; font-size: 0.875rem;
app/src/pages/media/Media.vue
+11 -11
View File
@@ -479,7 +479,7 @@ const typeIcon = (mimeType) => {
align-items: center;
min-height: 38px;
padding: 0 16px;
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-accent);
color: var(--aurora-accent-text);
font-size: 0.84rem;
@@ -529,7 +529,7 @@ const typeIcon = (mimeType) => {
width: min(320px, 100%);
min-height: 38px;
border: 1px solid var(--aurora-border);
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-bg-subtle);
display: flex;
align-items: center;
@@ -554,7 +554,7 @@ const typeIcon = (mimeType) => {
width: 42px;
min-height: 42px;
border: 1px solid var(--aurora-border);
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
color: var(--aurora-text);
background: var(--aurora-bg-subtle);
display: inline-flex;
@@ -581,7 +581,7 @@ const typeIcon = (mimeType) => {
.media-notice {
margin: 0 0 12px;
padding: 10px 12px;
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-bg-subtle);
color: var(--aurora-text);
font-size: 0.78rem;
@@ -590,7 +590,7 @@ const typeIcon = (mimeType) => {
.media-grid__empty {
padding: 60px 18px;
border: 1px solid var(--aurora-frame-border);
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-frame-bg);
color: var(--aurora-text-muted);
font-size: 0.85rem;
@@ -603,7 +603,7 @@ const typeIcon = (mimeType) => {
}
.media-card {
border: 1px solid var(--aurora-frame-border);
border-radius: 10px;
border-radius: var(--aurora-radius-md);
background: var(--aurora-frame-bg);
overflow: hidden;
}
@@ -688,7 +688,7 @@ const typeIcon = (mimeType) => {
width: 28px;
height: 28px;
border: 0;
border-radius: 6px;
border-radius: var(--aurora-radius-sm);
background: transparent;
color: var(--aurora-text-muted);
cursor: pointer;
@@ -733,7 +733,7 @@ const typeIcon = (mimeType) => {
width: 220px;
padding: 12px;
border: 1px solid var(--aurora-frame-border);
border-radius: 10px;
border-radius: var(--aurora-radius-md);
background: var(--aurora-frame-bg);
}
.media-page__main {
@@ -753,7 +753,7 @@ const typeIcon = (mimeType) => {
align-items: center;
gap: 8px;
border: none;
border-radius: 6px;
border-radius: var(--aurora-radius-sm);
background: none;
padding: 6px 6px;
color: var(--aurora-text);
@@ -815,7 +815,7 @@ const typeIcon = (mimeType) => {
min-width: 150px;
overflow-y: auto;
border: 1px solid var(--aurora-border);
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-frame-bg);
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
padding: 4px;
@@ -826,7 +826,7 @@ const typeIcon = (mimeType) => {
padding: 6px 10px;
border: none;
background: none;
border-radius: 6px;
border-radius: var(--aurora-radius-sm);
color: var(--aurora-text);
font-size: 0.78rem;
text-align: left;
app/src/pages/media/MediaFolderTree.vue
+3 -3
View File
@@ -129,7 +129,7 @@ const runFromMenu = (fn) => {
.mf-tree { list-style: none; margin: 0; padding-left: 14px; }
.mf-tree:first-of-type { padding-left: 0; }
.mf-tree__row {
display: flex; align-items: center; gap: 2px; border-radius: 6px;
display: flex; align-items: center; gap: 2px; border-radius: var(--aurora-radius-sm);
}
.mf-tree__row:hover { background: var(--aurora-bg-subtle); }
.mf-tree__row--active { background: var(--aurora-accent-soft); }
@@ -163,7 +163,7 @@ const runFromMenu = (fn) => {
padding: 4px;
list-style: none;
border: 1px solid var(--aurora-border);
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-frame-bg);
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
}
@@ -175,7 +175,7 @@ const runFromMenu = (fn) => {
padding: 7px 10px;
border: none;
background: none;
border-radius: 6px;
border-radius: var(--aurora-radius-sm);
color: var(--aurora-text);
font-size: 0.8rem;
text-align: left;
app/src/pages/menu-creator/MenuCreator.vue
+4 -4
View File
@@ -225,11 +225,11 @@ const toggleRole = (slug) => {
.menu-editor__row { display: flex; gap: 10px; }
.menu-editor__name {
flex: 1; font-size: 1.1rem; font-weight: 700; padding: 8px 10px;
border: 1px solid var(--aurora-border); border-radius: 8px;
border: 1px solid var(--aurora-border); border-radius: var(--aurora-radius-sm);
background: var(--aurora-bg-subtle); color: var(--aurora-text);
}
.menu-editor__status {
padding: 8px 10px; border-radius: 8px; border: 1px solid var(--aurora-border);
padding: 8px 10px; border-radius: var(--aurora-radius-sm); border: 1px solid var(--aurora-border);
background: var(--aurora-bg-subtle); color: var(--aurora-text);
}
.menu-editor__section h3 {
@@ -244,13 +244,13 @@ const toggleRole = (slug) => {
border-bottom: 1px solid var(--aurora-frame-border);
}
.menu-editor__item input[type='text'] {
flex: 1; padding: 6px 8px; border-radius: 6px; border: 1px solid var(--aurora-border);
flex: 1; padding: 6px 8px; border-radius: var(--aurora-radius-sm); border: 1px solid var(--aurora-border);
background: var(--aurora-bg-subtle); color: var(--aurora-text); font-size: 0.8125rem;
}
.menu-editor__hide { display: flex; align-items: center; gap: 4px; font-size: 0.75rem; color: var(--aurora-text-muted); }
.menu-editor__actions { display: flex; justify-content: flex-end; gap: 8px; }
.menu-editor__actions button {
border: none; border-radius: 8px; padding: 9px 18px; font-size: 0.875rem; cursor: pointer;
border: none; border-radius: var(--aurora-radius-sm); padding: 9px 18px; font-size: 0.875rem; cursor: pointer;
background: var(--aurora-bg-subtle); color: var(--aurora-text);
}
.menu-editor__actions .is-primary { background: var(--aurora-accent); color: #fff; }
app/src/pages/native-settings/NativeSettings.vue
+2 -2
View File
@@ -173,7 +173,7 @@ const save = async () => {
.native-settings__saved { font-size: 0.8125rem; color: var(--aurora-text-muted); }
.native-settings__save {
background: var(--aurora-accent); color: #fff; border: none;
border-radius: 9px; padding: 9px 20px; font-size: 0.875rem; font-weight: 500; cursor: pointer;
border-radius: var(--aurora-radius-md); padding: 9px 20px; font-size: 0.875rem; font-weight: 500; cursor: pointer;
}
.native-settings__save:disabled { opacity: 0.6; cursor: default; }
.native-settings__fields > :last-child { border-bottom: none; }
@@ -210,6 +210,6 @@ const save = async () => {
font-size: 0.8125rem;
background: var(--aurora-bg-subtle);
padding: 2px 8px;
border-radius: 5px;
border-radius: var(--aurora-radius-sm);
}
</style>
app/src/pages/nav-menus/NavMenus.vue
+9 -9
View File
@@ -361,21 +361,21 @@ const assignLocation = async (slug, menuId) => {
}
.nav-menus-page h1 { margin: 0; font-size: 1.6rem; font-weight: 700; color: var(--aurora-text); }
.nav-menus-notice { padding: 10px 14px; border-radius: 8px; margin-bottom: 16px; font-size: 0.875rem; }
.nav-menus-notice { padding: 10px 14px; border-radius: var(--aurora-radius-sm); margin-bottom: 16px; font-size: 0.875rem; }
.nav-menus-notice--success { background: rgba(34, 197, 94, 0.12); color: #22c55e; }
.nav-menus-notice--error { background: rgba(239, 68, 68, 0.12); color: #ef4444; }
.nav-menus-layout { display: grid; grid-template-columns: 260px 300px 1fr; gap: 20px; align-items: start; }
.nav-menus-side, .nav-menus-add, .nav-menus-structure {
background: var(--aurora-bg-subtle); border: 1px solid var(--aurora-border);
border-radius: 14px; padding: 18px;
border-radius: var(--aurora-radius-md); padding: 18px;
}
.nav-menus-side h2, .nav-menus-add h2, .nav-menus-structure h2 {
font-size: 0.9375rem; margin: 0 0 10px; color: var(--aurora-text);
}
.nav-menus-list { list-style: none; margin: 0 0 14px; padding: 0; }
.nav-menus-list__item {
width: 100%; text-align: left; padding: 8px 10px; border-radius: 8px;
width: 100%; text-align: left; padding: 8px 10px; border-radius: var(--aurora-radius-sm);
border: none; background: none; color: var(--aurora-text-muted); cursor: pointer;
font-size: 0.875rem;
}
@@ -385,7 +385,7 @@ const assignLocation = async (slug, menuId) => {
.nav-menus-create { display: flex; gap: 6px; margin-bottom: 20px; }
.nav-menus-create input {
flex: 1; padding: 7px 10px; border-radius: 7px; border: 1px solid var(--aurora-border);
flex: 1; padding: 7px 10px; border-radius: var(--aurora-radius-sm); border: 1px solid var(--aurora-border);
background: var(--aurora-bg); color: var(--aurora-text); font-size: 0.8125rem;
}
@@ -393,20 +393,20 @@ const assignLocation = async (slug, menuId) => {
.nav-menus-location label { font-size: 0.8125rem; color: var(--aurora-text-muted); }
.nav-menus-location select,
.nav-menus-add__custom input {
padding: 7px 10px; border-radius: 7px; border: 1px solid var(--aurora-border);
padding: 7px 10px; border-radius: var(--aurora-radius-sm); border: 1px solid var(--aurora-border);
background: var(--aurora-bg); color: var(--aurora-text); font-size: 0.8125rem;
}
.nav-menus-add__tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.nav-menus-add__tabs button {
padding: 6px 10px; border-radius: 7px; border: 1px solid var(--aurora-border);
padding: 6px 10px; border-radius: var(--aurora-radius-sm); border: 1px solid var(--aurora-border);
background: var(--aurora-bg); color: var(--aurora-text-muted); font-size: 0.75rem; cursor: pointer;
}
.nav-menus-add__tabs button.is-active { background: var(--aurora-accent-soft); color: var(--aurora-accent); border-color: transparent; }
.nav-menus-add__list { max-height: 320px; overflow-y: auto; display: flex; flex-direction: column; gap: 4px; }
.nav-menus-add__row {
display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 6px;
display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: var(--aurora-radius-sm);
font-size: 0.8125rem; color: var(--aurora-text);
}
.nav-menus-add__row:hover { background: var(--aurora-bg); }
@@ -417,14 +417,14 @@ const assignLocation = async (slug, menuId) => {
.nav-menus-structure__head { display: flex; align-items: center; justify-content: space-between; }
.nav-menus-item {
display: flex; align-items: center; justify-content: space-between;
padding: 8px 12px; border-radius: 8px; margin-bottom: 4px;
padding: 8px 12px; border-radius: var(--aurora-radius-sm); margin-bottom: 4px;
background: var(--aurora-bg); border: 1px solid var(--aurora-border);
font-size: 0.8125rem; color: var(--aurora-text);
}
.nav-menus-item__actions { display: flex; gap: 2px; }
.nav-menus-item__actions button {
border: none; background: none; color: var(--aurora-text-muted); cursor: pointer;
width: 26px; height: 26px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center;
width: 26px; height: 26px; border-radius: var(--aurora-radius-sm); display: inline-flex; align-items: center; justify-content: center;
}
.nav-menus-item__actions button:hover { background: var(--aurora-bg-subtle); color: var(--aurora-text); }
.nav-menus-item__actions button:disabled { opacity: 0.35; cursor: default; }
app/src/pages/pages/Pages.vue
+6 -6
View File
@@ -340,7 +340,7 @@ const rowRange = computed(() => {
align-items: center;
min-height: 38px;
padding: 0 16px;
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-accent);
color: var(--aurora-accent-text);
font-size: 0.84rem;
@@ -390,7 +390,7 @@ const rowRange = computed(() => {
width: min(320px, 100%);
min-height: 38px;
border: 1px solid var(--aurora-border);
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-bg-subtle);
display: flex;
align-items: center;
@@ -415,7 +415,7 @@ const rowRange = computed(() => {
width: 42px;
min-height: 42px;
border: 1px solid var(--aurora-border);
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
color: var(--aurora-text);
background: var(--aurora-bg-subtle);
display: inline-flex;
@@ -442,7 +442,7 @@ const rowRange = computed(() => {
.pages-notice {
margin: 0 0 12px;
padding: 10px 12px;
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-bg-subtle);
color: var(--aurora-text);
font-size: 0.78rem;
@@ -451,7 +451,7 @@ const rowRange = computed(() => {
.pages-table {
overflow: hidden;
border: 1px solid var(--aurora-frame-border);
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-frame-bg);
}
.pages-table__head,
@@ -559,7 +559,7 @@ const rowRange = computed(() => {
width: 28px;
height: 28px;
border: 0;
border-radius: 6px;
border-radius: var(--aurora-radius-sm);
background: transparent;
color: var(--aurora-text-muted);
cursor: pointer;
app/src/pages/plugins/Plugins.vue
+5 -5
View File
@@ -364,7 +364,7 @@ const versionLine = (plugin) => {
width: min(320px, 100%);
min-height: 38px;
border: 1px solid var(--aurora-border);
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-bg-subtle);
display: flex;
align-items: center;
@@ -388,7 +388,7 @@ const versionLine = (plugin) => {
.primary-button,
.icon-button {
border: 1px solid var(--aurora-border);
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
min-height: 42px;
color: var(--aurora-text);
background: var(--aurora-bg-subtle);
@@ -439,7 +439,7 @@ const versionLine = (plugin) => {
.plugins-notice {
margin: 0 0 12px;
padding: 10px 12px;
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
font-size: 0.78rem;
font-weight: 750;
}
@@ -454,7 +454,7 @@ const versionLine = (plugin) => {
.plugins-table {
overflow: hidden;
border: 1px solid var(--aurora-frame-border);
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-frame-bg);
box-shadow: none;
}
@@ -505,7 +505,7 @@ const versionLine = (plugin) => {
.plugin-row__mark {
width: 46px;
height: 46px;
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
display: flex;
align-items: center;
justify-content: center;
app/src/pages/posts/Posts.vue
+6 -6
View File
@@ -342,7 +342,7 @@ const rowRange = computed(() => {
align-items: center;
min-height: 38px;
padding: 0 16px;
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-accent);
color: var(--aurora-accent-text);
font-size: 0.84rem;
@@ -392,7 +392,7 @@ const rowRange = computed(() => {
width: min(320px, 100%);
min-height: 38px;
border: 1px solid var(--aurora-border);
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-bg-subtle);
display: flex;
align-items: center;
@@ -417,7 +417,7 @@ const rowRange = computed(() => {
width: 42px;
min-height: 42px;
border: 1px solid var(--aurora-border);
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
color: var(--aurora-text);
background: var(--aurora-bg-subtle);
display: inline-flex;
@@ -444,7 +444,7 @@ const rowRange = computed(() => {
.posts-notice {
margin: 0 0 12px;
padding: 10px 12px;
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-bg-subtle);
color: var(--aurora-text);
font-size: 0.78rem;
@@ -453,7 +453,7 @@ const rowRange = computed(() => {
.posts-table {
overflow: hidden;
border: 1px solid var(--aurora-frame-border);
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-frame-bg);
}
.posts-table__head,
@@ -561,7 +561,7 @@ const rowRange = computed(() => {
width: 28px;
height: 28px;
border: 0;
border-radius: 6px;
border-radius: var(--aurora-radius-sm);
background: transparent;
color: var(--aurora-text-muted);
cursor: pointer;
app/src/pages/profile/Profile.vue
+4 -4
View File
@@ -172,7 +172,7 @@ const changePassword = async () => {
.profile-page h1 { margin: 0; font-size: 1.6rem; font-weight: 700; color: var(--aurora-text); }
.profile-empty { color: var(--aurora-text-muted); font-size: 0.8125rem; }
.profile-notice { padding: 10px 14px; border-radius: 8px; margin-bottom: 16px; font-size: 0.875rem; }
.profile-notice { padding: 10px 14px; border-radius: var(--aurora-radius-sm); margin-bottom: 16px; font-size: 0.875rem; }
.profile-notice--success { background: rgba(34, 197, 94, 0.12); color: #22c55e; }
.profile-notice--error { background: rgba(239, 68, 68, 0.12); color: #ef4444; }
.profile-notice--info { background: var(--aurora-bg-subtle); color: var(--aurora-text-muted); }
@@ -182,7 +182,7 @@ const changePassword = async () => {
display: flex; flex-direction: column; gap: 18px;
background: var(--aurora-bg-subtle);
border: 1px solid var(--aurora-border);
border-radius: 14px;
border-radius: var(--aurora-radius-md);
padding: 24px;
margin-bottom: 20px;
}
@@ -190,7 +190,7 @@ const changePassword = async () => {
.profile-field span { font-size: 0.8125rem; font-weight: 600; color: var(--aurora-text); }
.profile-field input,
.profile-field textarea {
padding: 9px 12px; border-radius: 8px; border: 1px solid var(--aurora-border);
padding: 9px 12px; border-radius: var(--aurora-radius-sm); border: 1px solid var(--aurora-border);
background: var(--aurora-bg); color: var(--aurora-text); font-size: 0.875rem;
font-family: inherit; resize: vertical;
}
@@ -199,7 +199,7 @@ const changePassword = async () => {
.profile-password h2 { margin: 0 0 4px; font-size: 0.9375rem; color: var(--aurora-text); }
.profile-password__row { display: flex; gap: 8px; }
.profile-password__row input {
flex: 1; padding: 9px 12px; border-radius: 8px; border: 1px solid var(--aurora-border);
flex: 1; padding: 9px 12px; border-radius: var(--aurora-radius-sm); border: 1px solid var(--aurora-border);
background: var(--aurora-bg); color: var(--aurora-text); font-size: 0.875rem;
}
</style>
app/src/pages/role-editor/RoleEditor.vue
+3 -3
View File
@@ -182,7 +182,7 @@ const remove = async () => {
.role-editor { display: flex; flex-direction: column; gap: 18px; }
.role-editor__row { display: flex; gap: 10px; }
.role-editor__slug, .role-editor__name {
padding: 8px 10px; border-radius: 8px; border: 1px solid var(--aurora-border);
padding: 8px 10px; border-radius: var(--aurora-radius-sm); border: 1px solid var(--aurora-border);
background: var(--aurora-bg-subtle); color: var(--aurora-text); font-size: 0.875rem;
}
.role-editor__name { flex: 1; font-weight: 700; }
@@ -225,7 +225,7 @@ const remove = async () => {
z-index: 20;
width: 260px;
padding: 10px 12px;
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
border: 1px solid var(--aurora-frame-border);
background: var(--aurora-frame-bg);
color: var(--aurora-text);
@@ -246,7 +246,7 @@ const remove = async () => {
}
.role-editor__actions { display: flex; justify-content: flex-end; gap: 8px; }
.role-editor__actions button {
border: none; border-radius: 8px; padding: 9px 18px; font-size: 0.875rem; cursor: pointer;
border: none; border-radius: var(--aurora-radius-sm); padding: 9px 18px; font-size: 0.875rem; cursor: pointer;
background: var(--aurora-bg-subtle); color: var(--aurora-text);
}
.role-editor__actions .is-primary { background: var(--aurora-accent); color: #fff; }
app/src/pages/settings/Settings.vue
+7 -7
View File
@@ -302,7 +302,7 @@ const importSettings = (e) => {
flex-shrink: 0;
height: 100%;
overflow-y: auto;
border-radius: 16px;
border-radius: var(--aurora-radius-lg);
padding: 24px 20px;
box-sizing: border-box;
}
@@ -314,7 +314,7 @@ const importSettings = (e) => {
.settings__actions { display: flex; gap: 4px; }
.settings__actions button {
width: 30px; height: 30px; border: none; background: none;
color: var(--aurora-text-muted); cursor: pointer; border-radius: 7px;
color: var(--aurora-text-muted); cursor: pointer; border-radius: var(--aurora-radius-sm);
display: inline-flex; align-items: center; justify-content: center;
}
.settings__actions button:hover { background: var(--aurora-bg-subtle); color: var(--aurora-text); }
@@ -324,7 +324,7 @@ const importSettings = (e) => {
display: flex; align-items: center; gap: 8px;
background: var(--aurora-bg-subtle);
border: 1px solid var(--aurora-border);
border-radius: 10px; padding: 8px 12px; margin-bottom: 16px;
border-radius: var(--aurora-radius-md); padding: 8px 12px; margin-bottom: 16px;
color: var(--aurora-text-muted);
}
.settings__search input {
@@ -338,7 +338,7 @@ const importSettings = (e) => {
.settings__group-head {
display: flex; align-items: center; gap: 8px; width: 100%;
padding: 6px 8px; border: none; background: none; cursor: pointer;
border-radius: 8px; color: var(--aurora-text-muted);
border-radius: var(--aurora-radius-sm); color: var(--aurora-text-muted);
}
.settings__group-head:hover { color: var(--aurora-text); }
.settings__group-icon { font-size: 15px; width: 16px; height: 16px; }
@@ -356,7 +356,7 @@ const importSettings = (e) => {
.settings__cat {
display: flex; align-items: center; gap: 10px; width: 100%;
padding: 8px 10px; border: none; background: none; cursor: pointer;
border-radius: 10px; text-align: left; margin-bottom: 1px;
border-radius: var(--aurora-radius-md); text-align: left; margin-bottom: 1px;
color: var(--aurora-text);
}
.settings__cat:hover { background: var(--aurora-bg-subtle); }
@@ -383,7 +383,7 @@ const importSettings = (e) => {
flex: 1; min-width: 0;
height: 100%;
overflow-y: auto;
border-radius: 16px;
border-radius: var(--aurora-radius-lg);
padding: 28px 32px;
box-sizing: border-box;
}
@@ -400,7 +400,7 @@ const importSettings = (e) => {
.settings__saved { font-size: 0.8125rem; color: var(--aurora-text-muted); }
.settings__save {
background: var(--aurora-accent); color: #fff; border: none;
border-radius: 9px; padding: 9px 20px; font-size: 0.875rem; font-weight: 500; cursor: pointer;
border-radius: var(--aurora-radius-md); padding: 9px 20px; font-size: 0.875rem; font-weight: 500; cursor: pointer;
}
.settings__save:disabled { opacity: 0.6; cursor: default; }
app/src/pages/settings/components/SettingsField.vue
+12 -12
View File
@@ -340,7 +340,7 @@ const installCompanion = async () => {
background: var(--aurora-bg-subtle);
border: 1px solid var(--aurora-border);
color: var(--aurora-text);
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
padding: 9px 12px;
font-size: 0.875rem;
}
@@ -350,14 +350,14 @@ const installCompanion = async () => {
.field__color { display: flex; align-items: center; gap: 10px; }
.field__color input[type='color'] {
width: 40px; height: 32px; border: 1px solid var(--aurora-border);
border-radius: 8px; background: none; cursor: pointer; padding: 2px;
border-radius: var(--aurora-radius-sm); background: none; cursor: pointer; padding: 2px;
}
.field__color-hex { font-size: 0.8125rem; color: var(--aurora-text-muted); }
.field__image {
width: 160px; height: 120px;
border: 1px dashed var(--aurora-border);
border-radius: 12px;
border-radius: var(--aurora-radius-md);
background: var(--aurora-bg-subtle);
display: flex; flex-direction: column; align-items: center; justify-content: center;
gap: 8px; cursor: pointer; color: var(--aurora-text-muted);
@@ -376,13 +376,13 @@ const installCompanion = async () => {
.field__repeater-remove {
flex-shrink: 0; width: 34px; border: 1px solid var(--aurora-border);
background: var(--aurora-bg-subtle); color: var(--aurora-text-muted);
border-radius: 8px; cursor: pointer; font-size: 1.1rem;
border-radius: var(--aurora-radius-sm); cursor: pointer; font-size: 1.1rem;
}
.field__newitem {
border: 1px solid var(--aurora-border);
background: var(--aurora-bg-subtle);
color: var(--aurora-text);
border-radius: 8px; padding: 8px 16px; font-size: 0.8125rem; cursor: pointer;
border-radius: var(--aurora-radius-sm); padding: 8px 16px; font-size: 0.8125rem; cursor: pointer;
}
.field__newitem:hover { border-color: var(--aurora-accent); color: var(--aurora-accent); }
@@ -400,13 +400,13 @@ const installCompanion = async () => {
display: inline-flex;
background: var(--aurora-bg-subtle);
border: 1px solid var(--aurora-border);
border-radius: 9px;
border-radius: var(--aurora-radius-md);
padding: 3px;
gap: 2px;
}
.field__seg button {
border: none; background: none; cursor: pointer;
padding: 6px 26px; border-radius: 7px;
padding: 6px 26px; border-radius: var(--aurora-radius-sm);
font-size: 0.8125rem; color: var(--aurora-text-muted);
}
.field__seg--active { background: var(--aurora-accent); color: #fff !important; }
@@ -417,13 +417,13 @@ const installCompanion = async () => {
display: flex; flex-direction: column; align-items: center; gap: 6px;
width: 76px; padding: 10px 6px;
border: 1px solid var(--aurora-border);
border-radius: 10px;
border-radius: var(--aurora-radius-md);
background: var(--aurora-bg-subtle);
cursor: pointer;
}
.field__theme-card--active { border-color: var(--aurora-accent); box-shadow: 0 0 0 1px var(--aurora-accent); }
.field__theme-swatch {
width: 36px; height: 36px; border-radius: 10px;
width: 36px; height: 36px; border-radius: var(--aurora-radius-md);
border: 1px solid var(--aurora-card-border);
display: flex; align-items: flex-end; justify-content: flex-end;
padding: 4px;
@@ -441,14 +441,14 @@ const installCompanion = async () => {
max-height: 260px; overflow-y: auto; z-index: 20;
background: var(--aurora-card-bg);
border: 1px solid var(--aurora-border);
border-radius: 10px;
border-radius: var(--aurora-radius-md);
padding: 6px;
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
}
.field__font-item {
display: block; width: 100%; text-align: left;
border: none; background: none; cursor: pointer;
padding: 8px 10px; border-radius: 7px;
padding: 8px 10px; border-radius: var(--aurora-radius-sm);
font-size: 0.875rem; color: var(--aurora-text);
}
.field__font-item:hover { background: var(--aurora-bg-subtle); }
@@ -457,7 +457,7 @@ const installCompanion = async () => {
/* Companion plugin install card */
.field__companion-status { font-size: 0.8125rem; color: var(--aurora-text-muted); }
.field__companion-install {
border: none; border-radius: 8px; background: var(--aurora-accent); color: #fff;
border: none; border-radius: var(--aurora-radius-sm); background: var(--aurora-accent); color: #fff;
padding: 8px 16px; font-size: 0.8125rem; font-weight: 600; cursor: pointer;
}
.field__companion-install:disabled { opacity: 0.6; cursor: default; }
app/src/pages/themes/Themes.vue
+2 -2
View File
@@ -131,13 +131,13 @@ const remove = async (theme) => {
}
.themes-page h1 { margin: 0; font-size: 1.6rem; font-weight: 700; color: var(--aurora-text); }
.themes-empty { color: var(--aurora-text-muted); font-size: 0.8125rem; }
.themes-notice { padding: 10px 14px; border-radius: 8px; margin-bottom: 16px; font-size: 0.875rem; }
.themes-notice { padding: 10px 14px; border-radius: var(--aurora-radius-sm); margin-bottom: 16px; font-size: 0.875rem; }
.themes-notice--error { background: rgba(239, 68, 68, 0.12); color: #ef4444; }
.themes-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 18px; }
.theme-card {
background: var(--aurora-bg-subtle); border: 1px solid var(--aurora-border);
border-radius: 14px; overflow: hidden; display: flex; flex-direction: column;
border-radius: var(--aurora-radius-md); overflow: hidden; display: flex; flex-direction: column;
}
.theme-card--active { border-color: var(--aurora-accent); }
.theme-card__shot {
app/src/pages/users/AddUser.vue
+3 -3
View File
@@ -126,7 +126,7 @@ const submit = async () => {
.add-user-page h1 { margin: 0; font-size: 1.6rem; font-weight: 700; color: var(--aurora-text); }
.add-user-notice {
padding: 10px 14px; border-radius: 8px; margin-bottom: 16px; font-size: 0.875rem;
padding: 10px 14px; border-radius: var(--aurora-radius-sm); margin-bottom: 16px; font-size: 0.875rem;
}
.add-user-notice--success { background: rgba(34, 197, 94, 0.12); color: #22c55e; }
.add-user-notice--error { background: rgba(239, 68, 68, 0.12); color: #ef4444; }
@@ -135,7 +135,7 @@ const submit = async () => {
display: flex; flex-direction: column; gap: 18px;
background: var(--aurora-bg-subtle);
border: 1px solid var(--aurora-border);
border-radius: 14px;
border-radius: var(--aurora-radius-md);
padding: 24px;
}
.add-user-field { display: flex; flex-direction: column; gap: 6px; }
@@ -143,7 +143,7 @@ const submit = async () => {
.add-user-field em { font-weight: 400; font-style: normal; color: var(--aurora-text-muted); }
.add-user-field input,
.add-user-field select {
padding: 9px 12px; border-radius: 8px; border: 1px solid var(--aurora-border);
padding: 9px 12px; border-radius: var(--aurora-radius-sm); border: 1px solid var(--aurora-border);
background: var(--aurora-bg); color: var(--aurora-text); font-size: 0.875rem;
}
.add-user-field__row { display: flex; gap: 8px; }
app/src/pages/users/Users.vue
+6 -6
View File
@@ -281,7 +281,7 @@ const initials = (name) =>
align-items: center;
min-height: 38px;
padding: 0 16px;
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-accent);
color: var(--aurora-accent-text);
font-size: 0.84rem;
@@ -331,7 +331,7 @@ const initials = (name) =>
width: min(320px, 100%);
min-height: 38px;
border: 1px solid var(--aurora-border);
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-bg-subtle);
display: flex;
align-items: center;
@@ -356,7 +356,7 @@ const initials = (name) =>
width: 42px;
min-height: 42px;
border: 1px solid var(--aurora-border);
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
color: var(--aurora-text);
background: var(--aurora-bg-subtle);
display: inline-flex;
@@ -383,7 +383,7 @@ const initials = (name) =>
.users-notice {
margin: 0 0 12px;
padding: 10px 12px;
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-bg-subtle);
color: var(--aurora-text);
font-size: 0.78rem;
@@ -392,7 +392,7 @@ const initials = (name) =>
.users-table {
overflow: hidden;
border: 1px solid var(--aurora-frame-border);
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-frame-bg);
}
.users-table__head,
@@ -507,7 +507,7 @@ const initials = (name) =>
width: 28px;
height: 28px;
border: 0;
border-radius: 6px;
border-radius: var(--aurora-radius-sm);
background: transparent;
color: var(--aurora-text-muted);
cursor: pointer;
app/src/pages/widgets/Widgets.vue
+5 -5
View File
@@ -111,20 +111,20 @@ const remove = async (widget) => {
.widgets-page h1 { margin: 0 0 6px; font-size: 1.6rem; font-weight: 700; color: var(--aurora-text); }
.widgets-page__sub { margin: 0; font-size: 0.8125rem; color: var(--aurora-text-muted); max-width: 640px; }
.widgets-notice { padding: 10px 14px; border-radius: 8px; margin-bottom: 16px; font-size: 0.875rem; }
.widgets-notice { padding: 10px 14px; border-radius: var(--aurora-radius-sm); margin-bottom: 16px; font-size: 0.875rem; }
.widgets-notice--error { background: rgba(239, 68, 68, 0.12); color: #ef4444; }
.widgets-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.widgets-sidebar {
background: var(--aurora-bg-subtle); border: 1px solid var(--aurora-border);
border-radius: 14px; padding: 18px;
border-radius: var(--aurora-radius-md); padding: 18px;
}
.widgets-sidebar h2 { font-size: 0.9375rem; margin: 0 0 10px; color: var(--aurora-text); }
.widgets-empty { color: var(--aurora-text-muted); font-size: 0.8125rem; }
.widgets-item {
display: flex; align-items: center; justify-content: space-between; gap: 10px;
padding: 8px 10px; border-radius: 8px; margin-bottom: 6px;
padding: 8px 10px; border-radius: var(--aurora-radius-sm); margin-bottom: 6px;
background: var(--aurora-bg); border: 1px solid var(--aurora-border);
font-size: 0.8125rem;
}
@@ -134,11 +134,11 @@ const remove = async (widget) => {
.widgets-item__actions { display: flex; align-items: center; gap: 2px; flex-shrink: 0; }
.widgets-item__actions button {
border: none; background: none; color: var(--aurora-text-muted); cursor: pointer;
width: 26px; height: 26px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center;
width: 26px; height: 26px; border-radius: var(--aurora-radius-sm); display: inline-flex; align-items: center; justify-content: center;
}
.widgets-item__actions button:hover { background: var(--aurora-bg-subtle); color: var(--aurora-text); }
.widgets-item__actions select {
font-size: 0.75rem; padding: 4px 6px; border-radius: 6px;
font-size: 0.75rem; padding: 4px 6px; border-radius: var(--aurora-radius-sm);
border: 1px solid var(--aurora-border); background: var(--aurora-bg); color: var(--aurora-text);
}
</style>
app/src/shell/components/SearchModal.vue
+3 -3
View File
@@ -146,7 +146,7 @@ onUnmounted(() => document.removeEventListener('keydown', onKeydown));
align-self: flex-start;
background: var(--aurora-frame-bg, #1c1c20);
border: 1px solid var(--aurora-frame-border, #34343b);
border-radius: 14px;
border-radius: var(--aurora-radius-md);
box-shadow: 0 24px 64px rgba(0, 0, 0, 0.45);
overflow: hidden;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
@@ -171,7 +171,7 @@ onUnmounted(() => document.removeEventListener('keydown', onKeydown));
font-size: 0.6875rem;
color: var(--aurora-text-muted);
border: 1px solid var(--aurora-border, #27272a);
border-radius: 5px;
border-radius: var(--aurora-radius-sm);
padding: 2px 6px;
}
.smodal__state {
@@ -197,7 +197,7 @@ onUnmounted(() => document.removeEventListener('keydown', onKeydown));
cursor: pointer;
text-align: left;
padding: 10px 12px;
border-radius: 9px;
border-radius: var(--aurora-radius-md);
}
.smodal__result--active { background: var(--aurora-accent-soft); }
.smodal__result-title {
app/src/shell/components/Sidebar.vue
+5 -5
View File
@@ -276,7 +276,7 @@ const filteredAuroraNav = computed(() => {
flush against the viewport edges. */
background: var(--aurora-card-bg);
border: 1px solid var(--aurora-card-border);
border-radius: 20px;
border-radius: var(--aurora-radius-lg);
transition: width 0.2s ease;
z-index: 99999;
box-sizing: border-box;
@@ -316,7 +316,7 @@ const filteredAuroraNav = computed(() => {
gap: 8px;
margin: 0 12px 10px;
padding: 6px 10px;
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-bg-subtle);
color: var(--aurora-text-muted);
}
@@ -361,7 +361,7 @@ const filteredAuroraNav = computed(() => {
.sidebar__row {
display: flex;
align-items: center;
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
margin: 0 8px;
}
@@ -393,7 +393,7 @@ const filteredAuroraNav = computed(() => {
width: 28px;
height: 28px;
flex-shrink: 0;
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
background: var(--aurora-bg-subtle);
color: var(--aurora-text-muted);
transition: background 0.12s ease, color 0.12s ease;
@@ -467,7 +467,7 @@ const filteredAuroraNav = computed(() => {
text-decoration: none;
color: var(--aurora-text-muted);
font-size: 0.8125rem;
border-radius: 6px;
border-radius: var(--aurora-radius-sm);
margin: 0 8px;
}
app/src/shell/components/Toolbar.vue
+4 -4
View File
@@ -102,7 +102,7 @@ onUnmounted(() => document.removeEventListener('keydown', onKeydown));
justify-content: center;
width: 34px;
height: 34px;
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
color: var(--aurora-text-muted);
text-decoration: none;
}
@@ -120,7 +120,7 @@ onUnmounted(() => document.removeEventListener('keydown', onKeydown));
padding: 0 10px;
min-width: 240px;
border: 1px solid var(--aurora-border);
border-radius: 10px;
border-radius: var(--aurora-radius-md);
background: var(--aurora-bg-subtle);
color: var(--aurora-text-muted);
font-size: 0.8125rem;
@@ -141,7 +141,7 @@ onUnmounted(() => document.removeEventListener('keydown', onKeydown));
.toolbar__search-kbd {
font-size: 0.6875rem;
border: 1px solid var(--aurora-border);
border-radius: 5px;
border-radius: var(--aurora-radius-sm);
padding: 1px 6px;
background: var(--aurora-bg);
}
@@ -154,7 +154,7 @@ onUnmounted(() => document.removeEventListener('keydown', onKeydown));
height: 34px;
border: none;
background: none;
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
cursor: pointer;
color: var(--aurora-text-muted);
}
app/src/shell/components/UserMenu.vue
+3 -3
View File
@@ -82,7 +82,7 @@ onUnmounted(() => document.removeEventListener('click', onDocClick));
background: none;
cursor: pointer;
padding: 6px 8px;
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
color: var(--aurora-text);
}
.user-menu__trigger:hover {
@@ -125,7 +125,7 @@ onUnmounted(() => document.removeEventListener('click', onDocClick));
width: 240px;
background: var(--aurora-bg);
border: 1px solid var(--aurora-border);
border-radius: 12px;
border-radius: var(--aurora-radius-md);
box-shadow: 0 12px 32px rgba(0, 0, 0, 0.18);
overflow: hidden;
z-index: 100000;
@@ -170,7 +170,7 @@ onUnmounted(() => document.removeEventListener('click', onDocClick));
align-items: center;
gap: 10px;
padding: 8px 10px;
border-radius: 8px;
border-radius: var(--aurora-radius-sm);
text-decoration: none;
color: var(--aurora-text);
font-size: 0.8125rem;
app/src/shell/shell-frame.css
+11 -7
View File
@@ -21,8 +21,12 @@
/* Breathing room between page content and the right browser edge. */
--aurora-gutter-r: 44px;
--aurora-radius: 14px;
--aurora-radius-lg: 24px;
/* Corner-radius scale, one notch rounder across the UI — tune here and
every surface follows (all radii are tokenized onto this scale). */
--aurora-radius-sm: 10px; /* chips, badges, small/icon controls */
--aurora-radius-md: 14px; /* buttons, inputs, search, list rows */
--aurora-radius-lg: 20px; /* cards, panels, larger buttons */
--aurora-radius-xl: 28px; /* page frames: content card, dashboard, sidebar, editor */
/* Light theme */
--aurora-app-bg: #fafafa; /* zinc-50 */
@@ -160,7 +164,7 @@ html.aurora-ready #site-editor {
position produced a visible double-edge rendering artifact right at
the rounded corners. The background/gradient contrast alone is
enough to read as a distinct surface without it. */
border-radius: var(--aurora-radius-lg);
border-radius: var(--aurora-radius-xl);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
transition: left 0.2s ease;
box-sizing: border-box;
@@ -190,7 +194,7 @@ html.aurora-ready #wpbody-content {
background: var(--aurora-frame-bg);
color: var(--aurora-text);
border: 1px solid var(--aurora-frame-border);
border-radius: var(--aurora-radius-lg);
border-radius: var(--aurora-radius-xl);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
margin: 16px var(--aurora-gutter-r) 24px 24px;
padding: 32px;
@@ -303,11 +307,11 @@ html.aurora-ready .theme-install-overlay .wp-full-overlay-sidebar {
top: calc(var(--aurora-toolbar-h) + 16px) !important;
bottom: 24px !important;
height: auto !important;
border-top-left-radius: var(--aurora-radius-lg);
border-top-left-radius: var(--aurora-radius-xl);
}
html.aurora-ready .theme-install-overlay .wp-full-overlay-main {
top: 0 !important;
border-top-right-radius: var(--aurora-radius-lg);
border-top-right-radius: var(--aurora-radius-xl);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
}
@@ -318,7 +322,7 @@ html.aurora-ready .theme-install-overlay .wp-full-overlay-main {
.aurora-dashboard-frame {
background: var(--aurora-frame-bg);
border: 1px solid var(--aurora-frame-border);
border-radius: var(--aurora-radius-lg);
border-radius: var(--aurora-radius-xl);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
margin: 16px var(--aurora-gutter-r) 24px 24px;
box-sizing: border-box;