+
+
Overview
+
Short links on ladl.link — billed from your Ladill wallet
-
- Create link
-
+ @include('partials.mobile-header-btn', [
+ 'href' => route('user.links.create'),
+ 'label' => 'Create link',
+ 'variant' => 'primary',
+ ])
diff --git a/resources/views/partials/mobile-header-btn.blade.php b/resources/views/partials/mobile-header-btn.blade.php
new file mode 100644
index 0000000..97d79c4
--- /dev/null
+++ b/resources/views/partials/mobile-header-btn.blade.php
@@ -0,0 +1,53 @@
+@php
+ $variant = $variant ?? 'primary';
+ $type = $type ?? 'submit';
+ $tag = ! empty($href) ? 'a' : 'button';
+ $ariaLabel = $ariaLabel ?? $label ?? '';
+ $desktopLabel = $desktopLabel ?? $label ?? '';
+ $showDesktopIcon = $showDesktopIcon ?? ($variant === 'primary');
+
+ $mobileClass = match ($variant) {
+ 'primary' => 'btn-fab h-10 w-10 lg:hidden',
+ 'outline' => 'inline-flex h-10 w-10 items-center justify-center rounded-full border border-slate-200 bg-white text-slate-700 shadow-sm transition hover:border-slate-300 hover:bg-slate-50 lg:hidden',
+ 'dark' => 'inline-flex h-10 w-10 items-center justify-center rounded-full bg-gray-900 text-white shadow-sm transition hover:bg-gray-800 lg:hidden',
+ 'indigo' => 'inline-flex h-10 w-10 items-center justify-center rounded-full bg-indigo-600 text-white shadow-sm transition hover:bg-indigo-700 lg:hidden',
+ default => 'btn-fab h-10 w-10 lg:hidden',
+ };
+
+ $desktopClass = match ($variant) {
+ 'primary' => 'btn-primary hidden items-center lg:inline-flex',
+ 'outline' => 'hidden items-center rounded-lg border border-gray-200 bg-white px-4 py-2 text-sm font-medium text-gray-700 shadow-sm transition hover:bg-gray-50 lg:inline-flex',
+ 'dark' => 'hidden items-center gap-1.5 rounded-lg bg-gray-900 px-3.5 py-2 text-sm font-medium text-white transition hover:bg-gray-800 lg:inline-flex',
+ 'indigo' => 'hidden items-center justify-center rounded-xl bg-indigo-600 px-4 py-2.5 text-sm font-semibold text-white transition hover:bg-indigo-700 lg:inline-flex',
+ default => 'btn-primary hidden items-center lg:inline-flex',
+ };
+
+ $extraClass = $class ?? '';
+@endphp
+
+<{{ $tag }}
+ @if ($tag === 'a') href="{{ $href }}" @endif
+ @if ($tag === 'button') type="{{ $type }}" @endif
+ aria-label="{{ $ariaLabel }}"
+ title="{{ $ariaLabel }}"
+ @if (! empty($attributes)) {!! $attributes !!} @endif
+ class="{{ trim($mobileClass.' '.$extraClass) }}"
+>
+
+{{ $tag }}>
+
+<{{ $tag }}
+ @if ($tag === 'a') href="{{ $href }}" @endif
+ @if ($tag === 'button') type="{{ $type }}" @endif
+ @if (! empty($attributes)) {!! $attributes !!} @endif
+ class="{{ trim($desktopClass.' '.$extraClass) }}"
+>
+ @if ($showDesktopIcon)
+
+ @endif
+ {{ $desktopLabel }}
+{{ $tag }}>
diff --git a/resources/views/partials/mobile-icon-link.blade.php b/resources/views/partials/mobile-icon-link.blade.php
new file mode 100644
index 0000000..b1a96c4
--- /dev/null
+++ b/resources/views/partials/mobile-icon-link.blade.php
@@ -0,0 +1,27 @@
+@php
+ $icon = $icon ?? 'arrow';
+ $desktopClass = $desktopClass ?? 'text-xs font-medium text-indigo-600 hover:text-indigo-700';
+ $label = $label ?? '';
+@endphp
+
+
+
+ @if ($icon === 'shield')
+
+ @elseif ($icon === 'calendar')
+
+ @else
+
+ @endif
+
+ {{ $label }}
+