From e1a94e37491e7e0cd99afa97312037964cb4add3 Mon Sep 17 00:00:00 2001
From: David Carr <dave@dcblog.dev>
Date: Wed, 29 May 2024 19:51:31 +0100
Subject: [PATCH] Added 'class' property to form inputs

A new 'class' property has been added to form inputs in the input.blade.php file to improve control over styling. We have also improved readability by reformatting the label and input components. Now, the form input will show a red border if there are any related errors.
---
 resources/views/components/form/input.blade.php | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/resources/views/components/form/input.blade.php b/resources/views/components/form/input.blade.php
index ebe6a56..28e8ee0 100644
--- a/resources/views/components/form/input.blade.php
+++ b/resources/views/components/form/input.blade.php
@@ -4,6 +4,7 @@
     'name' => '',
     'label' => '',
     'value' => '',
+    'class' => ''
 ])
 
 @if ($label === 'none')
@@ -23,7 +24,9 @@
 
 <div class="mb-5">
     @if ($label !='none')
-        <label for="{{ $name }}" class="block text-sm font-medium leading-5 text-gray-700 dark:text-gray-200">{{ $label }} @if ($required != '') <span class="error">*</span>@endif</label>
+        <label for="{{ $name }}"
+       class="block text-sm font-medium leading-5 text-gray-700 dark:text-gray-200"
+        >{{ $label }} @if ($required != '') <span class="error">*</span>@endif</label>
     @endif
     <div class="rounded-md shadow-sm">
         <input
@@ -32,7 +35,11 @@
             name="{{ $name }}"
             value="{{ $slot }}"
             {{ $required }}
-            {{ $attributes->merge(['class' => 'block w-full dark:bg-gray-500 dark:text-gray-200 dark:placeholder-gray-200 border border-gray-300 rounded-md shadow-sm py-2 px-3 focus:outline-none focus:ring-light-blue-500 focus:border-light-blue-500 sm:text-sm']) }}>
+            @class([
+            'block w-full dark:bg-gray-500 dark:text-gray-200 dark:placeholder-gray-200 border border-gray-300 rounded-md shadow-sm py-2 px-3 focus:outline-none focus:ring-light-blue-500 focus:border-light-blue-500 sm:text-sm',
+            'border-red-500' => $errors->has($name),
+            ])
+            {{ $attributes }}>
         @error($name)
             <p class="error">{{ $message }}</p>
         @enderror