style(webui): unify UI across all pages to solid modern system

tokens instead of hardcoded, v9 everywhere, dialog guarded, confirm->dialog, empty unified, health out of nav, swagger icons/topbar, gutters, th uppercase, content 1280 centered.
This commit is contained in:
2026-09-08 12:30:50 +02:00
parent 2a75537fb9
commit ef62b8e94a
9 changed files with 1587 additions and 1668 deletions
+47 -2
View File
@@ -19,7 +19,30 @@ function renderSpec(spec) {
const methodTemplate = document.getElementById('api-method-template');
root.innerHTML = '';
Object.entries(spec.paths || {}).forEach(([path, methods]) => {
const paths = Object.entries(spec.paths || {});
if (!paths.length) {
const section = document.createElement('section');
section.className = 'panel';
const header = document.createElement('div');
header.className = 'panel-header';
const title = document.createElement('h2');
title.textContent = 'No endpoints';
header.appendChild(title);
const body = document.createElement('div');
body.className = 'panel-body';
const empty = document.createElement('div');
empty.className = 'empty-state';
const text = document.createElement('p');
text.className = 'muted';
text.textContent = 'The OpenAPI spec contains no paths.';
empty.appendChild(text);
body.appendChild(empty);
section.append(header, body);
root.appendChild(section);
return;
}
paths.forEach(([path, methods]) => {
const section = sectionTemplate.content.firstElementChild.cloneNode(true);
section.querySelector('.api-path').textContent = path;
const methodsRoot = section.querySelector('.api-methods');
@@ -53,6 +76,28 @@ loadSpec()
docsEl.textContent = '';
const section = document.createElement('section');
section.className = 'panel';
section.textContent = error.message;
const header = document.createElement('div');
header.className = 'panel-header';
const title = document.createElement('h2');
title.textContent = 'Failed to load API spec';
header.appendChild(title);
const body = document.createElement('div');
body.className = 'panel-body';
const empty = document.createElement('div');
empty.className = 'empty-state';
const text = document.createElement('p');
text.className = 'muted';
text.textContent = error.message;
const actions = document.createElement('div');
actions.className = 'empty-actions';
const retry = document.createElement('button');
retry.className = 'button';
retry.type = 'button';
retry.textContent = 'Retry';
retry.addEventListener('click', () => window.location.reload());
actions.appendChild(retry);
empty.append(text, actions);
body.appendChild(empty);
section.append(header, body);
docsEl.appendChild(section);
});