24 lines
1.2 KiB
PHP
24 lines
1.2 KiB
PHP
<div class="relative overflow-hidden rounded-2xl border border-border bg-surface p-5 shadow-sm">
|
|
<div class="mb-3 flex items-center justify-between">
|
|
<div>
|
|
<p class="text-[10px] font-bold uppercase tracking-widest text-text-muted">14-Day Forecast</p>
|
|
<h3 class="text-lg font-black text-text-base">Price Trend</h3>
|
|
</div>
|
|
<flux:badge color="orange">Pro</flux:badge>
|
|
</div>
|
|
|
|
<svg viewBox="0 0 200 60" class="mb-4 h-16 w-full opacity-40"
|
|
fill="none" stroke="var(--color-primary)" stroke-width="2.5"
|
|
stroke-linecap="round" stroke-linejoin="round">
|
|
<polyline points="0,45 20,38 40,42 60,30 80,35 100,20 120,25 140,15 160,22 180,12 200,18" />
|
|
</svg>
|
|
|
|
<div class="absolute inset-0 flex flex-col items-center justify-center rounded-2xl bg-surface/80 backdrop-blur-sm">
|
|
<iconify-icon icon="lucide:lock" class="mb-2 text-3xl text-primary"></iconify-icon>
|
|
<p class="mb-3 text-sm font-bold text-text-base">14-day forecast is a Pro feature</p>
|
|
<flux:button href="{{ route('register') }}" as="a" variant="primary" size="sm">
|
|
Unlock Forecast
|
|
</flux:button>
|
|
</div>
|
|
</div>
|