livewire kit

resources/views/components/action-message.blade.php

@@ -1,14 +0,0 @@
-@props([
-    'on',
-])
-
-<div
-    x-data="{ shown: false, timeout: null }"
-    x-init="@this.on('{{ $on }}', () => { clearTimeout(timeout); shown = true; timeout = setTimeout(() => { shown = false }, 2000); })"
-    x-show.transition.out.opacity.duration.1500ms="shown"
-    x-transition:leave.opacity.duration.1500ms
-    style="display: none"
-    {{ $attributes->merge(['class' => 'text-sm']) }}
->
-    {{ $slot->isEmpty() ? __('Saved.') : $slot }}
-</div>

resources/views/components/settings/layout.blade.php

@@ -0,0 +1,20 @@
+<div class="flex items-start max-md:flex-col">
+    <div class="me-10 w-full pb-4 md:w-[220px]">
+        <flux:navlist aria-label="{{ __('Settings') }}">
+            <flux:navlist.item :href="route('profile.edit')" wire:navigate>{{ __('Profile') }}</flux:navlist.item>
+            <flux:navlist.item :href="route('security.edit')" wire:navigate>{{ __('Security') }}</flux:navlist.item>
+            <flux:navlist.item :href="route('appearance.edit')" wire:navigate>{{ __('Appearance') }}</flux:navlist.item>
+        </flux:navlist>
+    </div>
+
+    <flux:separator class="md:hidden" />
+
+    <div class="flex-1 self-stretch max-md:pt-6">
+        <flux:heading>{{ $heading ?? '' }}</flux:heading>
+        <flux:subheading>{{ $subheading ?? '' }}</flux:subheading>
+
+        <div class="mt-5 w-full max-w-lg">
+            {{ $slot }}
+        </div>
+    </div>
+</div>