GovOPlaN/govoplan-core
1
0
Fork 0
Code Issues 43 Pull Requests Actions Packages Projects Releases Wiki Activity

Centralize shared layout style contracts

Browse Source
This commit is contained in:
Albrecht Degering
2026-07-21 13:46:59 +02:00
parent 2ac1e64daa
commit 865901f090
2 changed files with 111 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

108
webui/src/styles/components.css
View File

@@ -3063,3 +3063,111 @@
@keyframes file-drop-progress-spin { @keyframes file-drop-progress-spin {
to { transform: rotate(360deg); } to { transform: rotate(360deg); }
} }
/* Shared settings, placeholder, and administration layout contracts. */
.placeholder-stack {
display: grid;
gap: 8px;
margin-top: 12px;
}
.placeholder-stack span {
display: block;
border: 1px dashed var(--line-dark);
border-radius: 6px;
background: var(--panel-soft);
padding: 10px 12px;
color: var(--muted);
font-weight: 700;
}
.compact-detail-list {
gap: 8px;
}
.settings-dashboard-grid {
align-items: start;
}
.settings-list {
display: grid;
gap: 12px;
}
.settings-target-row {
max-width: 520px;
}
.admin-secret {
display: block;
padding: 14px;
margin: 12px 0;
overflow-wrap: anywhere;
border: var(--border-line);
border-radius: var(--radius-sm);
background: var(--surface-muted);
font-size: 14px;
user-select: all;
}
.admin-json-preview {
max-height: 420px;
overflow: auto;
padding: 12px;
border: var(--border-line);
border-radius: var(--radius-sm);
background: var(--surface-muted);
white-space: pre-wrap;
word-break: break-word;
}
.admin-audit-grid .data-grid-scroll-region {
max-height: min(68vh, 720px);
}
.admin-audit-grid .data-grid-header-cell {
top: 0;
}
.admin-details-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 10px 18px;
}
.admin-details-grid > div {
min-width: 0;
padding: 10px 0;
border-bottom: var(--border-line);
}
.admin-details-grid dt {
color: var(--muted);
font-size: 12px;
font-weight: 700;
text-transform: uppercase;
}
.admin-details-grid dd {
margin: 4px 0 0;
overflow-wrap: anywhere;
}
.admin-governance-mode {
display: grid;
gap: 8px;
}
.admin-tenant-assignment-row {
display: grid;
grid-template-columns: minmax(0, 1fr) 140px;
align-items: center;
gap: 10px;
}
.admin-settings-form {
display: grid;
gap: 18px;
}
.admin-settings-form .card {
margin: 0;
}
.admin-managed-notice {
margin: 0 0 16px;
padding: 12px 14px;
border: 1px solid var(--info-muted-border);
border-radius: var(--radius-sm);
background: var(--info-bg);
color: var(--info-text-deep);
line-height: 1.45;
}
@media (max-width: 850px) {
.admin-details-grid,
.admin-tenant-assignment-row {
grid-template-columns: 1fr;
}
}

3
webui/src/styles/layout.css
View File

@@ -29,6 +29,9 @@
.titlebar { position: relative; background: var(--titlebar-bg); border-bottom: var(--border-line); display: flex; align-items: center; padding: 0 18px; gap: 36px; z-index: 100; box-shadow: var(--shadow-chrome); } .titlebar { position: relative; background: var(--titlebar-bg); border-bottom: var(--border-line); display: flex; align-items: center; padding: 0 18px; gap: 36px; z-index: 100; box-shadow: var(--shadow-chrome); }
.tenant-selector { height: 40px; min-width: 210px; border: var(--border-line); border-radius: var(--radius-sm); background: var(--surface); display: flex; align-items: center; padding: 0 12px; gap: 5px; box-shadow: var(--shadow-xs); } .tenant-selector { height: 40px; min-width: 210px; border: var(--border-line); border-radius: var(--radius-sm); background: var(--surface); display: flex; align-items: center; padding: 0 12px; gap: 5px; box-shadow: var(--shadow-xs); }
.tenant-label, .tenant-caret, .muted { color: var(--muted); } .tenant-label, .tenant-caret, .muted { color: var(--muted); }
.block { display: block; }
.danger-text { color: var(--danger-text); }
.small-text { font-size: .78rem; }
.small-note { font-size: 12px; } .small-note { font-size: 12px; }
.titlebar-spacer { flex: 1; } .titlebar-spacer { flex: 1; }
.titlebar-link, .titlebar-icon-link, .account-pill { border: 0; background: transparent; display: inline-flex; align-items: center; gap: 7px; color: var(--muted); font: inherit; } .titlebar-link, .titlebar-icon-link, .account-pill { border: 0; background: transparent; display: inline-flex; align-items: center; gap: 7px; color: var(--muted); font: inherit; }