git_admin/CoRE.Vision
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ui: remove top header, move CPU/RAM/disk + clock into the footer

Browse Source 
Header bar dropped from all pages; brand, system stats (#sys-stats) and clock
(#clock) now live in the 22px footer next to the version. .layout fills the
full height minus the footer. ensureFooter runs before startClock/refreshStats
so the moved elements exist when populated.

VERSION 0.0.136.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
core
2026-06-01 20:56:59 +05:00
parent b07bf2d874
commit e2e03054ac
8 changed files with 10 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files
VERSION
+1 -1
View File
@@ -1 +1 @@
0.0.135 0.0.136
frontend/archive.html
-7
View File
@@ -7,13 +7,6 @@
<link rel="stylesheet" href="/static/style.css"> <link rel="stylesheet" href="/static/style.css">
</head> </head>
<body data-page="archive"> <body data-page="archive">
<header>
<div class="brand">CoRE<span>.Vision</span></div>
<div class="spacer"></div>
<div class="stats" id="sys-stats"></div>
<div class="clock" id="clock"></div>
</header>
<div class="layout"> <div class="layout">
<aside> <aside>
<a class="nav-item" href="/" data-nav="live"><span class="ico">▦</span>Live view</a> <a class="nav-item" href="/" data-nav="live"><span class="ico">▦</span>Live view</a>
frontend/cams.html
-7
View File
@@ -7,13 +7,6 @@
<link rel="stylesheet" href="/static/style.css"> <link rel="stylesheet" href="/static/style.css">
</head> </head>
<body data-page="cams"> <body data-page="cams">
<header>
<div class="brand">CoRE<span>.Vision</span></div>
<div class="spacer"></div>
<div class="stats" id="sys-stats"></div>
<div class="clock" id="clock"></div>
</header>
<div class="layout"> <div class="layout">
<aside> <aside>
<a class="nav-item" href="/" data-nav="live"><span class="ico">▦</span>Live view</a> <a class="nav-item" href="/" data-nav="live"><span class="ico">▦</span>Live view</a>
frontend/index.html
-7
View File
@@ -7,13 +7,6 @@
<link rel="stylesheet" href="/static/style.css"> <link rel="stylesheet" href="/static/style.css">
</head> </head>
<body data-page="live"> <body data-page="live">
<header>
<div class="brand">CoRE<span>.Vision</span></div>
<div class="spacer"></div>
<div class="stats" id="sys-stats"></div>
<div class="clock" id="clock"></div>
</header>
<div class="layout"> <div class="layout">
<aside> <aside>
<a class="nav-item active" href="/" data-nav="live"><span class="ico">▦</span>Live view</a> <a class="nav-item active" href="/" data-nav="live"><span class="ico">▦</span>Live view</a>
frontend/layout.html
-7
View File
@@ -7,13 +7,6 @@
<link rel="stylesheet" href="/static/style.css"> <link rel="stylesheet" href="/static/style.css">
</head> </head>
<body data-page="layout"> <body data-page="layout">
<header>
<div class="brand">CoRE<span>.Vision</span></div>
<div class="spacer"></div>
<div class="stats" id="sys-stats"></div>
<div class="clock" id="clock"></div>
</header>
<div class="layout"> <div class="layout">
<aside> <aside>
<div class="navline"> <div class="navline">
frontend/settings.html
-7
View File
@@ -7,13 +7,6 @@
<link rel="stylesheet" href="/static/style.css"> <link rel="stylesheet" href="/static/style.css">
</head> </head>
<body data-page="settings"> <body data-page="settings">
<header>
<div class="brand">CoRE<span>.Vision</span></div>
<div class="spacer"></div>
<div class="stats" id="sys-stats"></div>
<div class="clock" id="clock"></div>
</header>
<div class="layout"> <div class="layout">
<aside> <aside>
<a class="nav-item" href="/" data-nav="live"><span class="ico">▦</span>Live view</a> <a class="nav-item" href="/" data-nav="live"><span class="ico">▦</span>Live view</a>
frontend/static/app.js
+4 -2
View File
@@ -146,6 +146,8 @@ function ensureFooter() {
f.className = "app-footer"; f.className = "app-footer";
f.innerHTML = `<span class="brand">CoRE<span>.Vision</span></span>` + f.innerHTML = `<span class="brand">CoRE<span>.Vision</span></span>` +
`<span class="spacer"></span>` + `<span class="spacer"></span>` +
`<span class="stats" id="sys-stats"></span>` +
`<span class="clock" id="clock"></span>` +
`<span id="footer-version"></span>`; `<span id="footer-version"></span>`;
document.body.appendChild(f); document.body.appendChild(f);
} }
@@ -2046,10 +2048,10 @@ function initTabs() {
// ── загрузка страницы ─────────────────────────────────────────── // ── загрузка страницы ───────────────────────────────────────────
document.addEventListener("DOMContentLoaded", async () => { document.addEventListener("DOMContentLoaded", async () => {
ensureVersionEl();
ensureFooter(); // создаёт футер с #sys-stats/#clock до их заполнения
startClock(); startClock();
bindLogout(); bindLogout();
ensureVersionEl();
ensureFooter();
refreshStats(); setInterval(refreshStats, 5000); refreshStats(); setInterval(refreshStats, 5000);
applyGridMenuLimit(); applyGridMenuLimit();
const page = document.body.dataset.page; const page = document.body.dataset.page;
frontend/static/style.css
+5 -3
View File
@@ -47,16 +47,18 @@ nav a.active { background: var(--accent); color: #fff; }
.stats b { color: var(--text); font-weight: 600; } .stats b { color: var(--text); font-weight: 600; }
.clock { font-variant-numeric: tabular-nums; color: var(--text); } .clock { font-variant-numeric: tabular-nums; color: var(--text); }
/* ── Раскладка ── */ /* ── Раскладка (хедер убран — контент во всю высоту минус футер) ── */
.layout { display: flex; height: calc(100% - var(--header-h) - var(--footer-h)); } .layout { display: flex; height: calc(100% - var(--footer-h)); }
/* ── Футер ── */ /* ── Футер (бренд + CPU/RAM/диск + часы + версия) ── */
footer.app-footer { footer.app-footer {
height: var(--footer-h); display: flex; align-items: center; gap: 14px; height: var(--footer-h); display: flex; align-items: center; gap: 14px;
padding: 0 14px; background: var(--panel); border-top: 1px solid var(--border); padding: 0 14px; background: var(--panel); border-top: 1px solid var(--border);
font-size: 11px; color: var(--text-dim); font-size: 11px; color: var(--text-dim);
} }
footer.app-footer .brand { font-size: 12px; } footer.app-footer .brand { font-size: 12px; }
footer.app-footer .stats { display: flex; gap: 14px; font-size: 11px; }
footer.app-footer .clock { font-size: 11px; color: var(--text); }
footer.app-footer #footer-version { font-variant-numeric: tabular-nums; } footer.app-footer #footer-version { font-variant-numeric: tabular-nums; }
aside { aside {
width: var(--sidebar-w); background: var(--panel); border-right: 1px solid var(--border); width: var(--sidebar-w); background: var(--panel); border-right: 1px solid var(--border);