Kevin Adametz
9c6b7ed4f3
Beide Sites mit lokalem Font-Hosting, WebP, Build-Pipeline, SEO-Basis, HSTS, Performance-Tuning und aktualisierten Impressum/Datenschutz-Texten. Co-authored-by: Cursor <cursoragent@cursor.com>
98 lines
4.1 KiB
HTML
98 lines
4.1 KiB
HTML
<footer class="site-footer">
|
|
<div class="footer-inner">
|
|
<div class="footer-meta">
|
|
<p class="footer-copy">© MARKE MACHT · Denkraum für Unternehmer</p>
|
|
<p class="footer-note">Keine Cookies</p>
|
|
</div>
|
|
<div class="footer-links">
|
|
<a class="footer-link" href="./impressum.html">Impressum</a>
|
|
<a class="footer-link" href="./datenschutz.html">Datenschutz</a>
|
|
<button class="footer-link" type="button" data-audit-modal-open>Anfrage</button>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<div class="modal-backdrop" data-audit-modal aria-hidden="true">
|
|
<div class="modal-dialog" role="dialog" aria-modal="true" aria-labelledby="audit-modal-title" aria-describedby="audit-modal-desc">
|
|
<button class="modal-close" type="button" data-audit-modal-close aria-label="Anfragefenster schließen">
|
|
<svg class="icon" aria-hidden="true"><use href="./assets/icons.svg#close"></use></svg>
|
|
</button>
|
|
|
|
<div class="stack-32">
|
|
<div class="stack-16">
|
|
<span class="meta accent">Anfrage</span>
|
|
<h2 class="section-headline" id="audit-modal-title" style="max-width: 16ch;">Kurzer Erstkontakt.</h2>
|
|
<p class="body-text max-prose" id="audit-modal-desc">
|
|
Wählen Sie den direkten E-Mail-Weg oder senden Sie eine knappe Anfrage über das Formular.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="card stack-16">
|
|
<span class="meta">Direkt per E-Mail</span>
|
|
<p class="body-text">
|
|
Öffnet Ihr E-Mail-Programm mit vorausgefülltem Betreff.
|
|
</p>
|
|
<div>
|
|
<a class="btn btn-nav-cta" href="mailto:info@markemacht.de?subject=Anfrage%20Marken-Klarheits-Audit">
|
|
E-Mail öffnen
|
|
<svg class="icon" aria-hidden="true"><use href="./assets/icons.svg#arrow-forward"></use></svg>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div data-audit-form-panel>
|
|
<form class="modal-form stack-16" data-audit-form novalidate>
|
|
<div class="form-field">
|
|
<label class="meta" for="audit-name">Name</label>
|
|
<input id="audit-name" name="name" type="text" autocomplete="name" required />
|
|
</div>
|
|
|
|
<div class="form-field">
|
|
<label class="meta" for="audit-email">E-Mail</label>
|
|
<input id="audit-email" name="email" type="email" autocomplete="email" required />
|
|
</div>
|
|
|
|
<div class="form-field">
|
|
<label class="meta" for="audit-message">Worum geht es?</label>
|
|
<textarea id="audit-message" name="message" rows="5" required></textarea>
|
|
</div>
|
|
|
|
<div class="form-honeypot" aria-hidden="true">
|
|
<label for="audit-company">Firma</label>
|
|
<input id="audit-company" name="company" type="text" tabindex="-1" autocomplete="off" />
|
|
<label for="audit-url">Website</label>
|
|
<input id="audit-url" name="url" type="url" tabindex="-1" autocomplete="off" />
|
|
</div>
|
|
|
|
<label class="form-check">
|
|
<input name="privacy" type="checkbox" required />
|
|
<span class="form-switch" aria-hidden="true"></span>
|
|
<span>Ich akzeptiere die <a href="./datenschutz.html">Datenschutzerklärung</a>.</span>
|
|
</label>
|
|
|
|
<p class="form-status body-text" data-audit-form-status aria-live="polite"></p>
|
|
|
|
<div>
|
|
<button class="btn btn-nav-cta" type="submit">
|
|
Absenden
|
|
<svg class="icon" aria-hidden="true"><use href="./assets/icons.svg#arrow-forward"></use></svg>
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<div class="form-success" data-audit-form-success hidden>
|
|
<div class="form-success-icon" aria-hidden="true">
|
|
<svg class="icon icon--lg" aria-hidden="true"><use href="./assets/icons.svg#check-circle"></use></svg>
|
|
</div>
|
|
<div class="stack-16">
|
|
<h3 class="sub-headline">Vielen Dank für Ihre Anfrage.</h3>
|
|
<p class="body-text">Wir werden uns in Kürze bei Ihnen melden.</p>
|
|
</div>
|
|
<button class="btn btn-ghost" type="button" data-audit-modal-close>
|
|
Schließen
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|