Use Font Awesome icons for scroll-to-top button

This commit is contained in:
Helen Chong 2024-04-22 03:05:20 +08:00
parent e4e4c8f36d
commit 67a9788f26
92 changed files with 973 additions and 1068 deletions

View File

@ -568,31 +568,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -788,31 +788,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -544,31 +544,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -508,31 +508,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -578,31 +578,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -509,31 +509,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -525,31 +525,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -502,31 +502,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -7,7 +7,8 @@
--clr-body-txt: #fceaff; --clr-body-txt: #fceaff;
--clr-content-bg: #3d2163; --clr-content-bg: #3d2163;
--clr-top-btn: #FFD05A; --clr-top-btn-bg: #FFD05A;
--clr-top-btn-txt: #08031A;
--clr-main-heading: #ED64F5; --clr-main-heading: #ED64F5;
--clr-sub-heading: #e8b86f; --clr-sub-heading: #e8b86f;

View File

@ -656,31 +656,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -658,31 +658,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -623,31 +623,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -530,31 +530,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -521,31 +521,30 @@ After discovering the static site generator <a href="https://www.11ty.dev/">Elev
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -516,31 +516,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -527,31 +527,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -520,31 +520,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -521,31 +521,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -527,31 +527,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -530,31 +530,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -518,31 +518,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -518,31 +518,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -530,31 +530,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -759,31 +759,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -617,31 +617,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -483,31 +483,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -483,31 +483,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -483,31 +483,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -503,31 +503,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -483,31 +483,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -493,31 +493,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -510,31 +510,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -493,31 +493,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -533,31 +533,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -483,31 +483,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -493,31 +493,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -483,31 +483,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -523,31 +523,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -553,31 +553,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -553,31 +553,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -776,31 +776,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -1078,31 +1078,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -604,31 +604,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -746,31 +746,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -632,31 +632,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -775,31 +775,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -769,31 +769,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -752,31 +752,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -705,31 +705,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -4,7 +4,7 @@
<subtitle>Leilukin&#39;s personal website.</subtitle> <subtitle>Leilukin&#39;s personal website.</subtitle>
<link href="https://leilukin.neocities.org/feed.xml" rel="self"/> <link href="https://leilukin.neocities.org/feed.xml" rel="self"/>
<link href="https://leilukin.neocities.org"/> <link href="https://leilukin.neocities.org"/>
<updated>2024-04-21T15:31:24Z</updated> <updated>2024-04-21T19:02:27Z</updated>
<id>https://leilukin.neocities.org</id> <id>https://leilukin.neocities.org</id>
<author> <author>
<name>Leilukin</name> <name>Leilukin</name>

View File

@ -574,31 +574,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -532,31 +532,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -470,31 +470,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -543,31 +543,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -743,31 +743,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -822,31 +822,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -539,31 +539,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -345,31 +345,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -370,31 +370,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -438,31 +438,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -461,31 +461,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -637,31 +637,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -402,31 +402,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -445,31 +445,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -416,31 +416,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -389,31 +389,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -422,31 +422,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -551,31 +551,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -462,31 +462,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -348,31 +348,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -660,31 +660,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -350,31 +350,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -428,31 +428,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -356,31 +356,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -367,31 +367,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -352,31 +352,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -369,31 +369,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -350,31 +350,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -420,31 +420,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -528,31 +528,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -505,31 +505,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -466,31 +466,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -346,31 +346,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -434,31 +434,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -624,31 +624,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -432,31 +432,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -339,31 +339,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -438,31 +438,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -565,31 +565,30 @@
} }
} }
</style> </style>
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -1,28 +1,27 @@
<button class="top-btn hidden"> <button class="top-btn hidden" aria-label="Scroll to top">
<img src="/assets/images/elements/chevron-up.svg" alt="Scroll to top"> <i class="fa-solid fa-chevron-up"></i>
</button> </button>
<style> <style>
.top-btn { .top-btn {
position: fixed; position: fixed;
bottom: 10px; margin: 0;
right: 10px; padding: 0;
bottom: 0.5em;
right: 0.5em;
z-index: 999; z-index: 999;
border: none; border: none;
background-color: var(--clr-top-btn); background-color: var(--clr-top-btn-bg);
color: var(--clr-top-btn-txt);
border-radius: 50em; border-radius: 50em;
padding: 0.3em; width: 1.5rem;
aspect-ratio: 1 / 1;
} }
.top-btn:focus { .top-btn:focus {
outline: 0.25em solid var(--clr-top-btn); outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em; outline-offset: 0.15em;
} }
.top-btn img {
width: 1.5rem;
aspect-ratio: 1 / 1;
}
</style> </style>
<script defer> <script defer>

View File

@ -7,7 +7,8 @@
--clr-body-txt: #fceaff; --clr-body-txt: #fceaff;
--clr-content-bg: #3d2163; --clr-content-bg: #3d2163;
--clr-top-btn: #FFD05A; --clr-top-btn-bg: #FFD05A;
--clr-top-btn-txt: #08031A;
--clr-main-heading: #ED64F5; --clr-main-heading: #ED64F5;
--clr-sub-heading: #e8b86f; --clr-sub-heading: #e8b86f;

View File

@ -1,9 +0,0 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 15.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="612px" height="792px" viewBox="0 0 612 792" enable-background="new 0 0 612 792" xml:space="preserve">
<path d="M594.729,455.711c22.442,22.441,22.442,58.729,0,80.932c-22.441,22.202-58.729,22.44-80.932,0L306.096,328.942
L98.397,536.643c-22.441,22.44-58.729,22.44-80.931,0c-22.203-22.441-22.442-58.729,0-80.932l247.808-248.285
c22.441-22.441,58.729-22.441,80.932,0L594.729,455.711z"/>
</svg>

Before

Width:  |  Height:  |  Size: 759 B