Complete platform management workflows
This commit is contained in:
npc0-hue
+386
-9
@@ -1203,6 +1203,48 @@ button {
|
||||
align-items: end;
|
||||
}
|
||||
|
||||
.workflow-hint-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
gap: 10px;
|
||||
margin: 10px 0 12px;
|
||||
}
|
||||
|
||||
.workflow-hint-card,
|
||||
.form-guidance,
|
||||
.role-impact-list {
|
||||
display: grid;
|
||||
gap: 4px;
|
||||
padding: 10px 12px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 8px;
|
||||
background: var(--jelly-highlight), var(--glass-wash), var(--surface-solid);
|
||||
color: var(--ink-soft);
|
||||
box-shadow: inset 0 1px 0 var(--crystal-rim);
|
||||
font-size: 12.5px;
|
||||
line-height: 1.45;
|
||||
}
|
||||
|
||||
.workflow-hint-card strong,
|
||||
.form-guidance strong,
|
||||
.role-impact-list strong {
|
||||
color: var(--ink);
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.management-form-wide,
|
||||
.role-impact-list {
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
|
||||
.role-impact-list {
|
||||
margin: 0 0 12px;
|
||||
}
|
||||
|
||||
.management-form .role-impact-list {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.role-selector {
|
||||
grid-column: 1 / -1;
|
||||
display: flex;
|
||||
@@ -1225,6 +1267,20 @@ button {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.status-update-control {
|
||||
min-width: 132px;
|
||||
}
|
||||
|
||||
.status-update-control select {
|
||||
min-height: 32px;
|
||||
border: 1px solid var(--line-strong);
|
||||
border-radius: 8px;
|
||||
padding: 0 8px;
|
||||
background: var(--surface-solid);
|
||||
color: var(--ink);
|
||||
font: inherit;
|
||||
}
|
||||
|
||||
.profile-settings-page {
|
||||
gap: 18px;
|
||||
}
|
||||
@@ -1352,7 +1408,7 @@ button {
|
||||
.page-frame {
|
||||
width: min(100%, 1180px);
|
||||
display: grid;
|
||||
gap: 18px;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
@@ -1409,6 +1465,57 @@ button {
|
||||
color: var(--success);
|
||||
}
|
||||
|
||||
.page-summary-strip {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 6px;
|
||||
margin: -2px 0 0;
|
||||
}
|
||||
|
||||
.page-summary-chip {
|
||||
display: inline-flex;
|
||||
align-items: baseline;
|
||||
gap: 8px;
|
||||
min-height: 28px;
|
||||
padding: 4px 10px;
|
||||
border: 1px solid color-mix(in srgb, var(--line) 72%, transparent);
|
||||
border-left-width: 3px;
|
||||
border-radius: 999px;
|
||||
background: color-mix(in srgb, var(--surface) 52%, transparent);
|
||||
color: var(--ink-faint);
|
||||
-webkit-backdrop-filter: blur(14px) saturate(1.1);
|
||||
backdrop-filter: blur(14px) saturate(1.1);
|
||||
box-shadow: inset 0 1px 0 var(--crystal-rim);
|
||||
}
|
||||
|
||||
.page-summary-chip dt,
|
||||
.page-summary-chip dd {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.page-summary-chip dt {
|
||||
font-size: 12px;
|
||||
font-weight: 650;
|
||||
}
|
||||
|
||||
.page-summary-chip dd {
|
||||
color: var(--ink);
|
||||
font-size: 13px;
|
||||
font-weight: 760;
|
||||
}
|
||||
|
||||
.summary-tone-success {
|
||||
border-left-color: var(--teal);
|
||||
}
|
||||
|
||||
.summary-tone-warning {
|
||||
border-left-color: var(--gold);
|
||||
}
|
||||
|
||||
.summary-tone-neutral {
|
||||
border-left-color: var(--accent);
|
||||
}
|
||||
|
||||
/* ---- metric cards ---- */
|
||||
|
||||
.metric-grid {
|
||||
@@ -2598,10 +2705,6 @@ button {
|
||||
min-height: 52px;
|
||||
}
|
||||
|
||||
.ai-provider-metrics {
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.ai-provider-toolbar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -2610,7 +2713,6 @@ button {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.ai-provider-workspace,
|
||||
.server-workspace {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
|
||||
@@ -2618,7 +2720,6 @@ button {
|
||||
align-items: start;
|
||||
}
|
||||
|
||||
.ai-provider-workspace > *,
|
||||
.server-workspace > * {
|
||||
min-width: 0;
|
||||
}
|
||||
@@ -2743,6 +2844,68 @@ button {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.provider-actions-cell {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.human-row-actions {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.human-row-actions button {
|
||||
width: auto;
|
||||
min-width: 58px;
|
||||
height: 32px;
|
||||
gap: 5px;
|
||||
padding: 0 9px;
|
||||
white-space: nowrap;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.human-row-actions .row-action-button-active {
|
||||
border-color: var(--accent);
|
||||
color: var(--accent-deep);
|
||||
background: var(--glass-wash), var(--accent-soft);
|
||||
}
|
||||
|
||||
.inline-action-menu {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
z-index: 4;
|
||||
display: grid;
|
||||
gap: 6px;
|
||||
min-width: 160px;
|
||||
margin-top: 6px;
|
||||
padding: 8px;
|
||||
border: 1px solid var(--line-strong);
|
||||
border-radius: 8px;
|
||||
background: var(--frosted-surface), var(--surface-solid);
|
||||
box-shadow: var(--jelly-inset), 0 16px 36px var(--glass-shadow);
|
||||
}
|
||||
|
||||
.inline-action-menu button {
|
||||
min-height: 32px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 7px;
|
||||
padding: 0 9px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 8px;
|
||||
background: var(--jelly-highlight), var(--glass-wash), var(--surface-solid);
|
||||
color: var(--ink-soft);
|
||||
cursor: pointer;
|
||||
font-weight: 700;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.inline-action-menu button:hover,
|
||||
.inline-action-menu button:focus-visible {
|
||||
border-color: var(--accent);
|
||||
outline: none;
|
||||
color: var(--ink);
|
||||
}
|
||||
|
||||
.form-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -2779,6 +2942,61 @@ button {
|
||||
background: var(--danger-soft);
|
||||
}
|
||||
|
||||
.provider-setup-guide {
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
|
||||
.provider-preset-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.provider-preset-option {
|
||||
min-height: 74px;
|
||||
display: grid;
|
||||
align-content: start;
|
||||
gap: 4px;
|
||||
padding: 10px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 8px;
|
||||
background: var(--jelly-highlight), var(--glass-wash), var(--surface-solid);
|
||||
color: var(--ink-soft);
|
||||
cursor: pointer;
|
||||
text-align: left;
|
||||
box-shadow: inset 0 1px 0 var(--crystal-rim);
|
||||
}
|
||||
|
||||
.provider-preset-option strong {
|
||||
color: var(--ink);
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.provider-preset-option span {
|
||||
font-size: 12px;
|
||||
line-height: 1.35;
|
||||
}
|
||||
|
||||
.provider-preset-option:hover,
|
||||
.provider-preset-option:focus-visible {
|
||||
border-color: var(--accent);
|
||||
outline: none;
|
||||
box-shadow: inset 0 1px 0 var(--crystal-rim), 0 0 0 2px var(--accent-soft);
|
||||
}
|
||||
|
||||
.field-help {
|
||||
color: var(--ink-faint);
|
||||
font-size: 11.5px;
|
||||
font-weight: 600;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.form-helper-actions {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.provider-form label {
|
||||
display: grid;
|
||||
gap: 6px;
|
||||
@@ -3204,6 +3422,60 @@ button {
|
||||
box-shadow: var(--panel-shadow);
|
||||
}
|
||||
|
||||
.management-dialog-panel {
|
||||
width: min(720px, 100%);
|
||||
height: auto;
|
||||
max-height: min(760px, calc(100dvh - 32px));
|
||||
overflow: auto;
|
||||
border: 1px solid var(--line);
|
||||
border-left: 1px solid var(--line);
|
||||
border-radius: 8px;
|
||||
box-shadow: var(--jelly-inset), inset 0 0 0 1px var(--diamond-line), 0 18px 48px var(--glass-shadow), 0 0 34px var(--moonbeam);
|
||||
}
|
||||
|
||||
.management-dialog-wide {
|
||||
width: min(920px, 100%);
|
||||
}
|
||||
|
||||
.dialog-description {
|
||||
margin: 0;
|
||||
color: var(--ink-soft);
|
||||
font-size: 14px;
|
||||
line-height: 1.55;
|
||||
}
|
||||
|
||||
.management-dialog-panel .provider-form,
|
||||
.management-dialog-panel .management-form {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
backdrop-filter: none;
|
||||
}
|
||||
|
||||
.management-dialog-panel .management-form {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.management-dialog-panel .dialog-form .role-selector,
|
||||
.management-dialog-panel .dialog-form .confirm-actions {
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
|
||||
.management-dialog-panel .plugin-detail-panel,
|
||||
.management-dialog-panel .plugin-group {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
clip-path: none;
|
||||
}
|
||||
|
||||
.management-dialog-panel .plugin-group::before,
|
||||
.management-dialog-panel .plugin-group::after {
|
||||
content: none;
|
||||
}
|
||||
|
||||
.plugin-detail-actions {
|
||||
align-items: stretch;
|
||||
}
|
||||
@@ -3327,6 +3599,104 @@ button {
|
||||
font-size: 12.5px;
|
||||
}
|
||||
|
||||
/* ---- maintenance triage ---- */
|
||||
|
||||
.maintenance-triage-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.triage-card {
|
||||
min-height: 120px;
|
||||
display: grid;
|
||||
align-content: start;
|
||||
gap: 6px;
|
||||
padding: 13px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 8px;
|
||||
background: var(--corner-sparkle), var(--jelly-highlight), var(--glass-wash), var(--surface);
|
||||
background-size: 52px 52px, auto, auto, auto;
|
||||
background-position: right 8px top 6px, center, center, center;
|
||||
background-repeat: no-repeat;
|
||||
color: var(--ink-soft);
|
||||
cursor: pointer;
|
||||
text-align: left;
|
||||
box-shadow: inset 0 1px 0 var(--crystal-rim), var(--panel-shadow);
|
||||
}
|
||||
|
||||
.triage-card svg {
|
||||
color: var(--accent-deep);
|
||||
}
|
||||
|
||||
.triage-card span {
|
||||
color: var(--ink-faint);
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.triage-card strong {
|
||||
color: var(--ink);
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.triage-card small {
|
||||
color: var(--ink-soft);
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.triage-card:hover,
|
||||
.triage-card:focus-visible {
|
||||
border-color: var(--accent);
|
||||
outline: none;
|
||||
box-shadow: inset 0 1px 0 var(--crystal-rim), 0 0 0 2px var(--accent-soft), var(--panel-shadow);
|
||||
}
|
||||
|
||||
.maintenance-node-item {
|
||||
grid-template-columns: minmax(170px, 1fr) auto minmax(160px, 0.8fr) minmax(220px, 1.2fr);
|
||||
}
|
||||
|
||||
.maintenance-node-item .node-detail,
|
||||
.maintenance-node-item .maintenance-actions {
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
|
||||
.node-detail {
|
||||
display: grid;
|
||||
gap: 6px;
|
||||
padding: 8px 10px;
|
||||
border: 1px dashed var(--line);
|
||||
border-radius: 8px;
|
||||
color: var(--ink-faint);
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.node-detail summary {
|
||||
color: var(--ink-soft);
|
||||
cursor: pointer;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.node-detail[open] {
|
||||
background: var(--glass-wash), var(--accent-soft);
|
||||
}
|
||||
|
||||
.node-detail span {
|
||||
display: inline-block;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.maintenance-actions {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.maintenance-actions .theme-upload {
|
||||
min-height: 30px;
|
||||
}
|
||||
|
||||
/* ---- operation history ---- */
|
||||
|
||||
.operation-list {
|
||||
@@ -3498,6 +3868,10 @@ button {
|
||||
.confirm-actions button {
|
||||
min-height: 38px;
|
||||
padding: 0 16px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 6px;
|
||||
border-radius: 8px;
|
||||
border: 1px solid var(--line-strong);
|
||||
background: var(--surface-solid);
|
||||
@@ -3533,6 +3907,10 @@ button {
|
||||
|
||||
.management-form,
|
||||
.user-management-item,
|
||||
.workflow-hint-grid,
|
||||
.provider-preset-grid,
|
||||
.maintenance-triage-grid,
|
||||
.maintenance-node-item,
|
||||
.profile-settings-hero,
|
||||
.profile-settings-grid,
|
||||
.profile-settings-form-row,
|
||||
@@ -3542,6 +3920,7 @@ button {
|
||||
}
|
||||
|
||||
.user-actions,
|
||||
.maintenance-actions,
|
||||
.profile-settings-actions {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
@@ -3682,9 +4061,7 @@ button {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.ai-provider-metrics,
|
||||
.server-metrics,
|
||||
.ai-provider-workspace,
|
||||
.server-workspace,
|
||||
.form-grid {
|
||||
grid-template-columns: 1fr;
|
||||
|
||||
Reference in New Issue
Block a user