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,45 +166,39 @@ 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" src="@/assets/twitterIcon.svg?url"
class="cursor-pointer" class="cursor-pointer"
/> />
</a> </a>
</div>
<div class="mr-6">
<a href="https://www.linkedin.com/company/doiim/"> <a href="https://www.linkedin.com/company/doiim/">
<img <img
alt="LinkedIn" alt="LinkedIn"
width="20" width="20"
height="20" height="20"
src="@/assets/linkedinIcon.svg" src="@/assets/linkedinIcon.svg?url"
class="cursor-pointer" class="cursor-pointer"
href="https://www.linkedin.com/company/doiim/" href="https://www.linkedin.com/company/doiim/"
/> />
</a> </a>
</div>
<div class="mr-6">
<a href="https://www.github.com/doiim"> <a href="https://www.github.com/doiim">
<img <img
alt="Github" alt="Github"
width="20" width="20"
height="20" height="20"
src="@/assets/githubIcon.svg" src="@/assets/githubIcon.svg?url"
class="cursor-pointer" class="cursor-pointer"
/> />
</a> </a>
</div> </div>
</div> </div>
</div>
<div class="w-full flex justify-center"> <div class="w-full flex justify-center">
<hr class="w-4/5" /> <hr class="w-4/5" />
</div> </div>
@ -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 }"