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

Fix glitchy behaviour of token selector structure

Browse Source
This commit is contained in:
Vagner 2024-10-12 13:10:45 -03:00
parent 149f0e4767
commit fc8fac4b48
2 changed files with 7 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/SearchComponent.vue
View File

@ -172,7 +172,7 @@ watch(walletAddress, (): void => {
placeholder="0 " placeholder="0 "
step=".01" step=".01"
/> />
<div class="relative"> <div class="relative overflow-visible">
<button <button
ref="tokenDropdownRef" ref="tokenDropdownRef"
class="flex flex-row items-center p-2 bg-gray-300 hover:bg-gray-200 focus:outline-indigo-800 focus:outline-2 rounded-3xl min-w-fit gap-2 transition-colors" class="flex flex-row items-center p-2 bg-gray-300 hover:bg-gray-200 focus:outline-indigo-800 focus:outline-2 rounded-3xl min-w-fit gap-2 transition-colors"
@ -196,7 +196,7 @@ watch(walletAddress, (): void => {
<transition name="dropdown"> <transition name="dropdown">
<div <div
v-if="selectTokenToggle" v-if="selectTokenToggle"
class="mt-2 w-[100px] text-gray-900 absolute" class="mt-2 text-gray-900 absolute right-0 z-50 w-full min-w-max"
> >
<div class="bg-white rounded-xl z-10 border border-gray-300 drop-shadow-md shadow-md overflow-clip"> <div class="bg-white rounded-xl z-10 border border-gray-300 drop-shadow-md shadow-md overflow-clip">
<div <div

13
src/components/SellerSteps/WantSellComponent.vue
View File

@ -114,7 +114,7 @@ const handleButtonClick = async (
placeholder="Digite sua oferta" placeholder="Digite sua oferta"
step=".01" step=".01"
/> />
<div class="relative"> <div class="relative overflow-visible">
<button <button
ref="tokenDropdownRef" ref="tokenDropdownRef"
class="flex flex-row items-center p-2 bg-gray-300 hover:bg-gray-200 focus:outline-indigo-800 focus:outline-2 rounded-3xl min-w-fit gap-2 transition-colors" class="flex flex-row items-center p-2 bg-gray-300 hover:bg-gray-200 focus:outline-indigo-800 focus:outline-2 rounded-3xl min-w-fit gap-2 transition-colors"
@ -125,9 +125,9 @@ const handleButtonClick = async (
class="sm:w-fit w-4" class="sm:w-fit w-4"
:src="getTokenImage(selectedToken)" :src="getTokenImage(selectedToken)"
/> />
<span class="text-gray-900 sm:text-lg text-md font-medium" id="token">{{ <span class="text-gray-900 sm:text-lg text-md font-medium" id="token">
selectedToken {{ selectedToken }}
}}</span> </span>
<img <img
class="text-gray-900 pr-4 sm:pr-0 transition-all duration-500 ease-in-out" class="text-gray-900 pr-4 sm:pr-0 transition-all duration-500 ease-in-out"
:class="{'scale-y-[-1]': selectTokenToggle}" :class="{'scale-y-[-1]': selectTokenToggle}"
@ -138,7 +138,7 @@ const handleButtonClick = async (
<transition name="dropdown"> <transition name="dropdown">
<div <div
v-if="selectTokenToggle" v-if="selectTokenToggle"
class="mt-2 w-[100px] text-gray-900 absolute" class="mt-2 text-gray-900 absolute right-0 z-50 w-full min-w-max"
> >
<div class="bg-white rounded-xl z-10 border border-gray-300 drop-shadow-md shadow-md overflow-clip"> <div class="bg-white rounded-xl z-10 border border-gray-300 drop-shadow-md shadow-md overflow-clip">
<div <div
@ -158,9 +158,6 @@ const handleButtonClick = async (
{{ token }} {{ token }}
</span> </span>
</div> </div>
<div class="w-full flex justify-center">
<hr class="w-4/5" />
</div>
</div> </div>
</div> </div>
</transition> </transition>