Creados un monton de componentes para reutilizar en las paginas, modificadas vistas, faltan agregar mas cosas

2025-12-06 19:52:33 -03:00
parent 7840cc79ae
commit 20e7da64de
22 changed files with 810 additions and 168 deletions
@@ -1,25 +0,0 @@
-@props(['type' => 'dark'])
-
-@php
-    switch ($type) {
-        case 'info':
-            $class = 'text-blue-800 bg-blue-50 dark:text-blue-400';
-            break;
-        case 'danger':
-            $class = 'text-red-800 bg-red-50 dark:text-red-400';
-            break;
-        case 'success':
-            $class = 'text-green-800 bg-green-50 dark:text-green-400';
-            break;
-        case 'warning':
-            $class = 'text-yellow-800 bg-yellow-50 dark:text-yellow-300';
-            break;
-        default:
-            $class = 'text-gray-800 bg-gray-50 dark:text-gray-300';
-            break;
-    }
-@endphp
-
-<div {{$attributes->merge(['class'=>'p-4 my-4 mx-auto text-md max-w-[80%] rounded-lg dark:bg-gray-800 '.$class])}} role="alert">
-    <span class="font-semibold">{{$title}}</span> {{$content}}
-</div>
@@ -0,0 +1,7 @@
+@props(['disabled' => false, 'error' => null])
+
+<input {{ $disabled ? 'disabled' : ''}} {!! $attributes->merge(['class' => 'bg-neutral-800 border-neutral-700 text-white text-sm rounded-lg focus:ring-neon-lime focus:border-neon-lime block w-full p-2.5 placeholder-gray-500 transition-colors ' . ($error ? 'border-red-500 focus:border-red-500 focus:ring-red-500' : '')]) !!}>
+
+@if($error)
+    <p class="mt-1 text-xs text-red-400">{{ $error }}</p>
+@endif
@@ -0,0 +1,5 @@
+@props(['value'])
+
+<label {!! $attributes->merge(['class' => 'block mb-2 text-xs font-bold text-gray-400 uppercase tracking-wider']) !!}>
+    {{$value ?? $slot}}
+</label>
@@ -0,0 +1,13 @@
+@props(['disabled' => false, 'options', 'error' => null])
+
+<select  {{ $disabled ? 'disabled' : ''}} {!! $attributes->merge(['class' => 'bg-neutral-800 border-neutral-700 text-white text-sm rounded-lg focus:ring-neon-lime focus:border-neon-lime block w-full p-2.5 placeholder-gray-500 transition-colors ' . ($error ? 'border-red-500 focus:border-red-500 focus:ring-red-500' : '')]) !!}>
+    <option value="">Seleccione</option>
+    @if ($options)
+        @foreach ($options as $key => $op)
+            <option value={{$key}}>{{$op}}</option>
+        @endforeach
+    @endif
+</select>
+@if($error)
+    <p class="mt-1 text-xs text-red-400">{{ $error }}</p>
+@endif
@@ -0,0 +1,11 @@
+@if (session('success'))
+    <div class="p-4 mb-4 text-sm text-green-400 rounded-lg bg-neutral-800 border border-green-800/50" role="alert">
+        <span class="font-bold">¡Éxito!</span> {{ session('success') }}
+    </div>
+@endif
+
+@if (session('error'))
+    <div class="p-4 mb-4 text-sm text-red-400 rounded-lg bg-neutral-800 border border-red-800/50" role="alert">
+        <span class="font-bold">Error:</span> {{ session('error') }}
+    </div>
+@endif
@@ -0,0 +1,16 @@
+@props(['color' => 'gray'])
+
+@php
+$colors = [
+    'gray' => 'bg-gray-700 text-gray-300',
+    'red' => 'bg-red-900/50 text-red-300 border border-red-800',
+    'green' => 'bg-green-900/50 text-green-300 border border-green-800',
+    'yellow' => 'bg-yellow-900/50 text-yellow-300 border border-yellow-800',
+    'neon' => 'bg-[#ccff00]/10 text-[#ccff00] border border-[#ccff00]/50',
+];
+$classes = $colors[$color] ?? $colors['gray'];
+@endphp
+
+<span class="{{ $classes }} text-xs font-medium me-2 px-2.5 py-0.5 rounded border">
+    {{ $slot }}
+</span>