Redesign Startseite nach Claude-Design-Entwurf: Foto-Hero (Unsplash) mit Gradient-Overlay + Live-Card, Stat-Tiles, Alarm-Band mit Smartphone-Foto; /bildnachweis + Footer-Link (Credits Woblick/Matveev)
This commit is contained in:
@@ -0,0 +1,29 @@
|
||||
---
|
||||
import Base from '../layouts/Base.astro';
|
||||
const credits = [
|
||||
{use:'Startseite – Hero', author:'Kevin Woblick', handle:'@kovah', authorUrl:'https://unsplash.com/@kovah',
|
||||
photoUrl:'https://unsplash.com/photos/a-white-wall-with-three-air-conditioners-on-it-JkHSdaYRiUI', title:'Air Conditioning'},
|
||||
{use:'Startseite – Alarm-Sektion', author:'Andrey Matveev', handle:'@zelebb', authorUrl:'https://unsplash.com/@zelebb',
|
||||
photoUrl:'https://unsplash.com/photos/a-hand-holds-a-smartphone-showing-notifications-QGKCe8C3D8g', title:'Smartphone mit Benachrichtigungen'},
|
||||
];
|
||||
---
|
||||
<Base title="Bildnachweis – Kühlfinder" description="Fotonachweise und Lizenzangaben für die auf Kühlfinder verwendeten Bilder.">
|
||||
<section class="wrap" style="max-width:780px;margin-top:2rem">
|
||||
<span class="kicker"><span class="u"></span>Credits</span>
|
||||
<h1 style="margin:.3rem 0 .6rem">Bildnachweis</h1>
|
||||
<p class="muted">Die verwendeten Fotos stammen von <a href="https://unsplash.com/license" rel="noopener" target="_blank">Unsplash</a> und stehen unter der kostenlosen Unsplash-Lizenz. Eine Nennung ist nicht verpflichtend – wir tun es trotzdem, um die Fotograf:innen zu würdigen.</p>
|
||||
<div class="creditlist">
|
||||
{credits.map(c => (
|
||||
<div class="card creditrow">
|
||||
<div><strong>{c.title}</strong><div class="muted" style="font-size:.85rem">Verwendung: {c.use}</div></div>
|
||||
<div class="muted" style="font-size:.9rem">Foto: <a href={c.authorUrl} rel="noopener" target="_blank">{c.author} ({c.handle})</a> · <a href={c.photoUrl} rel="noopener" target="_blank">Original auf Unsplash ↗</a></div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
<p class="note" style="margin-top:1.2rem">Hinweis: Aktuell werden die Bilder über das Unsplash-CDN eingebunden. Für eine vollständig DSGVO-konforme, selbst gehostete Variante können die Dateien lokal unter <code>/public/img/</code> abgelegt und von dort ausgeliefert werden.</p>
|
||||
</section>
|
||||
</Base>
|
||||
<style>
|
||||
.creditlist{display:flex;flex-direction:column;gap:.8rem;margin-top:1rem}
|
||||
.creditrow{display:flex;flex-direction:column;gap:.4rem}
|
||||
</style>
|
||||
Reference in New Issue
Block a user