Patrick Müller
72 lines
3.0 KiB
HTML
72 lines
3.0 KiB
HTML
<div class="page">
|
||
<a routerLink="/admin" class="admin-link">Admin-Login ›</a>
|
||
|
||
<main class="hero">
|
||
|
||
<div class="title-block">
|
||
<span class="clef" aria-hidden="true">𝄞</span>
|
||
<h1>Nachklang</h1>
|
||
<p class="tagline">Veranstaltungskalender</p>
|
||
<div class="ornament-line"></div>
|
||
<p class="description">Abonniere unseren Kalender und verpasse keine Veranstaltung mehr.</p>
|
||
</div>
|
||
|
||
<div class="cards">
|
||
|
||
<!-- Apple Calendar -->
|
||
<a href="webcal://api.nachklang.art/calendar/events/public/ical" class="card">
|
||
<div class="icon-wrap apple">
|
||
<svg viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||
<rect width="48" height="48" fill="white"/>
|
||
<rect width="48" height="14" fill="#FF3B30"/>
|
||
<rect x="13" y="3" width="5" height="9" rx="2.5" fill="#c7c7cc"/>
|
||
<rect x="30" y="3" width="5" height="9" rx="2.5" fill="#c7c7cc"/>
|
||
<text x="24" y="13" text-anchor="middle"
|
||
font-family="Helvetica Neue, Helvetica, Arial, sans-serif"
|
||
font-size="6.5" font-weight="600" fill="rgba(255,255,255,0.92)"
|
||
letter-spacing="1.5">DEC</text>
|
||
<text x="24" y="41" text-anchor="middle"
|
||
font-family="Helvetica Neue, Helvetica, Arial, sans-serif"
|
||
font-size="21" font-weight="200" fill="#1c1c1e">31</text>
|
||
</svg>
|
||
</div>
|
||
<span class="card-label">Apple Kalender</span>
|
||
<span class="card-sub">iPhone · iPad · Mac</span>
|
||
</a>
|
||
|
||
<!-- Google Calendar -->
|
||
<a href="https://calendar.google.com/calendar/r?cid=webcal%3A%2F%2Fapi.nachklang.art%2Fcalendar%2Fevents%2Fpublic%2Fical"
|
||
target="_blank" rel="noopener noreferrer" class="card">
|
||
<div class="icon-wrap google">
|
||
<svg viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||
<rect width="48" height="48" fill="white"/>
|
||
<rect width="48" height="14" fill="#1a73e8"/>
|
||
<rect x="13" y="3" width="5" height="9" rx="2.5" fill="#80868b"/>
|
||
<rect x="30" y="3" width="5" height="9" rx="2.5" fill="#80868b"/>
|
||
<rect x="8" y="18" width="14" height="12" rx="1.5" fill="#4285f4"/>
|
||
<rect x="26" y="18" width="14" height="12" rx="1.5" fill="#ea4335"/>
|
||
<rect x="8" y="34" width="14" height="11" rx="1.5" fill="#34a853"/>
|
||
<rect x="26" y="34" width="14" height="11" rx="1.5" fill="#fbbc05"/>
|
||
</svg>
|
||
</div>
|
||
<span class="card-label">Google Kalender</span>
|
||
<span class="card-sub">Android · Web</span>
|
||
</a>
|
||
|
||
<!-- Copy iCal link -->
|
||
<button type="button" (click)="copyUrl()" class="card copy-card" [class.copied]="copied">
|
||
<div class="icon-wrap copy">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||
stroke-linecap="round" stroke-linejoin="round">
|
||
<path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/>
|
||
<path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/>
|
||
</svg>
|
||
</div>
|
||
<span class="card-label">{{ copied ? '✓ Kopiert!' : 'iCal-Link kopieren' }}</span>
|
||
<span class="card-sub">Outlook · andere Apps</span>
|
||
</button>
|
||
|
||
</div>
|
||
</main>
|
||
</div>
|