leilukin-site/blog/posts/2024-12-01-indieweb-carniva.../index.html

568 lines
26 KiB
HTML
Raw Normal View History

<!DOCTYPE html>
<html lang="en" dir="ltr" id="top">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="theme-color" content="#3d2163">
<meta property="og:title" content="IndieWeb Carnival November 2024: Impact | Blog">
<link rel="canonical" href="https://leilukin.com/blog/posts/2024-12-01-indieweb-carnival-november-2024-impact/">
<meta name="generator" content="Eleventy v3.0.0">
<meta name="author" content="Leilukin">
<meta name="description" content="My participation in IndieWeb Carnival November 2024, by reflecting on our capabilities of making an impact on other people and the world.">
<meta name="fediverse:creator" content="@Leilukin@dragonscave.space">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:type" content="article">
<meta property="og:description" content="My participation in IndieWeb Carnival November 2024, by reflecting on our capabilities of making an impact on other people and the world.">
<meta property="og:url" content="https://leilukin.com/blog/posts/2024-12-01-indieweb-carnival-november-2024-impact/">
<meta property="og:locale" content="en_MY">
<link rel="alternate" type="application/rss+xml" title="Leilukin&#39;s Hub" href="/feed.xml">
<link rel="preload" href="/assets/fonts/lexend/lexend-v19-latin-regular.woff2" as="font" type="font/woff2" crossorigin="">
<link rel="preload" href="/assets/fonts/lexend/lexend-v19-latin-700.woff2" as="font" type="font/woff2" crossorigin="">
<style>
@font-face {
font-display: swap;
font-family: 'Lexend';
font-style: normal;
font-weight: 400;
src: url('/assets/fonts/lexend/lexend-v19-latin-regular.woff2') format('woff2');
}
@font-face {
font-display: swap;
font-family: 'Lexend';
font-style: normal;
font-weight: 700;
src: url('/assets/fonts/lexend/lexend-v19-latin-700.woff2') format('woff2');
}
</style>
<link rel="stylesheet" href="/assets/fonts/fonts.css">
<link rel="stylesheet" href="/assets/css/global.css"><link rel="stylesheet" href="/assets/css/general.css"><link rel="stylesheet" href="/assets/css/content.css"><link rel="stylesheet" href="/assets/css/plugins.css"><link rel="stylesheet" href="/assets/css/components.css"><link rel="stylesheet" href="/assets/css/a11y-syntax-highlighting-dark.css"><link rel="stylesheet" href="/assets/css/pridesymbols.css"><link rel="stylesheet" href="/assets/css/utility.css">
2024-12-02 01:28:41 +00:00
<style>.toc__wrapper {
max-height: 89vh;
overflow-x: auto;
background-color: var(--clr-content-bg);
padding: 1rem 1.3rem;
}
.toc__heading {
font-size: 1.3rem;
font-weight: 700;
color: var(--clr-sub-heading);
}
.toc ol,
.toc ol ol {
display: grid;
gap: 0.3em;
}
.toc ol {
border-top: 0.1em solid var(--clr-title-border);
padding-left: 1.3em;
padding-top: 1em;
}
.toc ol ol {
border-top: none;
list-style-type: disc;
padding-left: 1em;
padding-top: 0.3em;
}
.toc ol a {
font-size: 1.1rem;
padding-left: 0.3em;
}
.toc ol ol a {
padding: 0;
font-size: 1rem;
}
.content__nav {
padding: 1.2em clamp(1em, 5%, 1.5em);
background-color: var(--clr-content-bg);
}
.content__nav--title {
font-size: 1.7rem;
}
.breadcrumbs {
list-style-type: "";
padding: 0;
margin: 0 0 0.7em 0;
display: flex;
gap: 0.5em;
flex-wrap: wrap;
justify-content: center;
}
.breadcrumbs li::after {
content: '➔';
padding-left: 0.3em;
}
.article__info--desc { margin-bottom: 1em; }
.blog__post--pagination {
padding-top: 1em;
margin-block-start: 2.5em;
border-top: 0.1em solid var(--clr-title-border);
}
.blog__post--nextprev {
list-style-type: "";
padding: 0;
margin: 0;
display: grid;
gap: 0.7em;
grid-template-columns: repeat(2, 1fr);
grid-template-areas: 'prev next';
}
.blog__post--prev { grid-area: prev; }
.blog__post--next { grid-area: next; }
.hero img { filter:
drop-shadow(0.1rem 0.1rem 0.2rem black)
drop-shadow(0.1rem 0.1rem 0.2rem rgba(30, 30, 30, 0.8))
; }
.hero {
width: 100%;
background-color: var(--clr-hero-bg);
display: flex;
flex-direction: column;
justify-content: center;
text-align: center;
}
.hero__top-bar {
background: var(--clr-navbar-bg);
width: 100%;
padding: 0.5em 0.7em;
}
.hero__img {
display: grid;
place-content: center;
}
.hero img {
object-fit: contain;
overflow: hidden;
max-height: 16rem;
}
.navbar {
background: var(--clr-navbar-bg);
width: 100%;
z-index: 998;
position: sticky;
top: 0;
padding: 0.6em;
}
.navbar__menu {
list-style-type: "";
margin: 0;
padding: 0;
display: flex;
gap: 1em;
flex-wrap: wrap;
text-align: center;
}
.navbar__menu a {
color: var(--clr-navbar-link);
text-decoration: none;
cursor: pointer;
display: inline-block;
}
.navbar__menu a:hover { color: var(--clr-link-hover); }
.navbar__menu a:focus { outline-offset: 0.2em; }
.navbar__links {
display: flex;
flex-wrap: wrap;
justify-content: space-evenly;
gap: 0.5em;
}
.navbar__toggle {
background-color: inherit;
color: var(--clr-navbar-link);
border: none;
padding: 0;
font-size: 1.25rem;
font-weight: 700;
display: none;
align-items: center;
gap: 0.3em;
}
.navbar__toggle svg { fill: currentColor; }
.navbar__toggle:focus,
.navbar__menu a:focus { outline-offset: 0.1em; }
.navbar__toggle:focus,
.navbar__menu a:focus { outline: 0.15em solid var(--clr-navbar-link); }
.navbar__popover {
background: var(--clr-navbar-bg);
border: 0.15em solid var(--clr-navbar-link);
padding: 1.5em;
max-width: 85%;
}
.navbar__popover::backdrop {
background-color: black;
opacity: 0.5;
}
@supports selector([popover]) {
.navbar__toggle { display: flex; }
.navbar__links { display: none; }
}
/* Tablet screen size */
@media only screen and (min-width: 43.75rem) {
.navbar { padding: 1em 0.6em; }
.navbar__toggle, .navbar__popover { display: none; }
.navbar__links { display: flex; }
}
.top-btn,
.top-btn:hover {
color: var(--clr-top-btn-txt);
text-decoration: none;
}
.top-btn {
position: fixed;
bottom: 0.5rem;
right: 0.5rem;
z-index: 999;
background-color: var(--clr-top-btn-bg);
display: flex;
align-items: center;
border-radius: 50em;
padding: 0.3em 0.5em;
gap: 0.2em;
}
.top-btn:focus {
outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em;
}
.top-btn__arrow {
display: inline-block;
width: 1em;
aspect-ratio: 1 / 1;
stroke-width: 0;
stroke: currentColor;
fill: currentColor;
}
:root { --footer-gap: 0.5em; }
.footer {
margin-top: auto;
width: 100%;
background: var(--clr-main-footer-bg);
padding: 1.5rem 1rem clamp(1.5rem, calc(100% - 1.5rem), 3.5rem);
text-align: center;
display: grid;
gap: var(--footer-gap);
}
.footer__links,
.footer__shrines {
display: flex;
flex-wrap: wrap;
justify-content: center;
column-gap: var(--footer-gap);
}
.footer__links { justify-self: center; }
.footer__shrines { align-self: center; }</style>
<link rel="icon" sizes="32x32" href="/favicon.ico">
<link rel="icon" type="image/svg+xml" href="/assets/favicon/leilukin-bee-favicon.svg">
<link rel="apple-touch-icon" sizes="180x180" href="/assets/favicon/apple-touch-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<link rel="me" href="mailto:contact@leilukin.com">
<link rel="me" href="https://dragonscave.space/@Leilukin">
<link rel="me" href="https://github.com/Leilukin">
<link rel="authorization_endpoint" href="https://indieauth.com/auth">
<script src="/assets/js/D968lGk6J8.js" defer=""></script>
2024-12-02 01:28:41 +00:00
<script src="/assets/js/details-utils.js" defer=""></script>
<title>
IndieWeb Carnival November 2024: Impact | Blog | Leilukin's Hub
</title>
</head>
<body>
<div class="skip-btn"><a href="#content">Skip to content</a></div>
<header class="hero">
<div class="hero__top-bar hidden"></div>
<div class="hero__img">
<img fetchpriority="high" src="/assets/leilukin/Leilukins-Hub-website-banner.avif" alt="Banner of Leilukin's Hub" width="900" height="300">
</div>
</header>
<nav class="navbar" aria-labelledby="top-level-nav-title">
<h2 class="visually-hidden" id="top-level-nav-title">Top Level</h2>
<ul class="navbar__menu navbar__links">
<li>
<a href="/">Home</a>
</li>
<li>
<a href="/about/">About</a>
</li>
<li>
<a href="/now/">Now</a>
</li>
<li>
<a href="/blog/">Blog</a>
</li>
<li>
<a href="/articles/">Articles</a>
</li>
<li>
<a href="/projects/">Projects</a>
</li>
<li>
<a href="/shrines/">Shrines</a>
</li>
<li>
<a href="/adoptables/">Adoptables</a>
</li>
<li>
<a href="/links/">Links</a>
</li>
<li>
<a href="/guestbook/">Guestbook</a>
</li>
</ul>
<button class="navbar__toggle" popovertarget="nav-menu" aria-label="Toggle navigation menu">
<svg aria-hidden="true" focusable="false" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--!Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M0 96C0 78.3 14.3 64 32 64l384 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 128C14.3 128 0 113.7 0 96zM0 256c0-17.7 14.3-32 32-32l384 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 288c-17.7 0-32-14.3-32-32zM448 416c0 17.7-14.3 32-32 32L32 448c-17.7 0-32-14.3-32-32s14.3-32 32-32l384 0c17.7 0 32 14.3 32 32z"></path></svg>
Navigation
</button>
</nav>
<div popover="" id="nav-menu" class="navbar__popover">
<ul class="navbar__menu">
<li>
<a href="/">Home</a>
</li>
<li>
<a href="/about/">About</a>
</li>
<li>
<a href="/now/">Now</a>
</li>
<li>
<a href="/blog/">Blog</a>
</li>
<li>
<a href="/articles/">Articles</a>
</li>
<li>
<a href="/projects/">Projects</a>
</li>
<li>
<a href="/shrines/">Shrines</a>
</li>
<li>
<a href="/adoptables/">Adoptables</a>
</li>
<li>
<a href="/links/">Links</a>
</li>
<li>
<a href="/guestbook/">Guestbook</a>
</li>
</ul>
</div>
<main id="content">
<header class="main__header">
<nav aria-labelledby="breadcrumbs-title">
<h2 class="visually-hidden" id="breadcrumbs-title">Breadcrumbs</h2>
<ol class="breadcrumbs">
<li>
<a href="/blog/">Blog</a>
</li>
<li>
<a href="/blog/posts/">Blog Archive</a>
</li>
</ol>
</nav>
<h1>IndieWeb Carnival November 2024: Impact</h1>
<div class="article__info">
<p class="article__info--desc">My participation in IndieWeb Carnival November 2024, by reflecting on our capabilities of making an impact on other people and the world.</p>
<p>
1,169 words.
Posted on <time datetime="2024-12-01T13:01:27+0800">1 December 2024</time> by Leilukin
</p>
<p>Categories:
<a href="/categories/indieweb">indieweb</a>,
<a href="/categories/life">life</a>,
<a href="/categories/personal-web">personal web</a>
</p>
</div>
</header>
<content-wrapper>
2024-12-02 01:28:41 +00:00
<aside class="left-sidebar" aria-label="Left sidebar">
<details-utils force-open="(min-width: 60rem)" force-restore="">
<details class="toc__wrapper sidebar--sticky">
<summary class="toc__heading" id="toc-heading">
Table of Contents
</summary>
<nav class="toc" aria-labelledby="toc-heading"><ol><li><a href="#impact-of-a-kind-and-generous-stranger">Impact of a Kind and Generous Stranger</a></li>
<li><a href="#strangers-impact-on-my-career-choices">Strangers' Impact on My Career Choices</a></li>
<li><a href="#what-impact-i-hope-to-make">What Impact I Hope to Make</a></li></ol></nav>
</details>
</details-utils>
</aside>
<article class="content">
<p>Alexandra, also known as <a href="https://xandra.cc/">Xandra</a>, is hosting the <a href="https://indieweb.org/IndieWeb_Carnival">IndieWeb Carnival</a> for November 2024, with the topic being <a href="https://library.xandra.cc/indieweb-carnival/">&quot;Impact&quot;</a>. It is a great topic for self-reflection, and Xandra has provided prompts as jumping points for us to share our thoughts and experiences related to the topic. I have some of my own to share as well.</p>
<p>I believe everyone is capable of making an impact on someone else's life, no matter how small, and even if in an indirect manner, because our actions and choices have consequences.</p>
<div class="heading-wrapper h2">
<h2 id="impact-of-a-kind-and-generous-stranger">Impact of a Kind and Generous Stranger</h2>
<a class="heading-anchor" href="#impact-of-a-kind-and-generous-stranger" aria-labelledby="impact-of-a-kind-and-generous-stranger"><span hidden="">#</span></a></div>
<p>One of the people who have made great impact on my life was a stranger whose name and face I have unfortunately forgotten, but I still fondly remember the moment when she helped me.</p>
<p>At the time, I was about to travel back to my home state for the first time since I began to attend university, which was located on a different state from my home state. I was supposed to take a regular train to a station closest to my parents' hometown, but due to my lack of knowledge, I accidentally took rapid transit that was not even connected to my home state, so I realised my mistake only when the rapid transit began to travel back to the direction of the state where my university was located. I contacted my parents about my situation, and they suggested me to drop by the next stop in the neighbouring state to my home state and wait for them to pick me up and bring me to my parents' hometown.</p>
<p>There was a woman passenger who intended to leave the rapid transit at the next stop learned about my situation, then acting as my temporary guide at a place I was unfamiliar with, and suggest me to stay in a shopping mall while waiting for my parents, while giving me her phone number so I can call her in case I need her help again. Eventually, through continuous contact with my parents, my father managed to locate me, pick me up, and safely brought me to my parents' hometown.</p>
<p>I never saw that woman again, and I lost her phone number, but despite being a stranger, her kindness and generosity had left a great impact on me, for being a major reason why I can still have faith in humanity to this day despite everything. She made me genuinely believe there are still humans who are willing to help out strangers in times of need, and why I strive to be a kind person myself.</p>
<div class="heading-wrapper h2">
<h2 id="strangers-impact-on-my-career-choices">Strangers' Impact on My Career Choices</h2>
<a class="heading-anchor" href="#strangers-impact-on-my-career-choices" aria-labelledby="strangers-impact-on-my-career-choices"><span hidden="">#</span></a></div>
<p>My career choices from graphic design to web development were another major example in my life of how strangers can still capable of making a profound impact on me.</p>
<p>During my teenage blogging years, I was following a Taiwanese blogger who was also a professional web designer. I was impressed by her web design skills displayed on her blog, especially her Flash header. She ended up becoming the main inspiration for my interest in design, and I picked up some basic HTML and CSS knowledge and skills. However, I lack the knowledge of how to break into the web design field, so I studied graphic design in university and subsequently worked as a graphic designer instead. After working in the field for 8 years, I was burned out from graphic design as a profession, for many reasons, including my mistaken belief that I could get web design work as a graphic designer.</p>
<p>Fast-forward to 2022, I discovered <a href="https://neocities.org/">Neocities</a> through Tumblr, and thus discovered the resurgence of personal websites. My interest in HTML and CSS was fully rekindled after learning to code my personal website from scratch for the first time on Neocities. Eventually, my interest grew large enough to take online courses to teach myself web development, starting with <a href="https://www.freecodecamp.org/">freeCodeCamp</a>. I decided that I wanted to become a web developer after hearing other web and software developers' stories about getting developer jobs without a computer science degree, including stories of those who previously worked on a different occupation.</p>
<p>In mid-2024, I decided to get more involved in the personal web by joining its communities. In June 2024, I joined a personal web community for hobbyist web developers named <a href="https://32bit.cafe/">32-Bit Cafe</a>, which was <a href="https://32bit.cafe/about/">started by Xandra herself</a>, on both its Discourse forum and its Discord server. In <a href="https://discourse.32bit.cafe/t/hello-its-me-leilukin/1029">my introduction thread</a> on 32-Bit Cafe's Discourse forum, I introduced myself as an aspiring web developer, because I was already in the process of working towards my goal of switching my career path from graphic design to web development.</p>
<p>I was drawn to 32-Bit Cafe because it appears to share my values, after reading its <a href="https://32bit.cafe/about/codeofconduct.php">code of conduct</a> and <a href="https://discourse.32bit.cafe/guidelines">community guidelines</a>, and I was proven right. I have been enjoying my time in the 32-Bit Cafe community and have always felt welcomed there. Interacting with other webweavers has provided me a lot of inspirations for my own website as well.</p>
<p>Finally, after spending almost 2 years to teach myself web development, I reached my goal of becoming a professional web development in August 2024. I shared the news of my official career transition from graphic design to web development on <a href="/blog/posts/2024-08-18-from-hobbyist-to-professional-web-developer/">this blog</a> and <a href="https://discourse.32bit.cafe/t/tell-us-some-good-news/1091/16?u=leilukin">32-Bit Cafe's Discourse forum</a>, and received a great deal of support and positive responses. I even received messages from other people in the personal space, including members of 32-Bit Cafe, that my story of transitioning from hobbyist to professional web developer has inspired them to learn web development more.</p>
<p>I made the decision to pursue web development as a profession after being inspired by other people's stories, so I was pleased to hear that my own story has inspired others in turn too. This shows the impact we can have on others by sharing our stories.</p>
<div class="heading-wrapper h2">
<h2 id="what-impact-i-hope-to-make">What Impact I Hope to Make</h2>
<a class="heading-anchor" href="#what-impact-i-hope-to-make" aria-labelledby="what-impact-i-hope-to-make"><span hidden="">#</span></a></div>
<p>My life and experience have taught me that everyone is capable of making an impact on other people and the world, and making connections to people from all walks of life on the web only cemented such belief.</p>
<p>I have used the internet for most of my life, with blogging being my first foray into creating things on the web, and thus planting the seed of my love for the web. Participating in the independent web as an adult has given me hope that a better web is possible. Now that I am a professional web developer, I aim to make use of my knowledges, skills and abilities to make the web better.</p>
<p>I cannot predict how long I will live, but I hope to do what I can to make a positive impact on the world by channelling my desire to want to make the world a better place into my actions and creations.</p>
<nav class="blog__post--pagination" aria-labelledby="nextprev-title">
<h2 class="visually-hidden" id="nextprev-title">Next and Previous Blog Posts</h2>
<ul class="blog__post--nextprev">
<li class="blog__post--prev">
<p>Previous Post:</p>
<a href="/blog/posts/2024-10-28-re-social-media-personal-blog/">Re: Social Media Hasn&#39;t Killed the Personal Blog Just Yet</a>
</li>
</ul>
</nav>
</article>
<aside class="right-sidebar" aria-label="Right sidebar">
<nav class="content__nav sidebar--sticky" aria-labelledby="my-contents-title">
<h2 class="content__nav--title" id="my-contents-title">My Contents</h2>
<ul class="content__nav--links">
<li><a href="/archive/">Content Archive</a></li>
<li><a href="/categories/">Content Categories</a></li>
<li><a href="/articles/">Articles</a></li>
<li><a href="/blog/posts/">Blog Archive</a></li>
<li><a href="/blog/">Blog Home</a></li>
</ul>
</nav>
</aside>
</content-wrapper>
</main>
<footer class="footer">
<p>
<svg class="inline-icon" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M48 64C21.5 64 0 85.5 0 112c0 15.1 7.1 29.3 19.2 38.4L236.8 313.6c11.4 8.5 27 8.5 38.4 0L492.8 150.4c12.1-9.1 19.2-23.3 19.2-38.4c0-26.5-21.5-48-48-48L48 64zM0 176L0 384c0 35.3 28.7 64 64 64l384 0c35.3 0 64-28.7 64-64l0-208L294.4 339.2c-22.8 17.1-54 17.1-76.8 0L0 176z"></path></svg>
<a href="mailto:&#x63;&#x6F;&#x6E;&#x74;&#x61;&#x63;&#x74;&#x40;&#x6C;&#x65;&#x69;&#x6C;&#x75;&#x6B;&#x69;&#x6E;&#x2E;&#x63;&#x6F;&#x6D;">Contact me by email</a> (<a href="https://useplaintext.email/">plain text email</a> encouraged)
</p>
<h2 class="visually-hidden">Footer Navigation:</h2>
<ul class="inline-nav footer__links">
<li>
<a href="/feed.xml"><svg class="inline-icon" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--!Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M0 64C0 46.3 14.3 32 32 32c229.8 0 416 186.2 416 416c0 17.7-14.3 32-32 32s-32-14.3-32-32C384 253.6 226.4 96 32 96C14.3 96 0 81.7 0 64zM0 416a64 64 0 1 1 128 0A64 64 0 1 1 0 416zM32 160c159.1 0 288 128.9 288 288c0 17.7-14.3 32-32 32s-32-14.3-32-32c0-123.7-100.3-224-224-224c-17.7 0-32-14.3-32-32s14.3-32 32-32z"></path></svg>RSS Feed</a>
</li>
<li><a href="/sitemap/
">Site Map</a></li><li><a href="/changelogs/">Changelogs</a></li><li><a href="/accessibility/">Accessibility</a></li><li><a href="/colophon/">Colophon</a></li></ul>
<p>Made with ♥ by Leilukin since 11 September 2022</p>
<p>
<svg class="inline-icon" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--!Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M96 64c0-17.7 14.3-32 32-32l320 0 64 0c70.7 0 128 57.3 128 128s-57.3 128-128 128l-32 0c0 53-43 96-96 96l-192 0c-53 0-96-43-96-96L96 64zM480 224l32 0c35.3 0 64-28.7 64-64s-28.7-64-64-64l-32 0 0 128zM32 416l512 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 480c-17.7 0-32-14.3-32-32s14.3-32 32-32z"></path></svg>
<a href="https://ko-fi.com/leilukin">Support me on Ko-Fi</a>
</p><div class="h-card hidden">
<span class="p-name p-nickname">Leilukin</span>
<a href="/" class="u-url">Home page</a>
<img src="https://i.postimg.cc/RZJgS6tY/leilukin-bee.avif" alt="Leilukin" class="u-photo" loading="lazy">
<span class="p-country-name">Malaysia</span>
<span class="p-note">They/she. A proudly queer and autistic <span class="p-gender-identity">non-binary</span> lesbian from Malaysia.</span>
</div><a href="#top" class="top-btn">
<svg class="top-btn__arrow" focusable="false" aria-hidden="true" viewBox="0 0 26 28">
<path d="M25.172 15.172c0 0.531-0.219 1.031-0.578 1.406l-1.172 1.172c-0.375 0.375-0.891 0.594-1.422 0.594s-1.047-0.219-1.406-0.594l-4.594-4.578v11c0 1.125-0.938 1.828-2 1.828h-2c-1.062 0-2-0.703-2-1.828v-11l-4.594 4.578c-0.359 0.375-0.875 0.594-1.406 0.594s-1.047-0.219-1.406-0.594l-1.172-1.172c-0.375-0.375-0.594-0.875-0.594-1.406s0.219-1.047 0.594-1.422l10.172-10.172c0.359-0.375 0.875-0.578 1.406-0.578s1.047 0.203 1.422 0.578l10.172 10.172c0.359 0.375 0.578 0.891 0.578 1.422z"></path>
</svg>
Back to Top
</a>
</footer>
</body>
</html>