Phase 5c: CSS layers and light theme
continuous-integration/drone/push Build is failing

- html/css split into tokens.css (custom properties), base.css (reset,
  typography, focus, skip link), components.css (buttons, inputs, tables,
  status cards, popups, menu, log lines) and layout.css (shell, sidebar,
  header, breakpoints); screen.css removed. Selectors and declarations
  moved as-is; three pairs of conflicting rules resolved in favour of the
  one that already won the cascade, two empty rules dropped.
- Every literal colour outside tokens.css is now a token (category badge
  borders excepted). color-scheme set so native controls follow.
- Light theme under prefers-color-scheme: light, with explicit
  data-theme="light"/"dark" overrides on :root for a future toggle.
  Body text 13.6:1, muted text 5.4:1, accent 5.1:1 on the light background.
- HTML: lang="en" everywhere, one h1 per page, maintenance page uses
  <main>, an id typo fixed.
This commit is contained in:
2026-09-26 13:34:51 +10:00
parent 0b7a54d7da
commit 3532679235
15 changed files with 1275 additions and 932 deletions
+6 -4
View File
@@ -1,11 +1,13 @@
<!doctype html>
<html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>xTeVe</title>
<link rel="stylesheet" href="css/screen.css" type="text/css">
<link rel="stylesheet" href="css/base.css" type="text/css">
<link rel="stylesheet" href="css/tokens.css">
<link rel="stylesheet" href="css/base.css">
<link rel="stylesheet" href="css/components.css">
<link rel="stylesheet" href="css/layout.css">
<script src="js/app.js"></script>
</head>
@@ -13,7 +15,7 @@
<div id="header" class="imgCenter"></div>
<main id="box" role="main" aria-labelledby="head-text">
<main id="box" aria-labelledby="head-text">
<div id="headline">
<h1 id="head-text" class="center">Login</h1>