still tuning server settings section
This commit is contained in:
parent
66f9c0bc1e
commit
80bc8d352c
11 changed files with 510 additions and 164 deletions
|
|
@ -1059,3 +1059,125 @@
|
|||
.restart-overlay-actions {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
/* Server Settings' Settings/Services tab bar. */
|
||||
.tab-bar {
|
||||
display: flex;
|
||||
gap: 4px;
|
||||
padding: 4px;
|
||||
margin-bottom: 18px;
|
||||
background: var(--surface-soft);
|
||||
border: 1px solid var(--line);
|
||||
border-radius: var(--radius);
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
.tab-btn {
|
||||
appearance: none;
|
||||
border: none;
|
||||
background: transparent;
|
||||
color: var(--text-soft);
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
padding: 7px 16px;
|
||||
border-radius: var(--radius-sm);
|
||||
cursor: pointer;
|
||||
transition: background 0.15s ease, color 0.15s ease;
|
||||
}
|
||||
|
||||
.tab-btn:hover {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.tab-btn.active {
|
||||
background: var(--panel);
|
||||
color: var(--text);
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
|
||||
}
|
||||
|
||||
/* Live Docker/process status cards -- Services tab. */
|
||||
.service-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.service-card {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
padding: 12px 14px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: var(--radius);
|
||||
background: var(--panel);
|
||||
}
|
||||
|
||||
.service-card-icon {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
flex: none;
|
||||
border-radius: var(--radius-sm);
|
||||
background: var(--surface-soft);
|
||||
color: var(--text-soft);
|
||||
}
|
||||
|
||||
.service-card-body {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.service-card-name {
|
||||
font-weight: 700;
|
||||
font-size: 13px;
|
||||
color: var(--text);
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
.service-card-detail {
|
||||
font-size: 11.5px;
|
||||
color: var(--muted);
|
||||
font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
|
||||
margin-top: 1px;
|
||||
}
|
||||
|
||||
.service-card-status {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
flex: none;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
text-transform: capitalize;
|
||||
padding: 4px 9px;
|
||||
border-radius: 999px;
|
||||
}
|
||||
|
||||
.service-card.tone-good .service-card-icon { color: var(--good); }
|
||||
.service-card.tone-good .service-card-status {
|
||||
color: var(--good);
|
||||
background: var(--good-tint);
|
||||
border: 1px solid var(--good-border);
|
||||
}
|
||||
|
||||
.service-card.tone-warn .service-card-icon { color: var(--warn); }
|
||||
.service-card.tone-warn .service-card-status {
|
||||
color: var(--warn);
|
||||
background: var(--warn-tint);
|
||||
border: 1px solid var(--warn-border);
|
||||
}
|
||||
|
||||
.service-card.tone-danger .service-card-icon { color: var(--danger); }
|
||||
.service-card.tone-danger .service-card-status {
|
||||
color: var(--danger);
|
||||
background: var(--danger-tint);
|
||||
border: 1px solid var(--danger-border);
|
||||
}
|
||||
|
||||
.service-card.tone-idle .service-card-status {
|
||||
color: var(--muted);
|
||||
background: var(--surface-soft);
|
||||
border: 1px solid var(--line);
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue