Kundenansicht neu: Glas-Logo auf der Anmeldung und Startbild der App
- public/neu/glas-logo.js: das Bauteil „liquid-glass-logo-reveal“ (21st.dev, Shader und Zeitleiste aus zanwei/glass-icon-reveal, MIT, Hinweis im Kopf) in reines JavaScript übertragen: WEBklar-Zeichen als Zeichenfläche (Stern und Punkt ausgestanzt), weiß, keine Schleife, Textur 512 px (auf dem Handy ~3× schneller bereit), Hintergrund läuft zum Rand aus, kein Rauschen auf reinem Weiß, ohne WebGL2 das ruhende Logo als CSS-Maske. - Anmeldung (Handy und PC): Glas-Logo statt App-Icon, der Name erscheint, sobald das Glas losgelassen hat; ein Klick spielt es erneut; reduzierte Bewegung zeigt das ruhende Logo. - Installierte App: startbild.js im Kopf von Übersicht und Anmeldung deckt beim ersten Öffnen je App-Start weiß ab, spielt das Glas-Logo (Tempo 1,25) und blendet dann weich aus; ein Tipp überspringt, spätestens nach 6,5 s ist es weg. Danach ruht das Logo der Anmeldung. - Tests: knGlasLogo (Zeitleiste, Glasbreite < 1,3 Kacheln, MIT-Hinweis, Startbild in der VM), Seitenprüfungen der Anmeldung und der Übersicht kennen die neuen Skripte. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
1 parent
1725aaa91c
commit
c997703251
9 files changed
+1221
-10
No files matched your search
@@ -16,6 +16,8 @@
|
||||
<meta name="apple-mobile-web-app-title" content="WEBklar">
|
||||
<link rel="stylesheet" href="/neu/tokens.css">
|
||||
<link rel="stylesheet" href="/neu/oeffentlich/oeffentlich.css">
|
||||
<!-- Installierte App: weißes Startbild mit dem Glas-Logo, läuft vor dem ersten Bild -->
|
||||
<script src="/neu/startbild.js"></script>
|
||||
</head>
|
||||
<body class="kn kn-seite kn-login-seite">
|
||||
<header class="kn-login-kopf">
|
||||
@@ -24,9 +26,9 @@
|
||||
|
||||
<main class="kn-login-haupt">
|
||||
<div class="kn-login-spalte">
|
||||
<!-- Handy: App-Icon wie beim Start einer App -->
|
||||
<!-- Logo mit Glas-Animation (login-logo.js), Handy und PC; der Name erscheint, sobald das Glas losgelassen hat -->
|
||||
<div class="kn-login-marke">
|
||||
<img src="/img/app-icon-192.png" alt="" width="64" height="64">
|
||||
<div class="kn-login-glas"></div>
|
||||
<span>WEBklar Kundenbereich</span>
|
||||
</div>
|
||||
<div class="kn-login-abschnitt">
|
||||
@@ -86,5 +88,6 @@
|
||||
<script>
|
||||
initLoginPage();
|
||||
</script>
|
||||
<script type="module" src="/neu/login-logo.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in new issue
Block a user