Fix broken input styles (#359)

Co-authored-by: Taylor Otwell <[email protected]>
laravel · Sep 15, 2024 · d2c2327 · d2c2327
1 parent a99877a
commit d2c2327
Show file tree

Hide file tree

Showing 6 changed files with 10 additions and 6 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/resources/views/components/forms/checkbox.blade.php b/resources/views/components/forms/checkbox.blade.php
@@ -1 +1 @@
-<input {{ $attributes->merge(['class' => 'text-red-600 border border-gray-400 focus:outline-none focus:ring-0 focus:border-red-600']) }} type="checkbox">
+<input {{ $attributes->merge(['class' => 'form-checkbox text-red-600 border border-gray-400 focus:outline-none focus:ring-0 focus:border-red-600']) }} type="checkbox">
diff --git a/resources/views/components/forms/input.blade.php b/resources/views/components/forms/input.blade.php
@@ -1,3 +1,3 @@
 @props(['type' => 'text'])
 
-<input {{ $attributes->merge(['class' => 'w-full block px-3 py-2 border border-gray-400 sm:text-sm focus:outline-none focus:ring-0 focus:border-red-600 transition']) }} type="{{ $type }}">
+<input {{ $attributes->merge(['class' => 'form-input w-full block px-3 py-2 border border-gray-400 sm:text-sm focus:outline-none focus:ring-0 focus:border-red-600 transition']) }} type="{{ $type }}">
diff --git a/resources/views/components/forms/textarea.blade.php b/resources/views/components/forms/textarea.blade.php
@@ -1 +1 @@
-<textarea {{ $attributes->merge(['class' => 'w-full block px-3 py-2 border border-gray-400 sm:text-sm focus:outline-none focus:ring-0 focus:border-red-600 transition [field-sizing:content]']) }}></textarea>
+<textarea {{ $attributes->merge(['class' => 'form-textarea w-full block px-3 py-2 border border-gray-400 sm:text-sm focus:outline-none focus:ring-0 focus:border-red-600 transition [field-sizing:content]']) }}></textarea>
diff --git a/resources/views/docs.blade.php b/resources/views/docs.blade.php
@@ -166,7 +166,7 @@ class="absolute w-full transform origin-top shadow-sm z-10"
                                     <select
                                         id="version-switcher"
                                         aria-label="Laravel version"
-                                        class="appearance-none flex-1 w-full px-0 py-1 placeholder-gray-900 tracking-wide bg-white focus:outline-none dark:bg-dark-700 dark:text-gray-400 dark:placeholder-gray-500"
+                                        class="appearance-none flex-1 w-full px-0 py-1 placeholder-gray-900 tracking-wide bg-white border-transparent focus:outline-none dark:bg-dark-700 dark:text-gray-400 dark:placeholder-gray-500"
                                         @change="window.location = $event.target.value"
                                     >
                                         @foreach ($versions as $key => $display)

diff --git a/tailwind.config.js b/tailwind.config.js
@@ -131,5 +131,9 @@ export default {
         pattern: new RegExp(`bg-(${Object.keys(accentColors).join('|')})`),
     }
   ],
-  plugins: [forms],
+  plugins: [
+    forms({
+        strategy: 'class',
+    })
+  ],
 }
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		<input {{ $attributes->merge(['class' => 'text-red-600 border border-gray-400 focus:outline-none focus:ring-0 focus:border-red-600']) }} type="checkbox">
		<input {{ $attributes->merge(['class' => 'form-checkbox text-red-600 border border-gray-400 focus:outline-none focus:ring-0 focus:border-red-600']) }} type="checkbox">
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		<textarea {{ $attributes->merge(['class' => 'w-full block px-3 py-2 border border-gray-400 sm:text-sm focus:outline-none focus:ring-0 focus:border-red-600 transition [field-sizing:content]']) }}></textarea>
		<textarea {{ $attributes->merge(['class' => 'form-textarea w-full block px-3 py-2 border border-gray-400 sm:text-sm focus:outline-none focus:ring-0 focus:border-red-600 transition [field-sizing:content]']) }}></textarea>