From 154a418149f8812e8d1b24cc0bf2a5f9d829182e Mon Sep 17 00:00:00 2001 From: isaacclad Date: Sun, 28 Jun 2026 16:21:40 +0000 Subject: [PATCH] Use + icon buttons on mobile dashboards. Sync mobile-header-btn partials, mobile x-btn.create, and update dashboard header actions for consistent mobile FABs. Co-authored-by: Cursor --- .../views/components/btn/create.blade.php | 33 ++++++++++++ .../partials/mobile-header-btn.blade.php | 53 +++++++++++++++++++ .../views/partials/mobile-icon-link.blade.php | 27 ++++++++++ resources/views/pos/dashboard.blade.php | 14 +++-- 4 files changed, 122 insertions(+), 5 deletions(-) create mode 100644 resources/views/components/btn/create.blade.php create mode 100644 resources/views/partials/mobile-header-btn.blade.php create mode 100644 resources/views/partials/mobile-icon-link.blade.php diff --git a/resources/views/components/btn/create.blade.php b/resources/views/components/btn/create.blade.php new file mode 100644 index 0000000..f51caf4 --- /dev/null +++ b/resources/views/components/btn/create.blade.php @@ -0,0 +1,33 @@ +@props([ + 'href' => null, + 'type' => 'button', + 'label' => null, +]) + +@php + $tag = $href ? 'a' : 'button'; + $ariaLabel = $label ?? trim(preg_replace('/\s+/', ' ', strip_tags((string) $slot))); +@endphp + +<{{ $tag }} + @if ($href) href="{{ $href }}" @endif + @if ($tag === 'button') type="{{ $type }}" @endif + aria-label="{{ $ariaLabel }}" + title="{{ $ariaLabel }}" + {{ $attributes->class(['btn-fab h-10 w-10 lg:hidden']) }} +> + + + +<{{ $tag }} + @if ($href) href="{{ $href }}" @endif + @if ($tag === 'button') type="{{ $type }}" @endif + {{ $attributes->class(['btn-primary hidden lg:inline-flex']) }} +> + + {{ $slot }} + 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 }} + @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 }} + 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 + + + diff --git a/resources/views/pos/dashboard.blade.php b/resources/views/pos/dashboard.blade.php index 245a9c8..1b9101f 100644 --- a/resources/views/pos/dashboard.blade.php +++ b/resources/views/pos/dashboard.blade.php @@ -1,11 +1,15 @@
-
-
-

Overview

-

Today's register takings and recent sales.

+
+
+

Overview

+
- Open register + @include('partials.mobile-header-btn', [ + 'href' => route('pos.register'), + 'label' => 'Open register', + 'variant' => 'primary', + ])