mag/WMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

now favicons and fontawsoem support

Browse Source
This commit is contained in:
Mark Gregory
2026-06-10 13:57:08 +01:00
parent 1489f9e747
commit b10ac13bb5
143 changed files with 9274 additions and 220 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/css/app.css
+415 -4
View File
@@ -1,4 +1,3 @@
@import '@fortawesome/fontawesome-free/css/all.min.css';
@import 'tailwindcss';
@import '../../vendor/livewire/flux/dist/flux.css';
@@ -66,10 +65,422 @@ select:focus[data-flux-control] {
@apply size-4;
} */
@layer components {
.wms-app-shell {
min-height: 100vh;
display: flex;
background: rgb(250 250 250);
}
.dark .wms-app-shell {
background: rgb(9 9 11);
}
.wms-sidebar {
position: sticky;
top: 0;
z-index: 40;
display: flex;
width: 20rem;
min-width: 20rem;
height: 100vh;
flex-direction: column;
border-right: 1px solid rgb(228 228 231);
background: rgb(250 250 250);
transition: width 180ms ease, min-width 180ms ease, transform 180ms ease;
}
.dark .wms-sidebar {
border-right-color: rgb(63 63 70);
background: rgb(24 24 27);
}
.wms-sidebar-header {
display: flex;
align-items: center;
gap: 0.75rem;
min-height: 4.5rem;
padding: 0.875rem;
border-bottom: 1px solid rgb(228 228 231);
}
.dark .wms-sidebar-header {
border-bottom-color: rgb(63 63 70);
}
.wms-brand {
display: flex;
align-items: center;
gap: 0.75rem;
min-width: 0;
flex: 1;
color: inherit;
text-decoration: none;
}
.wms-brand-mark {
background: linear-gradient(135deg, #08142a 0%, #0d2a4a 56%, #0f766e 100%);
box-shadow: inset 0 1px 0 rgb(255 255 255 / 18%), 0 10px 24px rgb(8 20 42 / 22%);
display: grid;
width: 2.35rem;
height: 2.35rem;
flex: 0 0 auto;
place-items: center;
border-radius: 0.75rem;
background: linear-gradient(135deg, rgb(15 23 42), rgb(14 116 144));
color: white;
box-shadow: 0 12px 24px rgb(15 23 42 / 0.22);
}
.wms-brand-mark-inner {
font-size: 1rem;
font-weight: 800;
letter-spacing: -0.04em;
}
.wms-brand-copy {
min-width: 0;
display: grid;
line-height: 1.1;
}
.wms-brand-title {
max-width: 14rem;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 0.94rem;
font-weight: 750;
color: rgb(24 24 27);
}
.dark .wms-brand-title {
color: rgb(244 244 245);
}
.wms-brand-subtitle {
margin-top: 0.15rem;
font-size: 0.72rem;
font-weight: 700;
letter-spacing: 0.14em;
color: rgb(8 145 178);
}
.wms-sidebar-toggle,
.wms-mobile-close,
.wms-mobile-menu {
display: inline-grid;
place-items: center;
border-radius: 0.65rem;
border: 1px solid rgb(228 228 231);
background: white;
color: rgb(63 63 70);
transition: background 120ms ease, color 120ms ease, border-color 120ms ease;
}
.wms-sidebar-toggle {
width: 2rem;
height: 2rem;
font-size: 1.35rem;
font-weight: 800;
line-height: 1;
}
.wms-sidebar-toggle:hover,
.wms-mobile-close:hover,
.wms-mobile-menu:hover {
border-color: rgb(14 116 144);
color: rgb(14 116 144);
}
.dark .wms-sidebar-toggle,
.dark .wms-mobile-close,
.dark .wms-mobile-menu {
border-color: rgb(63 63 70);
background: rgb(39 39 42);
color: rgb(228 228 231);
}
.wms-toggle-collapsed {
display: none;
}
.wms-mobile-close {
display: none;
width: 2rem;
height: 2rem;
font-size: 1.4rem;
line-height: 1;
}
.wms-sidebar-nav {
flex: 1;
overflow-y: auto;
padding: 0.85rem;
}
.wms-sidebar-group + .wms-sidebar-group {
margin-top: 1.1rem;
}
.wms-sidebar-heading {
padding: 0 0.625rem 0.45rem;
font-size: 0.69rem;
font-weight: 800;
letter-spacing: 0.11em;
text-transform: uppercase;
color: rgb(113 113 122);
}
.wms-sidebar-link {
position: relative;
display: flex;
min-height: 2.55rem;
align-items: center;
gap: 0.75rem;
border-radius: 0.75rem;
padding: 0.625rem 0.7rem;
color: rgb(63 63 70);
font-size: 0.9rem;
font-weight: 650;
text-decoration: none;
transition: background 120ms ease, color 120ms ease;
}
.wms-sidebar-link:hover {
background: rgb(244 244 245);
color: rgb(14 116 144);
}
.wms-sidebar-link.is-active {
background: rgb(236 254 255);
color: rgb(14 116 144);
}
.dark .wms-sidebar-link {
color: rgb(212 212 216);
}
.dark .wms-sidebar-link:hover {
background: rgb(39 39 42);
color: rgb(103 232 249);
}
.dark .wms-sidebar-link.is-active {
background: rgb(8 47 73 / 0.55);
color: rgb(103 232 249);
}
.wms-sidebar-icon {
width: 1.2rem;
min-width: 1.2rem;
text-align: center;
font-size: 1rem;
}
.wms-sidebar-footer {
display: grid;
gap: 0.25rem;
border-top: 1px solid rgb(228 228 231);
padding: 0.85rem;
}
.dark .wms-sidebar-footer {
border-top-color: rgb(63 63 70);
}
.wms-user-card {
margin-top: 0.5rem;
display: flex;
min-width: 0;
align-items: center;
gap: 0.65rem;
border-radius: 0.85rem;
border: 1px solid rgb(228 228 231);
background: white;
padding: 0.65rem;
}
.dark .wms-user-card {
border-color: rgb(63 63 70);
background: rgb(39 39 42);
}
.wms-user-avatar {
display: grid;
width: 2rem;
height: 2rem;
flex: 0 0 auto;
place-items: center;
border-radius: 999px;
background: rgb(15 23 42);
color: white;
font-size: 0.75rem;
font-weight: 800;
}
.wms-user-copy {
min-width: 0;
}
.wms-user-name,
.wms-user-email {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.wms-user-name {
font-size: 0.82rem;
font-weight: 750;
}
.wms-user-email {
font-size: 0.72rem;
color: rgb(113 113 122);
}
.wms-main-column {
min-width: 0;
flex: 1;
}
.wms-mobile-header {
display: none;
}
.wms-mobile-overlay {
display: none;
}
html[data-wms-sidebar='collapsed'] .wms-sidebar {
width: 5.25rem;
min-width: 5.25rem;
}
html[data-wms-sidebar='collapsed'] [data-wms-sidebar-label] {
display: none !important;
}
html[data-wms-sidebar='collapsed'] .wms-sidebar-header,
html[data-wms-sidebar='collapsed'] .wms-sidebar-footer,
html[data-wms-sidebar='collapsed'] .wms-sidebar-nav {
align-items: center;
padding-left: 0.65rem;
padding-right: 0.65rem;
}
html[data-wms-sidebar='collapsed'] .wms-brand {
flex: 0 0 auto;
}
html[data-wms-sidebar='collapsed'] .wms-sidebar-header {
justify-content: center;
flex-wrap: wrap;
}
html[data-wms-sidebar='collapsed'] .wms-sidebar-link {
justify-content: center;
padding-left: 0.65rem;
padding-right: 0.65rem;
}
html[data-wms-sidebar='collapsed'] .wms-toggle-expanded {
display: none;
}
html[data-wms-sidebar='collapsed'] .wms-toggle-collapsed {
display: inline;
}
@media (max-width: 1023px) {
.wms-app-shell {
display: block;
}
.wms-sidebar {
position: fixed;
inset: 0 auto 0 0;
width: min(21rem, calc(100vw - 2.5rem));
min-width: min(21rem, calc(100vw - 2.5rem));
transform: translateX(-105%);
box-shadow: 22px 0 60px rgb(0 0 0 / 0.24);
}
html[data-wms-mobile-sidebar='open'] .wms-sidebar {
transform: translateX(0);
}
html[data-wms-mobile-sidebar='open'] .wms-mobile-overlay {
position: fixed;
inset: 0;
z-index: 35;
display: block;
background: rgb(0 0 0 / 0.48);
backdrop-filter: blur(2px);
}
html[data-wms-sidebar='collapsed'] .wms-sidebar {
width: min(21rem, calc(100vw - 2.5rem));
min-width: min(21rem, calc(100vw - 2.5rem));
}
html[data-wms-sidebar='collapsed'] [data-wms-sidebar-label] {
display: initial !important;
}
html[data-wms-sidebar='collapsed'] .wms-brand-copy,
html[data-wms-sidebar='collapsed'] .wms-sidebar-heading,
html[data-wms-sidebar='collapsed'] .wms-user-card span,
html[data-wms-sidebar='collapsed'] .wms-sidebar-link span {
display: block !important;
}
html[data-wms-sidebar='collapsed'] .wms-sidebar-link {
justify-content: flex-start;
}
.wms-sidebar-toggle {
display: none;
}
.wms-mobile-close {
display: inline-grid;
}
.wms-mobile-header {
position: sticky;
top: 0;
z-index: 30;
display: flex;
min-height: 4rem;
align-items: center;
gap: 0.75rem;
border-bottom: 1px solid rgb(228 228 231);
background: rgb(255 255 255 / 0.86);
padding: 0.75rem 1rem;
backdrop-filter: blur(14px);
}
.dark .wms-mobile-header {
border-bottom-color: rgb(63 63 70);
background: rgb(24 24 27 / 0.86);
}
.wms-mobile-menu {
width: 2.35rem;
height: 2.35rem;
flex: 0 0 auto;
}
.wms-mobile-title {
min-width: 0;
flex: 1;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
color: inherit;
font-size: 0.96rem;
font-weight: 800;
text-decoration: none;
}
}
}
resources/js/app.js
+1
View File
@@ -0,0 +1 @@
import '@fortawesome/fontawesome-free/css/all.min.css';
resources/views/components/app-logo-icon.blade.php
+7 -16
View File
@@ -1,17 +1,8 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" {{ $attributes }} aria-hidden="true">
<defs>
<linearGradient id="wmsIconBg" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#08142a" />
<stop offset="1" stop-color="#0d9488" />
</linearGradient>
</defs>
<rect width="64" height="64" rx="15" fill="url(#wmsIconBg)" />
<path d="M7 17 51 3 63 12 17 27Z" fill="#fff" opacity=".10" />
<path d="M12 27 32 15 52 27 49 31 32 21 15 31Z" fill="#22d3ee" />
<rect x="15" y="30" width="34" height="22" rx="3" fill="#0f4460" stroke="#e2fcff" stroke-width="1.8" />
<path d="M20 36h5v16h-5zM29.5 36h5v16h-5zM39 36h5v16h-5z" fill="#061d33" stroke="#38d5ef" stroke-width="1" />
<path d="M20 33 28.5 39 44 30" fill="none" stroke="#f6b323" stroke-width="4.5" stroke-linecap="round" stroke-linejoin="round" />
<path d="M20 33 28.5 39 44 30" fill="none" stroke="#fff7d6" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
<text x="32" y="13" text-anchor="middle" font-family="Inter, Arial, sans-serif" font-size="8" font-weight="800" fill="#f8fafc">MPBA</text>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 42" {{ $attributes }}>
<path
fill="currentColor"
fill-rule="evenodd"
clip-rule="evenodd"
d="M17.2 5.633 8.6.855 0 5.633v26.51l16.2 9 16.2-9v-8.442l7.6-4.223V9.856l-8.6-4.777-8.6 4.777V18.3l-5.6 3.111V5.633ZM38 18.301l-5.6 3.11v-6.157l5.6-3.11V18.3Zm-1.06-7.856-5.54 3.078-5.54-3.079 5.54-3.078 5.54 3.079ZM24.8 18.3v-6.157l5.6 3.111v6.158L24.8 18.3Zm-1 1.732 5.54 3.078-13.14 7.302-5.54-3.078 13.14-7.3v-.002Zm-16.2 7.89 7.6 4.222V38.3L2 30.966V7.92l5.6 3.111v16.892ZM8.6 9.3 3.06 6.222 8.6 3.143l5.54 3.08L8.6 9.3Zm21.8 15.51-13.2 7.334V38.3l13.2-7.334v-6.156ZM9.6 11.034l5.6-3.11v14.6l-5.6 3.11v-14.6Z"
/>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 714 B

resources/views/components/app-logo.blade.php
+4 -4
View File
@@ -4,14 +4,14 @@
@if($sidebar)
<flux:sidebar.brand name="Warehouse Management System" {{ $attributes }}>
<x-slot name="logo" class="wms-brand-mark flex aspect-square size-9 items-center justify-center rounded-xl text-white">
<x-app-logo-icon class="size-9" />
<x-slot name="logo" class="flex aspect-square size-8 items-center justify-center rounded-md bg-accent-content text-accent-foreground">
<x-app-logo-icon class="size-5 fill-current text-white dark:text-black" />
</x-slot>
</flux:sidebar.brand>
@else
<flux:brand name="Warehouse Management System" {{ $attributes }}>
<x-slot name="logo" class="wms-brand-mark flex aspect-square size-9 items-center justify-center rounded-xl text-white">
<x-app-logo-icon class="size-9" />
<x-slot name="logo" class="flex aspect-square size-8 items-center justify-center rounded-md bg-accent-content text-accent-foreground">
<x-app-logo-icon class="size-5 fill-current text-white dark:text-black" />
</x-slot>
</flux:brand>
@endif
resources/views/layouts/app/sidebar.blade.php
+227 -94
View File
@@ -3,120 +3,175 @@
<head>
@include('partials.head')
</head>
<body class="min-h-screen bg-white dark:bg-zinc-800">
<flux:sidebar sticky collapsible="mobile" class="border-e border-zinc-200 bg-zinc-50 dark:border-zinc-700 dark:bg-zinc-900">
<flux:sidebar.header>
<x-app-logo :sidebar="true" href="{{ route('dashboard') }}" wire:navigate />
<flux:sidebar.collapse class="lg:hidden" />
</flux:sidebar.header>
<flux:sidebar.nav>
<flux:sidebar.group :heading="__('Operations')" class="grid">
<flux:sidebar.item icon="home" :href="route('dashboard')" :current="request()->routeIs('dashboard')" wire:navigate>
{{ __('Dashboard') }}
</flux:sidebar.item>
<body class="min-h-screen bg-white text-zinc-950 antialiased dark:bg-zinc-950 dark:text-zinc-100">
<div class="wms-app-shell" data-wms-shell>
<div class="wms-mobile-overlay" data-wms-mobile-close></div>
<flux:sidebar.item icon="building-storefront" :href="route('warehouses.index')" :current="request()->routeIs('warehouses.*')" wire:navigate>
{{ __('Warehouses') }}
</flux:sidebar.item>
<aside class="wms-sidebar" data-wms-sidebar aria-label="{{ __('Main navigation') }}">
<div class="wms-sidebar-header">
<a href="{{ route('dashboard') }}" wire:navigate class="wms-brand" aria-label="{{ __('Warehouse Management System') }}">
<span class="wms-brand-mark">
<span class="wms-brand-mark-inner">W</span>
</span>
<flux:sidebar.item icon="shield-check" :href="route('warehouse-rules.index')" :current="request()->routeIs('warehouse-rules.*')" wire:navigate>
{{ __('Validation Rules') }}
</flux:sidebar.item>
</flux:sidebar.group>
<span class="wms-brand-copy" data-wms-sidebar-label>
<span class="wms-brand-title">{{ __('Warehouse Management System') }}</span>
<span class="wms-brand-subtitle">MPBA</span>
</span>
</a>
@if(auth()->user()?->isMpbaPlatformAdmin())
<flux:sidebar.group :heading="__('Administration')" class="grid">
<flux:sidebar.item icon="squares-2x2" :href="route('platform.dashboard')" :current="request()->routeIs('platform.dashboard')" wire:navigate>
{{ __('Admin Dashboard') }}
</flux:sidebar.item>
<button
type="button"
class="wms-sidebar-toggle"
data-wms-sidebar-toggle
aria-label="{{ __('Collapse sidebar') }}"
aria-expanded="true"
>
<span class="wms-toggle-expanded">‹</span>
<span class="wms-toggle-collapsed">›</span>
</button>
<flux:sidebar.item icon="building-office-2" :href="route('platform.companies.index')" :current="request()->routeIs('platform.companies.*')" wire:navigate>
{{ __('Companies') }}
</flux:sidebar.item>
<button
type="button"
class="wms-mobile-close"
data-wms-mobile-close
aria-label="{{ __('Close navigation') }}"
>
×
</button>
</div>
<flux:sidebar.item icon="key" :href="route('platform.licenses.index')" :current="request()->routeIs('platform.licenses.*')" wire:navigate>
{{ __('Licences') }}
</flux:sidebar.item>
<nav class="wms-sidebar-nav" aria-label="{{ __('Operations') }}">
<div class="wms-sidebar-group">
<div class="wms-sidebar-heading" data-wms-sidebar-label>{{ __('Operations') }}</div>
<flux:sidebar.item icon="credit-card" :href="route('platform.payments.index')" :current="request()->routeIs('platform.payments.*')" wire:navigate>
{{ __('Payments') }}
</flux:sidebar.item>
</flux:sidebar.group>
@endif
</flux:sidebar.nav>
<a href="{{ route('dashboard') }}" wire:navigate class="wms-sidebar-link @if(request()->routeIs('dashboard')) is-active @endif" title="{{ __('Dashboard') }}">
<i class="fa-solid fa-gauge-high wms-sidebar-icon" aria-hidden="true"></i>
<span data-wms-sidebar-label>{{ __('Dashboard') }}</span>
</a>
<flux:spacer />
<a href="{{ route('warehouses.index') }}" wire:navigate class="wms-sidebar-link @if(request()->routeIs('warehouses.*')) is-active @endif" title="{{ __('Warehouses') }}">
<i class="fa-solid fa-warehouse wms-sidebar-icon" aria-hidden="true"></i>
<span data-wms-sidebar-label>{{ __('Warehouses') }}</span>
</a>
<flux:sidebar.nav>
<flux:sidebar.item icon="folder-git-2" href="/up">
{{ __('Health Check') }}
</flux:sidebar.item>
<a href="{{ route('warehouse-rules.index') }}" wire:navigate class="wms-sidebar-link @if(request()->routeIs('warehouse-rules.*')) is-active @endif" title="{{ __('Validation Rules') }}">
<i class="fa-solid fa-shield-halved wms-sidebar-icon" aria-hidden="true"></i>
<span data-wms-sidebar-label>{{ __('Validation Rules') }}</span>
</a>
</div>
<flux:sidebar.item icon="book-open-text" href="/admin">
{{ __('Platform Admin') }}
</flux:sidebar.item>
</flux:sidebar.nav>
@if(auth()->user()?->isMpbaPlatformAdmin())
<div class="wms-sidebar-group">
<div class="wms-sidebar-heading" data-wms-sidebar-label>{{ __('Administration') }}</div>
<x-desktop-user-menu class="hidden lg:block" :name="auth()->user()->name" />
</flux:sidebar>
<a href="{{ route('platform.dashboard') }}" wire:navigate class="wms-sidebar-link @if(request()->routeIs('platform.dashboard')) is-active @endif" title="{{ __('Admin Dashboard') }}">
<i class="fa-solid fa-table-columns wms-sidebar-icon" aria-hidden="true"></i>
<span data-wms-sidebar-label>{{ __('Admin Dashboard') }}</span>
</a>
<!-- Mobile User Menu -->
<flux:header class="lg:hidden">
<flux:sidebar.toggle class="lg:hidden" icon="bars-2" inset="left" />
<a href="{{ route('platform.companies.index') }}" wire:navigate class="wms-sidebar-link @if(request()->routeIs('platform.companies.*')) is-active @endif" title="{{ __('Companies') }}">
<i class="fa-solid fa-building wms-sidebar-icon" aria-hidden="true"></i>
<span data-wms-sidebar-label>{{ __('Companies') }}</span>
</a>
<flux:spacer />
<a href="{{ route('platform.licenses.index') }}" wire:navigate class="wms-sidebar-link @if(request()->routeIs('platform.licenses.*')) is-active @endif" title="{{ __('Licences') }}">
<i class="fa-solid fa-key wms-sidebar-icon" aria-hidden="true"></i>
<span data-wms-sidebar-label>{{ __('Licences') }}</span>
</a>
<flux:dropdown position="top" align="end">
<flux:profile
:initials="auth()->user()->initials()"
icon-trailing="chevron-down"
/>
<flux:menu>
<flux:menu.radio.group>
<div class="p-0 text-sm font-normal">
<div class="flex items-center gap-2 px-1 py-1.5 text-start text-sm">
<flux:avatar
:name="auth()->user()->name"
:initials="auth()->user()->initials()"
/>
<div class="grid flex-1 text-start text-sm leading-tight">
<flux:heading class="truncate">{{ auth()->user()->name }}</flux:heading>
<flux:text class="truncate">{{ auth()->user()->email }}</flux:text>
</div>
</div>
<a href="{{ route('platform.payments.index') }}" wire:navigate class="wms-sidebar-link @if(request()->routeIs('platform.payments.*')) is-active @endif" title="{{ __('Payments') }}">
<i class="fa-solid fa-credit-card wms-sidebar-icon" aria-hidden="true"></i>
<span data-wms-sidebar-label>{{ __('Payments') }}</span>
</a>
</div>
</flux:menu.radio.group>
@endif
</nav>
<flux:menu.separator />
<div class="wms-sidebar-footer">
<a href="/up" class="wms-sidebar-link" title="{{ __('Health Check') }}">
<i class="fa-solid fa-heart-pulse wms-sidebar-icon" aria-hidden="true"></i>
<span data-wms-sidebar-label>{{ __('Health Check') }}</span>
</a>
<flux:menu.radio.group>
<flux:menu.item :href="route('profile.edit')" icon="cog" wire:navigate>
{{ __('Settings') }}
</flux:menu.item>
</flux:menu.radio.group>
<a href="/admin" class="wms-sidebar-link" title="{{ __('Platform Admin') }}">
<i class="fa-solid fa-screwdriver-wrench wms-sidebar-icon" aria-hidden="true"></i>
<span data-wms-sidebar-label>{{ __('Platform Admin') }}</span>
</a>
<flux:menu.separator />
<div class="wms-user-card" data-wms-sidebar-label>
<div class="wms-user-avatar">{{ auth()->user()->initials() }}</div>
<div class="wms-user-copy">
<div class="wms-user-name">{{ auth()->user()->name }}</div>
<div class="wms-user-email">{{ auth()->user()->email }}</div>
</div>
</div>
</div>
</aside>
<form method="POST" action="{{ route('logout') }}" class="w-full">
@csrf
<flux:menu.item
as="button"
type="submit"
icon="arrow-right-start-on-rectangle"
class="w-full cursor-pointer"
data-test="logout-button"
>
{{ __('Log out') }}
</flux:menu.item>
</form>
</flux:menu>
</flux:dropdown>
</flux:header>
<div class="wms-main-column">
<header class="wms-mobile-header">
<button type="button" class="wms-mobile-menu" data-wms-mobile-open aria-label="{{ __('Open navigation') }}">
<i class="fa-solid fa-bars" aria-hidden="true"></i>
</button>
{{ $slot }}
<a href="{{ route('dashboard') }}" wire:navigate class="wms-mobile-title">
{{ __('Warehouse Management System') }}
</a>
<flux:dropdown position="top" align="end">
<flux:profile
:initials="auth()->user()->initials()"
icon-trailing="chevron-down"
/>
<flux:menu>
<flux:menu.radio.group>
<div class="p-0 text-sm font-normal">
<div class="flex items-center gap-2 px-1 py-1.5 text-start text-sm">
<flux:avatar
:name="auth()->user()->name"
:initials="auth()->user()->initials()"
/>
<div class="grid flex-1 text-start text-sm leading-tight">
<flux:heading class="truncate">{{ auth()->user()->name }}</flux:heading>
<flux:text class="truncate">{{ auth()->user()->email }}</flux:text>
</div>
</div>
</div>
</flux:menu.radio.group>
<flux:menu.separator />
<flux:menu.radio.group>
<flux:menu.item :href="route('profile.edit')" icon="cog" wire:navigate>
{{ __('Settings') }}
</flux:menu.item>
</flux:menu.radio.group>
<flux:menu.separator />
<form method="POST" action="{{ route('logout') }}" class="w-full">
@csrf
<flux:menu.item
as="button"
type="submit"
icon="arrow-right-start-on-rectangle"
class="w-full cursor-pointer"
data-test="logout-button"
>
{{ __('Log out') }}
</flux:menu.item>
</form>
</flux:menu>
</flux:dropdown>
</header>
{{ $slot }}
</div>
</div>
@persist('toast')
<flux:toast.group>
@@ -125,5 +180,83 @@
@endpersist
@fluxScripts
<script>
(function () {
const STORAGE_KEY = 'wms-sidebar-state';
function applySidebarState() {
const root = document.documentElement;
const saved = localStorage.getItem(STORAGE_KEY) || 'expanded';
root.dataset.wmsSidebar = saved === 'collapsed' ? 'collapsed' : 'expanded';
document.querySelectorAll('[data-wms-sidebar-toggle]').forEach((button) => {
const expanded = root.dataset.wmsSidebar !== 'collapsed';
button.setAttribute('aria-expanded', expanded ? 'true' : 'false');
button.setAttribute('aria-label', expanded ? '{{ __('Collapse sidebar') }}' : '{{ __('Expand sidebar') }}');
});
}
function closeMobileSidebar() {
document.documentElement.dataset.wmsMobileSidebar = 'closed';
}
function openMobileSidebar() {
document.documentElement.dataset.wmsMobileSidebar = 'open';
}
function bindSidebarControls() {
applySidebarState();
document.querySelectorAll('[data-wms-sidebar-toggle]').forEach((button) => {
if (button.dataset.wmsBound === '1') {
return;
}
button.dataset.wmsBound = '1';
button.addEventListener('click', function () {
const root = document.documentElement;
const next = root.dataset.wmsSidebar === 'collapsed' ? 'expanded' : 'collapsed';
root.dataset.wmsSidebar = next;
localStorage.setItem(STORAGE_KEY, next);
applySidebarState();
});
});
document.querySelectorAll('[data-wms-mobile-open]').forEach((button) => {
if (button.dataset.wmsBound === '1') {
return;
}
button.dataset.wmsBound = '1';
button.addEventListener('click', openMobileSidebar);
});
document.querySelectorAll('[data-wms-mobile-close]').forEach((button) => {
if (button.dataset.wmsBound === '1') {
return;
}
button.dataset.wmsBound = '1';
button.addEventListener('click', closeMobileSidebar);
});
document.querySelectorAll('.wms-sidebar-link[wire\\:navigate]').forEach((link) => {
if (link.dataset.wmsMobileBound === '1') {
return;
}
link.dataset.wmsMobileBound = '1';
link.addEventListener('click', closeMobileSidebar);
});
}
document.addEventListener('DOMContentLoaded', bindSidebarControls);
document.addEventListener('livewire:navigated', bindSidebarControls);
})();
</script>
</body>
</html>
resources/views/layouts/auth/card.blade.php
+1 -1
View File
@@ -11,7 +11,7 @@
<x-app-logo-icon class="size-9 fill-current text-black dark:text-white" />
</span>
<span class="sr-only">{{ config('app.name', 'Warehouse Management System') }}</span>
<span class="sr-only">{{ config('app.name', 'Laravel') }}</span>
</a>
<div class="flex flex-col gap-6">
resources/views/layouts/auth/simple.blade.php
+1 -1
View File
@@ -10,7 +10,7 @@
<span class="flex h-9 w-9 mb-1 items-center justify-center rounded-md">
<x-app-logo-icon class="size-9 fill-current text-black dark:text-white" />
</span>
<span class="sr-only">{{ config('app.name', 'Warehouse Management System') }}</span>
<span class="sr-only">{{ config('app.name', 'Laravel') }}</span>
</a>
<div class="flex flex-col gap-6">
{{ $slot }}
resources/views/layouts/auth/split.blade.php
+2 -2
View File
@@ -11,7 +11,7 @@
<span class="flex h-10 w-10 items-center justify-center rounded-md">
<x-app-logo-icon class="me-2 h-7 fill-current text-white" />
</span>
{{ config('app.name', 'Warehouse Management System') }}
{{ config('app.name', 'Laravel') }}
</a>
@php
@@ -32,7 +32,7 @@
<x-app-logo-icon class="size-9 fill-current text-black dark:text-white" />
</span>
<span class="sr-only">{{ config('app.name', 'Warehouse Management System') }}</span>
<span class="sr-only">{{ config('app.name', 'Laravel') }}</span>
</a>
{{ $slot }}
</div>
resources/views/partials/head.blade.php
+5 -16
View File
@@ -1,24 +1,13 @@
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
<meta name="application-name" content="{{ config('app.name', 'Warehouse Management System') }}" />
<meta name="apple-mobile-web-app-title" content="WMS" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="theme-color" content="#0d2a4a" />
<meta name="msapplication-TileColor" content="#08142a" />
<meta name="msapplication-config" content="/favicons/browserconfig.xml" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>
{{ filled($title ?? null) ? $title.' - '.config('app.name', 'Warehouse Management System') : config('app.name', 'Warehouse Management System') }}
{{ filled($title ?? null) ? $title.' - '.config('app.name', 'Laravel') : config('app.name', 'Laravel') }}
</title>
<link rel="icon" type="image/x-icon" href="/favicons/favicon.ico" />
<link rel="icon" type="image/svg+xml" href="/favicons/favicon.svg" />
<link rel="icon" type="image/png" sizes="16x16" href="/favicons/favicon-16x16.png" />
<link rel="icon" type="image/png" sizes="32x32" href="/favicons/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="96x96" href="/favicons/favicon-96x96.png" />
<link rel="apple-touch-icon" sizes="180x180" href="/favicons/apple-touch-icon.png" />
<link rel="manifest" href="/favicons/site.webmanifest" />
<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
@fonts
resources/views/welcome.blade.php
+6 -2
View File
@@ -4,7 +4,11 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{{ __('Welcome') }} - {{ config('app.name', 'Warehouse Management System') }}</title>
<title>{{ __('Welcome') }} - {{ config('app.name', 'Laravel') }}</title>
<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="icon" type="image/x-icon" href="/favicons/favicon.ico">
<link rel="icon" type="image/svg+xml" href="/favicons/favicon.svg">
@@ -58,7 +62,7 @@
<main class="flex max-w-[335px] w-full flex-col-reverse lg:max-w-4xl lg:flex-row">
<div class="text-[13px] leading-[20px] flex-1 p-6 pb-12 lg:p-20 bg-white dark:bg-[#161615] dark:text-[#EDEDEC] shadow-[inset_0px_0px_0px_1px_rgba(26,26,0,0.16)] dark:shadow-[inset_0px_0px_0px_1px_#fffaed2d] rounded-es-lg rounded-ee-lg lg:rounded-ss-lg lg:rounded-ee-none">
<h1 class="mb-1 font-medium">Let's get started</h1>
<p class="mb-2 text-[#706f6c] dark:text-[#A1A09A]">Warehouse Management System provides a secure, responsive platform for warehouse operations. <br>We suggest starting with the following.</p>
<p class="mb-2 text-[#706f6c] dark:text-[#A1A09A]">Laravel has an incredibly rich ecosystem. <br>We suggest starting with the following.</p>
<ul class="flex flex-col mb-4 lg:mb-6">
<li class="flex items-center gap-4 py-2 relative before:border-l before:border-[#e3e3e0] dark:before:border-[#3E3E3A] before:top-1/2 before:bottom-0 before:left-[0.4rem] before:absolute">
<span class="relative py-1 bg-white dark:bg-[#161615]">