spark-store-project/ServerStatus
15
0
Fork 0
mirror of https://github.com//cppla/ServerStatus synced 2026-08-06 10:23:57 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

1.1.9
CI / validate (push) Has been cancelled
Details

Browse Source
This commit is contained in:
cppla
2026-07-09 10:43:40 +08:00
parent 66e6179332
commit a8fc0b81ab
3 changed files with 2 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/css/app.css
-5
View File
@@ -101,8 +101,6 @@ table.data tbody tr:hover{background:rgba(59,130,246,.045)}
/* modal styles */ /* modal styles */
.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.55);display:flex;align-items:flex-start;justify-content:center;padding:5vh 1rem;z-index:50;backdrop-filter:blur(4px)} .modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.55);display:flex;align-items:flex-start;justify-content:center;padding:5vh 1rem;z-index:50;backdrop-filter:blur(4px)}
.modal-box{position:relative;width:100%;max-width:560px;background:var(--bg-alt);border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 30px -6px rgba(0,0,0,.6);padding:1.25rem 1.35rem;display:flex;flex-direction:column;gap:.9rem;animation:fade .25s ease} .modal-box{position:relative;width:100%;max-width:560px;background:var(--bg-alt);border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 30px -6px rgba(0,0,0,.6);padding:1.25rem 1.35rem;display:flex;flex-direction:column;gap:.9rem;animation:fade .25s ease}
.modal-box.high-load{border-color:rgba(239,68,68,.6);background:linear-gradient(180deg, rgba(239,68,68,.16), rgba(239,68,68,.08)), var(--bg-alt);box-shadow:0 0 0 1px rgba(239,68,68,.38),0 10px 28px -10px rgba(239,68,68,.28)}
body:not(.light) .modal-box.high-load{background:linear-gradient(180deg, rgba(239,68,68,.24), rgba(239,68,68,.12)), var(--bg-alt)}
.modal-title{margin:0;font-size:16px;font-weight:600;letter-spacing:.5px} .modal-title{margin:0;font-size:16px;font-weight:600;letter-spacing:.5px}
.modal-close{position:absolute;top:10px;right:12px;background:transparent;border:0;color:var(--text-dim);font-size:20px;line-height:1;cursor:pointer;padding:4px;border-radius:8px;transition:var(--trans)} .modal-close{position:absolute;top:10px;right:12px;background:transparent;border:0;color:var(--text-dim);font-size:20px;line-height:1;cursor:pointer;padding:4px;border-radius:8px;transition:var(--trans)}
.modal-close:hover{color:var(--text);background:var(--bg)} .modal-close:hover{color:var(--text);background:var(--bg)}
@@ -240,12 +238,9 @@ body.light .load-core-bubble{background:color-mix(in srgb,var(--accent) 8%,#fff)
} }
.cards .card{border:1px solid var(--border);border-radius:12px;padding:.75rem .85rem;background:linear-gradient(145deg,var(--bg),var(--bg-alt));display:flex;flex-direction:column;gap:.45rem;position:relative;} .cards .card{border:1px solid var(--border);border-radius:12px;padding:.75rem .85rem;background:linear-gradient(145deg,var(--bg),var(--bg-alt));display:flex;flex-direction:column;gap:.45rem;position:relative;}
.cards .card.offline{filter:saturate(.92);} .cards .card.offline{filter:saturate(.92);}
.cards .card.high-load,
.cards .card.alert-critical{border-color:rgba(239,68,68,.6);background:linear-gradient(180deg, rgba(239,68,68,.22), rgba(239,68,68,.12)), var(--bg-alt);box-shadow:0 0 0 1px rgba(239,68,68,.48),0 6px 18px -6px rgba(239,68,68,.28);} .cards .card.alert-critical{border-color:rgba(239,68,68,.6);background:linear-gradient(180deg, rgba(239,68,68,.22), rgba(239,68,68,.12)), var(--bg-alt);box-shadow:0 0 0 1px rgba(239,68,68,.48),0 6px 18px -6px rgba(239,68,68,.28);}
.cards .card.alert-warning{border-color:rgba(245,158,11,.55);background:linear-gradient(180deg, rgba(245,158,11,.16), rgba(245,158,11,.08)), var(--bg-alt);box-shadow:0 0 0 1px rgba(245,158,11,.32),0 6px 18px -8px rgba(245,158,11,.22);} .cards .card.alert-warning{border-color:rgba(245,158,11,.55);background:linear-gradient(180deg, rgba(245,158,11,.16), rgba(245,158,11,.08)), var(--bg-alt);box-shadow:0 0 0 1px rgba(245,158,11,.32),0 6px 18px -8px rgba(245,158,11,.22);}
table.data tbody tr.high-load,
table.data tbody tr.alert-critical{background:rgba(239,68,68,.18) !important;} table.data tbody tr.alert-critical{background:rgba(239,68,68,.18) !important;}
table.data tbody tr.high-load:hover,
table.data tbody tr.alert-critical:hover{background:rgba(239,68,68,.21) !important;} table.data tbody tr.alert-critical:hover{background:rgba(239,68,68,.21) !important;}
table.data tbody tr.alert-warning{background:rgba(245,158,11,.12) !important;} table.data tbody tr.alert-warning{background:rgba(245,158,11,.12) !important;}
table.data tbody tr.alert-warning:hover{background:rgba(245,158,11,.14) !important;} table.data tbody tr.alert-warning:hover{background:rgba(245,158,11,.14) !important;}
web/index.html
+2 -2
View File
@@ -6,7 +6,7 @@
<meta name="description" content="云监控,ServerStatus中文版,ServerStatus,ServerStatus cppla" /> <meta name="description" content="云监控,ServerStatus中文版,ServerStatus,ServerStatus cppla" />
<title>云监控</title> <title>云监控</title>
<link rel="icon" type="image/svg+xml" href="favicon.svg" /> <link rel="icon" type="image/svg+xml" href="favicon.svg" />
<link rel="stylesheet" href="css/app.css?v=20260709-1" /> <link rel="stylesheet" href="css/app.css?v=20260709-2" />
</head> </head>
<body> <body>
<header class="topbar"> <header class="topbar">
@@ -200,6 +200,6 @@
<a href="https://github.com/cppla/ServerStatus" target="_blank" rel="noopener">ServerStatus中文版</a> <a href="https://github.com/cppla/ServerStatus" target="_blank" rel="noopener">ServerStatus中文版</a>
</footer> </footer>
<script src="js/app.js?v=20260709-1" defer></script> <script src="js/app.js?v=20260709-2" defer></script>
</body> </body>
</html> </html>
web/js/app.js
-5
View File
@@ -146,10 +146,6 @@ function lossValues(s){
return [s.ping_10010, s.ping_189, s.ping_10086].map(p => clamp(num(p), 0, 100)); return [s.ping_10010, s.ping_189, s.ping_10086].map(p => clamp(num(p), 0, 100));
} }
function isBlocked(s){
return lossValues(s).every(p => p >= 100);
}
function metrics(s){ function metrics(s){
const online = !!(s.online4 || s.online6); const online = !!(s.online4 || s.online6);
const memPct = s.memory_total ? s.memory_used / s.memory_total * 100 : 0; const memPct = s.memory_total ? s.memory_used / s.memory_total * 100 : 0;
@@ -591,7 +587,6 @@ function refreshDetail(){
title.innerHTML = `${esc(s.name || '-')} 详情${s.os ? `<span class="os-chip${osClass(s.os)}">${esc(osLabel(s.os))}</span>` : ''}${spec ? `<span class="spec-chip" title="CPU 核心 / 总内存">${esc(spec)}</span>` : ''}${cpuModel ? `<span class="cpu-model-chip" title="${esc(cpuModel)}">${esc(cpuModel)}</span>` : ''}`; title.innerHTML = `${esc(s.name || '-')} 详情${s.os ? `<span class="os-chip${osClass(s.os)}">${esc(osLabel(s.os))}</span>` : ''}${spec ? `<span class="spec-chip" title="CPU 核心 / 总内存">${esc(spec)}</span>` : ''}${cpuModel ? `<span class="cpu-model-chip" title="${esc(cpuModel)}">${esc(cpuModel)}</span>` : ''}`;
const modalBox = document.querySelector('#detailModal .modal-box'); const modalBox = document.querySelector('#detailModal .modal-box');
if(modalBox){ if(modalBox){
modalBox.classList.remove('high-load');
modalBox.classList.toggle('alert-critical', m.rowLevel === 'critical'); modalBox.classList.toggle('alert-critical', m.rowLevel === 'critical');
modalBox.classList.toggle('alert-warning', m.rowLevel === 'warning'); modalBox.classList.toggle('alert-warning', m.rowLevel === 'warning');
} }