ReVanced/revanced-website
1
0
Fork 0
mirror of https://github.com/revanced/revanced-website.git synced 2025-05-29 12:50:13 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat: add skip navigation button (#140)

Browse Source 
Co-authored-by: afn <hey@afn.im>
This commit is contained in:
zalnars 2023-08-09 19:23:03 +02:00 committed by GitHub
parent 806a5de320
commit 36229adc78
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 26 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/layout/Navbar/NavHost.svelte
View File

@ -51,6 +51,8 @@
<svelte:window bind:scrollY={y} /> <svelte:window bind:scrollY={y} />
<nav class:scrolled={y > 10}> <nav class:scrolled={y > 10}>
<a class="menu-btn skiptab-btn" href="#skiptab">Skip navigation</a>
<button <button
class="menu-btn mobile-only" class="menu-btn mobile-only"
on:click={() => (menuOpen = !menuOpen)} on:click={() => (menuOpen = !menuOpen)}
@ -321,4 +323,21 @@
.menu-btn.open .menu-btn__burger::after { .menu-btn.open .menu-btn__burger::after {
transform: rotate(-45deg) translate(10px, 10px); transform: rotate(-45deg) translate(10px, 10px);
} }
.skiptab-btn {
position: fixed;
left: -300px;
border-radius: 100px;
text-decoration: none;
background-color: var(--accent-color);
z-index: 10;
color: var(--grey-four);
font-weight: 600;
font-size: 0.95rem;
padding: 16px 24px;
}
.skiptab-btn:focus {
left: 12px;
}
</style> </style>

12
src/routes/+layout.svelte
View File

@ -105,10 +105,12 @@
</svelte:fragment> </svelte:fragment>
</Dialogue> </Dialogue>
{#if $show_loading_animation} <div id="skiptab">
<Spinner /> {#if $show_loading_animation}
{:else} <Spinner />
<slot /> {:else}
{/if} <slot />
{/if}
</div>
<!-- <Footer> --> <!-- <Footer> -->
</QueryClientProvider> </QueryClientProvider>