mirror of
https://github.com/twinpath/app-beta.git
synced 2026-01-26 22:01:53 +07:00
first commit
This commit is contained in:
@@ -0,0 +1,36 @@
|
||||
<x-common.component-card title="Select Inputs">
|
||||
<div>
|
||||
<label class="mb-1.5 block text-sm font-medium text-gray-700 dark:text-gray-400">
|
||||
Select Input
|
||||
</label>
|
||||
<div x-data="{ isOptionSelected: false }" class="relative z-20 bg-transparent">
|
||||
<select
|
||||
class="dark:bg-dark-900 shadow-theme-xs focus:border-brand-300 focus:ring-brand-500/10 dark:focus:border-brand-800 h-11 w-full appearance-none rounded-lg border border-gray-300 bg-transparent bg-none px-4 py-2.5 pr-11 text-sm text-gray-800 placeholder:text-gray-400 focus:ring-3 focus:outline-hidden dark:border-gray-700 dark:bg-gray-900 dark:text-white/90 dark:placeholder:text-white/30"
|
||||
:class="isOptionSelected && 'text-gray-800 dark:text-white/90'" @change="isOptionSelected = true">
|
||||
<option value="" class="text-gray-700 dark:bg-gray-900 dark:text-gray-400">
|
||||
Select Option
|
||||
</option>
|
||||
<option value="" class="text-gray-700 dark:bg-gray-900 dark:text-gray-400">
|
||||
Marketing
|
||||
</option>
|
||||
<option value="" class="text-gray-700 dark:bg-gray-900 dark:text-gray-400">
|
||||
Template
|
||||
</option>
|
||||
<option value="" class="text-gray-700 dark:bg-gray-900 dark:text-gray-400">
|
||||
Development
|
||||
</option>
|
||||
</select>
|
||||
<span
|
||||
class="pointer-events-none absolute top-1/2 right-4 z-30 -translate-y-1/2 text-gray-700 dark:text-gray-400">
|
||||
<svg class="stroke-current" width="20" height="20" viewBox="0 0 20 20" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M4.79175 7.396L10.0001 12.6043L15.2084 7.396" stroke="" stroke-width="1.5"
|
||||
stroke-linecap="round" stroke-linejoin="round" />
|
||||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- multiple select --}}
|
||||
<x-form.select.multiple-select/>
|
||||
</x-common.component-card>
|
||||
Reference in New Issue
Block a user