feat: update icon and colors for model dropdown

This commit is contained in:
Shivam Mishra
2025-12-23 15:07:25 +05:30
parent ac64840ad7
commit 1b00a60836
@@ -17,8 +17,8 @@ const props = defineProps({
const emit = defineEmits(['change']);
const PROVIDER_ICONS = {
openai: 'i-logos-openai-icon',
anthropic: 'i-logos-anthropic-icon',
openai: 'i-ri-openai-fill',
anthropic: 'i-ri-anthropic-line',
mistral: 'i-logos-mistral-icon',
gemini: 'i-woot-gemini',
};
@@ -96,7 +96,7 @@ const selectModel = model => {
<div v-on-clickaway="closeDropdown" class="relative flex-shrink-0">
<button
type="button"
class="flex items-center gap-2 px-3 py-2 text-sm border rounded-lg border-n-weak bg-n-solid-2 hover:bg-n-solid-3 min-w-[180px] justify-between"
class="flex items-center gap-2 px-3 py-2 text-sm border rounded-lg border-n-weak dark:bg-n-solid-2 dark:hover:bg-n-solid-3 bg-n-alpha-2 hover:bg-n-alpha-1 min-w-[180px] justify-between"
@click="toggleDropdown"
>
<span v-if="selectedModelDetails" class="text-n-slate-12">
@@ -119,17 +119,14 @@ const selectModel = model => {
v-for="model in availableModels"
:key="model.id"
:click="() => selectModel(model)"
class="rounded-lg hover:bg-n-alpha-1"
class="rounded-lg dark:hover:bg-n-solid-3 hover:bg-n-alpha-1"
:class="{
'bg-n-alpha-2': selectedModelId === model.id,
'dark:bg-n-solid-3 bg-n-alpha-1': selectedModelId === model.id,
'pointer-events-none opacity-60': model.coming_soon,
}"
>
<div class="flex gap-2 w-full">
<Icon
:icon="iconForModel(model)"
class="size-4 flex-shrink-0 text-n-slate-11"
/>
<Icon :icon="iconForModel(model)" class="size-4 flex-shrink-0" />
<div class="flex flex-col w-full text-left gap-1">
<div
class="text-sm w-full font-medium leading-none text-n-slate-12 flex items-baseline justify-between"