|
/* retoor <retoor@molodetz.nl> */
|
|
|
|
.workspace-page {
|
|
max-width: var(--content-width);
|
|
margin: 0 auto;
|
|
padding: var(--space-md);
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--space-md);
|
|
}
|
|
|
|
.workspace-title {
|
|
color: var(--text-primary);
|
|
margin: 0;
|
|
}
|
|
|
|
.workspace-muted {
|
|
color: var(--text-secondary);
|
|
}
|
|
|
|
.workspace-state {
|
|
font-weight: 600;
|
|
color: var(--text-primary);
|
|
text-transform: capitalize;
|
|
}
|
|
|
|
.workspace-meters {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: var(--space-md);
|
|
margin: var(--space-sm) 0;
|
|
}
|
|
|
|
.workspace-meter {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: var(--space-xs);
|
|
color: var(--text-secondary);
|
|
}
|
|
|
|
.workspace-actions {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: var(--space-sm);
|
|
align-items: center;
|
|
}
|
|
|
|
.workspace-tunnel-list {
|
|
list-style: none;
|
|
padding: 0;
|
|
margin: 0 0 var(--space-sm) 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--space-xs);
|
|
}
|
|
|
|
.workspace-tunnel {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
gap: var(--space-xs);
|
|
}
|
|
|
|
.workspace-badge {
|
|
background: var(--bg-hover);
|
|
color: var(--text-secondary);
|
|
border-radius: var(--radius);
|
|
padding: 0 var(--space-xs);
|
|
font-size: 0.85em;
|
|
}
|
|
|
|
.workspace-badge-active {
|
|
background: var(--success);
|
|
color: var(--bg-card);
|
|
}
|
|
|
|
.workspace-badge-failed {
|
|
background: var(--danger);
|
|
color: var(--bg-card);
|
|
}
|
|
|
|
.workspace-badge-provisioning,
|
|
.workspace-badge-pending {
|
|
background: var(--warning);
|
|
color: var(--bg-card);
|
|
}
|
|
|
|
.workspace-error {
|
|
color: var(--danger);
|
|
}
|
|
|
|
.workspace-tunnel-form {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: var(--space-xs);
|
|
}
|
|
|
|
.workspace-suspended {
|
|
border-left: 3px solid var(--danger);
|
|
}
|
|
|
|
.workspace-flag-critical {
|
|
border-left: 3px solid var(--danger);
|
|
}
|
|
|
|
.workspace-flag-warn {
|
|
border-left: 3px solid var(--warning);
|
|
}
|
|
|
|
.workspace-flag-info {
|
|
border-left: 3px solid var(--text-secondary);
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.workspace-meters {
|
|
flex-direction: column;
|
|
}
|
|
}
|