feat(microservices): manage code queue through v3s
This commit is contained in:
@@ -6290,3 +6290,203 @@ input:focus, select:focus, textarea:focus { border-color: var(--accent-2); }
|
||||
.notification-banner-dismiss:hover {
|
||||
background: rgba(255,255,255,0.3);
|
||||
}
|
||||
|
||||
.v3s-page {
|
||||
display: grid;
|
||||
gap: 14px;
|
||||
}
|
||||
.v3s-hero-panel {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
border-color: rgba(215, 161, 58, 0.34);
|
||||
background:
|
||||
radial-gradient(circle at 88% 18%, rgba(215, 161, 58, 0.16), transparent 30%),
|
||||
radial-gradient(circle at 12% 84%, rgba(78, 183, 168, 0.13), transparent 34%),
|
||||
linear-gradient(135deg, rgba(255,255,255,0.045), rgba(255,255,255,0.012));
|
||||
}
|
||||
.v3s-hero {
|
||||
display: grid;
|
||||
grid-template-columns: 128px minmax(0, 1fr);
|
||||
align-items: center;
|
||||
gap: 18px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
.v3s-orb {
|
||||
position: relative;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
width: 118px;
|
||||
height: 118px;
|
||||
border: 1px solid rgba(215, 161, 58, 0.5);
|
||||
border-radius: 999px;
|
||||
background:
|
||||
repeating-conic-gradient(from 12deg, rgba(215,161,58,0.22) 0 8deg, transparent 8deg 19deg),
|
||||
radial-gradient(circle, rgba(78,183,168,0.22), rgba(0,0,0,0.18) 62%);
|
||||
box-shadow: 0 0 34px rgba(78,183,168,0.18), inset 0 0 24px rgba(0,0,0,0.32);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.22em;
|
||||
color: var(--accent);
|
||||
font-weight: 800;
|
||||
}
|
||||
.v3s-orb::before,
|
||||
.v3s-orb::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: 12px;
|
||||
border: 1px dashed rgba(78,183,168,0.38);
|
||||
border-radius: inherit;
|
||||
}
|
||||
.v3s-orb::after {
|
||||
inset: 28px;
|
||||
border-style: solid;
|
||||
border-color: rgba(255,255,255,0.12);
|
||||
}
|
||||
.v3s-hero-copy h2 {
|
||||
max-width: 860px;
|
||||
margin: 0 0 8px;
|
||||
color: var(--text);
|
||||
font-size: 22px;
|
||||
line-height: 1.2;
|
||||
letter-spacing: 0.08em;
|
||||
text-transform: none;
|
||||
}
|
||||
.v3s-route-strip {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
margin-top: 12px;
|
||||
}
|
||||
.v3s-route-strip span {
|
||||
padding: 5px 8px;
|
||||
border: 1px solid rgba(215,161,58,0.5);
|
||||
border-radius: 999px;
|
||||
background: rgba(215,161,58,0.12);
|
||||
color: var(--accent);
|
||||
font-size: 10px;
|
||||
font-weight: 800;
|
||||
letter-spacing: 0.16em;
|
||||
}
|
||||
.v3s-route-strip code {
|
||||
max-width: 100%;
|
||||
padding: 5px 8px;
|
||||
border: 1px solid var(--line-soft);
|
||||
border-radius: 999px;
|
||||
background: rgba(0,0,0,0.24);
|
||||
color: var(--text);
|
||||
overflow-wrap: anywhere;
|
||||
white-space: normal;
|
||||
}
|
||||
.v3s-control-plane-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
gap: 8px;
|
||||
margin-top: 12px;
|
||||
}
|
||||
.v3s-control-plane-card {
|
||||
min-height: 96px;
|
||||
padding: 12px;
|
||||
border: 1px solid rgba(255,255,255,0.1);
|
||||
background: linear-gradient(135deg, rgba(0,0,0,0.22), rgba(78,183,168,0.07));
|
||||
}
|
||||
.v3s-control-plane-card span {
|
||||
color: var(--muted);
|
||||
font-size: 10px;
|
||||
letter-spacing: 0.14em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.v3s-control-plane-card strong {
|
||||
display: block;
|
||||
margin-top: 8px;
|
||||
color: var(--text);
|
||||
font-size: 17px;
|
||||
letter-spacing: 0.08em;
|
||||
}
|
||||
.v3s-control-plane-card p {
|
||||
margin: 8px 0 0;
|
||||
color: var(--muted);
|
||||
font-size: 12px;
|
||||
line-height: 1.45;
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
.v3s-service-panel {
|
||||
border-color: rgba(78,183,168,0.25);
|
||||
}
|
||||
.v3s-service-summary {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||
gap: 8px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
.v3s-service-summary > div,
|
||||
.v3s-instance-card {
|
||||
border: 1px solid var(--line-soft);
|
||||
background: rgba(0,0,0,0.18);
|
||||
}
|
||||
.v3s-service-summary > div {
|
||||
display: grid;
|
||||
gap: 6px;
|
||||
min-height: 66px;
|
||||
padding: 10px;
|
||||
}
|
||||
.v3s-service-summary span,
|
||||
.v3s-kv dt {
|
||||
color: var(--muted);
|
||||
font-size: 10px;
|
||||
letter-spacing: 0.12em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.v3s-service-summary strong {
|
||||
color: var(--text);
|
||||
font-size: 18px;
|
||||
}
|
||||
.v3s-instance-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
|
||||
gap: 10px;
|
||||
}
|
||||
.v3s-instance-card {
|
||||
padding: 12px;
|
||||
border-left: 3px solid rgba(78,183,168,0.7);
|
||||
}
|
||||
.v3s-instance-role {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 8px;
|
||||
margin: 8px 0 10px;
|
||||
color: var(--accent);
|
||||
font-size: 11px;
|
||||
letter-spacing: 0.15em;
|
||||
}
|
||||
.v3s-kv {
|
||||
display: grid;
|
||||
grid-template-columns: 76px minmax(0, 1fr);
|
||||
gap: 6px 10px;
|
||||
margin: 0;
|
||||
}
|
||||
.v3s-kv dd {
|
||||
min-width: 0;
|
||||
margin: 0;
|
||||
color: var(--text);
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
.v3s-kv code {
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
@media (max-width: 780px) {
|
||||
.v3s-hero {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
.v3s-orb {
|
||||
width: 96px;
|
||||
height: 96px;
|
||||
}
|
||||
.v3s-service-summary {
|
||||
grid-template-columns: 1fr 1fr;
|
||||
}
|
||||
.v3s-control-plane-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user