akadmin/chatwoot
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

chore: More changes

Browse Source
This commit is contained in:
iamsivin
2024-12-08 20:41:11 +05:30
parent 919e080b83
commit d609889747
24 changed files with 59 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/javascript/shared/components/ui/MultiselectDropdown.vue
+8 -8
View File
@@ -60,7 +60,7 @@ const hasValue = computed(() => {
<woot-button
variant="hollow"
color-scheme="secondary"
class="w-full border border-solid border-slate-100 dark:border-slate-700 px-2 hover:border-slate-75 dark:hover:border-slate-600"
class="w-full px-2 border border-solid !border-n-weak dark:!border-n-weak hover:!border-n-strong dark:hover:!border-n-strong"
@click="
() => toggleDropdown() // ensure that the event is not passed to the button
"
@@ -73,25 +73,25 @@ const hasValue = computed(() => {
:status="selectedItem.availability_status"
:username="selectedItem.name"
/>
<div class="flex justify-between w-full min-w-0 items-center">
<div class="flex items-center justify-between w-full min-w-0">
<h4
v-if="!hasValue"
class="text-ellipsis text-sm text-slate-800 dark:text-slate-100"
class="text-sm text-ellipsis text-slate-800 dark:text-slate-100"
>
{{ multiselectorPlaceholder }}
</h4>
<h4
v-else
class="items-center leading-tight overflow-hidden whitespace-nowrap text-ellipsis text-sm text-slate-800 dark:text-slate-100"
class="items-center overflow-hidden text-sm leading-tight whitespace-nowrap text-ellipsis text-slate-800 dark:text-slate-100"
:title="selectedItem.name"
>
{{ selectedItem.name }}
</h4>
<i
v-if="showSearchDropdown"
class="icon i-lucide-chevron-up text-slate-600 mr-1"
class="mr-1 icon i-lucide-chevron-up text-slate-600"
/>
<i v-else class="icon i-lucide-chevron-down text-slate-600 mr-1" />
<i v-else class="mr-1 icon i-lucide-chevron-down text-slate-600" />
</div>
</div>
</woot-button>
@@ -99,9 +99,9 @@ const hasValue = computed(() => {
:class="{ 'dropdown-pane--open': showSearchDropdown }"
class="dropdown-pane"
>
<div class="flex justify-between items-center mb-1">
<div class="flex items-center justify-between mb-1">
<h4
class="text-sm text-slate-800 dark:text-slate-100 m-0 overflow-hidden whitespace-nowrap text-ellipsis"
class="m-0 overflow-hidden text-sm text-slate-800 dark:text-slate-100 whitespace-nowrap text-ellipsis"
>
{{ multiselectorTitle }}
</h4>
app/javascript/shared/components/ui/MultiselectDropdownItems.vue
+5 -9
View File
@@ -71,7 +71,7 @@ export default {
<template>
<div class="dropdown-wrap">
<div class="mb-2 flex-shrink-0 flex-grow-0 flex-auto max-h-8">
<div class="flex-auto flex-grow-0 flex-shrink-0 mb-2 max-h-8">
<input
ref="searchbar"
v-model="search"
@@ -81,7 +81,7 @@ export default {
:placeholder="inputPlaceholder"
/>
</div>
<div class="flex justify-start items-start flex-auto overflow-auto">
<div class="flex items-start justify-start flex-auto overflow-auto">
<div class="w-full max-h-[10rem]">
<WootDropdownMenu>
<WootDropdownItem v-for="option in filteredOptions" :key="option.id">
@@ -107,7 +107,7 @@ export default {
class="flex items-center justify-between w-full min-w-0 gap-2"
>
<span
class="leading-4 my-0 overflow-hidden whitespace-nowrap text-ellipsis text-sm"
class="my-0 overflow-hidden text-sm leading-4 whitespace-nowrap text-ellipsis"
:title="option.name"
>
{{ option.name }}
@@ -142,15 +142,11 @@ export default {
@apply justify-between w-full;
&.active {
@apply bg-slate-25 dark:bg-slate-700 border-slate-50 dark:border-slate-900 font-medium;
}
&:focus {
@apply bg-slate-25 dark:bg-slate-700;
@apply bg-n-slate-2 dark:bg-n-solid-3 border-n-weak/50 dark:border-n-weak font-medium;
}
&:hover {
@apply bg-slate-50 dark:bg-slate-800 text-slate-800 dark:text-slate-100;
@apply bg-n-slate-2 dark:bg-n-solid-3 text-slate-800 dark:text-slate-100;
}
}
</style>