maeneko
53d5a08bbd
Baseline TypeScript version before the Go rewrite: CAKE fair sharing with automatic deprioritisation of heavy devices, per-key priority, /metrics with a metrics token, the built-in Prometheus install/remove, the Monitor tab, grouped sidebar tabs and the dead-peer audit.
95 lines
2.7 KiB
CSS
95 lines
2.7 KiB
CSS
/*
|
|
Copyright (c) 2026 Ivan Vasilev
|
|
This source code is licensed under the MIT license found in the
|
|
LICENSE file in the root directory of this source tree.
|
|
*/
|
|
/* Стили вкладки «API-ключи». Общая дизайн-система — в App.css. */
|
|
|
|
/* Открытый API-ключ (показывается один раз при создании) */
|
|
.apikey-value {
|
|
font-family: var(--mono);
|
|
font-size: 13px;
|
|
color: var(--on-surface);
|
|
background: var(--surface-container);
|
|
border: 1px solid var(--outline-variant);
|
|
border-radius: 12px;
|
|
padding: 12px 14px;
|
|
width: 100%;
|
|
word-break: break-all;
|
|
user-select: all;
|
|
}
|
|
|
|
.apikey-cards-list { display: none; flex-direction: column; gap: 12px; }
|
|
|
|
.apikey-count { font-size: 12px; color: var(--neutral-text); }
|
|
.apikey-empty {
|
|
font-size: 14px;
|
|
color: var(--neutral-text);
|
|
text-align: center;
|
|
padding: 48px 0;
|
|
}
|
|
.apikey-card {
|
|
background: var(--surface-bright);
|
|
border: 1px solid var(--outline-variant);
|
|
border-radius: var(--r-card);
|
|
padding: 16px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 12px;
|
|
}
|
|
.apikey-card-header {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 8px;
|
|
}
|
|
.apikey-card-title {
|
|
display: flex;
|
|
align-items: baseline;
|
|
gap: 8px;
|
|
min-width: 0;
|
|
}
|
|
.apikey-card-num { font-size: 12px; color: var(--neutral-dot); flex-shrink: 0; }
|
|
.apikey-card-label {
|
|
font-size: 16px;
|
|
font-weight: 500;
|
|
color: var(--on-surface);
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.apikey-card-prefix {
|
|
font-family: var(--mono);
|
|
font-size: 13px;
|
|
color: var(--neutral-text);
|
|
word-break: break-all;
|
|
}
|
|
.apikey-card-meta {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
gap: 8px;
|
|
font-size: 12px;
|
|
color: var(--neutral-text);
|
|
}
|
|
|
|
@media (max-width: 640px) {
|
|
.apikey-cards-list { display: flex; }
|
|
}
|
|
|
|
/* Настройки ключа: какие серверы он видит */
|
|
.apikey-tr-tools td { padding-top: 0; }
|
|
.apikey-tools {
|
|
display: flex; flex-direction: column; gap: 10px;
|
|
background: var(--surface-bright);
|
|
border: 1px solid var(--outline-variant);
|
|
border-radius: 16px;
|
|
padding: 12px 16px 14px;
|
|
margin: 6px 0 8px;
|
|
}
|
|
.apikey-tools-title { margin: 0; font-size: 13px; font-weight: 500; color: var(--label); }
|
|
.apikey-tools-hint { margin: 0; font-size: 12px; color: var(--neutral-text); }
|
|
.apikey-card-btns { display: flex; gap: 8px; flex-shrink: 0; }
|
|
.apikey-card-servers { font-size: 12px; color: var(--neutral-text); }
|
|
|
|
.apikey-new-servers { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin: 0 0 16px; }
|