Updated
This commit is contained in:
@@ -57,13 +57,13 @@ watch(
|
||||
class="!bg-transparent outline-none text-black h-full selection:bg-slate-100 placeholder-slate-400"
|
||||
:placeholder="placeholder"
|
||||
/>
|
||||
<ComboboxTrigger>
|
||||
<ComboboxTrigger class="cursor-pointer">
|
||||
<Icon name="ci:chevron-down" class="size-5" />
|
||||
</ComboboxTrigger>
|
||||
</ComboboxAnchor>
|
||||
|
||||
<ComboboxContent
|
||||
class="absolute z-10 w-full mt-1.5 bg-slate-50 overflow-hidden rounded-xl shadow-sm border border-slate-200 will-change-[opacity,transform] data-[side=top]:animate-slideDownAndFade data-[side=bottom]:animate-slideUpAndFade"
|
||||
class="absolute z-10 w-full mt-4 bg-slate-50 overflow-hidden rounded-xl shadow-sm border border-slate-200 will-change-[opacity,transform] data-[side=top]:animate-slideDownAndFade data-[side=bottom]:animate-slideUpAndFade"
|
||||
>
|
||||
<ComboboxViewport class="p-[1rem]">
|
||||
<ComboboxEmpty
|
||||
@@ -74,29 +74,35 @@ watch(
|
||||
<ComboboxGroup>
|
||||
<ComboboxSeparator
|
||||
v-if="index !== 0"
|
||||
class="h-[1px] bg-slate-200 m-[1rem]"
|
||||
class="h-6"
|
||||
/>
|
||||
|
||||
<ComboboxLabel
|
||||
class="px-[1.2rem] w-full text-sm bg-black text-white rounded-full leading-[25px] py-1.5"
|
||||
class="flex items-center justify-between px-[1.2rem] w-full text-md text-black font-bold bg-slate-200/50 leading-[25px] py-3 rounded-lg"
|
||||
>
|
||||
{{ group.name }}
|
||||
<span>
|
||||
{{ group.name }}
|
||||
</span>
|
||||
<Icon name="ci:delivery-boxes" size="18px"/>
|
||||
</ComboboxLabel>
|
||||
|
||||
<ComboboxItem
|
||||
v-for="option in group.children"
|
||||
:key="option.name"
|
||||
:value="option.name"
|
||||
class="text-sm leading-none text-black/90 my-1.5 rounded-full hover:!bg-slate-200 flex items-center py-2.5 px-[1.2rem] relative select-none data-[disabled]:text-slate-50 data-[disabled]:pointer-events-none"
|
||||
class="text-sm cursor-pointer leading-none text-slate-700 my-1.5 rounded-md hover:bg-slate-200/25 flex items-center py-2.5 px-[1.2rem] relative select-none data-[disabled]:text-slate-50 data-[disabled]:pointer-events-none"
|
||||
>
|
||||
<ComboboxItemIndicator
|
||||
class="absolute left-3 w-[25px] inline-flex items-center justify-center"
|
||||
>
|
||||
<Icon name="ci:checkmark" size="18" />
|
||||
</ComboboxItemIndicator>
|
||||
<span>
|
||||
{{ option.name }}
|
||||
</span>
|
||||
<div class="flex items-center gap-2">
|
||||
<Icon name="ci:minus" class="opacity-50"/>
|
||||
<span>
|
||||
{{ option.name }}
|
||||
</span>
|
||||
</div>
|
||||
</ComboboxItem>
|
||||
</ComboboxGroup>
|
||||
</template>
|
||||
|
||||
Reference in New Issue
Block a user