RomanNum3ral
/
vert
mirror of https://github.com/VERT-sh/VERT.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

apply hoverable to .btn 

use @apply hoverable to .btn
use hoverable on images
This commit is contained in:
JovannMC 2025-01-01 18:14:37 +03:00
parent ec8d8900c0
commit 839d129cab
No known key found for this signature in database
3 changed files with 9 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/app.scss
View File

@ -149,7 +149,7 @@ body {
} }
.btn { .btn {
@apply bg-button flex items-center justify-center overflow-hidden relative cursor-pointer px-6 h-14 rounded-full font-medium focus:!outline-none hover:scale-105 duration-200 active:scale-95 disabled:opacity-50 disabled:pointer-events-none; @apply bg-button flex items-center justify-center overflow-hidden relative cursor-pointer px-6 h-14 rounded-full font-medium focus:!outline-none hover:scale-105 duration-200 active:scale-95 disabled:opacity-50 disabled:pointer-events-none hoverable;
transition: transition:
opacity 0.2s ease, opacity 0.2s ease,
transform 0.2s ease, transform 0.2s ease,

12
src/lib/sections/about/Donate.svelte
View File

@ -16,7 +16,7 @@
src={avatar} src={avatar}
alt={name} alt={name}
title={name} title={name}
class="w-9 h-9 rounded-full hoverable-lg" class="w-9 h-9 rounded-full"
/> />
<p class="text-sm text-black dynadark:text-white px-4">${amount}</p> <p class="text-sm text-black dynadark:text-white px-4">${amount}</p>
</div> </div>
@ -47,22 +47,22 @@
</button> </button>
<button <button
class="btn flex-1 p-4 rounded-lg bg-button text-black dynadark:text-white flex items-center justify-center hoverable" class="btn flex-1 p-4 rounded-lg bg-button text-black dynadark:text-white flex items-center justify-center"
> >
<CalendarHeartIcon size="24" class="inline-block mr-2" /> <CalendarHeartIcon size="24" class="inline-block mr-2" />
Monthly Monthly
</button> </button>
</div> </div>
<div class="flex gap-3 w-full"> <div class="flex gap-3 w-full">
<button class="bg-rose-300 text-black p-4 rounded-lg flex-1 hoverable-md" <button class="btn bg-rose-300 text-black p-4 rounded-lg flex-1"
>$1 USD</button >$1 USD</button
> >
<button <button
class="bg-button text-black dynadark:text-white p-4 rounded-lg flex-1 hoverable-md" class="btn bg-button text-black dynadark:text-white p-4 rounded-lg flex-1"
>$5 USD</button >$5 USD</button
> >
<button <button
class="bg-button text-black dynadark:text-white p-4 rounded-lg flex-1 hoverable-md" class="btn bg-button text-black dynadark:text-white p-4 rounded-lg flex-1"
>$10 USD</button >$10 USD</button
> >
<div class="relative flex items-center flex-[2]"> <div class="relative flex items-center flex-[2]">
@ -82,7 +82,7 @@
</p> </p>
<button <button
class="flex-1 p-3 rounded-3xl bg-rose-300 text-black flex items-center justify-center hoverable" class="btn flex-1 p-3 rounded-3xl bg-rose-300 text-black flex items-center justify-center"
> >
<WalletIcon size="24" class="inline-block mr-2" /> <WalletIcon size="24" class="inline-block mr-2" />
Pay now Pay now

4
src/lib/sections/about/Resources.svelte
View File

@ -17,7 +17,7 @@
href="https://discord.gg/kqevGxYPak" href="https://discord.gg/kqevGxYPak"
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
class="flex-1 gap-2 p-4 rounded-full bg-button text-black dynadark:text-white flex items-center justify-center hoverable" class="btn flex-1 gap-2 p-4 rounded-full bg-button text-black dynadark:text-white flex items-center justify-center"
> >
<MessageCircleMoreIcon size="24" class="inline-block mr-2" /> <MessageCircleMoreIcon size="24" class="inline-block mr-2" />
Discord server Discord server
@ -26,7 +26,7 @@
href="https://github.com/not-nullptr/VERT" href="https://github.com/not-nullptr/VERT"
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
class="flex-1 gap-2 p-4 rounded-full bg-button text-black dynadark:text-white flex items-center justify-center hoverable" class="btn flex-1 gap-2 p-4 rounded-full bg-button text-black dynadark:text-white flex items-center justify-center"
> >
<GithubIcon size="24" class="inline-block mr-2" /> <GithubIcon size="24" class="inline-block mr-2" />
Source code Source code