Small tweaks on styles.

This commit is contained in:
Filipe Soccol 2024-11-07 13:15:08 -03:00
parent 9ddc843c01
commit 617388d8e1
2 changed files with 35 additions and 39 deletions

View File

@ -12,6 +12,8 @@ import { getTokenImage } from "@/utils/imagesPath";
import { onClickOutside } from "@vueuse/core"; import { onClickOutside } from "@vueuse/core";
import { useOnboard } from "@web3-onboard/vue"; import { useOnboard } from "@web3-onboard/vue";
import ChevronDown from "@/assets/chevron.svg";
// html references // html references
const tokenDropdownRef = ref<any>(null); const tokenDropdownRef = ref<any>(null);
@ -136,7 +138,7 @@ const handleSellClick = async (
> >
{{ selectedToken }} {{ selectedToken }}
</span> </span>
<img <ChevronDown
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 }"
alt="Chevron Down" alt="Chevron Down"

View File

@ -166,43 +166,37 @@ onClickOutside(infoMenuRef, () => {
<hr class="w-4/5" /> <hr class="w-4/5" />
</div> </div>
<div <div
class="sm:text-center sm:justify-center ml-8 sm:ml-0 gap-2 px-4 rounded-md float-right" class="sm:text-center sm:justify-center ml-8 sm:ml-0 gap-2 px-4 rounded-md"
> >
<div class="redirect_button flex mr-4"> <div class="redirect_button flex justify-around">
<div class="mr-6"> <a href="https://www.twitter.com/doiim">
<a href="https://www.twitter.com/doiim"> <img
<img alt="Twitter"
alt="Twitter" width="20"
width="20" height="20"
height="20" src="@/assets/twitterIcon.svg?url"
src="@/assets/twitterIcon.svg" class="cursor-pointer"
class="cursor-pointer" />
/> </a>
</a> <a href="https://www.linkedin.com/company/doiim/">
</div> <img
<div class="mr-6"> alt="LinkedIn"
<a href="https://www.linkedin.com/company/doiim/"> width="20"
<img height="20"
alt="LinkedIn" src="@/assets/linkedinIcon.svg?url"
width="20" class="cursor-pointer"
height="20" href="https://www.linkedin.com/company/doiim/"
src="@/assets/linkedinIcon.svg" />
class="cursor-pointer" </a>
href="https://www.linkedin.com/company/doiim/" <a href="https://www.github.com/doiim">
/> <img
</a> alt="Github"
</div> width="20"
<div class="mr-6"> height="20"
<a href="https://www.github.com/doiim"> src="@/assets/githubIcon.svg?url"
<img class="cursor-pointer"
alt="Github" />
width="20" </a>
height="20"
src="@/assets/githubIcon.svg"
class="cursor-pointer"
/>
</a>
</div>
</div> </div>
</div> </div>
<div class="w-full flex justify-center"> <div class="w-full flex justify-center">
@ -257,7 +251,7 @@ onClickOutside(infoMenuRef, () => {
width="24" width="24"
/> />
<span <span
class="default-text text-gray-50 group-hover:text-gray-900 transition-all duration-500 ease-in-out" class="default-text text-gray-50 group-hover:text-gray-900 transition-all duration-500 ease-in-out whitespace-nowrap"
:class="{ '!text-gray-900': currencyMenuOpenToggle }" :class="{ '!text-gray-900': currencyMenuOpenToggle }"
> >
{{ Networks[etherStore.networkName].chainName }} {{ Networks[etherStore.networkName].chainName }}
@ -336,7 +330,7 @@ onClickOutside(infoMenuRef, () => {
] ]
" "
> >
<img alt="Account image" src="@/assets/account.svg" /> <img alt="Account image" src="@/assets/account.svg?url" />
<span <span
class="default-text text-gray-50 group-hover:text-gray-900 transition-all duration-500 ease-in-out" class="default-text text-gray-50 group-hover:text-gray-900 transition-all duration-500 ease-in-out"
:class="{ '!text-gray-900': menuOpenToggle }" :class="{ '!text-gray-900': menuOpenToggle }"