dave/coolify
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

refactor: Improve label positioning in input and checkbox components

Browse Source
This commit is contained in:
Andras Bacsai
2024-09-24 21:04:04 +02:00
parent d6b4e33db3
commit 70dfa101ef
3 changed files with 38 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
resources/views/components/forms/checkbox.blade.php
View File

@@ -8,20 +8,20 @@
'hideLabel' => false,
])
<div class="flex flex-row items-center gap-4 px-2 py-1 form-control min-w-fit dark:hover:bg-coolgray-100">
@if(!$hideLabel)
<label class="flex gap-4 px-0 min-w-fit label">
<span class="flex gap-2">
@if ($label)
{!! $label !!}
@else
{{ $id }}
@endif
@if ($helper)
<x-helper :helper="$helper" />
@endif
</span>
</label>
<div class="flex flex-row items-center py-1 form-control min-w-fit dark:hover:bg-coolgray-100">
@if (!$hideLabel)
<label class="flex gap-4 px-0 min-w-fit label">
<span class="flex gap-2">
@if ($label)
{!! $label !!}
@else
{{ $id }}
@endif
@if ($helper)
<x-helper :helper="$helper" />
@endif
</span>
</label>
@endif
<span class="flex-grow"></span>
<input @disabled($disabled) type="checkbox" {{ $attributes->merge(['class' => $defaultClass]) }}

4
resources/views/components/forms/input.blade.php
View File

@@ -3,7 +3,7 @@
'w-full' => !$isMultiline,
])>
@if ($label)
<label class="flex items-center gap-1 mb-1 text-sm font-medium">{{ $label }}
<label class="flex gap-1 items-center mb-1 text-sm font-medium">{{ $label }}
@if ($required)
<x-highlighted text="*" />
@endif
@@ -16,7 +16,7 @@
<div class="relative" x-data="{ type: 'password' }">
@if ($allowToPeak)
<div x-on:click="changePasswordFieldType"
class="absolute inset-y-0 right-0 flex items-center pr-2 cursor-pointer hover:dark:text-white">
class="flex absolute inset-y-0 right-0 items-center pr-2 cursor-pointer hover:dark:text-white">
<svg xmlns="http://www.w3.org/2000/svg" class="w-6 h-6" viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />