hueso/P2Pix-Front-End
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Apply transitions to all dropdowns

Browse Source
This commit is contained in:
Vagner
2024-10-12 13:09:34 -03:00
parent 1287a0e9a7
commit 149f0e4767
3 changed files with 168 additions and 158 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
src/components/SearchComponent.vue
View File

@@ -193,33 +193,35 @@ watch(walletAddress, (): void => {
src="@/assets/chevronDownBlack.svg"
/>
</button>
<div
v-if="selectTokenToggle"
class="mt-2 w-[100px] text-gray-900 absolute"
>
<div class="bg-white rounded-xl z-10 border border-gray-300 drop-shadow-md shadow-md overflow-clip">
<div
v-for="token in TokenEnum"
class="flex menu-button gap-2 px-4 cursor-pointer hover:bg-gray-300 transition-colors"
@click="handleSelectedToken(token)"
>
<img
:alt="token + ' logo'"
width="20"
height="20"
:src="getTokenImage(token)"
/>
<span
class="text-gray-900 py-4 text-end font-semibold text-sm"
<transition name="dropdown">
<div
v-if="selectTokenToggle"
class="mt-2 w-[100px] text-gray-900 absolute"
>
<div class="bg-white rounded-xl z-10 border border-gray-300 drop-shadow-md shadow-md overflow-clip">
<div
v-for="token in TokenEnum"
class="flex menu-button gap-2 px-4 cursor-pointer hover:bg-gray-300 transition-colors"
@click="handleSelectedToken(token)"
>
{{ token }}
</span>
</div>
<div class="w-full flex justify-center">
<hr class="w-4/5" />
<img
:alt="token + ' logo'"
width="20"
height="20"
:src="getTokenImage(token)"
/>
<span
class="text-gray-900 py-4 text-end font-semibold text-sm"
>
{{ token }}
</span>
</div>
<div class="w-full flex justify-center">
<hr class="w-4/5" />
</div>
</div>
</div>
</div>
</transition>
</div>
</div>
<div class="custom-divide py-2 mb-2"></div>