73 lines
1.3 KiB
CSS
73 lines
1.3 KiB
CSS
.connect-bar {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
padding: 8px 12px;
|
|
box-sizing: border-box;
|
|
background: rgba(12, 16, 24, 0.82);
|
|
border-bottom: 1px solid rgba(108, 198, 255, 0.25);
|
|
color: #d8e0ea;
|
|
font-family: 'Segoe UI', system-ui, sans-serif;
|
|
font-size: 14px;
|
|
z-index: 10;
|
|
}
|
|
|
|
.connect-bar .title {
|
|
font-weight: 600;
|
|
color: #6cc6ff;
|
|
letter-spacing: 0.02em;
|
|
}
|
|
|
|
.connect-bar .server {
|
|
flex: 0 1 320px;
|
|
min-width: 0;
|
|
padding: 5px 9px;
|
|
background: #0c1018;
|
|
border: 1px solid #2a3850;
|
|
border-radius: 4px;
|
|
color: #e6edf6;
|
|
font-family: ui-monospace, 'Cascadia Code', monospace;
|
|
font-size: 13px;
|
|
}
|
|
|
|
.connect-bar .server:focus {
|
|
outline: none;
|
|
border-color: #6cc6ff;
|
|
}
|
|
|
|
.connect-bar .connect {
|
|
padding: 5px 14px;
|
|
background: #1c2c44;
|
|
border: 1px solid #3a567f;
|
|
border-radius: 4px;
|
|
color: #d8e0ea;
|
|
font-size: 13px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.connect-bar .connect:hover {
|
|
background: #25395a;
|
|
border-color: #6cc6ff;
|
|
}
|
|
|
|
.connect-bar .status {
|
|
margin-left: auto;
|
|
font-variant-numeric: tabular-nums;
|
|
}
|
|
|
|
.connect-bar .status.ok {
|
|
color: #7fdca0;
|
|
}
|
|
|
|
.connect-bar .status.warn {
|
|
color: #f0c060;
|
|
}
|
|
|
|
.connect-bar .status.idle {
|
|
color: #8a96a6;
|
|
}
|