Compare commits
9
Commits
9d100734a9
...
main
| Author | SHA1 | Date | |
|---|---|---|---|
  knsoandClaude Opus 5.5
|
3ae1084df8 | ||
|
knsoandClaude Opus 5.5
|
116b8b741e | ||
|
Andrej StevanovskiandClaude Opus 5
|
5df349fc71 | ||
|
Andrej StevanovskiandClaude Opus 5.5
|
f6e98cdcbb | ||
|
Andrej StevanovskiandClaude Opus 5.5
|
65460b83dc | ||
|
Andrej StevanovskiandClaude Opus 5.5
|
f067556314 | ||
|
Andrej StevanovskiandClaude Opus 5.5
|
7ab8a7d5a9 | ||
|
Andrej StevanovskiandClaude Opus 5.5
|
4b3c90cb8e | ||
|
Andrej StevanovskiandClaude Opus 5.5
|
ab41686689 |
No files matched your search
@@ -214,7 +214,6 @@ kommerzielle Nutzung frei, keine Namensnennung nötig, Selbsthosting erlaubt. Si
|
||||
|---|---|---|
|
||||
| `assets/hero-start.jpg` | 10831693 | bunte Holzfahrzeuge auf Holz |
|
||||
| `assets/hero-verein.jpg` | 34148341 | Kindersachen auf der Kleiderstange |
|
||||
| `assets/laden-story.jpg` | 6591155 | Hände legen ein Oberteil zusammen |
|
||||
|
||||
**Bewusst keine Kinderfotos.** Pexels gibt für erkennbare Personen **kein Model Release**;
|
||||
für eine deutsche Gewerbeseite wäre das ein unnötiges Risiko. Deshalb Sachmotive und, beim
|
||||
@@ -238,11 +237,17 @@ Kundenwunsch 2026-09-24: die farbigen Flächen wirkten leer. Referenz ist die
|
||||
Handoff-Komponente **`Decor` — „flat decorative layer" (`variant`, `opacity`)**; sie steht
|
||||
in der Komponentenliste des Handoffs, wurde dort aber nie ausgeführt.
|
||||
|
||||
`assets/decor-toys.svg` ist eine nahtlose 420px-Kachel mit elf flachen
|
||||
Spielzeug-Silhouetten (Teddy, Ente, Auto, Ball, Bauklotz, Rassel, Stern, Ballon,
|
||||
Stapelturm, Herz, Segelboot), selbst gezeichnet, 4 KB. Sie wird als CSS-Maske benutzt, die
|
||||
Farbe kommt pro Fläche aus `--decor`: immer der Ton der Fläche, eine Stufe dunkler — ein
|
||||
Schatten, kein zweites Motiv. Auf dem Handy 320px-Kachel.
|
||||
`assets/decor/source.svg` ist eine nahtlose Kachel mit elf flachen Spielzeug-Silhouetten
|
||||
(Teddy, Ente, Auto, Ball, Bauklotz, Rassel, Stern, Ballon, Stapelturm, Herz, Segelboot),
|
||||
selbst gezeichnet. Daraus sind sieben vorgefärbte Varianten erzeugt (`warm`, `cool`,
|
||||
`rose`, `sky`, `sun`, `hero-shop`, `hero-verein`), eingebunden als normales
|
||||
Hintergrundbild: immer der Ton der Fläche, eine Stufe dunkler — ein Schatten, kein zweites
|
||||
Motiv. Kachel 600px, auf dem Handy 440px (auf Kundenwunsch größer, gleich kräftig).
|
||||
|
||||
**Nicht als CSS-Maske.** Die erste Fassung färbte eine einzige SVG per `mask` ein und war
|
||||
in Safari (Mac) komplett unsichtbar. Vorgefärbte Dateien sind etwas redundanter, laufen
|
||||
aber in jedem Browser. Den Hero-Übergang zur Fotokante macht nur noch eine reine
|
||||
Verlaufsmaske.
|
||||
|
||||
Liegt auf: Heros (Desktop nur über der Farbfläche, zur Fotokante ausgeblendet), allen
|
||||
getönten und gesättigten Feldern, den Bändern und dem Footer. Weiße Sektionen bleiben leer,
|
||||
@@ -251,6 +256,38 @@ damit der Rhythmus Weiß ↔ Farbe erhalten bleibt.
|
||||
Kontrast gegen die **dunklere** Musterfarbe gemessen, nicht gegen den Grund: `--ink-700`
|
||||
7.41–9.71, Weiß auf dem Blau-Band 4.65.
|
||||
|
||||
## Anfahrt und Karte (2026-09-25)
|
||||
|
||||
Adresse und Öffnungszeiten von Google Maps übernommen: **Hollerstraße 2, 84056 Rottenburg
|
||||
a.d. Laaber**, **Mo–Fr 9:00–13:00**, Sa/So geschlossen. Stehen jetzt im Footer aller Seiten,
|
||||
in der Kontaktkarte der Vereinsseite, auf der Shop-Seite und in der neuen Sektion
|
||||
„So findest du uns" (`index.html#anfahrt`).
|
||||
|
||||
**Die Karte ist eine Zwei-Klick-Lösung.** Ein Google-Maps-iframe beim Seitenaufruf würde
|
||||
die IP jedes Besuchers an Google übertragen und bräuchte eine Einwilligung nach
|
||||
§ 25 TDDDG — also ein Banner. Stattdessen steht dort eine getönte Fläche mit „Karte
|
||||
laden"; erst der Klick setzt das iframe ein (Inline-Skript am Ende von `index.html`, das
|
||||
einzige JavaScript der Site). Gemessen: vor dem Klick keine einzige Anfrage an Google.
|
||||
Datenschutzerklärung Abschnitt 4a beschreibt das. „Route planen" ist ein normaler Link.
|
||||
|
||||
Die Aussage „null Anfragen an Dritte" aus dem Abschnitt Recht gilt damit weiter für den
|
||||
Seitenaufruf, nicht mehr nach dem Klick auf die Karte.
|
||||
|
||||
Header: beide Zeichen (Laden und Hilfe Verein) nebeneinander auf allen Seiten.
|
||||
|
||||
## Ladenfoto und Lieder (2026-09-26)
|
||||
|
||||
Das Story-Bild ist jetzt das echte Schaufenster (Kundenfoto, `assets/laden-front.jpg`,
|
||||
3:2 mit Schild, Ballonbogen und Eingang) statt des Pexels-Motivs; `.story__img` dafür von
|
||||
4:3 auf 3:2. Bildnachweis im Impressum angepasst.
|
||||
|
||||
Die Player spielen echte Lieder: `assets/audio/lied-laden.mp3` (2:12, Startseite) und
|
||||
`lied-verein.mp3` (3:21, Vereinsseite) — ein Lied pro Seite, wie vorgegeben. Kein
|
||||
Autoplay. Fortschritt ist ein echter `<input type="range">`, per Tastatur bedienbar.
|
||||
**Abweichung vom Handoff:** keine gemerkte Abspielposition in `localStorage` — das wäre
|
||||
Speicherung auf dem Endgerät (§ 25 TDDDG) und widerspräche dem Versprechen der
|
||||
Datenschutzerklärung, das die Seite bannerfrei hält.
|
||||
|
||||
## Motion
|
||||
|
||||
Nur Zustandsfeedback, wie im Handoff: 120ms Farbe, 200ms Lift, 340ms alles Größere,
|
||||
@@ -289,6 +326,56 @@ abgelöst) und `datenschutz.html`. Beide nutzen die `.prose`-Klassen. Offene Ang
|
||||
als `.todo`-Felder mit gestricheltem Coral-Rahmen im Fließtext, damit nichts davon
|
||||
versehentlich live geht, plus ein `.prose__warn`-Kasten oben auf jeder Seite.
|
||||
|
||||
## Social Media (2026-09-29)
|
||||
|
||||
Vierte Footer-Spalte „Folgen" auf allen fünf Seiten: Facebook, Instagram, TikTok.
|
||||
|
||||
**Nur Links, keine Einbettungen.** Kein Page-Plugin, kein Feed, keine Like- oder
|
||||
Folgen-Schaltfläche. Solche Widgets laden fremde Skripte beim Seitenaufruf und setzen
|
||||
Cookies — das würde die Bannerfreiheit kippen, auf der die Datenschutzerklärung steht.
|
||||
Dieselbe Überlegung wie bei der Karte, nur mit dem angenehmeren Ergebnis: bei reinen Links
|
||||
braucht es nicht einmal eine Zwei-Klick-Lösung. Gemessen nach dem Einbau: weiterhin null
|
||||
Fremdanfragen, keine Cookies, kein Storage.
|
||||
|
||||
**Icon plus Text, nicht Icon allein.** Eine reine Icon-Reihe zwingt zum Raten und braucht
|
||||
eigene Beschriftung für Screenreader. Mit Text greift `.ftr__col a` unverändert weiter,
|
||||
inklusive Zielgrößen. Jeder Link trägt zusätzlich ein verstecktes
|
||||
„(öffnet in neuem Fenster)" und `rel="noopener noreferrer"`.
|
||||
|
||||
**Icons erben `currentColor`,** tragen also `--ink-700` statt Markenfarben. Im Fließtext
|
||||
trägt Farbe keine Information — siehe Abschnitt Farbe. Die Markenzeichen bleiben in ihrer
|
||||
Form unverändert; als Verweis auf das eigene Profil ist das zulässige Nennung.
|
||||
|
||||
**Die drei Ziele, alle vor dem Einbau im Browser geprüft:**
|
||||
|
||||
| | Adresse | Stand 29.09.2026 |
|
||||
|---|---|---|
|
||||
| Facebook | `/people/EmMas-Schatzkiste-Baby-und-Kinder-Secondhand-Laden/61594794906587/` | Seite bestätigt |
|
||||
| Instagram | `instagram.com/emmas_schatzkiste/` | 70 Follower, 112 Beiträge |
|
||||
| TikTok | `tiktok.com/@emmasschatzkiste` | 29 Videos, 64 Follower |
|
||||
|
||||
**Bei Facebook steht die dauerhafte Adresse, nicht der Share-Link.** Geliefert wurde
|
||||
`facebook.com/share/19NxMjLkKT/`. Solche Links sind undurchsichtig — beim Überfahren sieht
|
||||
niemand, wohin es geht —, sie hängen an einem Weiterleitungsschritt und können ungültig
|
||||
werden. Im Browser aufgelöst ergibt sich die Profiladresse mit der festen ID
|
||||
`61594794906587`; die steht jetzt im Footer, ohne die angehängten Tracking-Parameter
|
||||
`rdid` und `share_url`.
|
||||
|
||||
**Der Platzhalter-Mechanismus bleibt im CSS.** `.ftr__social[href^="URL-"]` zeichnet einen
|
||||
gestrichelten Coral-Rahmen, falls je wieder eine Adresse fehlt. Erfundene Profil-Links
|
||||
kommen nicht in Frage: ein Icon, das auf ein fremdes Konto führt, ist schlimmer als keins.
|
||||
|
||||
### Nebenbefund: die 44px-Regel im Footer war wirkungslos
|
||||
|
||||
Beim Messen aufgefallen: Fusszeilen-Links waren auf dem Handy **30px** hoch, nicht 44.
|
||||
Die Mobilregel steht in `site.css` bei Zeile ~245, die Basisregel mit `min-height:30px`
|
||||
im FOOTER-Abschnitt bei ~622 — gleiche Spezifität, spätere Regel gewinnt. Die weiter oben
|
||||
dokumentierte Korrektur war dadurch seit Längerem außer Kraft. Behoben durch einen Block
|
||||
am Dateiende; betrifft alle 13 Footer-Links, nicht nur die neuen.
|
||||
|
||||
Das ist im Projekt der dritte Fall derselben Falle. Merke: Overrides für Regeln aus den
|
||||
Komponentenabschnitten gehören ans **Ende** von `site.css`, nicht in den Mobile-Block oben.
|
||||
|
||||
## Mobil und Touch
|
||||
|
||||
**Überarbeitung 2026-09-24** (Kundenrückmeldung: Einstieg schwach, Header klobig, zu lang,
|
||||
|
||||
@@ -46,14 +46,15 @@ cd "/Users/andrej/ASX Studio/Emmas schatzkiste" && python3 -m http.server 4173
|
||||
|
||||
### Vom Kunden ausstehend
|
||||
|
||||
0. ~~**Die drei Social-Media-Adressen.**~~ Erledigt 2026-09-29. Facebook, Instagram und
|
||||
TikTok stehen im Footer aller fünf Seiten; alle drei Ziele wurden vor dem Einbau im
|
||||
Browser aufgerufen und bestätigt. Bei Facebook ist die dauerhafte Profiladresse
|
||||
eingetragen, nicht der gelieferte Share-Link (Begründung in [`DESIGN.md`](DESIGN.md)).
|
||||
|
||||
|
||||
3. ~~**Foto von Opa Martin.**~~ Erledigt 2026-09-24 (`assets/opa-martin.jpg`).
|
||||
4. **Zwei Audiodateien** — ein Lied für den Laden, eines für den Verein. Bis dahin ist der
|
||||
Player sichtbar deaktiviert, mit Badge „Audio folgt". Beim Einbau: je ein `<audio>`
|
||||
verdrahten, Button aktivieren, Fortschrittsbalken aus `timeupdate` treiben,
|
||||
Abspielposition in `localStorage` merken. **Ein Lied pro Seite, nicht beide auf beiden**
|
||||
(Kundenvorgabe).
|
||||
5. **Öffnungszeiten und vollständige Anschrift.** Bekannt sind nur Postleitzahl und Ort.
|
||||
Der Footer sagt bis dahin „Öffnungszeiten folgen".
|
||||
4. ~~**Zwei Audiodateien**~~ Erledigt 2026-09-26 (`assets/audio/`).
|
||||
5. ~~**Öffnungszeiten und vollständige Anschrift.**~~ Erledigt 2026-09-25 (von Google Maps).
|
||||
6. **Logos als Vektor.** Die gelieferten JPEGs sind freigestellt worden (siehe DESIGN.md),
|
||||
aber eine SVG- oder transparente PNG-Originaldatei wäre sauberer, besonders fürs
|
||||
Header-Zeichen bei 32px.
|
||||
|
||||
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,88 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="420" height="420" viewBox="0 0 420 420">
|
||||
<!-- Decor-Ebene (Handoff-DS: "Decor — flat decorative layer, variant, opacity").
|
||||
Einfarbige Spielzeug-Silhouetten, eingefaerbt fuer "cool" (#A9CFEE).
|
||||
Quelle: assets/decor/source.svg — Varianten mit Python daraus erzeugt. Kachel 420x420, nahtlos. -->
|
||||
<defs>
|
||||
<!-- Teddy -->
|
||||
<g id="teddy">
|
||||
<circle cx="-15" cy="-26" r="8"/><circle cx="15" cy="-26" r="8"/>
|
||||
<circle cx="0" cy="-14" r="17"/>
|
||||
<ellipse cx="0" cy="16" rx="18" ry="19"/>
|
||||
<circle cx="-19" cy="6" r="7"/><circle cx="19" cy="6" r="7"/>
|
||||
<circle cx="-12" cy="33" r="8"/><circle cx="12" cy="33" r="8"/>
|
||||
</g>
|
||||
<!-- Quietscheente -->
|
||||
<g id="duck">
|
||||
<path d="M-28 4 C-28 -6 -18 -10 -8 -8 L14 -8 C24 -8 30 0 30 8 C30 22 16 26 0 26 C-18 26 -28 18 -28 4 Z"/>
|
||||
<circle cx="10" cy="-18" r="13"/>
|
||||
<path d="M21 -20 L34 -15 L21 -11 Z"/>
|
||||
<path d="M-30 -4 L-20 -2 L-24 8 Z"/>
|
||||
</g>
|
||||
<!-- Spielzeugauto -->
|
||||
<g id="car">
|
||||
<path d="M-32 6 L-32 -6 Q-32 -10 -28 -10 L-16 -10 L-8 -22 L14 -22 L22 -10 L28 -10 Q32 -10 32 -6 L32 6 Z"/>
|
||||
<circle cx="-17" cy="8" r="8"/><circle cx="17" cy="8" r="8"/>
|
||||
</g>
|
||||
<!-- Ball -->
|
||||
<g id="ball">
|
||||
<path fill-rule="evenodd" d="M0 -22 A22 22 0 1 1 0 22 A22 22 0 1 1 0 -22 Z M-3 -19 C-12 -8 -12 8 -3 19 L3 19 C-6 8 -6 -8 3 -19 Z"/>
|
||||
</g>
|
||||
<!-- Bauklotz -->
|
||||
<g id="block">
|
||||
<path fill-rule="evenodd" d="M-18 -22 H18 Q22 -22 22 -18 V18 Q22 22 18 22 H-18 Q-22 22 -22 18 V-18 Q-22 -22 -18 -22 Z M-8 -12 V12 H2 Q10 12 10 5 Q10 0 5 -1 Q9 -3 9 -7 Q9 -12 1 -12 Z M-3 -8 V-3 H1 Q4 -3 4 -5.5 Q4 -8 1 -8 Z M-3 1 V8 H2 Q5 8 5 4.5 Q5 1 2 1 Z"/>
|
||||
</g>
|
||||
<!-- Rassel -->
|
||||
<g id="rattle">
|
||||
<circle cx="0" cy="-16" r="15"/>
|
||||
<rect x="-3.5" y="-4" width="7" height="30" rx="3.5"/>
|
||||
<circle cx="0" cy="28" r="6"/>
|
||||
</g>
|
||||
<!-- Stern -->
|
||||
<g id="star">
|
||||
<path d="M0 -22 L6.5 -7 L22 -6.5 L10 4 L14 20 L0 11 L-14 20 L-10 4 L-22 -6.5 L-6.5 -7 Z" stroke-linejoin="round"/>
|
||||
</g>
|
||||
<!-- Luftballon -->
|
||||
<g id="balloon">
|
||||
<ellipse cx="0" cy="-10" rx="15" ry="19"/>
|
||||
<path d="M-4 8 L4 8 L0 13 Z"/>
|
||||
<path d="M0 13 C5 20 -5 26 1 34" fill="none" stroke="#A9CFEE" stroke-width="2.4" stroke-linecap="round"/>
|
||||
</g>
|
||||
<!-- Stapelturm -->
|
||||
<g id="rings">
|
||||
<rect x="-2.5" y="-30" width="5" height="12" rx="2.5"/>
|
||||
<circle cx="0" cy="-30" r="4.5"/>
|
||||
<ellipse cx="0" cy="-14" rx="10" ry="6"/>
|
||||
<ellipse cx="0" cy="-2" rx="15" ry="7"/>
|
||||
<ellipse cx="0" cy="12" rx="20" ry="8"/>
|
||||
<rect x="-24" y="19" width="48" height="6" rx="3"/>
|
||||
</g>
|
||||
<!-- Herz -->
|
||||
<g id="heart">
|
||||
<path d="M0 18 C-14 8 -22 0 -22 -8 A10 10 0 0 1 0 -14 A10 10 0 0 1 22 -8 C22 0 14 8 0 18 Z"/>
|
||||
</g>
|
||||
<!-- Segelboot -->
|
||||
<g id="boat">
|
||||
<path d="M2 -28 L2 6 L24 6 Z"/>
|
||||
<path d="M-2 -20 L-2 6 L-16 6 Z"/>
|
||||
<path d="M-26 10 L26 10 L18 22 L-18 22 Z"/>
|
||||
</g>
|
||||
</defs>
|
||||
<g fill="#A9CFEE">
|
||||
<use href="#teddy" transform="translate(58 62) rotate(-12)"/>
|
||||
<use href="#star" transform="translate(170 36) rotate(14) scale(.8)"/>
|
||||
<use href="#car" transform="translate(282 70) rotate(8)"/>
|
||||
<use href="#ball" transform="translate(384 30) rotate(-20) scale(.85)"/>
|
||||
<use href="#balloon" transform="translate(150 150) rotate(10)"/>
|
||||
<use href="#duck" transform="translate(40 190) rotate(6)"/>
|
||||
<use href="#block" transform="translate(262 170) rotate(-10)"/>
|
||||
<use href="#heart" transform="translate(370 150) rotate(12) scale(.8)"/>
|
||||
<use href="#rings" transform="translate(80 312) rotate(-6)"/>
|
||||
<use href="#rattle" transform="translate(200 270) rotate(-35)"/>
|
||||
<use href="#boat" transform="translate(330 270) rotate(6)"/>
|
||||
<use href="#star" transform="translate(20 400) rotate(-8) scale(.6)"/>
|
||||
<use href="#star" transform="translate(440 400) rotate(-8) scale(.6)"/>
|
||||
<use href="#ball" transform="translate(250 380) rotate(30) scale(.7)"/>
|
||||
<use href="#heart" transform="translate(160 390) rotate(-14) scale(.6)"/>
|
||||
<use href="#teddy" transform="translate(390 368) rotate(10) scale(.75)"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.0 KiB |
@@ -0,0 +1,88 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="420" height="420" viewBox="0 0 420 420">
|
||||
<!-- Decor-Ebene (Handoff-DS: "Decor — flat decorative layer, variant, opacity").
|
||||
Einfarbige Spielzeug-Silhouetten, eingefaerbt fuer "hero-shop" (#B5D8F3).
|
||||
Quelle: assets/decor/source.svg — Varianten mit Python daraus erzeugt. Kachel 420x420, nahtlos. -->
|
||||
<defs>
|
||||
<!-- Teddy -->
|
||||
<g id="teddy">
|
||||
<circle cx="-15" cy="-26" r="8"/><circle cx="15" cy="-26" r="8"/>
|
||||
<circle cx="0" cy="-14" r="17"/>
|
||||
<ellipse cx="0" cy="16" rx="18" ry="19"/>
|
||||
<circle cx="-19" cy="6" r="7"/><circle cx="19" cy="6" r="7"/>
|
||||
<circle cx="-12" cy="33" r="8"/><circle cx="12" cy="33" r="8"/>
|
||||
</g>
|
||||
<!-- Quietscheente -->
|
||||
<g id="duck">
|
||||
<path d="M-28 4 C-28 -6 -18 -10 -8 -8 L14 -8 C24 -8 30 0 30 8 C30 22 16 26 0 26 C-18 26 -28 18 -28 4 Z"/>
|
||||
<circle cx="10" cy="-18" r="13"/>
|
||||
<path d="M21 -20 L34 -15 L21 -11 Z"/>
|
||||
<path d="M-30 -4 L-20 -2 L-24 8 Z"/>
|
||||
</g>
|
||||
<!-- Spielzeugauto -->
|
||||
<g id="car">
|
||||
<path d="M-32 6 L-32 -6 Q-32 -10 -28 -10 L-16 -10 L-8 -22 L14 -22 L22 -10 L28 -10 Q32 -10 32 -6 L32 6 Z"/>
|
||||
<circle cx="-17" cy="8" r="8"/><circle cx="17" cy="8" r="8"/>
|
||||
</g>
|
||||
<!-- Ball -->
|
||||
<g id="ball">
|
||||
<path fill-rule="evenodd" d="M0 -22 A22 22 0 1 1 0 22 A22 22 0 1 1 0 -22 Z M-3 -19 C-12 -8 -12 8 -3 19 L3 19 C-6 8 -6 -8 3 -19 Z"/>
|
||||
</g>
|
||||
<!-- Bauklotz -->
|
||||
<g id="block">
|
||||
<path fill-rule="evenodd" d="M-18 -22 H18 Q22 -22 22 -18 V18 Q22 22 18 22 H-18 Q-22 22 -22 18 V-18 Q-22 -22 -18 -22 Z M-8 -12 V12 H2 Q10 12 10 5 Q10 0 5 -1 Q9 -3 9 -7 Q9 -12 1 -12 Z M-3 -8 V-3 H1 Q4 -3 4 -5.5 Q4 -8 1 -8 Z M-3 1 V8 H2 Q5 8 5 4.5 Q5 1 2 1 Z"/>
|
||||
</g>
|
||||
<!-- Rassel -->
|
||||
<g id="rattle">
|
||||
<circle cx="0" cy="-16" r="15"/>
|
||||
<rect x="-3.5" y="-4" width="7" height="30" rx="3.5"/>
|
||||
<circle cx="0" cy="28" r="6"/>
|
||||
</g>
|
||||
<!-- Stern -->
|
||||
<g id="star">
|
||||
<path d="M0 -22 L6.5 -7 L22 -6.5 L10 4 L14 20 L0 11 L-14 20 L-10 4 L-22 -6.5 L-6.5 -7 Z" stroke-linejoin="round"/>
|
||||
</g>
|
||||
<!-- Luftballon -->
|
||||
<g id="balloon">
|
||||
<ellipse cx="0" cy="-10" rx="15" ry="19"/>
|
||||
<path d="M-4 8 L4 8 L0 13 Z"/>
|
||||
<path d="M0 13 C5 20 -5 26 1 34" fill="none" stroke="#B5D8F3" stroke-width="2.4" stroke-linecap="round"/>
|
||||
</g>
|
||||
<!-- Stapelturm -->
|
||||
<g id="rings">
|
||||
<rect x="-2.5" y="-30" width="5" height="12" rx="2.5"/>
|
||||
<circle cx="0" cy="-30" r="4.5"/>
|
||||
<ellipse cx="0" cy="-14" rx="10" ry="6"/>
|
||||
<ellipse cx="0" cy="-2" rx="15" ry="7"/>
|
||||
<ellipse cx="0" cy="12" rx="20" ry="8"/>
|
||||
<rect x="-24" y="19" width="48" height="6" rx="3"/>
|
||||
</g>
|
||||
<!-- Herz -->
|
||||
<g id="heart">
|
||||
<path d="M0 18 C-14 8 -22 0 -22 -8 A10 10 0 0 1 0 -14 A10 10 0 0 1 22 -8 C22 0 14 8 0 18 Z"/>
|
||||
</g>
|
||||
<!-- Segelboot -->
|
||||
<g id="boat">
|
||||
<path d="M2 -28 L2 6 L24 6 Z"/>
|
||||
<path d="M-2 -20 L-2 6 L-16 6 Z"/>
|
||||
<path d="M-26 10 L26 10 L18 22 L-18 22 Z"/>
|
||||
</g>
|
||||
</defs>
|
||||
<g fill="#B5D8F3">
|
||||
<use href="#teddy" transform="translate(58 62) rotate(-12)"/>
|
||||
<use href="#star" transform="translate(170 36) rotate(14) scale(.8)"/>
|
||||
<use href="#car" transform="translate(282 70) rotate(8)"/>
|
||||
<use href="#ball" transform="translate(384 30) rotate(-20) scale(.85)"/>
|
||||
<use href="#balloon" transform="translate(150 150) rotate(10)"/>
|
||||
<use href="#duck" transform="translate(40 190) rotate(6)"/>
|
||||
<use href="#block" transform="translate(262 170) rotate(-10)"/>
|
||||
<use href="#heart" transform="translate(370 150) rotate(12) scale(.8)"/>
|
||||
<use href="#rings" transform="translate(80 312) rotate(-6)"/>
|
||||
<use href="#rattle" transform="translate(200 270) rotate(-35)"/>
|
||||
<use href="#boat" transform="translate(330 270) rotate(6)"/>
|
||||
<use href="#star" transform="translate(20 400) rotate(-8) scale(.6)"/>
|
||||
<use href="#star" transform="translate(440 400) rotate(-8) scale(.6)"/>
|
||||
<use href="#ball" transform="translate(250 380) rotate(30) scale(.7)"/>
|
||||
<use href="#heart" transform="translate(160 390) rotate(-14) scale(.6)"/>
|
||||
<use href="#teddy" transform="translate(390 368) rotate(10) scale(.75)"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.0 KiB |
@@ -0,0 +1,88 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="420" height="420" viewBox="0 0 420 420">
|
||||
<!-- Decor-Ebene (Handoff-DS: "Decor — flat decorative layer, variant, opacity").
|
||||
Einfarbige Spielzeug-Silhouetten, eingefaerbt fuer "hero-verein" (#F1CC66).
|
||||
Quelle: assets/decor/source.svg — Varianten mit Python daraus erzeugt. Kachel 420x420, nahtlos. -->
|
||||
<defs>
|
||||
<!-- Teddy -->
|
||||
<g id="teddy">
|
||||
<circle cx="-15" cy="-26" r="8"/><circle cx="15" cy="-26" r="8"/>
|
||||
<circle cx="0" cy="-14" r="17"/>
|
||||
<ellipse cx="0" cy="16" rx="18" ry="19"/>
|
||||
<circle cx="-19" cy="6" r="7"/><circle cx="19" cy="6" r="7"/>
|
||||
<circle cx="-12" cy="33" r="8"/><circle cx="12" cy="33" r="8"/>
|
||||
</g>
|
||||
<!-- Quietscheente -->
|
||||
<g id="duck">
|
||||
<path d="M-28 4 C-28 -6 -18 -10 -8 -8 L14 -8 C24 -8 30 0 30 8 C30 22 16 26 0 26 C-18 26 -28 18 -28 4 Z"/>
|
||||
<circle cx="10" cy="-18" r="13"/>
|
||||
<path d="M21 -20 L34 -15 L21 -11 Z"/>
|
||||
<path d="M-30 -4 L-20 -2 L-24 8 Z"/>
|
||||
</g>
|
||||
<!-- Spielzeugauto -->
|
||||
<g id="car">
|
||||
<path d="M-32 6 L-32 -6 Q-32 -10 -28 -10 L-16 -10 L-8 -22 L14 -22 L22 -10 L28 -10 Q32 -10 32 -6 L32 6 Z"/>
|
||||
<circle cx="-17" cy="8" r="8"/><circle cx="17" cy="8" r="8"/>
|
||||
</g>
|
||||
<!-- Ball -->
|
||||
<g id="ball">
|
||||
<path fill-rule="evenodd" d="M0 -22 A22 22 0 1 1 0 22 A22 22 0 1 1 0 -22 Z M-3 -19 C-12 -8 -12 8 -3 19 L3 19 C-6 8 -6 -8 3 -19 Z"/>
|
||||
</g>
|
||||
<!-- Bauklotz -->
|
||||
<g id="block">
|
||||
<path fill-rule="evenodd" d="M-18 -22 H18 Q22 -22 22 -18 V18 Q22 22 18 22 H-18 Q-22 22 -22 18 V-18 Q-22 -22 -18 -22 Z M-8 -12 V12 H2 Q10 12 10 5 Q10 0 5 -1 Q9 -3 9 -7 Q9 -12 1 -12 Z M-3 -8 V-3 H1 Q4 -3 4 -5.5 Q4 -8 1 -8 Z M-3 1 V8 H2 Q5 8 5 4.5 Q5 1 2 1 Z"/>
|
||||
</g>
|
||||
<!-- Rassel -->
|
||||
<g id="rattle">
|
||||
<circle cx="0" cy="-16" r="15"/>
|
||||
<rect x="-3.5" y="-4" width="7" height="30" rx="3.5"/>
|
||||
<circle cx="0" cy="28" r="6"/>
|
||||
</g>
|
||||
<!-- Stern -->
|
||||
<g id="star">
|
||||
<path d="M0 -22 L6.5 -7 L22 -6.5 L10 4 L14 20 L0 11 L-14 20 L-10 4 L-22 -6.5 L-6.5 -7 Z" stroke-linejoin="round"/>
|
||||
</g>
|
||||
<!-- Luftballon -->
|
||||
<g id="balloon">
|
||||
<ellipse cx="0" cy="-10" rx="15" ry="19"/>
|
||||
<path d="M-4 8 L4 8 L0 13 Z"/>
|
||||
<path d="M0 13 C5 20 -5 26 1 34" fill="none" stroke="#F1CC66" stroke-width="2.4" stroke-linecap="round"/>
|
||||
</g>
|
||||
<!-- Stapelturm -->
|
||||
<g id="rings">
|
||||
<rect x="-2.5" y="-30" width="5" height="12" rx="2.5"/>
|
||||
<circle cx="0" cy="-30" r="4.5"/>
|
||||
<ellipse cx="0" cy="-14" rx="10" ry="6"/>
|
||||
<ellipse cx="0" cy="-2" rx="15" ry="7"/>
|
||||
<ellipse cx="0" cy="12" rx="20" ry="8"/>
|
||||
<rect x="-24" y="19" width="48" height="6" rx="3"/>
|
||||
</g>
|
||||
<!-- Herz -->
|
||||
<g id="heart">
|
||||
<path d="M0 18 C-14 8 -22 0 -22 -8 A10 10 0 0 1 0 -14 A10 10 0 0 1 22 -8 C22 0 14 8 0 18 Z"/>
|
||||
</g>
|
||||
<!-- Segelboot -->
|
||||
<g id="boat">
|
||||
<path d="M2 -28 L2 6 L24 6 Z"/>
|
||||
<path d="M-2 -20 L-2 6 L-16 6 Z"/>
|
||||
<path d="M-26 10 L26 10 L18 22 L-18 22 Z"/>
|
||||
</g>
|
||||
</defs>
|
||||
<g fill="#F1CC66">
|
||||
<use href="#teddy" transform="translate(58 62) rotate(-12)"/>
|
||||
<use href="#star" transform="translate(170 36) rotate(14) scale(.8)"/>
|
||||
<use href="#car" transform="translate(282 70) rotate(8)"/>
|
||||
<use href="#ball" transform="translate(384 30) rotate(-20) scale(.85)"/>
|
||||
<use href="#balloon" transform="translate(150 150) rotate(10)"/>
|
||||
<use href="#duck" transform="translate(40 190) rotate(6)"/>
|
||||
<use href="#block" transform="translate(262 170) rotate(-10)"/>
|
||||
<use href="#heart" transform="translate(370 150) rotate(12) scale(.8)"/>
|
||||
<use href="#rings" transform="translate(80 312) rotate(-6)"/>
|
||||
<use href="#rattle" transform="translate(200 270) rotate(-35)"/>
|
||||
<use href="#boat" transform="translate(330 270) rotate(6)"/>
|
||||
<use href="#star" transform="translate(20 400) rotate(-8) scale(.6)"/>
|
||||
<use href="#star" transform="translate(440 400) rotate(-8) scale(.6)"/>
|
||||
<use href="#ball" transform="translate(250 380) rotate(30) scale(.7)"/>
|
||||
<use href="#heart" transform="translate(160 390) rotate(-14) scale(.6)"/>
|
||||
<use href="#teddy" transform="translate(390 368) rotate(10) scale(.75)"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.0 KiB |
@@ -0,0 +1,88 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="420" height="420" viewBox="0 0 420 420">
|
||||
<!-- Decor-Ebene (Handoff-DS: "Decor — flat decorative layer, variant, opacity").
|
||||
Einfarbige Spielzeug-Silhouetten, eingefaerbt fuer "rose" (#F9BFB0).
|
||||
Quelle: assets/decor/source.svg — Varianten mit Python daraus erzeugt. Kachel 420x420, nahtlos. -->
|
||||
<defs>
|
||||
<!-- Teddy -->
|
||||
<g id="teddy">
|
||||
<circle cx="-15" cy="-26" r="8"/><circle cx="15" cy="-26" r="8"/>
|
||||
<circle cx="0" cy="-14" r="17"/>
|
||||
<ellipse cx="0" cy="16" rx="18" ry="19"/>
|
||||
<circle cx="-19" cy="6" r="7"/><circle cx="19" cy="6" r="7"/>
|
||||
<circle cx="-12" cy="33" r="8"/><circle cx="12" cy="33" r="8"/>
|
||||
</g>
|
||||
<!-- Quietscheente -->
|
||||
<g id="duck">
|
||||
<path d="M-28 4 C-28 -6 -18 -10 -8 -8 L14 -8 C24 -8 30 0 30 8 C30 22 16 26 0 26 C-18 26 -28 18 -28 4 Z"/>
|
||||
<circle cx="10" cy="-18" r="13"/>
|
||||
<path d="M21 -20 L34 -15 L21 -11 Z"/>
|
||||
<path d="M-30 -4 L-20 -2 L-24 8 Z"/>
|
||||
</g>
|
||||
<!-- Spielzeugauto -->
|
||||
<g id="car">
|
||||
<path d="M-32 6 L-32 -6 Q-32 -10 -28 -10 L-16 -10 L-8 -22 L14 -22 L22 -10 L28 -10 Q32 -10 32 -6 L32 6 Z"/>
|
||||
<circle cx="-17" cy="8" r="8"/><circle cx="17" cy="8" r="8"/>
|
||||
</g>
|
||||
<!-- Ball -->
|
||||
<g id="ball">
|
||||
<path fill-rule="evenodd" d="M0 -22 A22 22 0 1 1 0 22 A22 22 0 1 1 0 -22 Z M-3 -19 C-12 -8 -12 8 -3 19 L3 19 C-6 8 -6 -8 3 -19 Z"/>
|
||||
</g>
|
||||
<!-- Bauklotz -->
|
||||
<g id="block">
|
||||
<path fill-rule="evenodd" d="M-18 -22 H18 Q22 -22 22 -18 V18 Q22 22 18 22 H-18 Q-22 22 -22 18 V-18 Q-22 -22 -18 -22 Z M-8 -12 V12 H2 Q10 12 10 5 Q10 0 5 -1 Q9 -3 9 -7 Q9 -12 1 -12 Z M-3 -8 V-3 H1 Q4 -3 4 -5.5 Q4 -8 1 -8 Z M-3 1 V8 H2 Q5 8 5 4.5 Q5 1 2 1 Z"/>
|
||||
</g>
|
||||
<!-- Rassel -->
|
||||
<g id="rattle">
|
||||
<circle cx="0" cy="-16" r="15"/>
|
||||
<rect x="-3.5" y="-4" width="7" height="30" rx="3.5"/>
|
||||
<circle cx="0" cy="28" r="6"/>
|
||||
</g>
|
||||
<!-- Stern -->
|
||||
<g id="star">
|
||||
<path d="M0 -22 L6.5 -7 L22 -6.5 L10 4 L14 20 L0 11 L-14 20 L-10 4 L-22 -6.5 L-6.5 -7 Z" stroke-linejoin="round"/>
|
||||
</g>
|
||||
<!-- Luftballon -->
|
||||
<g id="balloon">
|
||||
<ellipse cx="0" cy="-10" rx="15" ry="19"/>
|
||||
<path d="M-4 8 L4 8 L0 13 Z"/>
|
||||
<path d="M0 13 C5 20 -5 26 1 34" fill="none" stroke="#F9BFB0" stroke-width="2.4" stroke-linecap="round"/>
|
||||
</g>
|
||||
<!-- Stapelturm -->
|
||||
<g id="rings">
|
||||
<rect x="-2.5" y="-30" width="5" height="12" rx="2.5"/>
|
||||
<circle cx="0" cy="-30" r="4.5"/>
|
||||
<ellipse cx="0" cy="-14" rx="10" ry="6"/>
|
||||
<ellipse cx="0" cy="-2" rx="15" ry="7"/>
|
||||
<ellipse cx="0" cy="12" rx="20" ry="8"/>
|
||||
<rect x="-24" y="19" width="48" height="6" rx="3"/>
|
||||
</g>
|
||||
<!-- Herz -->
|
||||
<g id="heart">
|
||||
<path d="M0 18 C-14 8 -22 0 -22 -8 A10 10 0 0 1 0 -14 A10 10 0 0 1 22 -8 C22 0 14 8 0 18 Z"/>
|
||||
</g>
|
||||
<!-- Segelboot -->
|
||||
<g id="boat">
|
||||
<path d="M2 -28 L2 6 L24 6 Z"/>
|
||||
<path d="M-2 -20 L-2 6 L-16 6 Z"/>
|
||||
<path d="M-26 10 L26 10 L18 22 L-18 22 Z"/>
|
||||
</g>
|
||||
</defs>
|
||||
<g fill="#F9BFB0">
|
||||
<use href="#teddy" transform="translate(58 62) rotate(-12)"/>
|
||||
<use href="#star" transform="translate(170 36) rotate(14) scale(.8)"/>
|
||||
<use href="#car" transform="translate(282 70) rotate(8)"/>
|
||||
<use href="#ball" transform="translate(384 30) rotate(-20) scale(.85)"/>
|
||||
<use href="#balloon" transform="translate(150 150) rotate(10)"/>
|
||||
<use href="#duck" transform="translate(40 190) rotate(6)"/>
|
||||
<use href="#block" transform="translate(262 170) rotate(-10)"/>
|
||||
<use href="#heart" transform="translate(370 150) rotate(12) scale(.8)"/>
|
||||
<use href="#rings" transform="translate(80 312) rotate(-6)"/>
|
||||
<use href="#rattle" transform="translate(200 270) rotate(-35)"/>
|
||||
<use href="#boat" transform="translate(330 270) rotate(6)"/>
|
||||
<use href="#star" transform="translate(20 400) rotate(-8) scale(.6)"/>
|
||||
<use href="#star" transform="translate(440 400) rotate(-8) scale(.6)"/>
|
||||
<use href="#ball" transform="translate(250 380) rotate(30) scale(.7)"/>
|
||||
<use href="#heart" transform="translate(160 390) rotate(-14) scale(.6)"/>
|
||||
<use href="#teddy" transform="translate(390 368) rotate(10) scale(.75)"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.0 KiB |
@@ -0,0 +1,88 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="420" height="420" viewBox="0 0 420 420">
|
||||
<!-- Decor-Ebene (Handoff-DS: "Decor — flat decorative layer, variant, opacity").
|
||||
Einfarbige Spielzeug-Silhouetten, eingefaerbt fuer "sky" (#2878BD).
|
||||
Quelle: assets/decor/source.svg — Varianten mit Python daraus erzeugt. Kachel 420x420, nahtlos. -->
|
||||
<defs>
|
||||
<!-- Teddy -->
|
||||
<g id="teddy">
|
||||
<circle cx="-15" cy="-26" r="8"/><circle cx="15" cy="-26" r="8"/>
|
||||
<circle cx="0" cy="-14" r="17"/>
|
||||
<ellipse cx="0" cy="16" rx="18" ry="19"/>
|
||||
<circle cx="-19" cy="6" r="7"/><circle cx="19" cy="6" r="7"/>
|
||||
<circle cx="-12" cy="33" r="8"/><circle cx="12" cy="33" r="8"/>
|
||||
</g>
|
||||
<!-- Quietscheente -->
|
||||
<g id="duck">
|
||||
<path d="M-28 4 C-28 -6 -18 -10 -8 -8 L14 -8 C24 -8 30 0 30 8 C30 22 16 26 0 26 C-18 26 -28 18 -28 4 Z"/>
|
||||
<circle cx="10" cy="-18" r="13"/>
|
||||
<path d="M21 -20 L34 -15 L21 -11 Z"/>
|
||||
<path d="M-30 -4 L-20 -2 L-24 8 Z"/>
|
||||
</g>
|
||||
<!-- Spielzeugauto -->
|
||||
<g id="car">
|
||||
<path d="M-32 6 L-32 -6 Q-32 -10 -28 -10 L-16 -10 L-8 -22 L14 -22 L22 -10 L28 -10 Q32 -10 32 -6 L32 6 Z"/>
|
||||
<circle cx="-17" cy="8" r="8"/><circle cx="17" cy="8" r="8"/>
|
||||
</g>
|
||||
<!-- Ball -->
|
||||
<g id="ball">
|
||||
<path fill-rule="evenodd" d="M0 -22 A22 22 0 1 1 0 22 A22 22 0 1 1 0 -22 Z M-3 -19 C-12 -8 -12 8 -3 19 L3 19 C-6 8 -6 -8 3 -19 Z"/>
|
||||
</g>
|
||||
<!-- Bauklotz -->
|
||||
<g id="block">
|
||||
<path fill-rule="evenodd" d="M-18 -22 H18 Q22 -22 22 -18 V18 Q22 22 18 22 H-18 Q-22 22 -22 18 V-18 Q-22 -22 -18 -22 Z M-8 -12 V12 H2 Q10 12 10 5 Q10 0 5 -1 Q9 -3 9 -7 Q9 -12 1 -12 Z M-3 -8 V-3 H1 Q4 -3 4 -5.5 Q4 -8 1 -8 Z M-3 1 V8 H2 Q5 8 5 4.5 Q5 1 2 1 Z"/>
|
||||
</g>
|
||||
<!-- Rassel -->
|
||||
<g id="rattle">
|
||||
<circle cx="0" cy="-16" r="15"/>
|
||||
<rect x="-3.5" y="-4" width="7" height="30" rx="3.5"/>
|
||||
<circle cx="0" cy="28" r="6"/>
|
||||
</g>
|
||||
<!-- Stern -->
|
||||
<g id="star">
|
||||
<path d="M0 -22 L6.5 -7 L22 -6.5 L10 4 L14 20 L0 11 L-14 20 L-10 4 L-22 -6.5 L-6.5 -7 Z" stroke-linejoin="round"/>
|
||||
</g>
|
||||
<!-- Luftballon -->
|
||||
<g id="balloon">
|
||||
<ellipse cx="0" cy="-10" rx="15" ry="19"/>
|
||||
<path d="M-4 8 L4 8 L0 13 Z"/>
|
||||
<path d="M0 13 C5 20 -5 26 1 34" fill="none" stroke="#2878BD" stroke-width="2.4" stroke-linecap="round"/>
|
||||
</g>
|
||||
<!-- Stapelturm -->
|
||||
<g id="rings">
|
||||
<rect x="-2.5" y="-30" width="5" height="12" rx="2.5"/>
|
||||
<circle cx="0" cy="-30" r="4.5"/>
|
||||
<ellipse cx="0" cy="-14" rx="10" ry="6"/>
|
||||
<ellipse cx="0" cy="-2" rx="15" ry="7"/>
|
||||
<ellipse cx="0" cy="12" rx="20" ry="8"/>
|
||||
<rect x="-24" y="19" width="48" height="6" rx="3"/>
|
||||
</g>
|
||||
<!-- Herz -->
|
||||
<g id="heart">
|
||||
<path d="M0 18 C-14 8 -22 0 -22 -8 A10 10 0 0 1 0 -14 A10 10 0 0 1 22 -8 C22 0 14 8 0 18 Z"/>
|
||||
</g>
|
||||
<!-- Segelboot -->
|
||||
<g id="boat">
|
||||
<path d="M2 -28 L2 6 L24 6 Z"/>
|
||||
<path d="M-2 -20 L-2 6 L-16 6 Z"/>
|
||||
<path d="M-26 10 L26 10 L18 22 L-18 22 Z"/>
|
||||
</g>
|
||||
</defs>
|
||||
<g fill="#2878BD">
|
||||
<use href="#teddy" transform="translate(58 62) rotate(-12)"/>
|
||||
<use href="#star" transform="translate(170 36) rotate(14) scale(.8)"/>
|
||||
<use href="#car" transform="translate(282 70) rotate(8)"/>
|
||||
<use href="#ball" transform="translate(384 30) rotate(-20) scale(.85)"/>
|
||||
<use href="#balloon" transform="translate(150 150) rotate(10)"/>
|
||||
<use href="#duck" transform="translate(40 190) rotate(6)"/>
|
||||
<use href="#block" transform="translate(262 170) rotate(-10)"/>
|
||||
<use href="#heart" transform="translate(370 150) rotate(12) scale(.8)"/>
|
||||
<use href="#rings" transform="translate(80 312) rotate(-6)"/>
|
||||
<use href="#rattle" transform="translate(200 270) rotate(-35)"/>
|
||||
<use href="#boat" transform="translate(330 270) rotate(6)"/>
|
||||
<use href="#star" transform="translate(20 400) rotate(-8) scale(.6)"/>
|
||||
<use href="#star" transform="translate(440 400) rotate(-8) scale(.6)"/>
|
||||
<use href="#ball" transform="translate(250 380) rotate(30) scale(.7)"/>
|
||||
<use href="#heart" transform="translate(160 390) rotate(-14) scale(.6)"/>
|
||||
<use href="#teddy" transform="translate(390 368) rotate(10) scale(.75)"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.0 KiB |
@@ -1,7 +1,7 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="420" height="420" viewBox="0 0 420 420">
|
||||
<!-- Decor-Ebene (Handoff-DS: "Decor — flat decorative layer, variant, opacity").
|
||||
Einfarbige Spielzeug-Silhouetten, wird als CSS-Maske benutzt: die Farbe kommt
|
||||
aus dem CSS (Variable decor), diese Datei liefert nur die Form. Kachel 420x420, nahtlos. -->
|
||||
Einfarbige Spielzeug-Silhouetten, Quelle fuer die eingefaerbten Varianten
|
||||
daneben (warm, cool, rose, sky, sun, hero-shop, hero-verein). Kachel 420x420, nahtlos. -->
|
||||
<defs>
|
||||
<!-- Teddy -->
|
||||
<g id="teddy">
|
||||
@@ -0,0 +1,88 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="420" height="420" viewBox="0 0 420 420">
|
||||
<!-- Decor-Ebene (Handoff-DS: "Decor — flat decorative layer, variant, opacity").
|
||||
Einfarbige Spielzeug-Silhouetten, eingefaerbt fuer "sun" (#E8B124).
|
||||
Quelle: assets/decor/source.svg — Varianten mit Python daraus erzeugt. Kachel 420x420, nahtlos. -->
|
||||
<defs>
|
||||
<!-- Teddy -->
|
||||
<g id="teddy">
|
||||
<circle cx="-15" cy="-26" r="8"/><circle cx="15" cy="-26" r="8"/>
|
||||
<circle cx="0" cy="-14" r="17"/>
|
||||
<ellipse cx="0" cy="16" rx="18" ry="19"/>
|
||||
<circle cx="-19" cy="6" r="7"/><circle cx="19" cy="6" r="7"/>
|
||||
<circle cx="-12" cy="33" r="8"/><circle cx="12" cy="33" r="8"/>
|
||||
</g>
|
||||
<!-- Quietscheente -->
|
||||
<g id="duck">
|
||||
<path d="M-28 4 C-28 -6 -18 -10 -8 -8 L14 -8 C24 -8 30 0 30 8 C30 22 16 26 0 26 C-18 26 -28 18 -28 4 Z"/>
|
||||
<circle cx="10" cy="-18" r="13"/>
|
||||
<path d="M21 -20 L34 -15 L21 -11 Z"/>
|
||||
<path d="M-30 -4 L-20 -2 L-24 8 Z"/>
|
||||
</g>
|
||||
<!-- Spielzeugauto -->
|
||||
<g id="car">
|
||||
<path d="M-32 6 L-32 -6 Q-32 -10 -28 -10 L-16 -10 L-8 -22 L14 -22 L22 -10 L28 -10 Q32 -10 32 -6 L32 6 Z"/>
|
||||
<circle cx="-17" cy="8" r="8"/><circle cx="17" cy="8" r="8"/>
|
||||
</g>
|
||||
<!-- Ball -->
|
||||
<g id="ball">
|
||||
<path fill-rule="evenodd" d="M0 -22 A22 22 0 1 1 0 22 A22 22 0 1 1 0 -22 Z M-3 -19 C-12 -8 -12 8 -3 19 L3 19 C-6 8 -6 -8 3 -19 Z"/>
|
||||
</g>
|
||||
<!-- Bauklotz -->
|
||||
<g id="block">
|
||||
<path fill-rule="evenodd" d="M-18 -22 H18 Q22 -22 22 -18 V18 Q22 22 18 22 H-18 Q-22 22 -22 18 V-18 Q-22 -22 -18 -22 Z M-8 -12 V12 H2 Q10 12 10 5 Q10 0 5 -1 Q9 -3 9 -7 Q9 -12 1 -12 Z M-3 -8 V-3 H1 Q4 -3 4 -5.5 Q4 -8 1 -8 Z M-3 1 V8 H2 Q5 8 5 4.5 Q5 1 2 1 Z"/>
|
||||
</g>
|
||||
<!-- Rassel -->
|
||||
<g id="rattle">
|
||||
<circle cx="0" cy="-16" r="15"/>
|
||||
<rect x="-3.5" y="-4" width="7" height="30" rx="3.5"/>
|
||||
<circle cx="0" cy="28" r="6"/>
|
||||
</g>
|
||||
<!-- Stern -->
|
||||
<g id="star">
|
||||
<path d="M0 -22 L6.5 -7 L22 -6.5 L10 4 L14 20 L0 11 L-14 20 L-10 4 L-22 -6.5 L-6.5 -7 Z" stroke-linejoin="round"/>
|
||||
</g>
|
||||
<!-- Luftballon -->
|
||||
<g id="balloon">
|
||||
<ellipse cx="0" cy="-10" rx="15" ry="19"/>
|
||||
<path d="M-4 8 L4 8 L0 13 Z"/>
|
||||
<path d="M0 13 C5 20 -5 26 1 34" fill="none" stroke="#E8B124" stroke-width="2.4" stroke-linecap="round"/>
|
||||
</g>
|
||||
<!-- Stapelturm -->
|
||||
<g id="rings">
|
||||
<rect x="-2.5" y="-30" width="5" height="12" rx="2.5"/>
|
||||
<circle cx="0" cy="-30" r="4.5"/>
|
||||
<ellipse cx="0" cy="-14" rx="10" ry="6"/>
|
||||
<ellipse cx="0" cy="-2" rx="15" ry="7"/>
|
||||
<ellipse cx="0" cy="12" rx="20" ry="8"/>
|
||||
<rect x="-24" y="19" width="48" height="6" rx="3"/>
|
||||
</g>
|
||||
<!-- Herz -->
|
||||
<g id="heart">
|
||||
<path d="M0 18 C-14 8 -22 0 -22 -8 A10 10 0 0 1 0 -14 A10 10 0 0 1 22 -8 C22 0 14 8 0 18 Z"/>
|
||||
</g>
|
||||
<!-- Segelboot -->
|
||||
<g id="boat">
|
||||
<path d="M2 -28 L2 6 L24 6 Z"/>
|
||||
<path d="M-2 -20 L-2 6 L-16 6 Z"/>
|
||||
<path d="M-26 10 L26 10 L18 22 L-18 22 Z"/>
|
||||
</g>
|
||||
</defs>
|
||||
<g fill="#E8B124">
|
||||
<use href="#teddy" transform="translate(58 62) rotate(-12)"/>
|
||||
<use href="#star" transform="translate(170 36) rotate(14) scale(.8)"/>
|
||||
<use href="#car" transform="translate(282 70) rotate(8)"/>
|
||||
<use href="#ball" transform="translate(384 30) rotate(-20) scale(.85)"/>
|
||||
<use href="#balloon" transform="translate(150 150) rotate(10)"/>
|
||||
<use href="#duck" transform="translate(40 190) rotate(6)"/>
|
||||
<use href="#block" transform="translate(262 170) rotate(-10)"/>
|
||||
<use href="#heart" transform="translate(370 150) rotate(12) scale(.8)"/>
|
||||
<use href="#rings" transform="translate(80 312) rotate(-6)"/>
|
||||
<use href="#rattle" transform="translate(200 270) rotate(-35)"/>
|
||||
<use href="#boat" transform="translate(330 270) rotate(6)"/>
|
||||
<use href="#star" transform="translate(20 400) rotate(-8) scale(.6)"/>
|
||||
<use href="#star" transform="translate(440 400) rotate(-8) scale(.6)"/>
|
||||
<use href="#ball" transform="translate(250 380) rotate(30) scale(.7)"/>
|
||||
<use href="#heart" transform="translate(160 390) rotate(-14) scale(.6)"/>
|
||||
<use href="#teddy" transform="translate(390 368) rotate(10) scale(.75)"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.0 KiB |
@@ -0,0 +1,88 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="420" height="420" viewBox="0 0 420 420">
|
||||
<!-- Decor-Ebene (Handoff-DS: "Decor — flat decorative layer, variant, opacity").
|
||||
Einfarbige Spielzeug-Silhouetten, eingefaerbt fuer "warm" (#EDC356).
|
||||
Quelle: assets/decor/source.svg — Varianten mit Python daraus erzeugt. Kachel 420x420, nahtlos. -->
|
||||
<defs>
|
||||
<!-- Teddy -->
|
||||
<g id="teddy">
|
||||
<circle cx="-15" cy="-26" r="8"/><circle cx="15" cy="-26" r="8"/>
|
||||
<circle cx="0" cy="-14" r="17"/>
|
||||
<ellipse cx="0" cy="16" rx="18" ry="19"/>
|
||||
<circle cx="-19" cy="6" r="7"/><circle cx="19" cy="6" r="7"/>
|
||||
<circle cx="-12" cy="33" r="8"/><circle cx="12" cy="33" r="8"/>
|
||||
</g>
|
||||
<!-- Quietscheente -->
|
||||
<g id="duck">
|
||||
<path d="M-28 4 C-28 -6 -18 -10 -8 -8 L14 -8 C24 -8 30 0 30 8 C30 22 16 26 0 26 C-18 26 -28 18 -28 4 Z"/>
|
||||
<circle cx="10" cy="-18" r="13"/>
|
||||
<path d="M21 -20 L34 -15 L21 -11 Z"/>
|
||||
<path d="M-30 -4 L-20 -2 L-24 8 Z"/>
|
||||
</g>
|
||||
<!-- Spielzeugauto -->
|
||||
<g id="car">
|
||||
<path d="M-32 6 L-32 -6 Q-32 -10 -28 -10 L-16 -10 L-8 -22 L14 -22 L22 -10 L28 -10 Q32 -10 32 -6 L32 6 Z"/>
|
||||
<circle cx="-17" cy="8" r="8"/><circle cx="17" cy="8" r="8"/>
|
||||
</g>
|
||||
<!-- Ball -->
|
||||
<g id="ball">
|
||||
<path fill-rule="evenodd" d="M0 -22 A22 22 0 1 1 0 22 A22 22 0 1 1 0 -22 Z M-3 -19 C-12 -8 -12 8 -3 19 L3 19 C-6 8 -6 -8 3 -19 Z"/>
|
||||
</g>
|
||||
<!-- Bauklotz -->
|
||||
<g id="block">
|
||||
<path fill-rule="evenodd" d="M-18 -22 H18 Q22 -22 22 -18 V18 Q22 22 18 22 H-18 Q-22 22 -22 18 V-18 Q-22 -22 -18 -22 Z M-8 -12 V12 H2 Q10 12 10 5 Q10 0 5 -1 Q9 -3 9 -7 Q9 -12 1 -12 Z M-3 -8 V-3 H1 Q4 -3 4 -5.5 Q4 -8 1 -8 Z M-3 1 V8 H2 Q5 8 5 4.5 Q5 1 2 1 Z"/>
|
||||
</g>
|
||||
<!-- Rassel -->
|
||||
<g id="rattle">
|
||||
<circle cx="0" cy="-16" r="15"/>
|
||||
<rect x="-3.5" y="-4" width="7" height="30" rx="3.5"/>
|
||||
<circle cx="0" cy="28" r="6"/>
|
||||
</g>
|
||||
<!-- Stern -->
|
||||
<g id="star">
|
||||
<path d="M0 -22 L6.5 -7 L22 -6.5 L10 4 L14 20 L0 11 L-14 20 L-10 4 L-22 -6.5 L-6.5 -7 Z" stroke-linejoin="round"/>
|
||||
</g>
|
||||
<!-- Luftballon -->
|
||||
<g id="balloon">
|
||||
<ellipse cx="0" cy="-10" rx="15" ry="19"/>
|
||||
<path d="M-4 8 L4 8 L0 13 Z"/>
|
||||
<path d="M0 13 C5 20 -5 26 1 34" fill="none" stroke="#EDC356" stroke-width="2.4" stroke-linecap="round"/>
|
||||
</g>
|
||||
<!-- Stapelturm -->
|
||||
<g id="rings">
|
||||
<rect x="-2.5" y="-30" width="5" height="12" rx="2.5"/>
|
||||
<circle cx="0" cy="-30" r="4.5"/>
|
||||
<ellipse cx="0" cy="-14" rx="10" ry="6"/>
|
||||
<ellipse cx="0" cy="-2" rx="15" ry="7"/>
|
||||
<ellipse cx="0" cy="12" rx="20" ry="8"/>
|
||||
<rect x="-24" y="19" width="48" height="6" rx="3"/>
|
||||
</g>
|
||||
<!-- Herz -->
|
||||
<g id="heart">
|
||||
<path d="M0 18 C-14 8 -22 0 -22 -8 A10 10 0 0 1 0 -14 A10 10 0 0 1 22 -8 C22 0 14 8 0 18 Z"/>
|
||||
</g>
|
||||
<!-- Segelboot -->
|
||||
<g id="boat">
|
||||
<path d="M2 -28 L2 6 L24 6 Z"/>
|
||||
<path d="M-2 -20 L-2 6 L-16 6 Z"/>
|
||||
<path d="M-26 10 L26 10 L18 22 L-18 22 Z"/>
|
||||
</g>
|
||||
</defs>
|
||||
<g fill="#EDC356">
|
||||
<use href="#teddy" transform="translate(58 62) rotate(-12)"/>
|
||||
<use href="#star" transform="translate(170 36) rotate(14) scale(.8)"/>
|
||||
<use href="#car" transform="translate(282 70) rotate(8)"/>
|
||||
<use href="#ball" transform="translate(384 30) rotate(-20) scale(.85)"/>
|
||||
<use href="#balloon" transform="translate(150 150) rotate(10)"/>
|
||||
<use href="#duck" transform="translate(40 190) rotate(6)"/>
|
||||
<use href="#block" transform="translate(262 170) rotate(-10)"/>
|
||||
<use href="#heart" transform="translate(370 150) rotate(12) scale(.8)"/>
|
||||
<use href="#rings" transform="translate(80 312) rotate(-6)"/>
|
||||
<use href="#rattle" transform="translate(200 270) rotate(-35)"/>
|
||||
<use href="#boat" transform="translate(330 270) rotate(6)"/>
|
||||
<use href="#star" transform="translate(20 400) rotate(-8) scale(.6)"/>
|
||||
<use href="#star" transform="translate(440 400) rotate(-8) scale(.6)"/>
|
||||
<use href="#ball" transform="translate(250 380) rotate(30) scale(.7)"/>
|
||||
<use href="#heart" transform="translate(160 390) rotate(-14) scale(.6)"/>
|
||||
<use href="#teddy" transform="translate(390 368) rotate(10) scale(.75)"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 176 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 84 KiB |
@@ -0,0 +1,64 @@
|
||||
/* Emma's Schatzkiste — Lied-Player
|
||||
Ein Lied pro Seite (Kundenvorgabe). Kein Autoplay: Ton gibt es nur auf Klick.
|
||||
Bewusst OHNE Merken der Abspielposition: das Handoff wollte localStorage, aber jede
|
||||
Speicherung auf dem Gerät fällt unter § 25 TDDDG — die Seite verspricht in der
|
||||
Datenschutzerklärung, nichts zu speichern, und braucht deshalb kein Banner. */
|
||||
(function () {
|
||||
function fmt(t) {
|
||||
if (!isFinite(t) || t < 0) t = 0;
|
||||
var m = Math.floor(t / 60), s = Math.floor(t % 60);
|
||||
return m + ':' + (s < 10 ? '0' : '') + s;
|
||||
}
|
||||
|
||||
document.querySelectorAll('[data-song]').forEach(function (box) {
|
||||
var audio = box.querySelector('audio');
|
||||
var btn = box.querySelector('[data-song-toggle]');
|
||||
var seek = box.querySelector('[data-song-seek]');
|
||||
var cur = box.querySelector('[data-song-cur]');
|
||||
var dur = box.querySelector('[data-song-dur]');
|
||||
var title = box.querySelector('h3').textContent;
|
||||
var seeking = false;
|
||||
|
||||
function paint() {
|
||||
var d = audio.duration, t = audio.currentTime;
|
||||
var p = d ? (t / d) * 100 : 0;
|
||||
if (!seeking) seek.value = p;
|
||||
seek.style.setProperty('--p', p + '%');
|
||||
cur.textContent = fmt(t);
|
||||
}
|
||||
|
||||
audio.addEventListener('loadedmetadata', function () {
|
||||
dur.textContent = fmt(audio.duration);
|
||||
paint();
|
||||
});
|
||||
audio.addEventListener('timeupdate', paint);
|
||||
audio.addEventListener('play', function () {
|
||||
box.classList.add('is-playing');
|
||||
btn.setAttribute('aria-label', title + ' pausieren');
|
||||
});
|
||||
audio.addEventListener('pause', function () {
|
||||
box.classList.remove('is-playing');
|
||||
btn.setAttribute('aria-label', title + ' abspielen');
|
||||
});
|
||||
audio.addEventListener('ended', function () {
|
||||
audio.currentTime = 0;
|
||||
paint();
|
||||
});
|
||||
|
||||
btn.addEventListener('click', function () {
|
||||
if (audio.paused) audio.play(); else audio.pause();
|
||||
});
|
||||
|
||||
seek.addEventListener('input', function () {
|
||||
seeking = true;
|
||||
var d = audio.duration || 0;
|
||||
seek.style.setProperty('--p', seek.value + '%');
|
||||
cur.textContent = fmt((seek.value / 100) * d);
|
||||
});
|
||||
seek.addEventListener('change', function () {
|
||||
if (audio.duration) audio.currentTime = (seek.value / 100) * audio.duration;
|
||||
seeking = false;
|
||||
paint();
|
||||
});
|
||||
});
|
||||
})();
|
||||
+194
-36
@@ -201,6 +201,9 @@ a:hover{color:var(--sky-600)}
|
||||
min-height:44px; /* Touch-Ziel, auch auf Tablets */
|
||||
}
|
||||
.hdr__brand img{width:34px; height:34px; object-fit:contain}
|
||||
/* Beide Zeichen: Laden und Hilfe Verein (Kundenwunsch 2026-09-25) — die zwei Welten
|
||||
des Handoffs stehen damit auf jeder Seite nebeneinander. */
|
||||
.hdr__marks{display:flex; align-items:center; gap:4px}
|
||||
.nav{display:flex; align-items:center; gap:var(--space-1); flex-wrap:wrap}
|
||||
/* 44px hoch statt 31: Tablets sind Touch-Geraete, WCAG 2.5.5 will 44x44.
|
||||
Passt weiterhin in den 64px hohen Header. */
|
||||
@@ -225,8 +228,10 @@ a:hover{color:var(--sky-600)}
|
||||
:root{--header-h:60px; --page-pad-x:20px}
|
||||
.hdr__in{gap:var(--space-2)}
|
||||
.hdr__brand{font-size:0; gap:0; min-width:44px; justify-content:center}
|
||||
.hdr__brand img{width:36px; height:36px}
|
||||
.hdr__brand img{width:32px; height:32px}
|
||||
.nav{flex-wrap:nowrap; gap:0}
|
||||
/* Die Kopfzeile traegt am Handy vier Punkte; "Neuigkeiten" steht dort direkt unter dem Hero */
|
||||
.nav a.nav__news{display:none}
|
||||
.nav a{
|
||||
position:relative; min-height:44px; padding:6px clamp(5px,2.2vw,10px);
|
||||
font-size:clamp(13px,3.8vw,15px); white-space:nowrap; border-radius:var(--radius-s);
|
||||
@@ -242,6 +247,10 @@ a:hover{color:var(--sky-600)}
|
||||
display:flex; align-items:center; min-height:44px; padding-block:2px;
|
||||
}
|
||||
}
|
||||
/* Unter 360px mit zwei Zeichen im Header: "Hilfe Verein" darf zweizeilig werden. */
|
||||
@media (max-width:359.98px){
|
||||
.nav a{white-space:normal; text-align:center; line-height:1.1}
|
||||
}
|
||||
|
||||
/* ============================================================ BUTTONS */
|
||||
.btn{
|
||||
@@ -378,10 +387,18 @@ a:hover{color:var(--sky-600)}
|
||||
}
|
||||
.story__copy{display:grid; gap:var(--space-4)}
|
||||
.story__copy p{max-width:50ch}
|
||||
/* Kundenwunsch 2026-09-24: Geschichte größer. Überschrift auf Display-Niveau, Text eine
|
||||
Stufe hoch auf 20px (vorhandene h3-Stufe, keine neue Größe) in ink-700 — er ist hier
|
||||
der Inhalt, nicht Beiwerk. Guardrail Typo-Extreme: groß wird wirklich groß. */
|
||||
#ueber-uns .sh h2{font-size:clamp(32px, 4.6vw, 48px); line-height:1.05}
|
||||
#ueber-uns .sh__chip{width:52px; height:52px}
|
||||
#ueber-uns .sh svg{width:26px; height:26px}
|
||||
.story__copy{gap:var(--space-5)}
|
||||
.story__copy p{font-size:20px; line-height:1.6; color:var(--ink-700); max-width:44ch}
|
||||
.story__img{
|
||||
/* height:auto ist noetig: die width/height-Attribute im HTML (gegen Layout-Shift)
|
||||
machen beide Achsen definit, dann ignoriert der Browser aspect-ratio. */
|
||||
width:100%; height:auto; aspect-ratio:4/3; object-fit:cover;
|
||||
width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; /* Ladenfoto ist Querformat */
|
||||
border-radius:var(--radius-xl); box-shadow:var(--shadow-band);
|
||||
transform:rotate(-1.5deg);
|
||||
}
|
||||
@@ -420,7 +437,44 @@ a:hover{color:var(--sky-600)}
|
||||
border-radius:var(--radius-xl); border:6px solid var(--surface-card);
|
||||
box-shadow:var(--shadow-band); transform:rotate(1.5deg);
|
||||
}
|
||||
.portrait__name{font:var(--t-h2); color:var(--accent-text); letter-spacing:var(--ls-display)} /* 4.43 auf sun-200 */
|
||||
/* Wie die Hero-Headline: Display-Größe, helles Markenblau mit dunkler Kontur (die Kontur
|
||||
trägt den Kontrast), leicht gekippt wie jede Headline-Zeile. */
|
||||
.portrait__name{
|
||||
font:var(--t-display); font-size:clamp(40px, 6vw, 60px); letter-spacing:var(--ls-display);
|
||||
color:var(--sky-500); -webkit-text-stroke:.1em var(--ink-700); paint-order:stroke fill;
|
||||
transform:rotate(-2deg);
|
||||
}
|
||||
|
||||
/* Anfahrt — Adresse, Zeiten, Karte */
|
||||
.visit{
|
||||
display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));
|
||||
gap:var(--space-8); align-items:stretch;
|
||||
}
|
||||
.visit__info{display:grid; gap:var(--space-6); align-content:center; justify-items:start}
|
||||
.visit__info .label{display:block; margin-bottom:var(--space-2)}
|
||||
.visit__addr{font:600 22px/1.35 'Nunito','Segoe UI',sans-serif; color:var(--ink-700)}
|
||||
.hours{margin:0; display:grid; grid-template-columns:auto auto; gap:var(--space-1) var(--space-6)}
|
||||
.hours dt{color:var(--ink-500)}
|
||||
.hours dd{margin:0; font-weight:700; color:var(--ink-700)}
|
||||
/* Zwei-Klick-Karte. Vor dem Klick eine getönte Fläche mit Decor-Muster — keine Karte
|
||||
in der Karte (Guardrail), nur Inhalt auf Fläche. */
|
||||
.map{
|
||||
position:relative; isolation:isolate; min-height:380px; overflow:hidden;
|
||||
border-radius:var(--radius-xl); box-shadow:var(--shadow-band);
|
||||
background:var(--sky-100) url(decor/cool.svg) 0 0/var(--decor-size,600px) auto repeat;
|
||||
display:grid; place-items:center; padding:var(--space-8) var(--space-6);
|
||||
}
|
||||
.map.is-loaded{padding:0; display:block; background:var(--surface-sunk)}
|
||||
.map iframe{display:block; width:100%; height:100%; min-height:380px; border:0}
|
||||
.map__consent{display:grid; gap:var(--space-3); justify-items:center; text-align:center; max-width:36ch}
|
||||
.map__pin{
|
||||
width:56px; height:56px; border-radius:50%; display:grid; place-items:center;
|
||||
background:var(--accent); color:#fff; box-shadow:var(--shadow-card);
|
||||
}
|
||||
.map__pin svg{width:28px; height:28px}
|
||||
.map__title{font:var(--t-h3); color:var(--ink-700)}
|
||||
.map__note{font:var(--t-small); color:var(--ink-700)}
|
||||
.map__note a{color:var(--ink-700)}
|
||||
|
||||
/* Audio */
|
||||
.song{
|
||||
@@ -440,15 +494,44 @@ a:hover{color:var(--sky-600)}
|
||||
background:var(--sun-400); color:var(--ink-700); /* 8.67 */
|
||||
}
|
||||
.song__row{display:flex; align-items:center; gap:var(--space-4)}
|
||||
/* Seit 2026-09-26 mit echten Liedern. Knopf im Vollton wie die Icon-Chips
|
||||
(weiß auf sky-500 3.86 / Ink auf sun-400 8.67 — Grafik-Schwelle 3.0). */
|
||||
.iconbtn{
|
||||
width:44px; height:44px; flex:none; border-radius:var(--radius-circle, 50%);
|
||||
display:grid; place-items:center; border:1px solid var(--line);
|
||||
background:var(--sun-100); color:var(--ink-300); cursor:not-allowed;
|
||||
width:52px; height:52px; flex:none; border-radius:50%;
|
||||
display:grid; place-items:center; border:0; cursor:pointer;
|
||||
background:var(--chip-bg,var(--accent)); color:var(--chip-fg,#fff);
|
||||
box-shadow:var(--shadow-button);
|
||||
transition:transform var(--dur-lift) var(--ease), box-shadow var(--dur-lift) var(--ease);
|
||||
}
|
||||
.iconbtn svg{width:18px; height:18px}
|
||||
.song__meter{flex:1; display:grid; gap:var(--space-2)}
|
||||
.song__track{height:8px; border-radius:var(--radius-pill); background:var(--surface-sunk)}
|
||||
.song__time, .song__note{font:var(--t-small); color:var(--ink-500)}
|
||||
.iconbtn:hover{transform:translateY(-2px); box-shadow:var(--shadow-card-hover)}
|
||||
.iconbtn:active{transform:scale(.95); box-shadow:var(--shadow-xs)}
|
||||
.iconbtn svg{width:22px; height:22px}
|
||||
.iconbtn .i-pause, .is-playing .iconbtn .i-play{display:none}
|
||||
.is-playing .iconbtn .i-pause{display:block}
|
||||
.song__meter{flex:1; display:grid; gap:var(--space-1)}
|
||||
/* Fortschritt als echter Regler — per Tastatur bedienbar, Füllung über --p aus player.js. */
|
||||
.song__seek{
|
||||
-webkit-appearance:none; appearance:none; width:100%; height:24px; margin:0;
|
||||
background:transparent; cursor:pointer; --p:0%;
|
||||
}
|
||||
.song__seek::-webkit-slider-runnable-track{
|
||||
height:8px; border-radius:var(--radius-pill);
|
||||
background:linear-gradient(to right,var(--accent-line) var(--p),var(--surface-sunk) var(--p));
|
||||
}
|
||||
.song__seek::-moz-range-track{height:8px; border-radius:var(--radius-pill); background:var(--surface-sunk)}
|
||||
.song__seek::-moz-range-progress{height:8px; border-radius:var(--radius-pill); background:var(--accent-line)}
|
||||
.song__seek::-webkit-slider-thumb{
|
||||
-webkit-appearance:none; width:18px; height:18px; margin-top:-5px; border-radius:50%;
|
||||
background:var(--surface-card); border:3px solid var(--ink-700); box-shadow:var(--shadow-xs);
|
||||
}
|
||||
.song__seek::-moz-range-thumb{
|
||||
width:12px; height:12px; border-radius:50%; background:var(--surface-card);
|
||||
border:3px solid var(--ink-700);
|
||||
}
|
||||
.song__seek:focus-visible{box-shadow:none; outline:none}
|
||||
.song__seek:focus-visible::-webkit-slider-thumb{box-shadow:var(--ring-focus)}
|
||||
.song__seek:focus-visible::-moz-range-thumb{box-shadow:var(--ring-focus)}
|
||||
.song__time{font:var(--t-small); color:var(--ink-500); font-variant-numeric:tabular-nums}
|
||||
|
||||
/* Band */
|
||||
.band{
|
||||
@@ -478,6 +561,8 @@ a:hover{color:var(--sky-600)}
|
||||
/* Telefon und E-Mail sind die wichtigsten Links der Seite und waren 23px hoch —
|
||||
einen Pixel unter WCAG 2.5.8. Als volles 44px-Ziel laesst sich die Nummer am
|
||||
Handy zuverlaessig antippen. */
|
||||
.contact .contact__note{font:var(--t-small); color:var(--ink-500)}
|
||||
.contact .contact__note a{min-height:0; display:inline}
|
||||
.contact a{
|
||||
color:var(--accent-text); display:inline-flex; align-items:center;
|
||||
min-height:44px; text-decoration:underline; text-underline-offset:3px;
|
||||
@@ -541,6 +626,32 @@ a:hover{color:var(--sky-600)}
|
||||
font:400 15px/1.4 'Nunito','Segoe UI',sans-serif; color:var(--ink-700); text-decoration:none;
|
||||
}
|
||||
.ftr__col a:hover{color:var(--sky-600); text-decoration:underline}
|
||||
/* Social-Links im Footer. Ausgehende Verweise, sonst nichts: kein Page-Plugin,
|
||||
kein Feed, kein Follow-Button. Solche Widgets laden fremde Skripte beim
|
||||
Seitenaufruf und wuerden die Bannerfreiheit kippen, auf der die
|
||||
Datenschutzerklaerung steht — dieselbe Ueberlegung wie bei der Karte.
|
||||
|
||||
Icon PLUS Text, nicht Icon allein: eine reine Icon-Reihe zwingt zum Raten und
|
||||
braucht Extra-Beschriftung. Mit Text greift .ftr__col a unveraendert weiter,
|
||||
inklusive der 30px/44px-Zielgroessen.
|
||||
Die Icons erben currentColor (--ink-700) statt Markenfarben zu tragen — im
|
||||
Fliesstext traegt Farbe keine Information, siehe DESIGN.md Abschnitt Farbe. */
|
||||
.ftr__social{gap:9px}
|
||||
.ftr__social svg{width:18px; height:18px; flex:none}
|
||||
|
||||
/* Platzhalter, solange eine Profiladresse fehlt. Unuebersehbar, damit nichts
|
||||
davon versehentlich live geht. */
|
||||
.ftr__social[href^="URL-"]{
|
||||
color:var(--coral-500); border:2px dashed var(--coral-400);
|
||||
border-radius:var(--radius-xs); padding-inline:6px; font-weight:700;
|
||||
}
|
||||
|
||||
/* Nur fuer Screenreader. */
|
||||
.vh{
|
||||
position:absolute; width:1px; height:1px; padding:0; margin:-1px;
|
||||
overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0;
|
||||
}
|
||||
|
||||
.ftr__legal{
|
||||
margin-top:var(--space-10); padding-top:var(--space-6); border-top:1px solid rgba(35,52,74,.12);
|
||||
font:var(--t-small); color:var(--ink-700); max-width:80ch;
|
||||
@@ -563,46 +674,45 @@ a:hover{color:var(--sky-600)}
|
||||
/* ============================================================ DECOR
|
||||
Referenz: Handoff-DS-Komponente "Decor — flat decorative layer" (variant, opacity).
|
||||
Im Handoff gelistet, aber nie gebaut. Kundenwunsch 2026-09-24: die Flächen wirkten leer.
|
||||
Flache Spielzeug-Silhouetten (assets/decor-toys.svg) als CSS-Maske, damit die Farbe pro
|
||||
Fläche aus dem CSS kommt: immer derselbe Farbton, eine Stufe dunkler — Schatten, kein
|
||||
zweites Motiv. Text darüber bleibt lesbar, gemessen gegen die DUNKLERE Musterfarbe:
|
||||
ink-700 ≥ 8.4 auf allen hellen Tönen, weiß auf #2878BD = 4.62. */
|
||||
Flache Spielzeug-Silhouetten, je Fläche derselbe Farbton eine Stufe dunkler — Schatten,
|
||||
kein zweites Motiv. Text darüber gemessen gegen die DUNKLERE Musterfarbe:
|
||||
ink-700 ≥ 7.41 auf allen hellen Tönen, weiß auf #2878BD = 4.65.
|
||||
|
||||
Technik: vorgefärbte SVG-Kacheln (assets/decor/*.svg, erzeugt aus source.svg) als
|
||||
normales Hintergrundbild. Die erste Fassung lief über eine CSS-Maske und war in
|
||||
Safari (Mac) unsichtbar — Hintergrundbilder laufen überall.
|
||||
Kachelgröße 600px (vorher 420): auf Kundenwunsch größere Spielzeuge, gleich kräftig. */
|
||||
.field--warm, .field--cool, .field--rose, .field--solid-sky, .field--solid-sun,
|
||||
.band, .ftr{position:relative; isolation:isolate}
|
||||
.field--warm::before, .field--cool::before, .field--rose::before,
|
||||
.field--solid-sky::before, .field--solid-sun::before, .band::before, .ftr::before,
|
||||
.hero::after{
|
||||
content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
|
||||
border-radius:inherit; background:var(--decor);
|
||||
-webkit-mask:url(decor-toys.svg) 0 0/var(--decor-size,420px) repeat;
|
||||
mask:url(decor-toys.svg) 0 0/var(--decor-size,420px) repeat;
|
||||
border-radius:inherit; background-repeat:repeat;
|
||||
background-size:var(--decor-size,600px) auto; background-position:0 0;
|
||||
}
|
||||
.field--warm, .band, .ftr{--decor:#EDC356}
|
||||
.field--cool, .band--cool{--decor:#A9CFEE}
|
||||
.field--rose{--decor:#F9BFB0}
|
||||
.field--solid-sky{--decor:#2878BD}
|
||||
.field--solid-sun{--decor:#E8B124}
|
||||
/* Kachelmuster versetzt, damit nicht jede Fläche mit demselben Teddy oben links beginnt. */
|
||||
.field--solid-sky::before, .field--solid-sun::before{-webkit-mask-position:140px 90px; mask-position:140px 90px}
|
||||
.field--warm::before, .band::before, .ftr::before{background-image:url(decor/warm.svg)}
|
||||
.field--cool::before, .band--cool::before{background-image:url(decor/cool.svg)}
|
||||
.field--rose::before{background-image:url(decor/rose.svg)}
|
||||
.field--solid-sky::before{background-image:url(decor/sky.svg); background-position:180px 120px}
|
||||
.field--solid-sun::before{background-image:url(decor/sun.svg); background-position:180px 120px}
|
||||
|
||||
/* Hero: über Foto und Verlauf, unter dem Text. Auf dem Desktop nur über der Farbfläche —
|
||||
eine zweite Maske blendet das Muster zur Fotokante hin aus. */
|
||||
.hero--shop{--decor:#B5D8F3}
|
||||
.hero--verein{--decor:#F1CC66}
|
||||
/* Hero: über Foto und Verlauf, unter dem Text. */
|
||||
.hero--shop::after{background-image:url(decor/hero-shop.svg)}
|
||||
.hero--verein::after{background-image:url(decor/hero-verein.svg)}
|
||||
.hero::after{z-index:0}
|
||||
.hero__in, .hero__mark{z-index:1}
|
||||
/* Desktop: nur über der Farbfläche, zur Fotokante hin ausgeblendet. Breite statt
|
||||
SVG-Maske; der Verlauf ist eine reine Gradient-Maske, die Safari seit Jahren kann. */
|
||||
@media (min-width:820px){
|
||||
.hero::after{
|
||||
-webkit-mask:url(decor-toys.svg) 0 0/420px repeat,
|
||||
linear-gradient(98deg,#000 calc(var(--scrim-edge) - 60px),transparent var(--scrim-edge));
|
||||
-webkit-mask-composite:source-in;
|
||||
mask:url(decor-toys.svg) 0 0/420px repeat,
|
||||
linear-gradient(98deg,#000 calc(var(--scrim-edge) - 60px),transparent var(--scrim-edge));
|
||||
mask-composite:intersect;
|
||||
right:auto; width:var(--scrim-edge);
|
||||
-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 70px),transparent);
|
||||
mask-image:linear-gradient(to right,#000 calc(100% - 70px),transparent);
|
||||
}
|
||||
}
|
||||
@media (max-width:819.98px){ .hero__media{z-index:1} }
|
||||
@media (max-width:639.98px){ :root{--decor-size:320px} }
|
||||
@media (max-width:639.98px){ :root{--decor-size:440px} }
|
||||
|
||||
/* ============================================================ HANDY-RHYTHMUS
|
||||
Kundenrückmeldung 2026-09-24: Einstieg zu schwach, zu lang, Headline zu klein.
|
||||
@@ -625,7 +735,6 @@ a:hover{color:var(--sky-600)}
|
||||
.hl{font-size:min(48px, calc((100vw - 2 * var(--page-pad-x)) / 7.4))}
|
||||
/* "zusammenhalten!" ist breiter: ≈ 8.0 × Schriftgröße inkl. Kontur. */
|
||||
.hero--verein .hl{font-size:min(48px, calc((100vw - 2 * var(--page-pad-x)) / 8.1))}
|
||||
.hero .hl span{-webkit-text-stroke-width:.075em}
|
||||
|
||||
.section{padding-block:var(--space-10)}
|
||||
.section--tight{padding-block:var(--space-8)}
|
||||
@@ -633,6 +742,8 @@ a:hover{color:var(--sky-600)}
|
||||
.sh{margin-bottom:var(--space-4)}
|
||||
.story{gap:var(--space-5)}
|
||||
.story__img{aspect-ratio:3/2}
|
||||
.story__copy p{font-size:18px}
|
||||
.hero .hl span, .portrait__name{-webkit-text-stroke-width:.075em}
|
||||
.portrait{max-width:260px; gap:var(--space-3)}
|
||||
.tiles{gap:var(--space-3)}
|
||||
.tile{padding:var(--space-5)}
|
||||
@@ -656,3 +767,50 @@ a:hover{color:var(--sky-600)}
|
||||
.nav a:focus-visible, .hdr__brand:focus-visible{border-radius:var(--radius-pill)}
|
||||
.iconbtn:focus-visible{border-radius:50%}
|
||||
.contact a:focus-visible, .ftr__col a:focus-visible{border-radius:var(--radius-xs)}
|
||||
|
||||
/* ============================================================ TOUCH-ZIELE MOBIL
|
||||
Muss ganz am Ende stehen. Die Regel im Mobile-Block weiter oben (Zeile ~245) setzt
|
||||
.ftr__col a auf min-height:44px, wird aber von der Basisregel im FOOTER-Abschnitt
|
||||
mit min-height:30px ueberschrieben — gleiche Spezifitaet, spaetere Regel gewinnt.
|
||||
Die dokumentierte 44px-Korrektur war dadurch seit laengerem wirkungslos; gemessen
|
||||
waren es auf dem Handy 30px. Hier greift sie wieder.
|
||||
Betrifft alle Fusszeilen-Links, nicht nur die Social-Links. */
|
||||
@media (max-width:639.98px){
|
||||
.ftr__col a, .ftr__col span{min-height:44px; padding-block:2px}
|
||||
}
|
||||
|
||||
/* ============================================================ NEUIGKEITEN (News-Pinnwand)
|
||||
Die Zettel rendert news.js (WEBklar-Portal, Funktion "News") in Kork mit Holzrahmen #A8733F,
|
||||
Schriften der Seite ueber die --wkn-Variablen. .news-board ist nur der statische Leerzustand im
|
||||
selben Look; news.js ersetzt ihn, sobald ein Beitrag haengt. */
|
||||
.news-lead{max-width:52ch; margin:calc(var(--space-2) * -1) 0 var(--space-6) 58px; color:var(--ink-500)}
|
||||
.news-pinnwand{
|
||||
--wkn-font-display:'Fredoka', 'Trebuchet MS', sans-serif;
|
||||
--wkn-font-body:'Nunito', 'Segoe UI', sans-serif;
|
||||
}
|
||||
.news-board{
|
||||
position:relative; border-radius:var(--radius-xl); border:12px solid #A8733F;
|
||||
padding:var(--space-12) var(--space-6); display:grid; place-items:center;
|
||||
background-color:#C08A52;
|
||||
background-image:
|
||||
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='a'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.1' numOctaves='2' seed='3'/%3E%3CfeColorMatrix values='0 0 0 0 .29 0 0 0 0 .16 0 0 0 0 .06 0 0 0 -2.4 1.25'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23a)'/%3E%3C/svg%3E"),
|
||||
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='b'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' seed='11'/%3E%3CfeColorMatrix values='0 0 0 0 .95 0 0 0 0 .8 0 0 0 0 .58 0 0 0 2.6 -1.55'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23b)'/%3E%3C/svg%3E");
|
||||
box-shadow:inset 0 6px 14px rgba(60,32,10,.35), var(--shadow-band);
|
||||
}
|
||||
.news-empty{
|
||||
position:relative; max-width:34ch; text-align:center; background:#fff; border-radius:8px;
|
||||
padding:var(--space-8) var(--space-6) var(--space-6); transform:rotate(-1.5deg);
|
||||
box-shadow:0 10px 22px rgba(35,52,74,.18);
|
||||
}
|
||||
.news-empty::before{
|
||||
content:""; position:absolute; top:-12px; left:50%; width:84px; height:24px;
|
||||
transform:translateX(-50%) rotate(3deg); background:rgba(255,255,255,.7);
|
||||
box-shadow:0 1px 2px rgba(35,52,74,.12);
|
||||
}
|
||||
.news-empty__pin svg{width:34px; height:34px; color:var(--sun-700)}
|
||||
.news-empty h3{font:var(--t-h2); color:var(--ink-700); margin:var(--space-2) 0}
|
||||
.news-empty p{color:var(--ink-500); margin:0}
|
||||
@media (max-width:700px){
|
||||
.news-lead{margin-left:0}
|
||||
.news-board{border-width:8px; padding:var(--space-10) var(--space-4); border-radius:var(--radius-l)}
|
||||
}
|
||||
+74
-22
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Datenschutzerklärung — Emma's Schatzkiste</title>
|
||||
<title>Datenschutzerklärung | Emma's Schatzkiste</title>
|
||||
<meta name="description" content="Datenschutzerklärung: keine Cookies, kein Tracking, lokal gehostete Schriften. Emma's Schatzkiste, Rottenburg a.d. Laaber." />
|
||||
<meta name="robots" content="noindex, follow" />
|
||||
<meta name="theme-color" content="#FDF4DC" />
|
||||
@@ -11,7 +11,7 @@
|
||||
<link rel="preload" href="assets/fonts/nunito-400-latin.woff2" as="font" type="font/woff2" crossorigin />
|
||||
<link rel="preload" href="assets/fonts/fredoka-500-latin.woff2" as="font" type="font/woff2" crossorigin />
|
||||
<link rel="stylesheet" href="assets/fonts.css?v=1f6be3c3" />
|
||||
<link rel="stylesheet" href="assets/site.css?v=b9a3adde" />
|
||||
<link rel="stylesheet" href="assets/site.css?v=ca3d584c" />
|
||||
</head>
|
||||
<body class="page-shop">
|
||||
<a class="skip" href="#inhalt">Zum Inhalt springen</a>
|
||||
@@ -19,11 +19,12 @@
|
||||
<header class="hdr">
|
||||
<div class="wrap hdr__in">
|
||||
<a class="hdr__brand" href="index.html">
|
||||
<img src="assets/logo-shop.png" alt="" />
|
||||
<span class="hdr__marks"><img src="assets/logo-shop.png" alt="" /><img src="assets/logo-verein.png" alt="" /></span>
|
||||
Emma's Schatzkiste
|
||||
</a>
|
||||
<nav class="nav" aria-label="Hauptnavigation">
|
||||
<a href="index.html">Start</a>
|
||||
<a class="nav__news" href="index.html#neuigkeiten">Neuigkeiten</a>
|
||||
<a href="shop.html">Shop</a>
|
||||
<a href="hilfe-verein.html">Hilfe Verein</a>
|
||||
<a href="hilfe-verein.html#kontakt">Kontakt</a>
|
||||
@@ -37,10 +38,12 @@
|
||||
<h1>Datenschutzerklärung</h1>
|
||||
|
||||
<div class="prose__intro">
|
||||
<strong>Kurz gesagt:</strong> Diese Website setzt keine Cookies, bindet keine
|
||||
Dienste Dritter ein und analysiert nichts. Es gibt kein Kontaktformular. Schriften
|
||||
werden vom eigenen Server geladen, nicht von Google. Deshalb gibt es hier auch kein
|
||||
Einwilligungsbanner — es gibt nichts einzuwilligen.
|
||||
<strong>Kurz gesagt:</strong> Diese Website setzt keine Cookies und analysiert nichts.
|
||||
Es gibt kein Kontaktformular. Schriften werden vom eigenen Server geladen, nicht von
|
||||
Google. Auf der Startseite ist eine Karte von Google Maps eingebunden. Beim Aufruf
|
||||
der Startseite wird dafür eine Verbindung zu Google hergestellt (siehe Abschnitt 4a).
|
||||
Die Neuigkeiten auf der Startseite lädt Ihr Browser vom Server meines Webdienstleisters
|
||||
WEBklar (siehe Abschnitt 4c).
|
||||
</div>
|
||||
|
||||
<div class="prose__warn">
|
||||
@@ -79,9 +82,50 @@
|
||||
daher nicht erforderlich, und ein Einwilligungsbanner gibt es bewusst nicht.</p>
|
||||
|
||||
<h2>4. Keine Analyse, kein Tracking, keine Werbung</h2>
|
||||
<p>Es sind keine Analyse-, Tracking- oder Werbedienste eingebunden — kein Google
|
||||
<p>Es sind keine Analyse-, Tracking- oder Werbedienste eingebunden: kein Google
|
||||
Analytics, kein Matomo, keine Pixel, keine Social-Media-Plugins, keine eingebetteten
|
||||
Videos oder Karten.</p>
|
||||
Videos. Zur Karte siehe den nächsten Abschnitt.</p>
|
||||
|
||||
<h2 id="karte">4a. Google Maps</h2>
|
||||
<p>Auf der Startseite ist eine Karte von Google Maps eingebunden. Anbieter
|
||||
ist die Google Ireland Limited, Gordon House, Barrow Street, Dublin 4, Irland.</p>
|
||||
<p>Die Karte wird beim Aufruf der Startseite automatisch geladen. Dabei baut Ihr Browser
|
||||
eine Verbindung zu Servern von Google auf.
|
||||
Dabei werden mindestens Ihre IP-Adresse, Datum und Uhrzeit sowie Informationen über
|
||||
Ihren Browser an Google übertragen; Google kann dabei Cookies setzen. Eine Übermittlung
|
||||
in die USA ist möglich. Google LLC ist unter dem EU-US Data Privacy Framework
|
||||
zertifiziert (Angemessenheitsbeschluss der EU-Kommission vom 10. Juli 2023).</p>
|
||||
<p>Die Karte dient dazu, meinen Laden leicht auffindbar zu machen. Rechtsgrundlage ist
|
||||
mein berechtigtes Interesse an einer ansprechenden Darstellung meines Angebots und
|
||||
einer einfachen Auffindbarkeit (Art. 6 Abs. 1 lit. f DSGVO). Sie können der Verarbeitung
|
||||
widersprechen oder die Übertragung verhindern, indem Sie in Ihrem Browser
|
||||
Inhalte von Google blockieren. Mehr zur Datenverarbeitung durch Google:
|
||||
<a href="https://policies.google.com/privacy" rel="noopener noreferrer" target="_blank">policies.google.com/privacy</a>.</p>
|
||||
<p>Der Link „Route planen" öffnet Google Maps in einem neuen Fenster. Auch dort gilt
|
||||
erst ab dem Klick die Datenschutzerklärung von Google.</p>
|
||||
|
||||
<h2 id="social">4b. Social Media</h2>
|
||||
<p>Im Fußbereich jeder Seite finden Sie Verweise auf unsere Profile bei Facebook,
|
||||
Instagram und TikTok. Das sind <strong>einfache Links</strong>. Es sind keine
|
||||
Plugins, Feeds, Like- oder Folgen-Schaltflächen dieser Netzwerke eingebunden.</p>
|
||||
<p>Beim Aufruf dieser Website werden deshalb <strong>keine Daten an die Netzwerke
|
||||
übertragen</strong> und keine Cookies der Netzwerke gesetzt. Erst wenn Sie einen der
|
||||
Links anklicken, verlässt Ihr Browser diese Website. Ab dann gelten ausschließlich
|
||||
die Datenschutzbestimmungen des jeweiligen Anbieters, auf dessen Verarbeitung wir
|
||||
keinen Einfluss haben.</p>
|
||||
|
||||
<h2 id="neuigkeiten">4c. Neuigkeiten auf dieser Website</h2>
|
||||
<p>Auf der Startseite zeige ich unter „Neues aus dem Laden“ kurze Beiträge mit Text und
|
||||
Fotos. Beim Aufruf der Seite lädt Ihr Browser diese Beiträge und Bilder von dem Server,
|
||||
den die WEBklar GbR, Am Schwimmbad 10, 67722 Winnweiler, in meinem Auftrag betreibt und
|
||||
der bei der Hetzner Online GmbH in Falkenstein (Deutschland) steht. Dabei werden Ihre
|
||||
IP-Adresse, Datum und Uhrzeit des Aufrufs sowie Angaben zu Ihrem Browser und
|
||||
Betriebssystem übertragen und kurzzeitig in Server-Protokollen gespeichert. Die
|
||||
Pinnwand setzt <strong>keine Cookies</strong> und speichert nichts in Ihrem Browser.</p>
|
||||
<p>Ich brauche diese Daten, um die Beiträge auszuliefern und den Betrieb sicher zu
|
||||
halten. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO. Mein berechtigtes Interesse
|
||||
liegt in der Darstellung aktueller Informationen und im sicheren, funktionsfähigen
|
||||
Betrieb der Website. Die Protokolle werden nach 14 Tagen gelöscht.</p>
|
||||
|
||||
<h2>5. Schriftarten</h2>
|
||||
<p>Die Schriften Fredoka und Nunito werden <strong>lokal vom eigenen Server</strong>
|
||||
@@ -90,11 +134,11 @@
|
||||
übermittelt.</p>
|
||||
|
||||
<h2>6. Kontaktaufnahme</h2>
|
||||
<p>Ein Kontaktformular gibt es nicht. Wenn Sie uns per E-Mail oder Telefon
|
||||
kontaktieren, verarbeiten wir Ihre Angaben ausschließlich zur Bearbeitung Ihrer
|
||||
<p>Ein Kontaktformular gibt es nicht. Wenn Sie mich per E-Mail oder Telefon
|
||||
kontaktieren, verarbeite ich Ihre Angaben ausschließlich zur Bearbeitung Ihrer
|
||||
Anfrage. Rechtsgrundlage ist Art. 6 Abs. 1 lit. b DSGVO, soweit die Anfrage auf einen
|
||||
Vertrag gerichtet ist, sonst Art. 6 Abs. 1 lit. f DSGVO (berechtigtes Interesse an der
|
||||
Beantwortung). Wir löschen die Daten, sobald der Vorgang erledigt ist und keine
|
||||
Beantwortung). Ich lösche die Daten, sobald der Vorgang erledigt ist und keine
|
||||
gesetzlichen Aufbewahrungsfristen entgegenstehen.</p>
|
||||
<p>Hinweis: Die angegebene E-Mail-Adresse wird bei Google (Gmail) geführt. Inhalte
|
||||
unverschlüsselter E-Mails können auf dem Übertragungsweg mitgelesen werden.</p>
|
||||
@@ -104,8 +148,10 @@
|
||||
und dem Server ist damit verschlüsselt.</p>
|
||||
|
||||
<h2>8. Empfänger und Drittlandübermittlung</h2>
|
||||
<p>Über den Hoster hinaus geben wir keine personenbezogenen Daten weiter. Eine
|
||||
Übermittlung in Länder außerhalb der EU beziehungsweise des EWR findet nicht statt.</p>
|
||||
<p>Über den Hoster und meinen Webdienstleister WEBklar (Abschnitt 4c) hinaus gebe ich
|
||||
keine personenbezogenen Daten weiter. Eine
|
||||
Übermittlung in Länder außerhalb der EU beziehungsweise des EWR findet durch mich nicht
|
||||
statt. Ausnahme ist die Karte von Google Maps auf der Startseite (Abschnitt 4a).</p>
|
||||
|
||||
<h2>9. Ihre Rechte</h2>
|
||||
<ul>
|
||||
@@ -125,10 +171,7 @@
|
||||
Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.</p>
|
||||
|
||||
<h2>11. Stand</h2>
|
||||
<p>Diese Erklärung beschreibt den Stand vom 21. September 2026. Sie muss angepasst
|
||||
werden, sobald sich an der Website etwas ändert — etwa wenn ein Kontaktformular, eine
|
||||
Karte, ein Newsletter, Audiodateien von einem fremden Dienst oder ein Online-Shop
|
||||
dazukommen.</p>
|
||||
<p>Diese Erklärung beschreibt den Stand vom 30. September 2026.</p>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
@@ -139,8 +182,9 @@
|
||||
<div class="ftr__col">
|
||||
<h3>Laden</h3>
|
||||
<ul>
|
||||
<li><a href="index.html">Unser Laden</a></li>
|
||||
<li><span>Öffnungszeiten folgen</span></li>
|
||||
<li><a href="index.html">Mein Laden</a></li>
|
||||
<li><a href="index.html#anfahrt">Hollerstraße 2, 84056 Rottenburg</a></li>
|
||||
<li><span>Mo–Fr 9:00–13:00 Uhr</span></li>
|
||||
<li><a href="tel:015751479212">Ware abgeben</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -155,14 +199,22 @@
|
||||
<div class="ftr__col">
|
||||
<h3>Über</h3>
|
||||
<ul>
|
||||
<li><a href="index.html#ueber-uns">Über uns</a></li>
|
||||
<li><a href="index.html#ueber-mich">Über mich</a></li>
|
||||
<li><a href="hilfe-verein.html#kontakt">Kontakt</a></li>
|
||||
<li><a href="impressum.html">Impressum</a></li>
|
||||
<li><a href="datenschutz.html">Datenschutz</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="ftr__col">
|
||||
<h3>Folgen</h3>
|
||||
<ul>
|
||||
<li><a class="ftr__social" href="https://www.facebook.com/people/EmMas-Schatzkiste-Baby-und-Kinder-Secondhand-Laden/61594794906587/" target="_blank" rel="noopener noreferrer"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/></svg>Facebook<span class="vh"> (öffnet in neuem Fenster)</span></a></li>
|
||||
<li><a class="ftr__social" href="https://www.instagram.com/emmas_schatzkiste/" target="_blank" rel="noopener noreferrer"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect width="20" height="20" x="2" y="2" rx="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" x2="17.51" y1="6.5" y2="6.5"/></svg>Instagram<span class="vh"> (öffnet in neuem Fenster)</span></a></li>
|
||||
<li><a class="ftr__social" href="https://www.tiktok.com/@emmasschatzkiste" target="_blank" rel="noopener noreferrer"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M9 12a4 4 0 1 0 4 4V4a5 5 0 0 0 5 5"/></svg>TikTok<span class="vh"> (öffnet in neuem Fenster)</span></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<p class="ftr__legal">Kleinunternehmerregelung nach § 19 UStG: Als Kleinunternehmer berechnen wir keine Umsatzsteuer und weisen sie daher auch nicht aus.</p>
|
||||
</div>
|
||||
<p class="ftr__legal">Kleinunternehmerregelung nach § 19 UStG: Als Kleinunternehmer berechne ich keine Umsatzsteuer und weise sie daher auch nicht aus.</p>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
|
||||
+40
-28
@@ -3,14 +3,14 @@
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Hilfe Verein — Hilfe. Herz. Hoffnung. | Emma's Schatzkiste</title>
|
||||
<meta name="description" content="Soziale Hilfe vor der Haustür in Rottenburg a.d. Laaber. Der Hilfe Verein ist im Aufbau: Geldspenden, ehrenamtlich mithelfen, weitersagen — jede Hand zählt." />
|
||||
<title>Hilfe Verein: Hilfe. Herz. Hoffnung. | Emma's Schatzkiste</title>
|
||||
<meta name="description" content="Soziale Hilfe vor der Haustür in Rottenburg a.d. Laaber. Der Hilfe Verein ist im Aufbau: Geldspenden, ehrenamtlich mithelfen, weitersagen. Jede Hand zählt." />
|
||||
<meta name="theme-color" content="#FDF4DC" />
|
||||
<link rel="icon" href="assets/logo-verein.png" />
|
||||
<link rel="preload" href="assets/fonts/nunito-400-latin.woff2" as="font" type="font/woff2" crossorigin />
|
||||
<link rel="preload" href="assets/fonts/fredoka-500-latin.woff2" as="font" type="font/woff2" crossorigin />
|
||||
<link rel="stylesheet" href="assets/fonts.css?v=1f6be3c3" />
|
||||
<link rel="stylesheet" href="assets/site.css?v=b9a3adde" />
|
||||
<link rel="stylesheet" href="assets/site.css?v=ca3d584c" />
|
||||
</head>
|
||||
<body class="page-verein">
|
||||
<a class="skip" href="#inhalt">Zum Inhalt springen</a>
|
||||
@@ -18,11 +18,12 @@
|
||||
<header class="hdr">
|
||||
<div class="wrap hdr__in">
|
||||
<a class="hdr__brand" href="index.html">
|
||||
<img src="assets/logo-shop.png" alt="" />
|
||||
<span class="hdr__marks"><img src="assets/logo-shop.png" alt="" /><img src="assets/logo-verein.png" alt="" /></span>
|
||||
Emma's Schatzkiste
|
||||
</a>
|
||||
<nav class="nav" aria-label="Hauptnavigation">
|
||||
<a href="index.html">Start</a>
|
||||
<a class="nav__news" href="index.html#neuigkeiten">Neuigkeiten</a>
|
||||
<a href="shop.html">Shop</a>
|
||||
<a href="hilfe-verein.html" aria-current="page">Hilfe Verein</a>
|
||||
<a href="#kontakt">Kontakt</a>
|
||||
@@ -43,7 +44,7 @@
|
||||
<span class="c-coral">teilen,</span>
|
||||
<span class="c-sky">zusammenhalten!</span>
|
||||
</h1>
|
||||
<p class="hero__sub">Soziale Hilfe vor der Haustür. Der Verein ist gerade im Aufbau — und jede Hand zählt.</p>
|
||||
<p class="hero__sub">Soziale Hilfe vor der Haustür. Der Verein ist gerade im Aufbau, und jede Hand zählt.</p>
|
||||
<div class="hero__actions">
|
||||
<a class="btn btn--primary btn--l" href="#helfen">
|
||||
So kannst du helfen
|
||||
@@ -54,7 +55,7 @@
|
||||
<div class="trusts">
|
||||
<div class="trust">
|
||||
<span class="trust__chip"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M11 14h2a2 2 0 1 0 0-4h-3c-.6 0-1.1.2-1.4.6L3 16"/><path d="m7 20 1.6-1.4c.3-.4.8-.6 1.4-.6h4c1.1 0 2.1-.4 2.8-1.2l4.6-4.4a2 2 0 0 0-2.75-2.91l-4.2 3.9"/><path d="m2 15 6 6"/><path d="M19.5 8.5c.7-.7 1.5-1.6 1.5-2.7A2.73 2.73 0 0 0 16 4a2.78 2.78 0 0 0-5 1.8c0 1.2.8 2 1.5 2.8L16 12Z"/></svg></span>
|
||||
<span><b>Im Aufbau</b><span>wir fangen gerade an</span></span>
|
||||
<span><b>Im Aufbau</b><span>ich fange gerade an</span></span>
|
||||
</div>
|
||||
<div class="trust">
|
||||
<span class="trust__chip"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"/><circle cx="12" cy="10" r="3"/></svg></span>
|
||||
@@ -69,23 +70,23 @@
|
||||
<section class="wrap section">
|
||||
<div class="sh">
|
||||
<span class="sh__chip"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M9 18V5l12-2v13"/><circle cx="6" cy="18" r="3"/><circle cx="18" cy="16" r="3"/></svg></span>
|
||||
<h2>Unser Lied</h2>
|
||||
<h2>Mein Lied</h2>
|
||||
</div>
|
||||
<div class="song">
|
||||
<div class="song" data-song>
|
||||
<audio src="assets/audio/lied-verein.mp3" preload="metadata"></audio>
|
||||
<div class="song__top">
|
||||
<h3>Lied vom Hilfe Verein</h3>
|
||||
<span class="badge">Audio folgt</span>
|
||||
</div>
|
||||
<div class="song__row">
|
||||
<button class="iconbtn" type="button" disabled aria-label="Abspielen — Audio folgt">
|
||||
<svg viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><polygon points="6 3 20 12 6 21 6 3"/></svg>
|
||||
<button class="iconbtn" type="button" data-song-toggle aria-label="Lied vom Hilfe Verein abspielen">
|
||||
<svg class="i-play" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><polygon points="7 4 20 12 7 20 7 4"/></svg>
|
||||
<svg class="i-pause" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><rect x="6" y="4" width="4" height="16" rx="1"/><rect x="14" y="4" width="4" height="16" rx="1"/></svg>
|
||||
</button>
|
||||
<div class="song__meter">
|
||||
<div class="song__track"></div>
|
||||
<span class="song__time">0:00</span>
|
||||
<input class="song__seek" type="range" min="0" max="100" step="0.1" value="0" aria-label="Position im Lied" data-song-seek />
|
||||
<span class="song__time"><span data-song-cur>0:00</span> / <span data-song-dur>3:21</span></span>
|
||||
</div>
|
||||
</div>
|
||||
<p class="song__note">Sobald die Datei da ist, spielt der Player sie hier ab.</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@@ -93,23 +94,23 @@
|
||||
<div class="wrap">
|
||||
<div class="sh">
|
||||
<span class="sh__chip"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M11 14h2a2 2 0 1 0 0-4h-3c-.6 0-1.1.2-1.4.6L3 16"/><path d="m7 20 1.6-1.4c.3-.4.8-.6 1.4-.6h4c1.1 0 2.1-.4 2.8-1.2l4.6-4.4a2 2 0 0 0-2.75-2.91l-4.2 3.9"/><path d="m2 15 6 6"/><path d="M19.5 8.5c.7-.7 1.5-1.6 1.5-2.7A2.73 2.73 0 0 0 16 4a2.78 2.78 0 0 0-5 1.8c0 1.2.8 2 1.5 2.8L16 12Z"/></svg></span>
|
||||
<h2>Wir brauchen Hilfe</h2>
|
||||
<h2>Ich brauche Hilfe</h2>
|
||||
</div>
|
||||
<p class="lede" style="margin-bottom:var(--space-8)">Ein Verein im Aufbau braucht beides: Mittel, um wirklich helfen zu können, und Menschen, die mit anpacken. Finanziell und menschlich — in jeder Form.</p>
|
||||
<p class="lede" style="margin-bottom:var(--space-8)">Ein Verein im Aufbau braucht beides: Mittel, um wirklich helfen zu können, und Menschen, die mit anpacken. Finanziell und menschlich, in jeder Form.</p>
|
||||
<div class="tiles">
|
||||
<div class="tile tile--rose">
|
||||
<h3>Geldspenden</h3>
|
||||
<p>Jeder Betrag hilft — für Ware, Miete und Familien, die gerade nichts übrig haben.</p>
|
||||
<p>Jeder Betrag hilft: für Ware, Miete und Familien, die gerade nichts übrig haben.</p>
|
||||
<a class="btn btn--primary" href="mailto:emmas.schatzkiste.hilft@gmail.com?subject=Spende%20Hilfe%20Verein">Spenden</a>
|
||||
</div>
|
||||
<div class="tile tile--cool">
|
||||
<h3>Ehrenamtlich mithelfen</h3>
|
||||
<p>Sortieren, verkaufen, aufbauen, mitdenken — regelmäßig oder ab und zu.</p>
|
||||
<p>Sortieren, verkaufen, aufbauen, mitdenken. Regelmäßig oder ab und zu.</p>
|
||||
<a class="btn btn--secondary" href="tel:015751479212">Anrufen</a>
|
||||
</div>
|
||||
<div class="tile tile--warm">
|
||||
<h3>Weitersagen</h3>
|
||||
<p>Reichweite kostet nichts: erzähl von uns und bring Familien vorbei.</p>
|
||||
<p>Reichweite kostet nichts: erzähl von mir und bring Familien vorbei.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -120,23 +121,24 @@
|
||||
<div class="band__copy">
|
||||
<span class="label">Der Second-Hand-Laden</span>
|
||||
<h2>Wo alles angefangen hat.</h2>
|
||||
<p>Im September haben wir den Second-Hand-Laden übernommen — eine Herzensangelegenheit. Kinder und Jugendliche bekommen bei uns Spielsachen, die ein zweites Leben verdient haben.</p>
|
||||
<p>Die Sachen sind preiswert, sehr gut erhalten und von guter Qualität. Und wir suchen mit, bis du findest, was du brauchst.</p>
|
||||
<p>Im September 2025 habe ich den Second-Hand-Laden übernommen. Eine Herzensangelegenheit. Kinder und Jugendliche bekommen bei mir Spielsachen, die ein zweites Leben verdient haben.</p>
|
||||
<p>Die Sachen sind preiswert, sehr gut erhalten und von guter Qualität. Und ich suche mit, bis du findest, was du brauchst.</p>
|
||||
<a class="btn btn--secondary btn--l" href="index.html">Mehr über den Laden</a>
|
||||
</div>
|
||||
<img src="assets/logo-shop.png" alt="Emma's Schatzkiste — Baby & Kind Second Hand" style="max-width:360px" />
|
||||
<img src="assets/logo-shop.png" alt="Emma's Schatzkiste, Baby & Kind Second Hand" style="max-width:360px" />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="wrap section" id="kontakt">
|
||||
<div class="sh">
|
||||
<span class="sh__chip"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect width="20" height="16" x="2" y="4" rx="2"/><path d="m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7"/></svg></span>
|
||||
<h2>Schreib uns</h2>
|
||||
<h2>Schreib mir</h2>
|
||||
</div>
|
||||
<div class="contacts">
|
||||
<div class="contact">
|
||||
<span class="label">Adresse</span>
|
||||
<p>84056 Rottenburg a.d. Laaber</p>
|
||||
<p>Hollerstraße 2<br />84056 Rottenburg a.d. Laaber</p>
|
||||
<p class="contact__note">Mo–Fr 9:00–13:00 Uhr · <a href="index.html#anfahrt">Karte & Anfahrt</a></p>
|
||||
</div>
|
||||
<div class="contact">
|
||||
<span class="label">Telefon</span>
|
||||
@@ -157,8 +159,9 @@
|
||||
<div class="ftr__col">
|
||||
<h3>Laden</h3>
|
||||
<ul>
|
||||
<li><a href="index.html">Unser Laden</a></li>
|
||||
<li><span>Öffnungszeiten folgen</span></li>
|
||||
<li><a href="index.html">Mein Laden</a></li>
|
||||
<li><a href="index.html#anfahrt">Hollerstraße 2, 84056 Rottenburg</a></li>
|
||||
<li><span>Mo–Fr 9:00–13:00 Uhr</span></li>
|
||||
<li><a href="tel:015751479212">Ware abgeben</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -173,16 +176,25 @@
|
||||
<div class="ftr__col">
|
||||
<h3>Über</h3>
|
||||
<ul>
|
||||
<li><a href="index.html#ueber-uns">Über uns</a></li>
|
||||
<li><a href="index.html#ueber-mich">Über mich</a></li>
|
||||
<li><a href="#kontakt">Kontakt</a></li>
|
||||
<li><a href="impressum.html">Impressum</a></li>
|
||||
<li><a href="datenschutz.html">Datenschutz</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="ftr__col">
|
||||
<h3>Folgen</h3>
|
||||
<ul>
|
||||
<li><a class="ftr__social" href="https://www.facebook.com/people/EmMas-Schatzkiste-Baby-und-Kinder-Secondhand-Laden/61594794906587/" target="_blank" rel="noopener noreferrer"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/></svg>Facebook<span class="vh"> (öffnet in neuem Fenster)</span></a></li>
|
||||
<li><a class="ftr__social" href="https://www.instagram.com/emmas_schatzkiste/" target="_blank" rel="noopener noreferrer"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect width="20" height="20" x="2" y="2" rx="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" x2="17.51" y1="6.5" y2="6.5"/></svg>Instagram<span class="vh"> (öffnet in neuem Fenster)</span></a></li>
|
||||
<li><a class="ftr__social" href="https://www.tiktok.com/@emmasschatzkiste" target="_blank" rel="noopener noreferrer"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M9 12a4 4 0 1 0 4 4V4a5 5 0 0 0 5 5"/></svg>TikTok<span class="vh"> (öffnet in neuem Fenster)</span></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<p class="ftr__legal">Kleinunternehmerregelung nach § 19 UStG: Als Kleinunternehmer berechnen wir keine Umsatzsteuer und weisen sie daher auch nicht aus.</p>
|
||||
</div>
|
||||
<p class="ftr__legal">Kleinunternehmerregelung nach § 19 UStG: Als Kleinunternehmer berechne ich keine Umsatzsteuer und weise sie daher auch nicht aus.</p>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script src="assets/player.js" defer></script>
|
||||
</body>
|
||||
</html>
|
||||
+31
-37
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Impressum — Emma's Schatzkiste</title>
|
||||
<title>Impressum | Emma's Schatzkiste</title>
|
||||
<meta name="description" content="Impressum und Anbieterkennzeichnung nach § 5 DDG für Emma's Schatzkiste in Rottenburg a.d. Laaber." />
|
||||
<meta name="robots" content="noindex, follow" />
|
||||
<meta name="theme-color" content="#FDF4DC" />
|
||||
@@ -11,7 +11,7 @@
|
||||
<link rel="preload" href="assets/fonts/nunito-400-latin.woff2" as="font" type="font/woff2" crossorigin />
|
||||
<link rel="preload" href="assets/fonts/fredoka-500-latin.woff2" as="font" type="font/woff2" crossorigin />
|
||||
<link rel="stylesheet" href="assets/fonts.css?v=1f6be3c3" />
|
||||
<link rel="stylesheet" href="assets/site.css?v=b9a3adde" />
|
||||
<link rel="stylesheet" href="assets/site.css?v=ca3d584c" />
|
||||
</head>
|
||||
<body class="page-shop">
|
||||
<a class="skip" href="#inhalt">Zum Inhalt springen</a>
|
||||
@@ -19,11 +19,12 @@
|
||||
<header class="hdr">
|
||||
<div class="wrap hdr__in">
|
||||
<a class="hdr__brand" href="index.html">
|
||||
<img src="assets/logo-shop.png" alt="" />
|
||||
<span class="hdr__marks"><img src="assets/logo-shop.png" alt="" /><img src="assets/logo-verein.png" alt="" /></span>
|
||||
Emma's Schatzkiste
|
||||
</a>
|
||||
<nav class="nav" aria-label="Hauptnavigation">
|
||||
<a href="index.html">Start</a>
|
||||
<a class="nav__news" href="index.html#neuigkeiten">Neuigkeiten</a>
|
||||
<a href="shop.html">Shop</a>
|
||||
<a href="hilfe-verein.html">Hilfe Verein</a>
|
||||
<a href="hilfe-verein.html#kontakt">Kontakt</a>
|
||||
@@ -36,12 +37,6 @@
|
||||
<div class="prose">
|
||||
<h1>Impressum</h1>
|
||||
|
||||
<div class="prose__warn">
|
||||
<strong>Fast vollständig.</strong> Name und Anschrift sind aus dem Impressum der
|
||||
bisherigen Seite übernommen. Offen ist nur noch das rot umrandete Feld unten.
|
||||
Dieser Entwurf ersetzt keine Rechtsberatung.
|
||||
</div>
|
||||
|
||||
<h2>Angaben gemäß § 5 DDG</h2>
|
||||
<dl>
|
||||
<dt>Anbieter</dt><dd>Martin Lindenau</dd>
|
||||
@@ -49,53 +44,43 @@
|
||||
<dt>Telefon</dt><dd><a href="tel:015751479212">0157 51479212</a></dd>
|
||||
<dt>E-Mail</dt><dd><a href="mailto:emmas.schatzkiste.hilft@gmail.com">emmas.schatzkiste.hilft@<wbr>gmail.com</a></dd>
|
||||
</dl>
|
||||
<p>Eine ladungsfähige Anschrift ist zwingend — ein Postfach genügt nicht.</p>
|
||||
|
||||
<h2>Umsatzsteuer</h2>
|
||||
<p>Kleinunternehmerregelung nach § 19 UStG: Als Kleinunternehmer berechnen wir keine
|
||||
Umsatzsteuer und weisen sie daher auch nicht aus. Eine Umsatzsteuer-Identifikationsnummer
|
||||
<p>Kleinunternehmerregelung nach § 19 UStG: Als Kleinunternehmer berechne ich keine Umsatzsteuer und weise sie daher auch nicht aus. Eine Umsatzsteuer-Identifikationsnummer
|
||||
nach § 27 a UStG besteht deshalb nicht.</p>
|
||||
|
||||
<h2>Registereintrag</h2>
|
||||
<p><span class="todo">Bitte bestätigen:</span> Kleingewerbe, nicht im Handelsregister
|
||||
eingetragen. Falls doch ein Eintrag besteht, gehören Registergericht und
|
||||
Registernummer hierher.</p>
|
||||
|
||||
<h2>Hilfe Verein</h2>
|
||||
<p>Der „Hilfe Verein" befindet sich im Aufbau und ist
|
||||
<strong>noch nicht als Verein eingetragen</strong>. Er tritt daher nicht als eigene
|
||||
juristische Person auf; verantwortlich ist die oben genannte Person. Sobald die
|
||||
Eintragung erfolgt ist, gehören Name, Rechtsform, Vereinsregister, Registernummer und
|
||||
der Vorstand hierher — und der Verein braucht dann ein eigenes Impressum.</p>
|
||||
juristische Person auf; verantwortlich ist die oben genannte Person. </p>
|
||||
|
||||
<h2>Verbraucherstreitbeilegung</h2>
|
||||
<p>Wir sind nicht bereit und nicht verpflichtet, an Streitbeilegungsverfahren vor einer
|
||||
<p>Ich bin nicht bereit und nicht verpflichtet, an Streitbeilegungsverfahren vor einer
|
||||
Verbraucherschlichtungsstelle teilzunehmen.</p>
|
||||
<p>Ein Hinweis auf die EU-Plattform zur Online-Streitbeilegung entfällt: Sie wurde zum
|
||||
20. Juli 2025 abgeschaltet (Verordnung (EU) 2024/3228). Falls auf der alten Seite noch
|
||||
ein Link dorthin steht, muss er weg — ein toter Pflichthinweis ist selbst abmahnbar.</p>
|
||||
20. Juli 2025 abgeschaltet (Verordnung (EU) 2024/3228).</p>
|
||||
|
||||
<h2>Haftung für Inhalte</h2>
|
||||
<p>Als Diensteanbieter sind wir für eigene Inhalte auf diesen Seiten nach den
|
||||
allgemeinen Gesetzen verantwortlich. Wir sind nicht verpflichtet, übermittelte oder
|
||||
<p>Als Diensteanbieter bin ich für eigene Inhalte auf diesen Seiten nach den
|
||||
allgemeinen Gesetzen verantwortlich. Ich bin nicht verpflichtet, übermittelte oder
|
||||
gespeicherte fremde Informationen zu überwachen oder nach Umständen zu forschen, die
|
||||
auf eine rechtswidrige Tätigkeit hinweisen. Sobald uns eine konkrete Rechtsverletzung
|
||||
bekannt wird, entfernen wir den Inhalt umgehend.</p>
|
||||
auf eine rechtswidrige Tätigkeit hinweisen. Sobald mir eine konkrete Rechtsverletzung
|
||||
bekannt wird, entferne ich den Inhalt umgehend.</p>
|
||||
|
||||
<h2>Haftung für Links</h2>
|
||||
<p>Unser Angebot enthält Links zu externen Websites Dritter, auf deren Inhalte wir
|
||||
keinen Einfluss haben. Für diese fremden Inhalte ist stets der jeweilige Anbieter
|
||||
verantwortlich. Bei Bekanntwerden von Rechtsverletzungen entfernen wir solche Links
|
||||
<p>Mein Angebot enthält Links zu externen Websites Dritter, auf deren Inhalte ich
|
||||
keinen Einfluss habe. Für diese fremden Inhalte ist stets der jeweilige Anbieter
|
||||
verantwortlich. Bei Bekanntwerden von Rechtsverletzungen entferne ich solche Links
|
||||
umgehend.</p>
|
||||
|
||||
<h2>Urheberrecht</h2>
|
||||
<p>Die durch die Betreiber erstellten Inhalte und Werke unterliegen dem deutschen
|
||||
<p>Die durch den Betreiber erstellten Inhalte und Werke unterliegen dem deutschen
|
||||
Urheberrecht. Beiträge Dritter sind als solche gekennzeichnet.</p>
|
||||
|
||||
<h2>Bildnachweis</h2>
|
||||
<p>Fotos von <a href="https://www.pexels.com/" rel="noopener noreferrer" target="_blank">Pexels</a>
|
||||
(Pexels-Lizenz: kommerzielle Nutzung frei, keine Namensnennung erforderlich) —
|
||||
Bild-IDs 10831693, 34148341 und 6591155. Logos: Emma's Schatzkiste.</p>
|
||||
(Pexels-Lizenz: kommerzielle Nutzung frei, keine Namensnennung erforderlich),
|
||||
Bild-IDs 10831693 und 34148341. Ladenfoto, Porträtfoto und Logos: Emma's Schatzkiste.</p>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
@@ -106,8 +91,9 @@
|
||||
<div class="ftr__col">
|
||||
<h3>Laden</h3>
|
||||
<ul>
|
||||
<li><a href="index.html">Unser Laden</a></li>
|
||||
<li><span>Öffnungszeiten folgen</span></li>
|
||||
<li><a href="index.html">Mein Laden</a></li>
|
||||
<li><a href="index.html#anfahrt">Hollerstraße 2, 84056 Rottenburg</a></li>
|
||||
<li><span>Mo–Fr 9:00–13:00 Uhr</span></li>
|
||||
<li><a href="tel:015751479212">Ware abgeben</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -122,14 +108,22 @@
|
||||
<div class="ftr__col">
|
||||
<h3>Über</h3>
|
||||
<ul>
|
||||
<li><a href="index.html#ueber-uns">Über uns</a></li>
|
||||
<li><a href="index.html#ueber-mich">Über mich</a></li>
|
||||
<li><a href="hilfe-verein.html#kontakt">Kontakt</a></li>
|
||||
<li><a href="impressum.html">Impressum</a></li>
|
||||
<li><a href="datenschutz.html">Datenschutz</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="ftr__col">
|
||||
<h3>Folgen</h3>
|
||||
<ul>
|
||||
<li><a class="ftr__social" href="https://www.facebook.com/people/EmMas-Schatzkiste-Baby-und-Kinder-Secondhand-Laden/61594794906587/" target="_blank" rel="noopener noreferrer"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/></svg>Facebook<span class="vh"> (öffnet in neuem Fenster)</span></a></li>
|
||||
<li><a class="ftr__social" href="https://www.instagram.com/emmas_schatzkiste/" target="_blank" rel="noopener noreferrer"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect width="20" height="20" x="2" y="2" rx="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" x2="17.51" y1="6.5" y2="6.5"/></svg>Instagram<span class="vh"> (öffnet in neuem Fenster)</span></a></li>
|
||||
<li><a class="ftr__social" href="https://www.tiktok.com/@emmasschatzkiste" target="_blank" rel="noopener noreferrer"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M9 12a4 4 0 1 0 4 4V4a5 5 0 0 0 5 5"/></svg>TikTok<span class="vh"> (öffnet in neuem Fenster)</span></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<p class="ftr__legal">Kleinunternehmerregelung nach § 19 UStG: Als Kleinunternehmer berechnen wir keine Umsatzsteuer und weisen sie daher auch nicht aus.</p>
|
||||
</div>
|
||||
<p class="ftr__legal">Kleinunternehmerregelung nach § 19 UStG: Als Kleinunternehmer berechne ich keine Umsatzsteuer und weise sie daher auch nicht aus.</p>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
|
||||
+88
-26
@@ -3,14 +3,14 @@
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Emma's Schatzkiste — Baby- und Kindersachen aus zweiter Hand in Rottenburg a.d. Laaber</title>
|
||||
<meta name="description" content="Second-Hand für Baby und Kind in Rottenburg a.d. Laaber: preiswert, sehr gut erhalten, jedes Teil nur einmal da. Dazu unser Hilfe Verein — Hilfe. Herz. Hoffnung." />
|
||||
<title>Emma's Schatzkiste | Baby- und Kindersachen aus zweiter Hand in Rottenburg a.d. Laaber</title>
|
||||
<meta name="description" content="Second-Hand für Baby und Kind in Rottenburg a.d. Laaber: preiswert, sehr gut erhalten, jedes Teil nur einmal da. Dazu mein Hilfe Verein: Hilfe. Herz. Hoffnung." />
|
||||
<meta name="theme-color" content="#FDF4DC" />
|
||||
<link rel="icon" href="assets/logo-shop.png" />
|
||||
<link rel="preload" href="assets/fonts/nunito-400-latin.woff2" as="font" type="font/woff2" crossorigin />
|
||||
<link rel="preload" href="assets/fonts/fredoka-500-latin.woff2" as="font" type="font/woff2" crossorigin />
|
||||
<link rel="stylesheet" href="assets/fonts.css?v=1f6be3c3" />
|
||||
<link rel="stylesheet" href="assets/site.css?v=b9a3adde" />
|
||||
<link rel="stylesheet" href="assets/site.css?v=ca3d584c" />
|
||||
</head>
|
||||
<body class="page-shop">
|
||||
<a class="skip" href="#inhalt">Zum Inhalt springen</a>
|
||||
@@ -18,11 +18,12 @@
|
||||
<header class="hdr">
|
||||
<div class="wrap hdr__in">
|
||||
<a class="hdr__brand" href="index.html">
|
||||
<img src="assets/logo-shop.png" alt="" />
|
||||
<span class="hdr__marks"><img src="assets/logo-shop.png" alt="" /><img src="assets/logo-verein.png" alt="" /></span>
|
||||
Emma's Schatzkiste
|
||||
</a>
|
||||
<nav class="nav" aria-label="Hauptnavigation">
|
||||
<a href="index.html" aria-current="page">Start</a>
|
||||
<a class="nav__news" href="index.html#neuigkeiten">Neuigkeiten</a>
|
||||
<a href="shop.html">Shop</a>
|
||||
<a href="hilfe-verein.html">Hilfe Verein</a>
|
||||
<a href="hilfe-verein.html#kontakt">Kontakt</a>
|
||||
@@ -37,13 +38,13 @@
|
||||
<span class="hero__scrim" aria-hidden="true"></span>
|
||||
<div class="wrap hero__in">
|
||||
<div class="hero__col">
|
||||
<img class="hero__logo" src="assets/logo-shop.png" alt="Emma's Schatzkiste — Baby & Kind Second Hand" />
|
||||
<img class="hero__logo" src="assets/logo-shop.png" alt="Emma's Schatzkiste, Baby & Kind Second Hand" />
|
||||
<h1 class="hl">
|
||||
<span class="c-sky">Gebraucht,</span>
|
||||
<span class="c-sun">geliebt,</span>
|
||||
<span class="c-coral">weitergegeben!</span>
|
||||
</h1>
|
||||
<p class="hero__sub">Baby- und Kindersachen aus zweiter Hand — preiswert, gut erhalten, mitten in Rottenburg.</p>
|
||||
<p class="hero__sub">Baby- und Kindersachen aus zweiter Hand: preiswert, gut erhalten, mitten in Rottenburg.</p>
|
||||
<div class="hero__actions">
|
||||
<a class="btn btn--primary btn--l" href="hilfe-verein.html">
|
||||
Hilfe Verein ansehen
|
||||
@@ -57,24 +58,43 @@
|
||||
</div>
|
||||
<div class="trust">
|
||||
<span class="trust__chip"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z"/><path d="m9 12 2 2 4-4"/></svg></span>
|
||||
<span><b>Sehr gut erhalten</b><span>wir prüfen jedes Teil</span></span>
|
||||
<span><b>Sehr gut erhalten</b><span>ich prüfe jedes Teil</span></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="wrap section" id="ueber-uns">
|
||||
<!-- News-Pinnwand (WEBklar Kundenportal, Funktion "News"). Beitraege schreibt Opa Martin im Portal;
|
||||
news.js ersetzt den Leerzustand, sobald mindestens ein Beitrag haengt. -->
|
||||
<section class="wrap section" id="neuigkeiten">
|
||||
<div class="sh">
|
||||
<span class="sh__chip" style="--chip-bg:var(--coral-600)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12 17v5"/><path d="M9 10.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H8a2 2 0 0 0 0 4 1 1 0 0 1 1 1z"/></svg></span>
|
||||
<h2>Neues aus dem Laden</h2>
|
||||
</div>
|
||||
<p class="news-lead">Was gerade reingekommen ist, wann ich zu habe und was sonst so los ist. Frisch von mir an die Pinnwand gehängt.</p>
|
||||
<div class="news-pinnwand" data-webklar-news="q74ehq7hvnpiymqy" data-api="https://project.webklar.com" data-signature="Opa Martin">
|
||||
<div class="news-board">
|
||||
<div class="news-empty">
|
||||
<span class="news-empty__pin"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12 17v5"/><path d="M9 10.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H8a2 2 0 0 0 0 4 1 1 0 0 1 1 1z"/></svg></span>
|
||||
<h3>Hier hängt bald was Neues.</h3>
|
||||
<p>Neue Ware, Aktionen und Öffnungszeiten findest du ab jetzt an dieser Pinnwand. Schau bald wieder vorbei.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="wrap section" id="ueber-mich">
|
||||
<div class="sh">
|
||||
<span class="sh__chip"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z"/></svg></span>
|
||||
<h2>Wie alles angefangen hat</h2>
|
||||
</div>
|
||||
<div class="story">
|
||||
<div class="story__copy">
|
||||
<p>Im September haben wir den Second-Hand-Laden übernommen — eine Herzensangelegenheit. Kinder und Jugendliche sollen Spielsachen bekommen, die ein zweites Leben verdient haben: nachhaltig, familienfreundlich und für jeden Geldbeutel.</p>
|
||||
<p>Bei uns findest du Einzelstücke — vom Strampler bis zum Bobbycar. Jedes Teil gibt es nur 1× vorhanden, und jedes hat schon eine Geschichte hinter sich.</p>
|
||||
<p>Im September 2025 habe ich den Second-Hand-Laden übernommen. Eine Herzensangelegenheit. Kinder und Jugendliche sollen Spielsachen bekommen, die ein zweites Leben verdient haben: nachhaltig, familienfreundlich und für jeden Geldbeutel.</p>
|
||||
<p>Bei mir findest du Einzelstücke, vom Strampler bis zum Bobbycar. Jedes Teil gibt es nur 1× vorhanden, und jedes hat schon eine Geschichte hinter sich.</p>
|
||||
</div>
|
||||
<img class="story__img" src="assets/laden-story.jpg" alt="Hände legen ein Kinderoberteil zusammen und packen es in eine Kiste" loading="lazy" width="1200" height="900" />
|
||||
<img class="story__img" src="assets/laden-front.jpg" alt="Schaufenster von Emma's Schatzkiste mit bunten Kinderrädern, Luftballonbogen am Eingang und dem Laden-Schild" loading="lazy" width="1304" height="869" />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@@ -96,7 +116,38 @@
|
||||
<div class="tiles">
|
||||
<div class="tile"><h3>Preise für Familien</h3><p>Second-Hand-Preise, die zum Familienbudget passen.</p></div>
|
||||
<div class="tile"><h3>Sehr gut erhalten</h3><p>Auch aus zweiter Hand: geprüft, sauber, in gutem Zustand.</p></div>
|
||||
<div class="tile"><h3>Wir suchen mit</h3><p>Sag uns, was du brauchst — wir helfen beim Suchen.</p></div>
|
||||
<div class="tile"><h3>Ich suche mit</h3><p>Sag mir, was du brauchst, ich helfe beim Suchen.</p></div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="wrap section" id="anfahrt">
|
||||
<div class="sh">
|
||||
<span class="sh__chip"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"/><circle cx="12" cy="10" r="3"/></svg></span>
|
||||
<h2>So findest du mich</h2>
|
||||
</div>
|
||||
<div class="visit">
|
||||
<div class="visit__info">
|
||||
<div>
|
||||
<span class="label">Adresse</span>
|
||||
<p class="visit__addr">Hollerstraße 2<br />84056 Rottenburg a.d. Laaber</p>
|
||||
</div>
|
||||
<div>
|
||||
<span class="label">Öffnungszeiten</span>
|
||||
<dl class="hours">
|
||||
<dt>Montag bis Freitag</dt><dd>9:00 – 13:00 Uhr</dd>
|
||||
<dt>Samstag, Sonntag</dt><dd>geschlossen</dd>
|
||||
</dl>
|
||||
</div>
|
||||
<a class="btn btn--primary btn--l" href="https://www.google.com/maps/dir/?api=1&destination=EmMas+Schatzkiste%2C+Hollerstra%C3%9Fe+2%2C+84056+Rottenburg+an+der+Laaber" target="_blank" rel="noopener noreferrer">
|
||||
Route planen
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M5 12h14"/><path d="m12 5 7 7-7 7"/></svg>
|
||||
</a>
|
||||
</div>
|
||||
<!-- Google-Karte wird direkt angezeigt (Wunsch Kunde, 30.09.2026).
|
||||
Hinweis dazu in der Datenschutzerklaerung, Abschnitt 4a. -->
|
||||
<div class="map is-loaded">
|
||||
<iframe src="https://maps.google.com/maps?q=EmMas%20Schatzkiste%2C%20Hollerstra%C3%9Fe%202%2C%2084056%20Rottenburg%20an%20der%20Laaber&z=16&output=embed" title="Karte: EmMas Schatzkiste, Hollerstraße 2, Rottenburg a.d. Laaber" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -105,23 +156,23 @@
|
||||
<section class="wrap section--tight">
|
||||
<div class="sh">
|
||||
<span class="sh__chip"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M9 18V5l12-2v13"/><circle cx="6" cy="18" r="3"/><circle cx="18" cy="16" r="3"/></svg></span>
|
||||
<h2>Unser Lied</h2>
|
||||
<h2>Mein Lied</h2>
|
||||
</div>
|
||||
<div class="song">
|
||||
<div class="song" data-song>
|
||||
<audio src="assets/audio/lied-laden.mp3" preload="metadata"></audio>
|
||||
<div class="song__top">
|
||||
<h3>Lied vom Laden</h3>
|
||||
<span class="badge">Audio folgt</span>
|
||||
</div>
|
||||
<div class="song__row">
|
||||
<button class="iconbtn" type="button" disabled aria-label="Abspielen — Audio folgt">
|
||||
<svg viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><polygon points="6 3 20 12 6 21 6 3"/></svg>
|
||||
<button class="iconbtn" type="button" data-song-toggle aria-label="Lied vom Laden abspielen">
|
||||
<svg class="i-play" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><polygon points="7 4 20 12 7 20 7 4"/></svg>
|
||||
<svg class="i-pause" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><rect x="6" y="4" width="4" height="16" rx="1"/><rect x="14" y="4" width="4" height="16" rx="1"/></svg>
|
||||
</button>
|
||||
<div class="song__meter">
|
||||
<div class="song__track"></div>
|
||||
<span class="song__time">0:00</span>
|
||||
<input class="song__seek" type="range" min="0" max="100" step="0.1" value="0" aria-label="Position im Lied" data-song-seek />
|
||||
<span class="song__time"><span data-song-cur>0:00</span> / <span data-song-dur>2:12</span></span>
|
||||
</div>
|
||||
</div>
|
||||
<p class="song__note">Sobald die Datei da ist, spielt der Player sie hier ab.</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@@ -129,8 +180,8 @@
|
||||
<div class="band">
|
||||
<div class="band__copy">
|
||||
<span class="label">Hilfe. Herz. Hoffnung.</span>
|
||||
<h2>Unser Hilfe Verein ist im Aufbau.</h2>
|
||||
<p>Soziale Hilfe für unsere Region. Dafür brauchen wir finanzielle und menschliche Hilfe — in jeder Form, die du geben kannst.</p>
|
||||
<h2>Mein Hilfe Verein ist im Aufbau.</h2>
|
||||
<p>Soziale Hilfe für meine Region. Dafür brauche ich finanzielle und menschliche Hilfe, in jeder Form, die du geben kannst.</p>
|
||||
<a class="btn btn--primary btn--l" href="hilfe-verein.html#helfen">So kannst du helfen</a>
|
||||
</div>
|
||||
<img src="assets/logo-verein.png" alt="Emma's Schatzkiste Hilfe Verein" />
|
||||
@@ -145,8 +196,9 @@
|
||||
<div class="ftr__col">
|
||||
<h3>Laden</h3>
|
||||
<ul>
|
||||
<li><a href="index.html">Unser Laden</a></li>
|
||||
<li><span>Öffnungszeiten folgen</span></li>
|
||||
<li><a href="index.html">Mein Laden</a></li>
|
||||
<li><a href="index.html#anfahrt">Hollerstraße 2, 84056 Rottenburg</a></li>
|
||||
<li><span>Mo–Fr 9:00–13:00 Uhr</span></li>
|
||||
<li><a href="tel:015751479212">Ware abgeben</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -161,16 +213,26 @@
|
||||
<div class="ftr__col">
|
||||
<h3>Über</h3>
|
||||
<ul>
|
||||
<li><a href="index.html#ueber-uns">Über uns</a></li>
|
||||
<li><a href="index.html#ueber-mich">Über mich</a></li>
|
||||
<li><a href="hilfe-verein.html#kontakt">Kontakt</a></li>
|
||||
<li><a href="impressum.html">Impressum</a></li>
|
||||
<li><a href="datenschutz.html">Datenschutz</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="ftr__col">
|
||||
<h3>Folgen</h3>
|
||||
<ul>
|
||||
<li><a class="ftr__social" href="https://www.facebook.com/people/EmMas-Schatzkiste-Baby-und-Kinder-Secondhand-Laden/61594794906587/" target="_blank" rel="noopener noreferrer"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/></svg>Facebook<span class="vh"> (öffnet in neuem Fenster)</span></a></li>
|
||||
<li><a class="ftr__social" href="https://www.instagram.com/emmas_schatzkiste/" target="_blank" rel="noopener noreferrer"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect width="20" height="20" x="2" y="2" rx="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" x2="17.51" y1="6.5" y2="6.5"/></svg>Instagram<span class="vh"> (öffnet in neuem Fenster)</span></a></li>
|
||||
<li><a class="ftr__social" href="https://www.tiktok.com/@emmasschatzkiste" target="_blank" rel="noopener noreferrer"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M9 12a4 4 0 1 0 4 4V4a5 5 0 0 0 5 5"/></svg>TikTok<span class="vh"> (öffnet in neuem Fenster)</span></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<p class="ftr__legal">Kleinunternehmerregelung nach § 19 UStG: Als Kleinunternehmer berechnen wir keine Umsatzsteuer und weisen sie daher auch nicht aus.</p>
|
||||
</div>
|
||||
<p class="ftr__legal">Kleinunternehmerregelung nach § 19 UStG: Als Kleinunternehmer berechne ich keine Umsatzsteuer und weise sie daher auch nicht aus.</p>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script src="assets/player.js" defer></script>
|
||||
<script src="https://project.webklar.com/embed/news.js" defer></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -3,15 +3,15 @@
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Online-Shop im Aufbau — Emma's Schatzkiste</title>
|
||||
<meta name="description" content="Der Online-Shop von Emma's Schatzkiste ist noch im Aufbau. Bis dahin: vorbeikommen in Rottenburg a.d. Laaber oder anrufen — wir suchen mit." />
|
||||
<title>Online-Shop im Aufbau | Emma's Schatzkiste</title>
|
||||
<meta name="description" content="Der Online-Shop von Emma's Schatzkiste ist noch im Aufbau. Bis dahin: vorbeikommen in Rottenburg a.d. Laaber oder anrufen, ich suche mit." />
|
||||
<meta name="robots" content="noindex, follow" />
|
||||
<meta name="theme-color" content="#FDF4DC" />
|
||||
<link rel="icon" href="assets/logo-shop.png" />
|
||||
<link rel="preload" href="assets/fonts/nunito-400-latin.woff2" as="font" type="font/woff2" crossorigin />
|
||||
<link rel="preload" href="assets/fonts/fredoka-500-latin.woff2" as="font" type="font/woff2" crossorigin />
|
||||
<link rel="stylesheet" href="assets/fonts.css?v=1f6be3c3" />
|
||||
<link rel="stylesheet" href="assets/site.css?v=b9a3adde" />
|
||||
<link rel="stylesheet" href="assets/site.css?v=ca3d584c" />
|
||||
</head>
|
||||
<body class="page-shop parked">
|
||||
<a class="skip" href="#inhalt">Zum Inhalt springen</a>
|
||||
@@ -19,11 +19,12 @@
|
||||
<header class="hdr">
|
||||
<div class="wrap hdr__in">
|
||||
<a class="hdr__brand" href="index.html">
|
||||
<img src="assets/logo-shop.png" alt="" />
|
||||
<span class="hdr__marks"><img src="assets/logo-shop.png" alt="" /><img src="assets/logo-verein.png" alt="" /></span>
|
||||
Emma's Schatzkiste
|
||||
</a>
|
||||
<nav class="nav" aria-label="Hauptnavigation">
|
||||
<a href="index.html">Start</a>
|
||||
<a class="nav__news" href="index.html#neuigkeiten">Neuigkeiten</a>
|
||||
<a href="shop.html" aria-current="page">Shop</a>
|
||||
<a href="hilfe-verein.html">Hilfe Verein</a>
|
||||
<a href="hilfe-verein.html#kontakt">Kontakt</a>
|
||||
@@ -35,7 +36,7 @@
|
||||
<div class="parked__in">
|
||||
<span class="badge">Im Aufbau</span>
|
||||
<h1>Der Online-Shop ist noch im Aufbau.</h1>
|
||||
<p>Wir richten ihn gerade ein. Bis dahin findest du unsere Sachen im Laden in Rottenburg a.d. Laaber — oder du rufst an und wir suchen mit.</p>
|
||||
<p>Ich richte ihn gerade ein. Bis dahin findest du meine Sachen im Laden in der Hollerstraße 2 in Rottenburg a.d. Laaber, Montag bis Freitag von 9 bis 13 Uhr. Oder du rufst an und ich suche mit.</p>
|
||||
<div class="hero__actions" style="justify-content:center">
|
||||
<a class="btn btn--primary btn--l" href="tel:015751479212">0157 51479212</a>
|
||||
<a class="btn btn--secondary btn--l" href="index.html">Zurück zur Startseite</a>
|
||||
@@ -49,8 +50,9 @@
|
||||
<div class="ftr__col">
|
||||
<h3>Laden</h3>
|
||||
<ul>
|
||||
<li><a href="index.html">Unser Laden</a></li>
|
||||
<li><span>Öffnungszeiten folgen</span></li>
|
||||
<li><a href="index.html">Mein Laden</a></li>
|
||||
<li><a href="index.html#anfahrt">Hollerstraße 2, 84056 Rottenburg</a></li>
|
||||
<li><span>Mo–Fr 9:00–13:00 Uhr</span></li>
|
||||
<li><a href="tel:015751479212">Ware abgeben</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -65,14 +67,22 @@
|
||||
<div class="ftr__col">
|
||||
<h3>Über</h3>
|
||||
<ul>
|
||||
<li><a href="index.html#ueber-uns">Über uns</a></li>
|
||||
<li><a href="index.html#ueber-mich">Über mich</a></li>
|
||||
<li><a href="hilfe-verein.html#kontakt">Kontakt</a></li>
|
||||
<li><a href="impressum.html">Impressum</a></li>
|
||||
<li><a href="datenschutz.html">Datenschutz</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="ftr__col">
|
||||
<h3>Folgen</h3>
|
||||
<ul>
|
||||
<li><a class="ftr__social" href="https://www.facebook.com/people/EmMas-Schatzkiste-Baby-und-Kinder-Secondhand-Laden/61594794906587/" target="_blank" rel="noopener noreferrer"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/></svg>Facebook<span class="vh"> (öffnet in neuem Fenster)</span></a></li>
|
||||
<li><a class="ftr__social" href="https://www.instagram.com/emmas_schatzkiste/" target="_blank" rel="noopener noreferrer"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect width="20" height="20" x="2" y="2" rx="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" x2="17.51" y1="6.5" y2="6.5"/></svg>Instagram<span class="vh"> (öffnet in neuem Fenster)</span></a></li>
|
||||
<li><a class="ftr__social" href="https://www.tiktok.com/@emmasschatzkiste" target="_blank" rel="noopener noreferrer"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M9 12a4 4 0 1 0 4 4V4a5 5 0 0 0 5 5"/></svg>TikTok<span class="vh"> (öffnet in neuem Fenster)</span></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<p class="ftr__legal">Kleinunternehmerregelung nach § 19 UStG: Als Kleinunternehmer berechnen wir keine Umsatzsteuer und weisen sie daher auch nicht aus.</p>
|
||||
</div>
|
||||
<p class="ftr__legal">Kleinunternehmerregelung nach § 19 UStG: Als Kleinunternehmer berechne ich keine Umsatzsteuer und weise sie daher auch nicht aus.</p>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
|
||||
Reference in new issue
Block a user