DogFatherGitandClaude Opus 5
efe98e32a7
Der Tastatur-Test (pruef-tastatur.mjs, neu) zeigte auf allen fünf geprüften Seiten dasselbe Bild: jedes Bedienelement erreichbar, Fokus durchgehend sichtbar, keine Tastaturfalle -- aber kein Sprunglink. Ohne ihn muss sich jemand, der die Tastatur benutzt, auf JEDER Seite erneut durch das komplette Menü tabben (31 bis 52 Punkte), bevor der eigentliche Inhalt beginnt. WCAG 2.4.1 verlangt genau diesen Ausweg. An einer Stelle gelöst statt in 35 Dateien: renderHeader() in main.js setzt das Sprungziel und stellt den Link davor. Das tabindex="-1" am <main> ist der Teil, der meistens fehlt: ohne ihn verschiebt der Sprung in Chrome und Safari nur die Bildlaufleiste, der Tastaturfokus bleibt in der Navigation -- der nächste Tab landet wieder im Menü und der Sprung war wirkungslos. Cache-Buster auf 20260827a (244 Stellen), sonst bekäme niemand die geänderte main.js und main.css ausgeliefert. Co-Authored-By: Claude Opus 5 <[email protected]>
87 lines
4.7 KiB
HTML
87 lines
4.7 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de" data-theme="dogfather">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>Modi werden — DOGFATHER UNIVERSE</title>
|
|
<meta name="description" content="Werde Modi bei Team Dogi — DogFathers persönliches Community-Team." />
|
|
<link rel="icon" type="image/png" href="assets/img/favicon.png" />
|
|
<link rel="manifest" href="/manifest.json" />
|
|
<meta name="theme-color" content="#0b0d10" />
|
|
<meta property="og:type" content="website" />
|
|
<meta property="og:site_name" content="DOGFATHER UNIVERSE" />
|
|
<meta property="og:title" content="Modi werden — DOGFATHER UNIVERSE" />
|
|
<meta property="og:description" content="Werde Modi bei Team Dogi — DogFathers persönliches Community-Team." />
|
|
<meta property="og:image" content="https://dogfather-universe.com/assets/img/og-cover.jpg" />
|
|
<meta property="og:url" content="https://dogfather-universe.com/bewerben-modi.html" />
|
|
<meta name="twitter:card" content="summary_large_image" />
|
|
<meta name="twitter:title" content="Modi werden — DOGFATHER UNIVERSE" />
|
|
<meta name="twitter:description" content="Werde Modi bei Team Dogi — DogFathers persönliches Community-Team." />
|
|
<meta name="twitter:image" content="https://dogfather-universe.com/assets/img/og-cover.jpg" />
|
|
|
|
<link rel="stylesheet" href="assets/css/main.css?v=20260827a" />
|
|
<link rel="stylesheet" href="assets/css/theme-dogfather.css?v=20260827a" />
|
|
<link rel="stylesheet" href="assets/css/theme-hasidog.css?v=20260827a" />
|
|
<link rel="stylesheet" href="assets/css/theme-spicymedia.css?v=20260827a" />
|
|
</head>
|
|
<body class="mit-hintergrund bewerben-seite" style="--page-bg:url('/assets/img/bg-bewerben-modi.jpg');--page-bg-mobile:url('/assets/img/bg-bewerben-modi-mobile.jpg');">
|
|
<div id="site-header"></div>
|
|
|
|
<main>
|
|
<section class="hero page-bg">
|
|
<div class="hero-banner"><img src="/assets/img/bg-bewerben-modi.jpg" alt="" loading="eager" /></div>
|
|
<div class="container">
|
|
<span class="eyebrow" data-i18n="bwm_eyebrow">🩵 Team Dogi — Community</span>
|
|
<h1 data-i18n="bwm_h1">Werde Modi bei Team Dogi</h1>
|
|
<p class="lead worlds" data-i18n="bwm_lead">Chat, Community und Zusammenhalt im Alltag — mit Herz statt nur Regeln.</p>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="section-tight">
|
|
<div class="container" style="max-width:640px;">
|
|
<form class="app-form" id="form-modi" novalidate>
|
|
<div class="field">
|
|
<label for="m-name" data-i18n="bwm_label_name">Name *</label>
|
|
<input id="m-name" name="name" type="text" required />
|
|
</div>
|
|
<div class="field">
|
|
<label for="m-email" data-i18n="bwm_label_email">E-Mail *</label>
|
|
<input id="m-email" name="email" type="email" required />
|
|
<span class="error-msg" data-i18n="bwm_error_email">Bitte gültige E-Mail-Adresse eingeben.</span>
|
|
</div>
|
|
<div class="field">
|
|
<label for="m-kontakt" data-i18n="bwm_label_kontakt">Discord- oder TikTok-Handle *</label>
|
|
<input id="m-kontakt" name="kontakt" type="text" placeholder="z.B. Discord: dein-tag" data-i18n-attr="placeholder:bwm_placeholder_kontakt" required />
|
|
</div>
|
|
<div class="field">
|
|
<label for="m-erfahrung" data-i18n="bwm_label_erfahrung">Hast du schon Erfahrung als Moderator:in / in einer Community? *</label>
|
|
<textarea id="m-erfahrung" name="erfahrung" required></textarea>
|
|
</div>
|
|
<div class="field">
|
|
<label for="m-verfuegbarkeit" data-i18n="bwm_label_verfuegbarkeit">Wie viel Zeit kannst du pro Woche investieren? *</label>
|
|
<input id="m-verfuegbarkeit" name="verfuegbarkeit" type="text" required />
|
|
</div>
|
|
<div class="field">
|
|
<label for="m-warum" data-i18n="bwm_label_warum">Warum willst du Modi bei Team Dogi werden? *</label>
|
|
<textarea id="m-warum" name="warum" required></textarea>
|
|
</div>
|
|
<p class="small muted" data-i18n="bwm_hinweis">Modis sind DogFathers persönliches Team — nicht Teil der Spicy Media Agentur. 🩵</p>
|
|
<button class="btn btn-primary" type="submit" data-i18n="bwm_submit">Bewerbung als Modi senden</button>
|
|
<div class="form-status"></div>
|
|
</form>
|
|
|
|
<div class="btn-row" style="justify-content:center;margin-top:1.6rem;">
|
|
<a class="btn btn-outline" href="team-modis.html" data-i18n="bwm_link_modis">← Zum Modi-Team</a>
|
|
<a class="btn btn-outline" href="bewerben.html" data-i18n="bwm_link_bewerben">Andere Bewerbung suchen</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
|
|
<div id="site-footer"></div>
|
|
<script src="assets/js/forms.js?v=20260827a"></script>
|
|
<script src="assets/js/i18n-bewerben-modi.js?v=20260827a"></script>
|
|
<script src="assets/js/main.js?v=20260827a"></script>
|
|
</body>
|
|
</html>
|