Add Create Job button link

First add the component for the button link. $ sail artisan make:component --view -- button-link INFO View [resources/views/components/button-link.blade.php] created successfully. Build the component with attributes. $attributes->merge() allows merging custom attributes with the default Tailwind classes. Insert <x-button-link> into <x-app-layout> for Create Job button link. Use flex to move button link to the right of existing tag.
sacren · Dec 11, 2024 · 903ab2a · 903ab2a
1 parent 6681d01
commit 903ab2a
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 2 deletions.
diff --git a/resources/views/components/button-link.blade.php b/resources/views/components/button-link.blade.php
@@ -0,0 +1,3 @@
+<a {{ $attributes->merge(['class' => 'inline-block rounded bg-indigo-600 px-4 py-2 text-sm font-medium text-white shadow hover:bg-indigo-500 focus:outline-none focus:ring-2 focus:ring-indigo-600 focus:ring-offset-2']) }}>
+    {{ $slot }}
+</a>
diff --git a/resources/views/layouts/app.blade.php b/resources/views/layouts/app.blade.php
@@ -21,8 +21,13 @@
             <!-- Page Heading -->
             @isset($header)
                 <header class="bg-white shadow">
-                    <div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
-                        {{ $header }}
+                    <div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8 flex items-center justify-between">
+                        <div>
+                            {{ $header }}
+                        </div>
+                        <x-button-link href="{{ route('jobs.create') }}">
+                            Create Job
+                        </x-button-link>
                     </div>
                 </header>
             @endisset