Fix file input for mobile

This commit is contained in:
samy
2025-06-16 08:42:13 -10:00
parent 2b93fa0001
commit 64eece8ec2
4 changed files with 36 additions and 11 deletions
@@ -8,10 +8,12 @@
id="{{ $id }}" id="{{ $id }}"
name="{{ $name }}" name="{{ $name }}"
type="{{ $type }}" type="{{ $type }}"
placeholder="{{ $placeholder }}" @if($placeholder)
placeholder="{{ $placeholder}}"
@endif
@if($required) required @endif @if($required) required @endif
@if($disabled) disabled @endif @if($disabled) disabled @endif
@if (! $isLivewire) @if (! $isLivewire && ! empty($resolvedValue))
value="{{ $resolvedValue }}" value="{{ $resolvedValue }}"
@endif @endif
@@ -1,11 +1,13 @@
<div class="navbar bg-primary text-primary-content shadow-sm"> <div class="navbar bg-primary text-primary-content shadow-sm">
<div class="navbar-start"> <div class="navbar-start">
<!-- Mobile Dropdown --> <!-- Mobile Dropdown -->
<div class="dropdown"> <div
class="dropdown"
>
<div tabindex="0" role="button" class="btn btn-ghost lg:hidden"> <div tabindex="0" role="button" class="btn btn-ghost lg:hidden">
<x-heroicon-m-bars-4 class="h-5 w-5" href=""/> <x-heroicon-m-bars-4 class="h-5 w-5" href=""/>
</div> </div>
<ul tabindex="0" <ul
class="menu menu-sm dropdown-content bg-primary rounded-box z-1 mt-3 w-52 p-2 shadow"> class="menu menu-sm dropdown-content bg-primary rounded-box z-1 mt-3 w-52 p-2 shadow">
{{ $menu }} {{ $menu }}
</ul> </ul>
@@ -3,20 +3,41 @@
'name' => 'User', 'name' => 'User',
]) ])
<div class="dropdown dropdown-end"> @php
<div tabindex="0" role="button" class="btn btn-ghost btn-circle avatar"> $colors = [
<div class="w-10 rounded-full"> '#F44336', '#E91E63', '#9C27B0', '#673AB7',
'#3F51B5', '#2196F3', '#03A9F4', '#00BCD4',
'#009688', '#4CAF50', '#8BC34A', '#CDDC39',
'#FFC107', '#FF9800', '#FF5722', '#795548',
];
$hash = crc32($name);
$color = $colors[$hash % count($colors)];
@endphp
<div
class="dropdown dropdown-end"
>
<div tabindex="0" role="button" class="btn btn-ghost btn-circle avatar @if(!$avatar) avatar-placeholder @endif">
<div class="w-10 rounded-full bg-secondary text-white flex items-center
justify-center text-xl font-semibold overflow-hidden"
style="background-color: {{ $avatar ? 'transparent' : $color }}">
@if($avatar) @if($avatar)
<img <img
alt="User avatar" alt="User avatar"
src="{{ $avatar }}" /> src="{{ $avatar }}" />
@else @else
{{ strtoupper($name[0]) }} <span>
{{ strtoupper($name[0]) }}
</span>
@endif @endif
</div> </div>
</div> </div>
<ul tabindex="0" <ul
class="menu menu-sm dropdown-content bg-primary rounded-box mt-3 w-52 p-2 z-50 drop-shadow-xl"> class="menu menu-sm dropdown-content bg-primary rounded-box mt-3 w-52 p-2 z-50 drop-shadow-xl">
{{ $slot }} {{ $slot }}
</ul> </ul>
</div>
</div>
+1 -1
View File
@@ -39,7 +39,7 @@ class Input extends Component
public ?string $prefix = null, public ?string $prefix = null,
) { ) {
$baseClass = $this->type === 'file' ? 'file-input file-input-bordered w-full' : 'input input-bordered w-full'; $baseClass = $this->type === 'file' ? 'file-input w-full' : 'input input-bordered w-full';
$this->initFormField( $this->initFormField(
name: $name, name: $name,