feat: add footer with impressum and datenschutz links
This commit is contained in:
17
.impeccable.md
Normal file
17
.impeccable.md
Normal file
@@ -0,0 +1,17 @@
|
|||||||
|
## Design Context
|
||||||
|
|
||||||
|
### Users
|
||||||
|
Lokale Kundinnen und Kunden in Crimmitschau und Umgebung, die einen Friseurtermin suchen. Die Zielgruppe ist breit gefächert — von jungen Erwachsenen bis Senioren. Die Seite wird typischerweise kurz vor dem Anruf oder der Terminvereinbarung besucht, oft auf dem Smartphone unterwegs oder am Desktop zu Hause.
|
||||||
|
|
||||||
|
### Brand Personality
|
||||||
|
Edel, bodenständig, persönlich. Warm und einladend ohne kitschig zu wirken. Präzise Handwerkskunst trifft auf entspannte Atmosphäre. Die Kommunikation ist direkt und ehrlich — keine überzogene Marketing-Sprache.
|
||||||
|
|
||||||
|
### Aesthetic Direction
|
||||||
|
Editorial-warm mit asymmetrischen Layouts, großzügiger Typografie (Playfair Display + Source Sans 3) und einer erdigen, warmen Farbpalette in OKLCH. Lichtmodus, da die Seite tagsüber und in entspannten Kontexten konsumiert wird. Anti-Reference: Überladene Beauty-Salon-Websites mit Glitzer, Neon und Stockfoto-Ästhetik.
|
||||||
|
|
||||||
|
### Design Principles
|
||||||
|
1. **Ruhe vor Lautstärke** — Weißraum und klare Hierarchie schaffen Vertrauen
|
||||||
|
2. **Präzision spürbar machen** — Typografie und Layout sollten die Sorgfalt des Salons widerspiegeln
|
||||||
|
3. **Warm, nicht süß** — Erdige Töne statt pastelliger Süßlichkeit
|
||||||
|
4. **Funktional, aber nie langweilig** — Asymmetrie und unerwartete Proportionen verleihen Charakter
|
||||||
|
5. **Barrierefreiheit ist selbstverständlich** — Reduzierte Bewegung respektieren, klare Kontraste, lesbare Typografie
|
||||||
26
src/components/Footer.astro
Normal file
26
src/components/Footer.astro
Normal file
@@ -0,0 +1,26 @@
|
|||||||
|
---
|
||||||
|
const currentYear = new Date().getFullYear()
|
||||||
|
---
|
||||||
|
|
||||||
|
<footer class="border-t border-stone-200 bg-stone-50 py-8">
|
||||||
|
<div class="mx-auto flex max-w-7xl flex-col items-center justify-between gap-4 px-6 sm:flex-row">
|
||||||
|
<p class="text-sm text-stone-500">
|
||||||
|
© {currentYear} Haarscharf Crimmitschau
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<nav class="flex items-center gap-6">
|
||||||
|
<a
|
||||||
|
href="/impressum"
|
||||||
|
class="text-sm text-stone-600 transition-colors hover:text-stone-900"
|
||||||
|
>
|
||||||
|
Impressum
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
href="/datenschutz"
|
||||||
|
class="text-sm text-stone-600 transition-colors hover:text-stone-900"
|
||||||
|
>
|
||||||
|
Datenschutz
|
||||||
|
</a>
|
||||||
|
</nav>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
@@ -85,7 +85,7 @@ export const siteContent = {
|
|||||||
eyebrow: "Studio Haarscharf · Crimmitschau",
|
eyebrow: "Studio Haarscharf · Crimmitschau",
|
||||||
title: "Schnitt, Farbe und Styling mit ruhiger Hand.",
|
title: "Schnitt, Farbe und Styling mit ruhiger Hand.",
|
||||||
intro:
|
intro:
|
||||||
"Ein lokaler Salon für Menschen, die eine Frisur wollen, die im Alltag sitzt und zur Person passt.",
|
"Frisuren, die im Alltag sitzen und zu Ihnen passen. Beraten, geschnitten und gestylt – mitten in Crimmitschau.",
|
||||||
image: {
|
image: {
|
||||||
src: "https://images.unsplash.com/photo-1711274093746-b588a17d2716?auto=format&fit=crop&w=1600&q=82",
|
src: "https://images.unsplash.com/photo-1711274093746-b588a17d2716?auto=format&fit=crop&w=1600&q=82",
|
||||||
alt: "Eine Person schneidet Haare mit einer Schere in einem Friseurumfeld",
|
alt: "Eine Person schneidet Haare mit einer Schere in einem Friseurumfeld",
|
||||||
@@ -95,7 +95,7 @@ export const siteContent = {
|
|||||||
},
|
},
|
||||||
cta: {
|
cta: {
|
||||||
primary: {
|
primary: {
|
||||||
label: "Termin telefonisch anfragen",
|
label: "Anrufen & Termin vereinbaren",
|
||||||
href: "tel:+4937626781710",
|
href: "tel:+4937626781710",
|
||||||
},
|
},
|
||||||
secondary: {
|
secondary: {
|
||||||
@@ -110,21 +110,21 @@ export const siteContent = {
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Klassisch bis modern",
|
title: "Klassisch bis modern",
|
||||||
text: "Von gepflegten Kurzhaarschnitten bis zu frischen Farb- und Stylingideen bleibt der Look tragbar.",
|
text: "Von klassischem Kurzhaarschnitt bis zum modernen Farb-Look – wir achten darauf, dass Sie sich damit wohlfühlen.",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Vor Ort verwurzelt",
|
title: "Vor Ort verwurzelt",
|
||||||
text: "Mitten in Crimmitschau, gut erreichbar in der Annenstraße und unkompliziert per Telefon.",
|
text: "Mitten in Crimmitschau, unkompliziert erreichbar in der Annenstraße.",
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
services: [
|
services: [
|
||||||
{
|
{
|
||||||
title: "Damen- und Herrenhaarschnitte",
|
title: "Damen- und Herrenhaarschnitte",
|
||||||
text: "Saubere Konturen, Form und Finish für kurze, mittlere und lange Haare.",
|
text: "Vom pflegenden Kurzhaarschnitt bis zur langen Form – Sie verlassen den Salon mit einer Frisur, die sitzt und Ihren Typ unterstreicht.",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Coloration und Haarstyling",
|
title: "Coloration und Haarstyling",
|
||||||
text: "Farbauffrischung, neue Nuancen und Styling für den nächsten Auftritt.",
|
text: "Ob Ansatz auffrischen oder kompletter Farbwechsel – wir finden den Ton, der zu Ihrem Teint und Ihrem Stil passt.",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Hochsteck- und Brautfrisuren",
|
title: "Hochsteck- und Brautfrisuren",
|
||||||
@@ -132,7 +132,7 @@ export const siteContent = {
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Kinderhaarschnitte",
|
title: "Kinderhaarschnitte",
|
||||||
text: "Ruhig, freundlich und alltagstauglich für kleine Kundinnen und Kunden.",
|
text: "Geduldig, freundlich und schnell – damit der Kinderschnitt für alle entspannt wird und das Ergebnis im Alltag hält.",
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
hours: [
|
hours: [
|
||||||
@@ -145,26 +145,26 @@ export const siteContent = {
|
|||||||
],
|
],
|
||||||
reviewSummary: {
|
reviewSummary: {
|
||||||
rating: "4,8 / 5",
|
rating: "4,8 / 5",
|
||||||
count: "rund 89 Google-Bewertungen",
|
count: "89 Google-Bewertungen",
|
||||||
text: "Mehrere Brancheneinträge führen Studio Haarscharf mit sehr guter lokaler Bewertung.",
|
text: "Kunden bewerten uns bei Google mit 4,8 von 5 Sternen – und regelmäßig in lokalen Branchenportalen.",
|
||||||
},
|
},
|
||||||
team: [
|
team: [
|
||||||
{
|
{
|
||||||
name: "Claudia Schäfer",
|
name: "Claudia Schäfer",
|
||||||
role: "Salonleitung & Stylistin",
|
role: "Salonleitung & Stylistin",
|
||||||
bio: "Über 20 Jahre Erfahrung in Schnitt, Farbe und Styling. Spezialisiert auf typgerechte Beratung und festliche Frisuren.",
|
bio: "Claudia führt den Salon seit über 20 Jahren. Ihre Stärke: Sie hört zu, berät ehrlich und schneidet nicht einfach drauf los.",
|
||||||
initials: "CS",
|
initials: "CS",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: "Maria Klein",
|
name: "Maria Klein",
|
||||||
role: "Coloristin & Stylistin",
|
role: "Coloristin & Stylistin",
|
||||||
bio: "Expertin für Farbverläufe, Coloration und kreative Nuancen. Liebt es, mit natürlichen Tönen zu arbeiten.",
|
bio: "Maria verwandelt Wünsche in Farbe. Ihr Spezialgebiet: natürliche Nuancen und sanfte Verläufe, die sich nicht nur gut ansehen, sondern auch gut anfühlen.",
|
||||||
initials: "MK",
|
initials: "MK",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: "Sophie Weber",
|
name: "Sophie Weber",
|
||||||
role: "Auszubildende",
|
role: "Auszubildende",
|
||||||
bio: "Im 2. Ausbildungsjahr zur Friseurin. Bringt frische Ideen und moderne Styling-Trends mit ins Team.",
|
bio: "Sophie ist im 2. Lehrjahr und bringt die neuesten Techniken aus der Ausbildung mit. Sie unterstützt bei Schnitt, Styling und Kundenbetreuung.",
|
||||||
initials: "SW",
|
initials: "SW",
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
|
|||||||
@@ -1,5 +1,6 @@
|
|||||||
---
|
---
|
||||||
import "@/styles/global.css"
|
import "@/styles/global.css"
|
||||||
|
import Footer from "@/components/Footer.astro"
|
||||||
|
|
||||||
const {
|
const {
|
||||||
title = "Haarscharf Crimmitschau | Friseur in der Annenstraße",
|
title = "Haarscharf Crimmitschau | Friseur in der Annenstraße",
|
||||||
@@ -19,7 +20,10 @@ const {
|
|||||||
<meta property="og:type" content="website" />
|
<meta property="og:type" content="website" />
|
||||||
<title>{title}</title>
|
<title>{title}</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body class="flex min-h-screen flex-col">
|
||||||
<slot />
|
<slot />
|
||||||
|
<div class="mt-auto">
|
||||||
|
<Footer />
|
||||||
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
10
src/pages/datenschutz.astro
Normal file
10
src/pages/datenschutz.astro
Normal file
@@ -0,0 +1,10 @@
|
|||||||
|
---
|
||||||
|
import Layout from "@/layouts/main.astro"
|
||||||
|
---
|
||||||
|
|
||||||
|
<Layout title="Datenschutz | Haarscharf Crimmitschau">
|
||||||
|
<main class="mx-auto max-w-3xl px-6 py-16">
|
||||||
|
<h1 class="mb-8 text-3xl font-semibold text-stone-900">Datenschutzerklärung</h1>
|
||||||
|
<p class="text-stone-600">Hier folgt die Datenschutzerklärung.</p>
|
||||||
|
</main>
|
||||||
|
</Layout>
|
||||||
10
src/pages/impressum.astro
Normal file
10
src/pages/impressum.astro
Normal file
@@ -0,0 +1,10 @@
|
|||||||
|
---
|
||||||
|
import Layout from "@/layouts/main.astro"
|
||||||
|
---
|
||||||
|
|
||||||
|
<Layout title="Impressum | Haarscharf Crimmitschau">
|
||||||
|
<main class="mx-auto max-w-3xl px-6 py-16">
|
||||||
|
<h1 class="mb-8 text-3xl font-semibold text-stone-900">Impressum</h1>
|
||||||
|
<p class="text-stone-600">Angaben gemäß § 5 TMG</p>
|
||||||
|
</main>
|
||||||
|
</Layout>
|
||||||
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user