23 lines
1.0 KiB
PHP
23 lines
1.0 KiB
PHP
@props([
|
|
'streak' => 0,
|
|
'points' => 0,
|
|
])
|
|
|
|
<header class="h-14 px-6 flex items-center gap-4 border-b border-line bg-bg-elev sticky top-0 z-10 backdrop-blur-sm">
|
|
<x-layout.search-input />
|
|
|
|
<div class="flex items-center gap-2.5 ml-auto">
|
|
<x-layout.gamification-chip icon="fire" :value="$streak . ' Tage'" />
|
|
<x-layout.gamification-chip icon="star" :value="number_format((int) $points, 0, ',', '.')" />
|
|
|
|
<button
|
|
type="button"
|
|
aria-label="Mitteilungen"
|
|
class="relative w-9 h-9 grid place-items-center rounded-lg border border-line bg-bg-soft hover:bg-bg-tint hover:border-line-strong transition-all duration-150 cursor-pointer focus:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2 focus-visible:ring-offset-bg-elev"
|
|
>
|
|
<x-heroicon-o-bell class="w-4 h-4 text-ink-2" />
|
|
<span class="absolute top-2 right-2 w-1.5 h-1.5 rounded-full bg-danger ring-2 ring-bg-soft"></span>
|
|
</button>
|
|
</div>
|
|
</header>
|