adds multiple qol changes

This commit is contained in:
Christian Beutel
2024-02-21 18:28:42 +01:00
parent 2363c677b7
commit a24662a56e
18 changed files with 1236 additions and 99 deletions

View File

@@ -48,7 +48,7 @@
</button>
{#if isOpen}
<ul
class="menu absolute bg-white border rounded-l-xl rounded-b-xl shadow-md right-0 overflow-hidden text-black"
class="menu absolute bg-white border rounded-l-xl rounded-b-xl shadow-md right-0 overflow-hidden text-black mt-1"
class:none={isOpen}
style="z-index: 1001"
>
@@ -56,15 +56,15 @@
<!-- svelte-ignore a11y-no-noninteractive-element-interactions -->
<!-- svelte-ignore a11y-no-noninteractive-tabindex -->
<li
class="menu-item flex items-center p-4 cursor-pointer hover:bg-gray-100 focus:bg-gray-200 transition-colors"
class="menu-item flex items-center px-4 py-3 cursor-pointer hover:bg-gray-100 focus:bg-gray-200 transition-colors"
tabindex="0"
on:mouseup|stopPropagation={() => handleItemClick(item)}
on:keydown|stopPropagation={() => handleItemClick(item)}
>
{#if item.icon}
<i class="fa fa-{item.icon} mr-6"></i>
<i class="fa fa-{item.icon} mr-3"></i>
{/if}
{item.text}
<span class="whitespace-nowrap">{item.text}</span>
</li>
{/each}
</ul>

View File

@@ -28,7 +28,7 @@
</h3>
<button
type="button"
class="text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm w-8 h-8 ms-auto inline-flex justify-center items-center dark:hover:bg-gray-600 dark:hover:text-white"
class="rounded-full py-1 px-[10px] hover:bg-gray-100 focus:ring-4 ring-gray-200 transition-colors"
on:click={closeModal}
>
<i class="fa fa-close"></i>

View File

@@ -29,7 +29,7 @@
type="radio"
checked={i == selected}
value={item.value}
class="w-4 h-4 text-primary bg-gray-100 border-gray-300 focus:ring-gray-400 focus:ring-2"
class="w-4 h-4 text-primary accent-primary bg-gray-100 border-gray-300 focus:ring-gray-400 focus:ring-2"
on:change={() => handleRadioChange(i)}
/>
<label

View File

@@ -60,7 +60,7 @@
</span>
{#if value.length > 0}
<button
class="absolute top-1/2 -translate-y-1/2 right-0 h-6 w-6 mr-4 hover:bg-gray-300 hover:bg-opacity-50 rounded-full"
class="absolute top-1/2 -translate-y-1/2 right-0 h-6 w-6 mr-2 hover:bg-gray-300 hover:bg-opacity-50 rounded-full"
on:click={clear}
in:fade={{ duration: 150 }}
out:fade={{ duration: 150 }}
@@ -73,8 +73,8 @@
name="q"
autocomplete="off"
extraClasses="{large
? 'pl-12 py-4 text-xl min-w-80 w-[33vw] max-w-[532px] rounded-xl'
: 'pl-10'}"
? 'px-12 py-4 text-xl min-w-80 w-[33vw] max-w-[532px] rounded-xl'
: 'px-10'}"
{placeholder}
bind:value
on:input={onSearchType}