diff options
| author | secondl1ght <[email protected]> | 2022-09-17 11:13:10 -0600 |
|---|---|---|
| committer | Adam Soltys <[email protected]> | 2022-09-24 09:05:08 -0700 |
| commit | 9e749509227cf19dd49cb84ce3239d5dd1d9579a (patch) | |
| tree | 40b4419a2f81ca7a00b0169d88164c9293c8190b /src/components/AppHeader.svelte | |
| parent | d12525469342ccb65473d6fdb4d617f347835075 (diff) | |
| download | coinos-ui-9e749509227cf19dd49cb84ce3239d5dd1d9579a.tar.gz coinos-ui-9e749509227cf19dd49cb84ce3239d5dd1d9579a.zip | |
add hover states to links and buttons
Diffstat (limited to 'src/components/AppHeader.svelte')
| -rw-r--r-- | src/components/AppHeader.svelte | 10 |
1 files changed, 5 insertions, 5 deletions
diff --git a/src/components/AppHeader.svelte b/src/components/AppHeader.svelte index 22c18622..1ac72f87 100644 --- a/src/components/AppHeader.svelte +++ b/src/components/AppHeader.svelte @@ -42,7 +42,7 @@ class="bg-white p-2 rounded-full w-12 h-12 drop-shadow-xl border border-black/10 {$page .url.pathname === `/${$user.username}/receive` ? 'opacity-100' - : 'opacity-70'}" + : 'opacity-70 hover:opacity-80'}" ><Icon icon="numpad" style="mx-auto" /> </button> </a> @@ -51,7 +51,7 @@ class="bg-white p-2 rounded-full w-12 h-12 drop-shadow-xl border border-black/10 {$page .url.pathname === `/${$user.username}/transactions` ? 'opacity-100' - : 'opacity-70'} relative" + : 'opacity-70 hover:opacity-80'} relative" ><Icon icon="clock" style="mx-auto" /> {#if $newPayment} <span class="absolute top-0 right-0"> @@ -70,7 +70,7 @@ class="bg-white p-2 rounded-full w-12 h-12 drop-shadow-xl border border-black/10 {$page .url.pathname === `/${$user.username}` ? 'opacity-100' - : 'opacity-70'}" + : 'opacity-70 hover:opacity-80'}" ><Icon icon="profile" style="mx-auto" /> </button> </a> @@ -82,7 +82,7 @@ $page.url.pathname === `/${$user.username}/settings` || $page.url.pathname === `/${$user.username}/support` ? 'opacity-100' - : 'opacity-70'}" + : `opacity-70 hover:opacity-80 ${showMenu ? 'opacity-80' : ''}`}" on:click={() => (showMenu = !showMenu)} ><Icon icon="menu" style="mx-auto" /> </button> @@ -96,7 +96,7 @@ {#each menuButtons as button} <li> <button - class="flex justify-center items-center font-semibold text-sm" + class="flex justify-center items-center font-semibold text-sm hover:opacity-80" on:click={() => handleMenuItemClick(button.goto)} ><Icon icon={button.icon} style="mr-1" /> {$t(button.stringID)} </button> |