Committing laravel (part 4)
committing blade templating files and components that might come in handy
This commit is contained in:
parent
82f958e5da
commit
e5439ac63f
31 changed files with 2447 additions and 0 deletions
20
resources/views/components/calendar/index.blade.php
Normal file
20
resources/views/components/calendar/index.blade.php
Normal file
|
|
@ -0,0 +1,20 @@
|
||||||
|
<div
|
||||||
|
data-tw-merge
|
||||||
|
{{ $attributes->class(['full-calendar'])->merge($attributes->whereDoesntStartWith('class')->getAttributes()) }}
|
||||||
|
></div>
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('vendors')
|
||||||
|
@vite('resources/js/vendor/calendar/index.js')
|
||||||
|
@vite('resources/js/vendor/calendar/plugins/interaction.js')
|
||||||
|
@vite('resources/js/vendor/calendar/plugins/day-grid.js')
|
||||||
|
@vite('resources/js/vendor/calendar/plugins/time-grid.js')
|
||||||
|
@vite('resources/js/vendor/calendar/plugins/list.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/components/calendar/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
|
|
@ -0,0 +1,20 @@
|
||||||
|
<!-- BEGIN: Dark Mode Switcher -->
|
||||||
|
<div
|
||||||
|
class="dark-mode-switcher {{ $darkMode ? 'dark-mode-switcher--active' : '' }} box group fixed bottom-0 right-0 z-50 mb-10 mr-10 flex h-12 w-40 cursor-pointer items-center justify-center rounded-full border shadow-md"
|
||||||
|
data-url="{{ route('dark-mode-switcher') }}"
|
||||||
|
>
|
||||||
|
<div class="mr-4 text-slate-600 dark:text-slate-200">Dark Mode</div>
|
||||||
|
<div @class([
|
||||||
|
'border w-[38px] h-[24px] p-px outline-none rounded-full relative cursor-pointer',
|
||||||
|
'before:content-[\'\'] before:w-[22px] before:h-[22px] before:transition-all before:duration-200 before:shadow-[1px_1px_3px_rgba(0,0,0,0.25)] before:absolute before:inset-y-0 before:my-auto before:rounded-full',
|
||||||
|
'group-[.dark-mode-switcher--active]:bg-primary group-[.dark-mode-switcher--active]:border-primary',
|
||||||
|
'group-[.dark-mode-switcher--active]:before:ml-[13px] group-[.dark-mode-switcher--active]:before:bg-white',
|
||||||
|
])></div>
|
||||||
|
</div>
|
||||||
|
<!-- END: Dark Mode Switcher -->
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/components/dark-mode-switcher/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
15
resources/views/components/donut-chart/index.blade.php
Normal file
15
resources/views/components/donut-chart/index.blade.php
Normal file
|
|
@ -0,0 +1,15 @@
|
||||||
|
@props(['width' => 'w-auto', 'height' => 'h-auto'])
|
||||||
|
|
||||||
|
<div class="{{ $width }} {{ $height }}">
|
||||||
|
<x-base.chart
|
||||||
|
class="donut-chart"
|
||||||
|
{{ $attributes->merge($attributes->whereDoesntStartWith('class')->getAttributes()) }}
|
||||||
|
>
|
||||||
|
</x-base.chart>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/components/donut-chart/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
@props(['width' => 'w-auto', 'height' => 'h-auto'])
|
||||||
|
|
||||||
|
<div class="{{ $width }} {{ $height }}">
|
||||||
|
<x-base.chart
|
||||||
|
class="horizontal-bar-chart"
|
||||||
|
{{ $attributes->merge($attributes->whereDoesntStartWith('class')->getAttributes()) }}
|
||||||
|
>
|
||||||
|
</x-base.chart>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/components/horizontal-bar-chart/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
6
resources/views/components/leaflet-map/index.blade.php
Normal file
6
resources/views/components/leaflet-map/index.blade.php
Normal file
|
|
@ -0,0 +1,6 @@
|
||||||
|
<x-base.leaflet-map-loader
|
||||||
|
lat="-6.2425342"
|
||||||
|
long="106.8626478"
|
||||||
|
apiKey="1e86fd5a7f60486a8e899411776f60d5"
|
||||||
|
{{ $attributes->merge($attributes->whereDoesntStartWith('class')->getAttributes()) }}
|
||||||
|
/>
|
||||||
15
resources/views/components/line-chart/index.blade.php
Normal file
15
resources/views/components/line-chart/index.blade.php
Normal file
|
|
@ -0,0 +1,15 @@
|
||||||
|
@props(['width' => 'w-auto', 'height' => 'h-auto'])
|
||||||
|
|
||||||
|
<div class="{{ $width }} {{ $height }}">
|
||||||
|
<x-base.chart
|
||||||
|
class="line-chart"
|
||||||
|
{{ $attributes->merge($attributes->whereDoesntStartWith('class')->getAttributes()) }}
|
||||||
|
>
|
||||||
|
</x-base.chart>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/components/line-chart/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
|
|
@ -0,0 +1,28 @@
|
||||||
|
<!-- BEGIN: Main Color Switcher -->
|
||||||
|
<div
|
||||||
|
class="fixed bottom-0 right-0 z-50 flex items-center justify-center h-12 px-5 mb-10 border rounded-full shadow-md box mr-52">
|
||||||
|
<div class="hidden mr-4 text-slate-600 dark:text-slate-200 sm:block">
|
||||||
|
Color Scheme
|
||||||
|
</div>
|
||||||
|
<a
|
||||||
|
class="{{ $colorScheme == 'default' ? 'border-slate-300 dark:border-darkmode-800/80' : 'border-white dark:border-darkmode-600' }} mr-1 block h-8 w-8 cursor-pointer rounded-full border-4 bg-blue-800 hover:border-slate-200"
|
||||||
|
href="{{ route('color-scheme-switcher', ['color_scheme' => 'default']) }}"
|
||||||
|
></a>
|
||||||
|
<a
|
||||||
|
class="{{ $colorScheme == 'theme-1' ? 'border-slate-300 dark:border-darkmode-800/80' : 'border-white dark:border-darkmode-600' }} mr-1 block h-8 w-8 cursor-pointer rounded-full border-4 bg-emerald-900 hover:border-slate-200"
|
||||||
|
href="{{ route('color-scheme-switcher', ['color_scheme' => 'theme-1']) }}"
|
||||||
|
></a>
|
||||||
|
<a
|
||||||
|
class="{{ $colorScheme == 'theme-2' ? 'border-slate-300 dark:border-darkmode-800/80' : 'border-white dark:border-darkmode-600' }} mr-1 block h-8 w-8 cursor-pointer rounded-full border-4 bg-blue-900 hover:border-slate-200"
|
||||||
|
href="{{ route('color-scheme-switcher', ['color_scheme' => 'theme-2']) }}"
|
||||||
|
></a>
|
||||||
|
<a
|
||||||
|
class="{{ $colorScheme == 'theme-3' ? 'border-slate-300 dark:border-darkmode-800/80' : 'border-white dark:border-darkmode-600' }} mr-1 block h-8 w-8 cursor-pointer rounded-full border-4 bg-cyan-900 hover:border-slate-200"
|
||||||
|
href="{{ route('color-scheme-switcher', ['color_scheme' => 'theme-3']) }}"
|
||||||
|
></a>
|
||||||
|
<a
|
||||||
|
class="{{ $colorScheme == 'theme-4' ? 'border-slate-300 dark:border-darkmode-800/80' : 'border-white dark:border-darkmode-600' }} block h-8 w-8 cursor-pointer rounded-full border-4 bg-indigo-900 hover:border-slate-200"
|
||||||
|
href="{{ route('color-scheme-switcher', ['color_scheme' => 'theme-4']) }}"
|
||||||
|
></a>
|
||||||
|
</div>
|
||||||
|
<!-- END: Main Color Switcher -->
|
||||||
133
resources/views/components/mobile-menu/index.blade.php
Normal file
133
resources/views/components/mobile-menu/index.blade.php
Normal file
|
|
@ -0,0 +1,133 @@
|
||||||
|
<!-- BEGIN: Mobile Menu -->
|
||||||
|
<div @class([
|
||||||
|
'mobile-menu group w-full fixed bg-primary/90 z-[60] border-b border-white/[0.08] -mt-5 -mx-3 sm:-mx-8 mb-6 dark:bg-darkmode-800/90 md:hidden',
|
||||||
|
"before:content-[''] before:w-full before:h-screen before:z-10 before:fixed before:inset-x-0 before:bg-black/90 before:transition-opacity before:duration-200 before:ease-in-out",
|
||||||
|
'before:invisible before:opacity-0',
|
||||||
|
'[&.mobile-menu--active]:before:visible [&.mobile-menu--active]:before:opacity-100',
|
||||||
|
])>
|
||||||
|
<div class="flex h-[70px] items-center px-3 sm:px-8">
|
||||||
|
<a
|
||||||
|
class="mr-auto flex"
|
||||||
|
href=""
|
||||||
|
>
|
||||||
|
<img
|
||||||
|
class="w-6"
|
||||||
|
src="{{ Vite::asset('resources/images/logo.svg') }}"
|
||||||
|
alt="Midone Tailwind HTML Admin Template"
|
||||||
|
/>
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
class="mobile-menu-toggler"
|
||||||
|
href="#"
|
||||||
|
>
|
||||||
|
<x-base.lucide
|
||||||
|
class="h-8 w-8 -rotate-90 transform text-white"
|
||||||
|
icon="BarChart2"
|
||||||
|
/>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div @class([
|
||||||
|
'scrollable h-screen z-20 top-0 left-0 w-[270px] -ml-[100%] bg-primary transition-all duration-300 ease-in-out dark:bg-darkmode-800',
|
||||||
|
'[&[data-simplebar]]:fixed [&_.simplebar-scrollbar]:before:bg-black/50',
|
||||||
|
'group-[.mobile-menu--active]:ml-0',
|
||||||
|
])>
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
@class([
|
||||||
|
'fixed top-0 right-0 mt-4 mr-4 transition-opacity duration-200 ease-in-out',
|
||||||
|
'invisible opacity-0',
|
||||||
|
'group-[.mobile-menu--active]:visible group-[.mobile-menu--active]:opacity-100',
|
||||||
|
])
|
||||||
|
>
|
||||||
|
<x-base.lucide
|
||||||
|
class="mobile-menu-toggler h-8 w-8 -rotate-90 transform text-white"
|
||||||
|
icon="XCircle"
|
||||||
|
/>
|
||||||
|
</a>
|
||||||
|
<ul class="py-2">
|
||||||
|
<!-- BEGIN: First Child -->
|
||||||
|
@foreach ($sideMenu as $menuKey => $menu)
|
||||||
|
@if ($menu == 'divider')
|
||||||
|
<li class="menu__divider my-6"></li>
|
||||||
|
@else
|
||||||
|
<li>
|
||||||
|
<a
|
||||||
|
class="{{ $firstLevelActiveIndex == $menuKey ? 'menu menu--active' : 'menu' }}"
|
||||||
|
href="{{ isset($menu['route_name']) ? route($menu['route_name'], $menu['params']) : 'javascript:;' }}"
|
||||||
|
>
|
||||||
|
<div class="menu__icon">
|
||||||
|
<x-base.lucide icon="{{ $menu['icon'] }}" />
|
||||||
|
</div>
|
||||||
|
<div class="menu__title">
|
||||||
|
{{ $menu['title'] }}
|
||||||
|
@if (isset($menu['sub_menu']))
|
||||||
|
<div
|
||||||
|
class="menu__sub-icon {{ $firstLevelActiveIndex == $menuKey ? 'transform rotate-180' : '' }}">
|
||||||
|
<x-base.lucide icon="ChevronDown" />
|
||||||
|
</div>
|
||||||
|
@endif
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
@if (isset($menu['sub_menu']))
|
||||||
|
<ul class="{{ $firstLevelActiveIndex == $menuKey ? 'menu__sub-open' : '' }}">
|
||||||
|
@foreach ($menu['sub_menu'] as $subMenuKey => $subMenu)
|
||||||
|
<li>
|
||||||
|
<a
|
||||||
|
class="{{ $secondLevelActiveIndex == $subMenuKey ? 'menu menu--active' : 'menu' }}"
|
||||||
|
href="{{ isset($subMenu['route_name']) ? route($subMenu['route_name'], $subMenu['params']) : 'javascript:;' }}"
|
||||||
|
>
|
||||||
|
<div class="menu__icon">
|
||||||
|
<x-base.lucide icon="{{ $subMenu['icon'] }}" />
|
||||||
|
</div>
|
||||||
|
<div class="menu__title">
|
||||||
|
{{ $subMenu['title'] }}
|
||||||
|
@if (isset($subMenu['sub_menu']))
|
||||||
|
<div
|
||||||
|
class="menu__sub-icon {{ $secondLevelActiveIndex == $subMenuKey ? 'transform rotate-180' : '' }}">
|
||||||
|
<x-base.lucide icon="ChevronDown" />
|
||||||
|
</div>
|
||||||
|
@endif
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
@if (isset($subMenu['sub_menu']))
|
||||||
|
<ul
|
||||||
|
class="{{ $secondLevelActiveIndex == $subMenuKey ? 'menu__sub-open' : '' }}">
|
||||||
|
@foreach ($subMenu['sub_menu'] as $lastSubMenuKey => $lastSubMenu)
|
||||||
|
<li>
|
||||||
|
<a
|
||||||
|
class="{{ $thirdLevelActiveIndex == $lastSubMenuKey ? 'menu menu--active' : 'menu' }}"
|
||||||
|
href="{{ isset($lastSubMenu['route_name']) ? route($lastSubMenu['route_name'], $lastSubMenu['params']) : 'javascript:;' }}"
|
||||||
|
>
|
||||||
|
<div class="menu__icon">
|
||||||
|
<x-base.lucide icon="{{ $lastSubMenu['icon'] }}" />
|
||||||
|
</div>
|
||||||
|
<div class="menu__title">{{ $lastSubMenu['title'] }}</div>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
@endforeach
|
||||||
|
</ul>
|
||||||
|
@endif
|
||||||
|
</li>
|
||||||
|
@endforeach
|
||||||
|
</ul>
|
||||||
|
@endif
|
||||||
|
</li>
|
||||||
|
@endif
|
||||||
|
@endforeach
|
||||||
|
<!-- END: First Child -->
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- END: Mobile Menu -->
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('vendors')
|
||||||
|
@vite('resources/js/vendor/simplebar/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/components/mobile-menu/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
15
resources/views/components/pie-chart/index.blade.php
Normal file
15
resources/views/components/pie-chart/index.blade.php
Normal file
|
|
@ -0,0 +1,15 @@
|
||||||
|
@props(['width' => 'w-auto', 'height' => 'h-auto'])
|
||||||
|
|
||||||
|
<div class="{{ $width }} {{ $height }}">
|
||||||
|
<x-base.chart
|
||||||
|
class="pie-chart"
|
||||||
|
{{ $attributes->merge($attributes->whereDoesntStartWith('class')->getAttributes()) }}
|
||||||
|
>
|
||||||
|
</x-base.chart>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/components/pie-chart/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
@props(['width' => 'w-auto', 'height' => 'h-auto'])
|
||||||
|
|
||||||
|
<div class="{{ $width }} {{ $height }}">
|
||||||
|
<x-base.chart
|
||||||
|
class="report-bar-chart-1"
|
||||||
|
{{ $attributes->merge($attributes->whereDoesntStartWith('class')->getAttributes()) }}
|
||||||
|
>
|
||||||
|
</x-base.chart>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/components/report-bar-chart-1/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
15
resources/views/components/report-bar-chart/index.blade.php
Normal file
15
resources/views/components/report-bar-chart/index.blade.php
Normal file
|
|
@ -0,0 +1,15 @@
|
||||||
|
@props(['width' => 'w-auto', 'height' => 'h-auto'])
|
||||||
|
|
||||||
|
<div class="{{ $width }} {{ $height }}">
|
||||||
|
<x-base.chart
|
||||||
|
class="report-bar-chart"
|
||||||
|
{{ $attributes->merge($attributes->whereDoesntStartWith('class')->getAttributes()) }}
|
||||||
|
>
|
||||||
|
</x-base.chart>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/components/report-bar-chart/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
@props(['width' => 'w-auto', 'height' => 'h-auto'])
|
||||||
|
|
||||||
|
<div class="{{ $width }} {{ $height }}">
|
||||||
|
<x-base.chart
|
||||||
|
class="report-donut-chart-1"
|
||||||
|
{{ $attributes->merge($attributes->whereDoesntStartWith('class')->getAttributes()) }}
|
||||||
|
>
|
||||||
|
</x-base.chart>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/components/report-donut-chart-1/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
@props(['width' => 'w-auto', 'height' => 'h-auto'])
|
||||||
|
|
||||||
|
<div class="{{ $width }} {{ $height }}">
|
||||||
|
<x-base.chart
|
||||||
|
class="report-donut-chart-2"
|
||||||
|
{{ $attributes->merge($attributes->whereDoesntStartWith('class')->getAttributes()) }}
|
||||||
|
>
|
||||||
|
</x-base.chart>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/components/report-donut-chart-2/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
@props(['width' => 'w-auto', 'height' => 'h-auto'])
|
||||||
|
|
||||||
|
<div class="{{ $width }} {{ $height }}">
|
||||||
|
<x-base.chart
|
||||||
|
id="report-donut-chart"
|
||||||
|
{{ $attributes->merge($attributes->whereDoesntStartWith('class')->getAttributes()) }}
|
||||||
|
>
|
||||||
|
</x-base.chart>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/components/report-donut-chart/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
15
resources/views/components/report-line-chart/index.blade.php
Normal file
15
resources/views/components/report-line-chart/index.blade.php
Normal file
|
|
@ -0,0 +1,15 @@
|
||||||
|
@props(['width' => 'w-auto', 'height' => 'h-auto'])
|
||||||
|
|
||||||
|
<div class="{{ $width }} {{ $height }}">
|
||||||
|
<x-base.chart
|
||||||
|
id="report-line-chart"
|
||||||
|
{{ $attributes->merge($attributes->whereDoesntStartWith('class')->getAttributes()) }}
|
||||||
|
>
|
||||||
|
</x-base.chart>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/components/report-line-chart/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
15
resources/views/components/report-pie-chart/index.blade.php
Normal file
15
resources/views/components/report-pie-chart/index.blade.php
Normal file
|
|
@ -0,0 +1,15 @@
|
||||||
|
@props(['width' => 'w-auto', 'height' => 'h-auto'])
|
||||||
|
|
||||||
|
<div class="{{ $width }} {{ $height }}">
|
||||||
|
<x-base.chart
|
||||||
|
id="report-pie-chart"
|
||||||
|
{{ $attributes->merge($attributes->whereDoesntStartWith('class')->getAttributes()) }}
|
||||||
|
>
|
||||||
|
</x-base.chart>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/components/report-pie-chart/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
@props(['width' => 'w-auto', 'height' => 'h-auto'])
|
||||||
|
|
||||||
|
<div class="{{ $width }} {{ $height }}">
|
||||||
|
<x-base.chart
|
||||||
|
class="simple-line-chart-1"
|
||||||
|
{{ $attributes->merge($attributes->whereDoesntStartWith('class')->getAttributes()) }}
|
||||||
|
>
|
||||||
|
</x-base.chart>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/components/simple-line-chart-1/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
@props(['width' => 'w-auto', 'height' => 'h-auto'])
|
||||||
|
|
||||||
|
<div class="{{ $width }} {{ $height }}">
|
||||||
|
<x-base.chart
|
||||||
|
class="simple-line-chart-2"
|
||||||
|
{{ $attributes->merge($attributes->whereDoesntStartWith('class')->getAttributes()) }}
|
||||||
|
>
|
||||||
|
</x-base.chart>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/components/simple-line-chart-2/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
@props(['width' => 'w-auto', 'height' => 'h-auto'])
|
||||||
|
|
||||||
|
<div class="{{ $width }} {{ $height }}">
|
||||||
|
<x-base.chart
|
||||||
|
class="simple-line-chart-3"
|
||||||
|
{{ $attributes->merge($attributes->whereDoesntStartWith('class')->getAttributes()) }}
|
||||||
|
>
|
||||||
|
</x-base.chart>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/components/simple-line-chart-3/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
@props(['width' => 'w-auto', 'height' => 'h-auto'])
|
||||||
|
|
||||||
|
<div class="{{ $width }} {{ $height }}">
|
||||||
|
<x-base.chart
|
||||||
|
class="simple-line-chart-4"
|
||||||
|
{{ $attributes->merge($attributes->whereDoesntStartWith('class')->getAttributes()) }}
|
||||||
|
>
|
||||||
|
</x-base.chart>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/components/simple-line-chart-4/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
15
resources/views/components/simple-line-chart/index.blade.php
Normal file
15
resources/views/components/simple-line-chart/index.blade.php
Normal file
|
|
@ -0,0 +1,15 @@
|
||||||
|
@props(['width' => 'w-auto', 'height' => 'h-auto'])
|
||||||
|
|
||||||
|
<div class="{{ $width }} {{ $height }}">
|
||||||
|
<x-base.chart
|
||||||
|
class="simple-line-chart"
|
||||||
|
{{ $attributes->merge($attributes->whereDoesntStartWith('class')->getAttributes()) }}
|
||||||
|
>
|
||||||
|
</x-base.chart>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/components/simple-line-chart/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
@props(['width' => 'w-auto', 'height' => 'h-auto'])
|
||||||
|
|
||||||
|
<div class="{{ $width }} {{ $height }}">
|
||||||
|
<x-base.chart
|
||||||
|
class="stacked-bar-chart-1"
|
||||||
|
{{ $attributes->merge($attributes->whereDoesntStartWith('class')->getAttributes()) }}
|
||||||
|
>
|
||||||
|
</x-base.chart>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/components/stacked-bar-chart-1/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
15
resources/views/components/stacked-bar-chart/index.blade.php
Normal file
15
resources/views/components/stacked-bar-chart/index.blade.php
Normal file
|
|
@ -0,0 +1,15 @@
|
||||||
|
@props(['width' => 'w-auto', 'height' => 'h-auto'])
|
||||||
|
|
||||||
|
<div class="{{ $width }} {{ $height }}">
|
||||||
|
<x-base.chart
|
||||||
|
class="stacked-bar-chart"
|
||||||
|
{{ $attributes->merge($attributes->whereDoesntStartWith('class')->getAttributes()) }}
|
||||||
|
>
|
||||||
|
</x-base.chart>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/components/stacked-bar-chart/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
261
resources/views/components/top-bar/index.blade.php
Normal file
261
resources/views/components/top-bar/index.blade.php
Normal file
|
|
@ -0,0 +1,261 @@
|
||||||
|
<!-- BEGIN: Top Bar -->
|
||||||
|
<div
|
||||||
|
class="top-bar-boxed relative z-[51] -mx-3 mt-12 mb-12 h-[70px] border-b border-white/[0.08] px-3 sm:-mx-8 sm:px-8 md:-mt-5 md:pt-0">
|
||||||
|
<div class="flex h-full items-center">
|
||||||
|
<!-- BEGIN: Logo -->
|
||||||
|
<a
|
||||||
|
class="-intro-x hidden md:flex"
|
||||||
|
href=""
|
||||||
|
>
|
||||||
|
<img
|
||||||
|
class="w-6"
|
||||||
|
src="{{ Vite::asset('resources/images/logo.svg') }}"
|
||||||
|
alt="Icewall Tailwind HTML Admin Template"
|
||||||
|
/>
|
||||||
|
<span class="ml-3 text-lg text-white"> Icewall </span>
|
||||||
|
</a>
|
||||||
|
<!-- END: Logo -->
|
||||||
|
<!-- BEGIN: Breadcrumb -->
|
||||||
|
<x-base.breadcrumb
|
||||||
|
class="-intro-x mr-auto h-full border-white/[0.08] md:ml-10 md:border-l md:pl-10"
|
||||||
|
light
|
||||||
|
>
|
||||||
|
<x-base.breadcrumb.link :index="0">Application</x-base.breadcrumb.link>
|
||||||
|
<x-base.breadcrumb.link
|
||||||
|
:index="1"
|
||||||
|
:active="true"
|
||||||
|
>
|
||||||
|
Dashboard
|
||||||
|
</x-base.breadcrumb.link>
|
||||||
|
</x-base.breadcrumb>
|
||||||
|
<!-- END: Breadcrumb -->
|
||||||
|
<!-- BEGIN: Search -->
|
||||||
|
<div class="intro-x relative mr-3 sm:mr-6">
|
||||||
|
<div class="search hidden sm:block">
|
||||||
|
<x-base.form-input
|
||||||
|
class="w-56 rounded-full border-transparent bg-slate-200 pr-8 shadow-none transition-[width] duration-300 ease-in-out focus:w-72 focus:border-transparent dark:bg-darkmode-400/70"
|
||||||
|
type="text"
|
||||||
|
placeholder="Search..."
|
||||||
|
/>
|
||||||
|
<x-base.lucide
|
||||||
|
class="absolute inset-y-0 right-0 my-auto mr-3 h-5 w-5 text-slate-600 dark:text-slate-500"
|
||||||
|
icon="Search"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<a
|
||||||
|
class="relative text-white/70 sm:hidden"
|
||||||
|
href=""
|
||||||
|
>
|
||||||
|
<x-base.lucide
|
||||||
|
class="h-5 w-5 dark:text-slate-500"
|
||||||
|
icon="Search"
|
||||||
|
/>
|
||||||
|
</a>
|
||||||
|
<x-base.transition
|
||||||
|
class="search-result absolute right-0 z-10 mt-[3px] hidden"
|
||||||
|
selector=".show"
|
||||||
|
enter="transition-all ease-linear duration-150"
|
||||||
|
enterFrom="mt-5 invisible opacity-0 translate-y-1"
|
||||||
|
enterTo="mt-[3px] visible opacity-100 translate-y-0"
|
||||||
|
leave="transition-all ease-linear duration-150"
|
||||||
|
leaveFrom="mt-[3px] visible opacity-100 translate-y-0"
|
||||||
|
leaveTo="mt-5 invisible opacity-0 translate-y-1"
|
||||||
|
>
|
||||||
|
<div class="box w-[450px] p-5">
|
||||||
|
<div class="mb-2 font-medium">Pages</div>
|
||||||
|
<div class="mb-5">
|
||||||
|
<a
|
||||||
|
class="flex items-center"
|
||||||
|
href=""
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="flex h-8 w-8 items-center justify-center rounded-full bg-success/20 text-success dark:bg-success/10">
|
||||||
|
<x-base.lucide
|
||||||
|
class="h-4 w-4"
|
||||||
|
icon="Inbox"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="ml-3">Mail Settings</div>
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
class="mt-2 flex items-center"
|
||||||
|
href=""
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="flex h-8 w-8 items-center justify-center rounded-full bg-pending/10 text-pending">
|
||||||
|
<x-base.lucide
|
||||||
|
class="h-4 w-4"
|
||||||
|
icon="Users"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="ml-3">Users & Permissions</div>
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
class="mt-2 flex items-center"
|
||||||
|
href=""
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="flex h-8 w-8 items-center justify-center rounded-full bg-primary/10 text-primary/80 dark:bg-primary/20">
|
||||||
|
<x-base.lucide
|
||||||
|
class="h-4 w-4"
|
||||||
|
icon="CreditCard"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="ml-3">Transactions Report</div>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="mb-2 font-medium">Users</div>
|
||||||
|
<div class="mb-5">
|
||||||
|
@foreach (array_slice($fakers, 0, 4) as $faker)
|
||||||
|
<a
|
||||||
|
class="mt-2 flex items-center"
|
||||||
|
href=""
|
||||||
|
>
|
||||||
|
<div class="image-fit h-8 w-8">
|
||||||
|
<img
|
||||||
|
class="rounded-full"
|
||||||
|
src="{{ Vite::asset($faker['photos'][0]) }}"
|
||||||
|
alt="Midone Tailwind HTML Admin Template"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="ml-3">{{ $faker['users'][0]['name'] }}</div>
|
||||||
|
<div class="ml-auto w-48 truncate text-right text-xs text-slate-500">
|
||||||
|
{{ $faker['users'][0]['email'] }}
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
@endforeach
|
||||||
|
</div>
|
||||||
|
<div class="mb-2 font-medium">Products</div>
|
||||||
|
@foreach (array_slice($fakers, 0, 4) as $faker)
|
||||||
|
<a
|
||||||
|
class="mt-2 flex items-center"
|
||||||
|
href=""
|
||||||
|
>
|
||||||
|
<div class="image-fit h-8 w-8">
|
||||||
|
<img
|
||||||
|
class="rounded-full"
|
||||||
|
src="{{ Vite::asset($faker['images'][0]) }}"
|
||||||
|
alt="Midone Tailwind HTML Admin Template"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="ml-3">{{ $faker['products'][0]['name'] }}</div>
|
||||||
|
<div class="ml-auto w-48 truncate text-right text-xs text-slate-500">
|
||||||
|
{{ $faker['products'][0]['category'] }}
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
@endforeach
|
||||||
|
</div>
|
||||||
|
</x-base.transition>
|
||||||
|
</div>
|
||||||
|
<!-- END: Search -->
|
||||||
|
<!-- BEGIN: Notifications -->
|
||||||
|
<x-base.popover class="intro-x mr-4 sm:mr-6">
|
||||||
|
<x-base.popover.button
|
||||||
|
class="relative block text-white/70 outline-none before:absolute before:top-[-2px] before:right-0 before:h-[8px] before:w-[8px] before:rounded-full before:bg-danger before:content-['']"
|
||||||
|
>
|
||||||
|
<x-base.lucide
|
||||||
|
class="h-5 w-5 dark:text-slate-500"
|
||||||
|
icon="Bell"
|
||||||
|
/>
|
||||||
|
</x-base.popover.button>
|
||||||
|
<x-base.popover.panel class="mt-2 w-[280px] p-5 sm:w-[350px]">
|
||||||
|
<div class="mb-5 font-medium">Notifications</div>
|
||||||
|
@foreach (array_slice($fakers, 0, 5) as $fakerKey => $faker)
|
||||||
|
<div @class([
|
||||||
|
'cursor-pointer relative flex items-center',
|
||||||
|
'mt-5' => $fakerKey,
|
||||||
|
])>
|
||||||
|
<div class="image-fit relative mr-1 h-12 w-12 flex-none">
|
||||||
|
<img
|
||||||
|
class="rounded-full"
|
||||||
|
src="{{ Vite::asset($faker['photos'][0]) }}"
|
||||||
|
alt="Midone Tailwind HTML Admin Template"
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
class="absolute bottom-0 right-0 h-3 w-3 rounded-full border-2 border-white bg-success dark:border-darkmode-600">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="ml-2 overflow-hidden">
|
||||||
|
<div class="flex items-center">
|
||||||
|
<a
|
||||||
|
class="mr-5 truncate font-medium"
|
||||||
|
href=""
|
||||||
|
>
|
||||||
|
{{ $faker['users'][0]['name'] }}
|
||||||
|
</a>
|
||||||
|
<div class="ml-auto whitespace-nowrap text-xs text-slate-400">
|
||||||
|
{{ $faker['times'][0] }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="mt-0.5 w-full truncate text-slate-500">
|
||||||
|
{{ $faker['news'][0]['short_content'] }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
@endforeach
|
||||||
|
</x-base.popover.panel>
|
||||||
|
</x-base.popover>
|
||||||
|
<!-- END: Notifications -->
|
||||||
|
<!-- BEGIN: Account Menu -->
|
||||||
|
<x-base.menu>
|
||||||
|
<x-base.menu.button
|
||||||
|
class="image-fit zoom-in intro-x block h-8 w-8 scale-110 overflow-hidden rounded-full shadow-lg"
|
||||||
|
>
|
||||||
|
<img
|
||||||
|
src="{{ Vite::asset($faker['photos'][0]) }}"
|
||||||
|
alt="Midone Tailwind HTML Admin Template"
|
||||||
|
/>
|
||||||
|
</x-base.menu.button>
|
||||||
|
<x-base.menu.items
|
||||||
|
class="relative mt-px w-56 bg-primary/80 text-white before:absolute before:inset-0 before:z-[-1] before:block before:rounded-md before:bg-black"
|
||||||
|
>
|
||||||
|
<x-base.menu.header class="font-normal">
|
||||||
|
<div class="font-medium">{{ $fakers[0]['users'][0]['name'] }}</div>
|
||||||
|
<div class="mt-0.5 text-xs text-white/70 dark:text-slate-500">
|
||||||
|
{{ $fakers[0]['jobs'][0] }}
|
||||||
|
</div>
|
||||||
|
</x-base.menu.header>
|
||||||
|
<x-base.menu.divider class="bg-white/[0.08]" />
|
||||||
|
<x-base.menu.item class="hover:bg-white/5">
|
||||||
|
<x-base.lucide
|
||||||
|
class="mr-2 h-4 w-4"
|
||||||
|
icon="User"
|
||||||
|
/> Profile
|
||||||
|
</x-base.menu.item>
|
||||||
|
<x-base.menu.item class="hover:bg-white/5">
|
||||||
|
<x-base.lucide
|
||||||
|
class="mr-2 h-4 w-4"
|
||||||
|
icon="Edit"
|
||||||
|
/> Add Account
|
||||||
|
</x-base.menu.item>
|
||||||
|
<x-base.menu.item class="hover:bg-white/5">
|
||||||
|
<x-base.lucide
|
||||||
|
class="mr-2 h-4 w-4"
|
||||||
|
icon="Lock"
|
||||||
|
/> Reset Password
|
||||||
|
</x-base.menu.item>
|
||||||
|
<x-base.menu.item class="hover:bg-white/5">
|
||||||
|
<x-base.lucide
|
||||||
|
class="mr-2 h-4 w-4"
|
||||||
|
icon="HelpCircle"
|
||||||
|
/> Help
|
||||||
|
</x-base.menu.item>
|
||||||
|
<x-base.menu.divider class="bg-white/[0.08]" />
|
||||||
|
<x-base.menu.item class="hover:bg-white/5">
|
||||||
|
<x-base.lucide
|
||||||
|
class="mr-2 h-4 w-4"
|
||||||
|
icon="ToggleRight"
|
||||||
|
/> Logout
|
||||||
|
</x-base.menu.item>
|
||||||
|
</x-base.menu.items>
|
||||||
|
</x-base.menu>
|
||||||
|
<!-- END: Account Menu -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- END: Top Bar -->
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/components/top-bar/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
@props(['width' => 'w-auto', 'height' => 'h-auto'])
|
||||||
|
|
||||||
|
<div class="{{ $width }} {{ $height }}">
|
||||||
|
<x-base.chart
|
||||||
|
class="vertical-bar-chart"
|
||||||
|
{{ $attributes->merge($attributes->whereDoesntStartWith('class')->getAttributes()) }}
|
||||||
|
>
|
||||||
|
</x-base.chart>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/components/vertical-bar-chart/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
67
resources/views/layouts/base.blade.php
Normal file
67
resources/views/layouts/base.blade.php
Normal file
|
|
@ -0,0 +1,67 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<!--
|
||||||
|
Template Name: Icewall - HTML Admin Dashboard Template
|
||||||
|
Author: Left4code
|
||||||
|
Website: http://www.left4code.com/
|
||||||
|
Contact: muhammadrizki@left4code.com
|
||||||
|
Purchase: https://themeforest.net/user/left4code/portfolio
|
||||||
|
Renew Support: https://themeforest.net/user/left4code/portfolio
|
||||||
|
License: You must have a valid license purchased only from themeforest(the above link) in order to legally use the theme for your project.
|
||||||
|
-->
|
||||||
|
<html
|
||||||
|
class="{{ $darkMode ? 'dark' : '' }}{{ $colorScheme != 'default' ? ' ' . $colorScheme : '' }}"
|
||||||
|
lang="{{ str_replace('_', '-', app()->getLocale()) }}"
|
||||||
|
>
|
||||||
|
<!-- BEGIN: Head -->
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<link
|
||||||
|
href="{{ Vite::asset('resources/images/logo.svg') }}"
|
||||||
|
rel="shortcut icon"
|
||||||
|
>
|
||||||
|
<meta
|
||||||
|
name="csrf-token"
|
||||||
|
content="{{ csrf_token() }}"
|
||||||
|
>
|
||||||
|
<meta
|
||||||
|
name="viewport"
|
||||||
|
content="width=device-width, initial-scale=1"
|
||||||
|
>
|
||||||
|
<meta
|
||||||
|
name="description"
|
||||||
|
content="Icewall admin is super flexible, powerful, clean & modern responsive tailwind admin template with unlimited possibilities."
|
||||||
|
>
|
||||||
|
<meta
|
||||||
|
name="keywords"
|
||||||
|
content="admin template, Icewall Admin Template, dashboard template, flat admin template, responsive admin template, web app"
|
||||||
|
>
|
||||||
|
<meta
|
||||||
|
name="author"
|
||||||
|
content="LEFT4CODE"
|
||||||
|
>
|
||||||
|
|
||||||
|
@yield('head')
|
||||||
|
|
||||||
|
<!-- BEGIN: CSS Assets-->
|
||||||
|
@vite('resources/css/app.css')
|
||||||
|
@stack('styles')
|
||||||
|
<!-- END: CSS Assets-->
|
||||||
|
</head>
|
||||||
|
<!-- END: Head -->
|
||||||
|
|
||||||
|
<body>
|
||||||
|
@yield('content')
|
||||||
|
|
||||||
|
@vite('resources/js/app.js')
|
||||||
|
|
||||||
|
<!-- BEGIN: Vendor JS Assets-->
|
||||||
|
@stack('vendors')
|
||||||
|
<!-- END: Vendor JS Assets-->
|
||||||
|
|
||||||
|
<!-- BEGIN: Pages, layouts, components JS Assets-->
|
||||||
|
@stack('scripts')
|
||||||
|
<!-- END: Pages, layouts, components JS Assets-->
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
157
resources/views/layouts/side-menu.blade.php
Normal file
157
resources/views/layouts/side-menu.blade.php
Normal file
|
|
@ -0,0 +1,157 @@
|
||||||
|
@extends('../layouts/base')
|
||||||
|
|
||||||
|
@section('head')
|
||||||
|
@yield('subhead')
|
||||||
|
@endsection
|
||||||
|
|
||||||
|
@section('content')
|
||||||
|
<div
|
||||||
|
class="pt-2 pb-7 before:absolute before:inset-0 before:bg-skew-pattern before:bg-fixed before:bg-no-repeat before:content-[''] dark:before:bg-skew-pattern-dark">
|
||||||
|
<x-dark-mode-switcher />
|
||||||
|
<x-main-color-switcher />
|
||||||
|
<x-mobile-menu />
|
||||||
|
<x-top-bar />
|
||||||
|
<div @class([
|
||||||
|
'relative',
|
||||||
|
"before:content-[''] before:w-[95%] before:z-[-1] before:rounded-[1.3rem] before:bg-white/10 before:h-full before:-mt-4 before:absolute before:mx-auto before:inset-x-0 before:dark:bg-darkmode-400/50",
|
||||||
|
|
||||||
|
// Animation
|
||||||
|
'before:translate-y-[35px] before:opacity-0 before:animate-[0.4s_ease-in-out_0.1s_intro-wrapper] before:animate-fill-mode-forwards',
|
||||||
|
])>
|
||||||
|
<div @class([
|
||||||
|
'translate-y-0 bg-primary flex rounded-[1.3rem] -mt-[7px] md:mt-0 dark:bg-darkmode-400',
|
||||||
|
'before:block before:absolute before:inset-0 before:bg-black/[0.15] before:rounded-[1.3rem] before:z-[-1]',
|
||||||
|
|
||||||
|
// Animation
|
||||||
|
'animate-[0.4s_ease-in-out_0.2s_intro-wrapper] animate-fill-mode-forwards translate-y-[35px]',
|
||||||
|
])>
|
||||||
|
<!-- BEGIN: Side Menu -->
|
||||||
|
<nav class="side-nav hidden w-[105px] overflow-x-hidden px-5 pt-8 pb-16 md:block xl:w-[250px]">
|
||||||
|
<ul>
|
||||||
|
@foreach ($sideMenu as $menuKey => $menu)
|
||||||
|
@if ($menu == 'divider')
|
||||||
|
<li @class([
|
||||||
|
'side-nav__divider my-6',
|
||||||
|
|
||||||
|
// Animation
|
||||||
|
'opacity-0 animate-[0.4s_ease-in-out_0.1s_intro-divider] animate-fill-mode-forwards animate-delay-' .
|
||||||
|
(array_search($menuKey, array_keys($sideMenu)) + 1) * 10,
|
||||||
|
])></li>
|
||||||
|
@else
|
||||||
|
<li>
|
||||||
|
<a
|
||||||
|
href="{{ isset($menu['route_name']) ? route($menu['route_name'], $menu['params']) : 'javascript:;' }}"
|
||||||
|
@class([
|
||||||
|
$firstLevelActiveIndex == $menuKey
|
||||||
|
? 'side-menu side-menu--active'
|
||||||
|
: 'side-menu',
|
||||||
|
|
||||||
|
// Animation
|
||||||
|
'[&:not(.side-menu--active)]:opacity-0 [&:not(.side-menu--active)]:translate-x-[50px] animate-[0.4s_ease-in-out_0.1s_intro-menu] animate-fill-mode-forwards animate-delay-' .
|
||||||
|
(array_search($menuKey, array_keys($sideMenu)) + 1) * 10,
|
||||||
|
])
|
||||||
|
>
|
||||||
|
<div class="side-menu__icon">
|
||||||
|
<x-base.lucide icon="{{ $menu['icon'] }}" />
|
||||||
|
</div>
|
||||||
|
<div class="side-menu__title">
|
||||||
|
{{ $menu['title'] }}
|
||||||
|
@if (isset($menu['sub_menu']))
|
||||||
|
<div
|
||||||
|
class="side-menu__sub-icon {{ $firstLevelActiveIndex == $menuKey ? 'transform rotate-180' : '' }}">
|
||||||
|
<x-base.lucide icon="ChevronDown" />
|
||||||
|
</div>
|
||||||
|
@endif
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
@if (isset($menu['sub_menu']))
|
||||||
|
<ul class="{{ $firstLevelActiveIndex == $menuKey ? 'side-menu__sub-open' : '' }}">
|
||||||
|
@foreach ($menu['sub_menu'] as $subMenuKey => $subMenu)
|
||||||
|
<li>
|
||||||
|
<a
|
||||||
|
href="{{ isset($subMenu['route_name']) ? route($subMenu['route_name'], $subMenu['params']) : 'javascript:;' }}"
|
||||||
|
@class([
|
||||||
|
$secondLevelActiveIndex == $subMenuKey
|
||||||
|
? 'side-menu side-menu--active'
|
||||||
|
: 'side-menu',
|
||||||
|
|
||||||
|
// Animation
|
||||||
|
'[&:not(.side-menu--active)]:opacity-0 [&:not(.side-menu--active)]:translate-x-[50px] animate-[0.4s_ease-in-out_0.1s_intro-menu] animate-fill-mode-forwards animate-delay-' .
|
||||||
|
(array_search($subMenuKey, array_keys($menu['sub_menu'])) + 1) * 10,
|
||||||
|
])
|
||||||
|
>
|
||||||
|
<div class="side-menu__icon">
|
||||||
|
<x-base.lucide icon="{{ $subMenu['icon'] }}" />
|
||||||
|
</div>
|
||||||
|
<div class="side-menu__title">
|
||||||
|
{{ $subMenu['title'] }}
|
||||||
|
@if (isset($subMenu['sub_menu']))
|
||||||
|
<div
|
||||||
|
class="side-menu__sub-icon {{ $secondLevelActiveIndex == $subMenuKey ? 'transform rotate-180' : '' }}">
|
||||||
|
<x-base.lucide icon="ChevronDown" />
|
||||||
|
</div>
|
||||||
|
@endif
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
@if (isset($subMenu['sub_menu']))
|
||||||
|
<ul
|
||||||
|
class="{{ $secondLevelActiveIndex == $subMenuKey ? 'side-menu__sub-open' : '' }}">
|
||||||
|
@foreach ($subMenu['sub_menu'] as $lastSubMenuKey => $lastSubMenu)
|
||||||
|
<li>
|
||||||
|
<a
|
||||||
|
href="{{ isset($lastSubMenu['route_name']) ? route($lastSubMenu['route_name'], $lastSubMenu['params']) : 'javascript:;' }}"
|
||||||
|
@class([
|
||||||
|
$thirdLevelActiveIndex == $lastSubMenuKey
|
||||||
|
? 'side-menu side-menu--active'
|
||||||
|
: 'side-menu',
|
||||||
|
|
||||||
|
// Animation
|
||||||
|
'[&:not(.side-menu--active)]:opacity-0 [&:not(.side-menu--active)]:translate-x-[50px] animate-[0.4s_ease-in-out_0.1s_intro-menu] animate-fill-mode-forwards animate-delay-' .
|
||||||
|
(array_search($lastSubMenuKey, array_keys($subMenu['sub_menu'])) + 1) * 10,
|
||||||
|
])
|
||||||
|
>
|
||||||
|
<div class="side-menu__icon">
|
||||||
|
<x-base.lucide
|
||||||
|
icon="{{ $lastSubMenu['icon'] }}"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="side-menu__title">
|
||||||
|
{{ $lastSubMenu['title'] }}
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
@endforeach
|
||||||
|
</ul>
|
||||||
|
@endif
|
||||||
|
</li>
|
||||||
|
@endforeach
|
||||||
|
</ul>
|
||||||
|
@endif
|
||||||
|
</li>
|
||||||
|
@endif
|
||||||
|
@endforeach
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
<!-- END: Side Menu -->
|
||||||
|
<!-- BEGIN: Content -->
|
||||||
|
<div
|
||||||
|
class="md:max-w-auto min-h-screen min-w-0 max-w-full flex-1 rounded-[1.3rem] bg-slate-100 px-4 pb-10 shadow-sm before:block before:h-px before:w-full before:content-[''] dark:bg-darkmode-700 md:px-[22px]">
|
||||||
|
@yield('subcontent')
|
||||||
|
</div>
|
||||||
|
<!-- END: Content -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
@endsection
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/vendor/tippy/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/layouts/side-menu/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
157
resources/views/layouts/simple-menu.blade.php
Normal file
157
resources/views/layouts/simple-menu.blade.php
Normal file
|
|
@ -0,0 +1,157 @@
|
||||||
|
@extends('../layouts/base')
|
||||||
|
|
||||||
|
@section('head')
|
||||||
|
@yield('subhead')
|
||||||
|
@endsection
|
||||||
|
|
||||||
|
@section('content')
|
||||||
|
<div
|
||||||
|
class="pt-2 pb-7 before:absolute before:inset-0 before:bg-skew-pattern before:bg-fixed before:bg-no-repeat before:content-[''] dark:before:bg-skew-pattern-dark">
|
||||||
|
<x-dark-mode-switcher />
|
||||||
|
<x-main-color-switcher />
|
||||||
|
<x-mobile-menu />
|
||||||
|
<x-top-bar />
|
||||||
|
<div @class([
|
||||||
|
'relative',
|
||||||
|
"before:content-[''] before:w-[95%] before:z-[-1] before:rounded-[1.3rem] before:bg-white/10 before:h-full before:-mt-4 before:absolute before:mx-auto before:inset-x-0 before:dark:bg-darkmode-400/50",
|
||||||
|
|
||||||
|
// Animation
|
||||||
|
'before:translate-y-[35px] before:opacity-0 before:animate-[0.4s_ease-in-out_0.1s_intro-wrapper] before:animate-fill-mode-forwards',
|
||||||
|
])>
|
||||||
|
<div @class([
|
||||||
|
'translate-y-0 bg-primary flex rounded-[1.3rem] -mt-[7px] md:mt-0 dark:bg-darkmode-400',
|
||||||
|
'before:block before:absolute before:inset-0 before:bg-black/[0.15] before:rounded-[1.3rem] before:z-[-1]',
|
||||||
|
|
||||||
|
// Animation
|
||||||
|
'animate-[0.4s_ease-in-out_0.2s_intro-wrapper] animate-fill-mode-forwards translate-y-[35px]',
|
||||||
|
])>
|
||||||
|
<!-- BEGIN: Side Menu -->
|
||||||
|
<nav class="side-nav side-nav--simple hidden w-[105px] overflow-x-hidden px-5 pt-8 pb-16 md:block">
|
||||||
|
<ul>
|
||||||
|
@foreach ($simpleMenu as $menuKey => $menu)
|
||||||
|
@if ($menu == 'divider')
|
||||||
|
<li @class([
|
||||||
|
'side-nav__divider my-6',
|
||||||
|
|
||||||
|
// Animation
|
||||||
|
'opacity-0 animate-[0.4s_ease-in-out_0.1s_intro-divider] animate-fill-mode-forwards animate-delay-' .
|
||||||
|
(array_search($menuKey, array_keys($sideMenu)) + 1) * 10,
|
||||||
|
])></li>
|
||||||
|
@else
|
||||||
|
<li>
|
||||||
|
<a
|
||||||
|
href="{{ isset($menu['route_name']) ? route($menu['route_name'], $menu['params']) : 'javascript:;' }}"
|
||||||
|
@class([
|
||||||
|
$firstLevelActiveIndex == $menuKey
|
||||||
|
? 'side-menu side-menu--active'
|
||||||
|
: 'side-menu',
|
||||||
|
|
||||||
|
// Animation
|
||||||
|
'[&:not(.side-menu--active)]:opacity-0 [&:not(.side-menu--active)]:translate-x-[50px] animate-[0.4s_ease-in-out_0.1s_intro-menu] animate-fill-mode-forwards animate-delay-' .
|
||||||
|
(array_search($menuKey, array_keys($sideMenu)) + 1) * 10,
|
||||||
|
])
|
||||||
|
>
|
||||||
|
<div class="side-menu__icon">
|
||||||
|
<x-base.lucide icon="{{ $menu['icon'] }}" />
|
||||||
|
</div>
|
||||||
|
<div class="side-menu__title">
|
||||||
|
{{ $menu['title'] }}
|
||||||
|
@if (isset($menu['sub_menu']))
|
||||||
|
<div
|
||||||
|
class="side-menu__sub-icon {{ $firstLevelActiveIndex == $menuKey ? 'transform rotate-180' : '' }}">
|
||||||
|
<x-base.lucide icon="ChevronDown" />
|
||||||
|
</div>
|
||||||
|
@endif
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
@if (isset($menu['sub_menu']))
|
||||||
|
<ul class="{{ $firstLevelActiveIndex == $menuKey ? 'side-menu__sub-open' : '' }}">
|
||||||
|
@foreach ($menu['sub_menu'] as $subMenuKey => $subMenu)
|
||||||
|
<li>
|
||||||
|
<a
|
||||||
|
href="{{ isset($subMenu['route_name']) ? route($subMenu['route_name'], $subMenu['params']) : 'javascript:;' }}"
|
||||||
|
@class([
|
||||||
|
$secondLevelActiveIndex == $subMenuKey
|
||||||
|
? 'side-menu side-menu--active'
|
||||||
|
: 'side-menu',
|
||||||
|
|
||||||
|
// Animation
|
||||||
|
'[&:not(.side-menu--active)]:opacity-0 [&:not(.side-menu--active)]:translate-x-[50px] animate-[0.4s_ease-in-out_0.1s_intro-menu] animate-fill-mode-forwards animate-delay-' .
|
||||||
|
(array_search($subMenuKey, array_keys($menu['sub_menu'])) + 1) * 10,
|
||||||
|
])
|
||||||
|
>
|
||||||
|
<div class="side-menu__icon">
|
||||||
|
<x-base.lucide icon="{{ $subMenu['icon'] }}" />
|
||||||
|
</div>
|
||||||
|
<div class="side-menu__title">
|
||||||
|
{{ $subMenu['title'] }}
|
||||||
|
@if (isset($subMenu['sub_menu']))
|
||||||
|
<div
|
||||||
|
class="side-menu__sub-icon {{ $secondLevelActiveIndex == $subMenuKey ? 'transform rotate-180' : '' }}">
|
||||||
|
<x-base.lucide icon="ChevronDown" />
|
||||||
|
</div>
|
||||||
|
@endif
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
@if (isset($subMenu['sub_menu']))
|
||||||
|
<ul
|
||||||
|
class="{{ $secondLevelActiveIndex == $subMenuKey ? 'side-menu__sub-open' : '' }}">
|
||||||
|
@foreach ($subMenu['sub_menu'] as $lastSubMenuKey => $lastSubMenu)
|
||||||
|
<li>
|
||||||
|
<a
|
||||||
|
href="{{ isset($lastSubMenu['route_name']) ? route($lastSubMenu['route_name'], $lastSubMenu['params']) : 'javascript:;' }}"
|
||||||
|
@class([
|
||||||
|
$thirdLevelActiveIndex == $lastSubMenuKey
|
||||||
|
? 'side-menu side-menu--active'
|
||||||
|
: 'side-menu',
|
||||||
|
|
||||||
|
// Animation
|
||||||
|
'[&:not(.side-menu--active)]:opacity-0 [&:not(.side-menu--active)]:translate-x-[50px] animate-[0.4s_ease-in-out_0.1s_intro-menu] animate-fill-mode-forwards animate-delay-' .
|
||||||
|
(array_search($lastSubMenuKey, array_keys($subMenu['sub_menu'])) + 1) * 10,
|
||||||
|
])
|
||||||
|
>
|
||||||
|
<div class="side-menu__icon">
|
||||||
|
<x-base.lucide
|
||||||
|
icon="{{ $lastSubMenu['icon'] }}"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="side-menu__title">
|
||||||
|
{{ $lastSubMenu['title'] }}
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
@endforeach
|
||||||
|
</ul>
|
||||||
|
@endif
|
||||||
|
</li>
|
||||||
|
@endforeach
|
||||||
|
</ul>
|
||||||
|
@endif
|
||||||
|
</li>
|
||||||
|
@endif
|
||||||
|
@endforeach
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
<!-- END: Side Menu -->
|
||||||
|
<!-- BEGIN: Content -->
|
||||||
|
<div
|
||||||
|
class="md:max-w-auto min-h-screen min-w-0 max-w-full flex-1 rounded-[1.3rem] bg-slate-100 px-4 pb-10 shadow-sm before:block before:h-px before:w-full before:content-[''] dark:bg-darkmode-700 md:px-[22px]">
|
||||||
|
@yield('subcontent')
|
||||||
|
</div>
|
||||||
|
<!-- END: Content -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
@endsection
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/vendor/tippy/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/layouts/side-menu/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
128
resources/views/layouts/top-menu.blade.php
Normal file
128
resources/views/layouts/top-menu.blade.php
Normal file
|
|
@ -0,0 +1,128 @@
|
||||||
|
@extends('../layouts/base')
|
||||||
|
|
||||||
|
@section('head')
|
||||||
|
@yield('subhead')
|
||||||
|
@endsection
|
||||||
|
|
||||||
|
@section('content')
|
||||||
|
<div
|
||||||
|
class="pt-2 pb-7 before:absolute before:inset-0 before:bg-skew-pattern before:bg-fixed before:bg-no-repeat before:content-[''] dark:before:bg-skew-pattern-dark">
|
||||||
|
<x-dark-mode-switcher />
|
||||||
|
<x-main-color-switcher />
|
||||||
|
<x-mobile-menu />
|
||||||
|
<x-top-bar />
|
||||||
|
<!-- BEGIN: Top Menu -->
|
||||||
|
<nav @class([
|
||||||
|
'top-nav hidden md:block xl:pt-[12px] z-50 relative xl:px-6 -mt-2 xl:-mt-[3px]',
|
||||||
|
|
||||||
|
// Animation
|
||||||
|
'animate-[0.4s_ease-in-out_0.3s_intro-top-menu] animate-fill-mode-forwards opacity-0 translate-y-[35px]',
|
||||||
|
])>
|
||||||
|
<ul class="flex h-[50px] flex-wrap">
|
||||||
|
@foreach ($topMenu as $menuKey => $menu)
|
||||||
|
<li>
|
||||||
|
<a
|
||||||
|
href="{{ isset($menu['route_name']) ? route($menu['route_name'], $menu['params']) : 'javascript:;' }}"
|
||||||
|
@class([
|
||||||
|
$firstLevelActiveIndex == $menuKey
|
||||||
|
? 'top-menu top-menu--active'
|
||||||
|
: 'top-menu',
|
||||||
|
|
||||||
|
// Animation
|
||||||
|
'[&:not(.top-menu--active)]:opacity-0 [&:not(.top-menu--active)]:translate-y-[50px] animate-[0.4s_ease-in-out_0.3s_intro-top-menu] animate-fill-mode-forwards animate-delay-' .
|
||||||
|
(array_search($menuKey, array_keys($topMenu)) + 1) * 10,
|
||||||
|
])
|
||||||
|
>
|
||||||
|
<div class="top-menu__icon">
|
||||||
|
<x-base.lucide icon="{{ $menu['icon'] }}" />
|
||||||
|
</div>
|
||||||
|
<div class="top-menu__title">
|
||||||
|
{{ $menu['title'] }}
|
||||||
|
@if (isset($menu['sub_menu']))
|
||||||
|
<x-base.lucide
|
||||||
|
class="top-menu__sub-icon"
|
||||||
|
icon="chevron-down"
|
||||||
|
/>
|
||||||
|
@endif
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
@if (isset($menu['sub_menu']))
|
||||||
|
<ul class="{{ $firstLevelActiveIndex == $menuKey ? 'top-menu__sub-open' : '' }}">
|
||||||
|
@foreach ($menu['sub_menu'] as $subMenuKey => $subMenu)
|
||||||
|
<li>
|
||||||
|
<a
|
||||||
|
class="top-menu"
|
||||||
|
href="{{ isset($subMenu['route_name']) ? route($subMenu['route_name'], $subMenu['params']) : 'javascript:;' }}"
|
||||||
|
>
|
||||||
|
<div class="top-menu__icon">
|
||||||
|
<x-base.lucide icon="{{ $subMenu['icon'] }}" />
|
||||||
|
</div>
|
||||||
|
<div class="top-menu__title">
|
||||||
|
{{ $subMenu['title'] }}
|
||||||
|
@if (isset($subMenu['sub_menu']))
|
||||||
|
<x-base.lucide
|
||||||
|
class="top-menu__sub-icon"
|
||||||
|
icon="chevron-down"
|
||||||
|
/>
|
||||||
|
@endif
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
@if (isset($subMenu['sub_menu']))
|
||||||
|
<ul
|
||||||
|
class="{{ $secondLevelActiveIndex == $subMenuKey ? 'top-menu__sub-open' : '' }}">
|
||||||
|
@foreach ($subMenu['sub_menu'] as $lastSubMenuKey => $lastSubMenu)
|
||||||
|
<li>
|
||||||
|
<a
|
||||||
|
class="top-menu"
|
||||||
|
href="{{ isset($lastSubMenu['route_name']) ? route($lastSubMenu['route_name'], $lastSubMenu['params']) : 'javascript:;' }}"
|
||||||
|
>
|
||||||
|
<div class="top-menu__icon">
|
||||||
|
<x-base.lucide icon="{{ $lastSubMenu['icon'] }}" />
|
||||||
|
</div>
|
||||||
|
<div class="top-menu__title">{{ $lastSubMenu['title'] }}</div>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
@endforeach
|
||||||
|
</ul>
|
||||||
|
@endif
|
||||||
|
</li>
|
||||||
|
@endforeach
|
||||||
|
</ul>
|
||||||
|
@endif
|
||||||
|
</li>
|
||||||
|
@endforeach
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
<!-- END: Top Menu -->
|
||||||
|
<!-- BEGIN: Content -->
|
||||||
|
<div @class([
|
||||||
|
'relative',
|
||||||
|
"before:content-[''] before:w-[95%] before:z-[-1] before:rounded-[1.3rem] before:bg-transparent xl:before:bg-white/10 before:h-full before:-mt-4 before:absolute before:mx-auto before:inset-x-0 before:dark:bg-darkmode-400/50",
|
||||||
|
|
||||||
|
// Animation
|
||||||
|
'before:translate-y-[35px] before:opacity-0 before:animate-[0.4s_ease-in-out_0.1s_intro-wrapper] before:animate-fill-mode-forwards',
|
||||||
|
])>
|
||||||
|
<div @class([
|
||||||
|
'translate-y-0 bg-transparent xl:bg-primary flex rounded-[1.3rem] md:pt-[80px] -mt-[7px] md:-mt-[67px] xl:-mt-[62px] dark:bg-transparent xl:dark:bg-darkmode-400',
|
||||||
|
'before:hidden xl:before:block before:absolute before:inset-0 before:bg-black/[0.15] before:rounded-[1.3rem] before:z-[-1]',
|
||||||
|
|
||||||
|
// Animation
|
||||||
|
'animate-[0.4s_ease-in-out_0.2s_intro-wrapper] animate-fill-mode-forwards translate-y-[35px]',
|
||||||
|
])>
|
||||||
|
<!-- BEGIN: Content -->
|
||||||
|
<div
|
||||||
|
class="md:max-w-auto min-h-screen min-w-0 max-w-full flex-1 rounded-[1.3rem] bg-slate-100 px-4 pb-10 shadow-sm before:block before:h-px before:w-full before:content-[''] dark:bg-darkmode-700 md:px-[22px]">
|
||||||
|
@yield('subcontent')
|
||||||
|
</div>
|
||||||
|
<!-- END: Content -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- END: Content -->
|
||||||
|
</div>
|
||||||
|
@endsection
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/components/top-bar/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
140
resources/views/login/main.blade.php
Executable file
140
resources/views/login/main.blade.php
Executable file
|
|
@ -0,0 +1,140 @@
|
||||||
|
@extends('../layouts/' . $layout)
|
||||||
|
|
||||||
|
@section('head')
|
||||||
|
<title>Login - Icewall - Tailwind HTML Admin Template</title>
|
||||||
|
@endsection
|
||||||
|
|
||||||
|
@section('content')
|
||||||
|
<div @class([
|
||||||
|
'-m-3 sm:-mx-8 p-3 sm:px-8 relative h-screen lg:overflow-hidden bg-primary xl:bg-white dark:bg-darkmode-800 xl:dark:bg-darkmode-600',
|
||||||
|
'before:hidden before:xl:block before:content-[\'\'] before:w-[57%] before:-mt-[28%] before:-mb-[16%] before:-ml-[13%] before:absolute before:inset-y-0 before:left-0 before:transform before:rotate-[-4.5deg] before:bg-primary/20 before:rounded-[100%] before:dark:bg-darkmode-400',
|
||||||
|
'after:hidden after:xl:block after:content-[\'\'] after:w-[57%] after:-mt-[20%] after:-mb-[13%] after:-ml-[13%] after:absolute after:inset-y-0 after:left-0 after:transform after:rotate-[-4.5deg] after:bg-primary after:rounded-[100%] after:dark:bg-darkmode-700',
|
||||||
|
])>
|
||||||
|
<div class="container relative z-10 sm:px-10">
|
||||||
|
<div class="block grid-cols-2 gap-4 xl:grid">
|
||||||
|
<!-- BEGIN: Login Info -->
|
||||||
|
<div class="hidden min-h-screen flex-col xl:flex">
|
||||||
|
<a
|
||||||
|
class="-intro-x flex items-center pt-5"
|
||||||
|
href=""
|
||||||
|
>
|
||||||
|
<img
|
||||||
|
class="w-6"
|
||||||
|
src="{{ Vite::asset('resources/images/logo.svg') }}"
|
||||||
|
alt="Midone Tailwind HTML Admin Template"
|
||||||
|
/>
|
||||||
|
<span class="ml-3 text-lg text-white"> Icewall </span>
|
||||||
|
</a>
|
||||||
|
<div class="my-auto">
|
||||||
|
<img
|
||||||
|
class="-intro-x -mt-16 w-1/2"
|
||||||
|
src="{{ Vite::asset('resources/images/illustration.svg') }}"
|
||||||
|
alt="Midone Tailwind HTML Admin Template"
|
||||||
|
/>
|
||||||
|
<div class="-intro-x mt-10 text-4xl font-medium leading-tight text-white">
|
||||||
|
A few more clicks to <br />
|
||||||
|
sign in to your account.
|
||||||
|
</div>
|
||||||
|
<div class="-intro-x mt-5 text-lg text-white text-opacity-70 dark:text-slate-400">
|
||||||
|
Manage all your e-commerce accounts in one place
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- END: Login Info -->
|
||||||
|
<!-- BEGIN: Login Form -->
|
||||||
|
<div class="my-10 flex h-screen py-5 xl:my-0 xl:h-auto xl:py-0">
|
||||||
|
<div
|
||||||
|
class="mx-auto my-auto w-full rounded-md bg-white px-5 py-8 shadow-md dark:bg-darkmode-600 sm:w-3/4 sm:px-8 lg:w-2/4 xl:ml-20 xl:w-auto xl:bg-transparent xl:p-0 xl:shadow-none">
|
||||||
|
<h2 class="intro-x text-center text-2xl font-bold xl:text-left xl:text-3xl">
|
||||||
|
Sign In
|
||||||
|
</h2>
|
||||||
|
<div class="intro-x mt-2 text-center text-slate-400 xl:hidden">
|
||||||
|
A few more clicks to sign in to your account. Manage all your
|
||||||
|
e-commerce accounts in one place
|
||||||
|
</div>
|
||||||
|
<div class="intro-x mt-8">
|
||||||
|
<form id="login-form">
|
||||||
|
<x-base.form-input
|
||||||
|
class="intro-x login__input block min-w-full px-4 py-3 xl:min-w-[350px]"
|
||||||
|
id="email"
|
||||||
|
type="text"
|
||||||
|
value="midone@left4code.com"
|
||||||
|
placeholder="Email"
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
class="login__input-error mt-2 text-danger"
|
||||||
|
id="error-email"
|
||||||
|
></div>
|
||||||
|
<x-base.form-input
|
||||||
|
class="intro-x login__input mt-4 block min-w-full px-4 py-3 xl:min-w-[350px]"
|
||||||
|
id="password"
|
||||||
|
type="password"
|
||||||
|
value="password"
|
||||||
|
placeholder="Password"
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
class="login__input-error mt-2 text-danger"
|
||||||
|
id="error-password"
|
||||||
|
></div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
<div class="intro-x mt-4 flex text-xs text-slate-600 dark:text-slate-500 sm:text-sm">
|
||||||
|
<div class="mr-auto flex items-center">
|
||||||
|
<x-base.form-check.input
|
||||||
|
class="mr-2 border"
|
||||||
|
id="remember-me"
|
||||||
|
type="checkbox"
|
||||||
|
/>
|
||||||
|
<label
|
||||||
|
class="cursor-pointer select-none"
|
||||||
|
for="remember-me"
|
||||||
|
>
|
||||||
|
Remember me
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<a href="">Forgot Password?</a>
|
||||||
|
</div>
|
||||||
|
<div class="intro-x mt-5 text-center xl:mt-8 xl:text-left">
|
||||||
|
<x-base.button
|
||||||
|
class="w-full px-4 py-3 align-top xl:mr-3 xl:w-32"
|
||||||
|
id="btn-login"
|
||||||
|
variant="primary"
|
||||||
|
>
|
||||||
|
Login
|
||||||
|
</x-base.button>
|
||||||
|
<x-base.button
|
||||||
|
class="mt-3 w-full px-4 py-3 align-top xl:mt-0 xl:w-32"
|
||||||
|
variant="outline-secondary"
|
||||||
|
>
|
||||||
|
Register
|
||||||
|
</x-base.button>
|
||||||
|
</div>
|
||||||
|
<div class="intro-x mt-10 text-center text-slate-600 dark:text-slate-500 xl:mt-24 xl:text-left">
|
||||||
|
By signin up, you agree to our
|
||||||
|
<a
|
||||||
|
class="text-primary dark:text-slate-200"
|
||||||
|
href=""
|
||||||
|
>
|
||||||
|
Terms and Conditions
|
||||||
|
</a>
|
||||||
|
&
|
||||||
|
<a
|
||||||
|
class="text-primary dark:text-slate-200"
|
||||||
|
href=""
|
||||||
|
>
|
||||||
|
Privacy Policy
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- END: Login Form -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
@endsection
|
||||||
|
|
||||||
|
@once
|
||||||
|
@push('scripts')
|
||||||
|
@vite('resources/js/pages/login/index.js')
|
||||||
|
@endpush
|
||||||
|
@endonce
|
||||||
1045
resources/views/pages/dashboard-overview-1.blade.php
Executable file
1045
resources/views/pages/dashboard-overview-1.blade.php
Executable file
File diff suppressed because it is too large
Load diff
Loading…
Reference in a new issue