56 lines
1.2 KiB
Svelte
56 lines
1.2 KiB
Svelte
<script>
|
|
import git from '$lib/assets/git-branch-fill.svg';
|
|
import rss from '$lib/assets/rss-fill.svg';
|
|
</script>
|
|
|
|
<div class="footer">
|
|
<div>
|
|
<span>Made with 🤘 by </span>
|
|
<a href="https://metalhead.club/@aymm" rel="me">@aymm@metalhead.club</a>
|
|
</div>
|
|
|
|
|
<div>
|
|
<a href="https://phlaym.net/git/phlaym/moshing-mammut">
|
|
<img alt="Git branch" src={git} class="icon" />
|
|
Source Code
|
|
</a>
|
|
</div>
|
|
|
|
|
<div>
|
|
<a href="/feed.xml">
|
|
<img alt="RSS" src={rss} class="icon" />
|
|
RSS Feed
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<style>
|
|
.footer {
|
|
position: sticky;
|
|
bottom: 0px;
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
align-items: center;
|
|
gap: 10px;
|
|
backdrop-filter: blur(10px);
|
|
-webkit-backdrop-filter: blur(10px);
|
|
background-color: var(--color-grey-translucent);
|
|
padding: 0.3em 1em;
|
|
margin: 0 -8px;
|
|
border-radius: 3px;
|
|
}
|
|
.icon {
|
|
position: relative;
|
|
top: 0.25em;
|
|
color: white;
|
|
height: 1em;
|
|
}
|
|
@media (prefers-color-scheme: dark) {
|
|
.icon {
|
|
filter: invert();
|
|
}
|
|
.footer {
|
|
background-color: var(--color-grey-translucent);
|
|
}
|
|
}
|
|
</style> |