1
0
watterblock/index.html
Adrian Wannenmacher f530706097
implement _yesscript css class
Elements with this class are only shown when JS is available, i.e. they
are (mostly) the opposite of the noscript element.

This replaces the previous implementation to do that, which was itself
based on JavaScript. It is now reusable, declarative and easier to grasp
at a glance.

As the entire site is built on JS this likely won't be used much beyond
its single current invocation.
2026-03-10 22:08:30 +01:00

59 lines
1.7 KiB
HTML

<!DOCTYPE html>
<html lang="bar-AT" class="_regular">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Watterblock</title>
<link rel="stylesheet" href="/vendored/normalize-8.0.1.css">
<link rel="stylesheet" href="/style.css">
<link rel="stylesheet" href="/vendored/material-icons.css" />
<noscript>
<style>
._yesscript {
display: none !important;
}
</style>
</noscript>
<script type="module">
// initialize DB early
import WbDb from "/data/db.js";
WbDb.get();
</script>
<script src="/vendored/mithril-2.3.8.js" defer></script>
<script src="/index.js" type="module"></script>
<meta name="application-name" content="Watterblock">
<meta name="author" content="Adrian Wannenmacher">
<meta name="description" lang="de-AT"
content="Einfach zu verwendender Watterblock, der die Daten lokal im Browser speichert.">
<meta name="keywords" content="Watten,Block,Spiel,Mitschrift">
<meta name="theme-color" content="lch(86 84 71)" media="(prefers-color-scheme: dark)">
<meta name="theme-color" content="lch(20 87 292)" media="(prefers-color-scheme: light)">
</head>
<body class="wb-layout">
<div class="wb-splash _yesscript">
<div class="spinner"></div>
<h1>Watterblock</h1>
<p>I lad grad…</p>
</div>
<noscript class="wb-splash">
<h1>Watterblock</h1>
<p>Da Watterblock kann nit aufgmacht werdn.</p>
<p>
Des ligt daran, dass ea als Programm direkt in deim Browser laft. Daher
is ea a völlig von <em>JavaScript</em> abhängig. Sonst geht ea nit.
</p>
<p>
<strong>
Sei doch so guat und schoit <em>JavaScript</em> wieder ein.
</strong>
</p>
</noscript>
</body>
</html>