Merge branch 'bryam' of https://github.com/BryamE/ProyectoLauck into giane
This commit is contained in:
@@ -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,39 @@
|
||||
@props(['disabled' => false, 'error' => null, 'options' => [], 'placeholder' => 'Seleccionar...'])
|
||||
|
||||
<!-- Contenedor relativo para posicionar la flecha personalizada si quisiéramos (opcional) -->
|
||||
<div class="relative">
|
||||
<select {{ $disabled ? 'disabled' : '' }} {!! $attributes->merge(['class' => '
|
||||
appearance-none bg-transparent border-0 border-b-2 border-neutral-700 text-white text-sm
|
||||
py-2.5 px-0 w-full focus:outline-none focus:ring-0 focus:border-neon-lime peer cursor-pointer
|
||||
transition-colors' . ($error ? 'border-red-500 focus:border-red-500' : '')
|
||||
]) !!}>
|
||||
|
||||
@if($placeholder)
|
||||
<option value="" disabled selected class="bg-neutral-800 text-gray-500">{{ $placeholder }}</option>
|
||||
@endif
|
||||
|
||||
{{ $slot }}
|
||||
|
||||
</select>
|
||||
|
||||
<!-- Flecha personalizada (SVG) posicionada a la derecha -->
|
||||
<div class="absolute inset-y-0 right-0 flex items-center px-2 pointer-events-none">
|
||||
<svg class="w-4 h-4 text-gray-500 peer-focus:text-neon-lime transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path>
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<!-- Mensaje de error -->
|
||||
@if($error)
|
||||
<p class="mt-1 text-xs text-red-400">{{ $error }}</p>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
{{--
|
||||
NOTA DE ESTILO:
|
||||
- `appearance-none`: Quita el estilo feo por defecto del navegador.
|
||||
- `bg-transparent`: Fondo transparente para que se vea el color de fondo de tu web.
|
||||
- `border-b-2`: Borde solo abajo (estilo línea).
|
||||
- `focus:ring-0`: Quita el anillo azul de Chrome al hacer click.
|
||||
- `peer`: Permite que el icono de la flecha cambie de color cuando el select tiene foco.
|
||||
--}}
|
||||
@@ -36,7 +36,10 @@
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="block py-2 px-3 text-white hover:text-neon-lime md:hover:bg-transparent md:border-0 md:p-0 transition-colors">Taller</a>
|
||||
<a href="#"
|
||||
class="block py-2 px-3 md:p-0 transition-colors {{ request()->is('mantenimiento*') ? 'text-neon-lime border-b-2 border-neon-lime' : 'text-white hover:text-neon-lime' }}">
|
||||
Taller
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="{{ route('sales.create') }}"
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
<h1 class="font-black text-4xl md:text-5xl text-white uppercase italic">
|
||||
{{ $title }}
|
||||
@if($highlight)
|
||||
<span class="text-transparent bg-clip-text bg-gradient-to-r from-white to-gray-500">{{ $highlight }}</span>
|
||||
<span class="text-transparent bg-clip-text bg-gradient-to-r from-white to-gray-500 pe-2">{{ $highlight }}</span>
|
||||
@endif
|
||||
</h1>
|
||||
</div>
|
||||
@@ -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>
|
||||
Reference in New Issue
Block a user