cozy/src/components/Footer.astro

66 lines
1.2 KiB
Text

---
import Icon from 'astro-iconify'
import { VERSION } from '../consts'
---
<footer>
<section>Remove distractions. Save for later.</section>
<section class="attribution">
<a href="/blog/01-building-a-cozy-web/">Hand-crafted</a> with <Icon
name="line-md:heart"
/> by <a href="https://ayo.ayco.io">Ayo Ayco</a>
<br />
<a href="/blog">Blog</a> •
<a href="https://ayco.io/sh/cozy">SourceHut</a> •
<a href="https://social.ayco.io/@ayo">Mastodon</a>
<br />
<span>{VERSION}</span>
</section>
<section class="disclaimer">All rights reserved to content owners.</section>
</footer>
<style>
footer {
width: 100%;
margin: 0 auto;
text-align: center;
color: rgb(var(--gray));
display: flex;
font-size: small;
& a {
color: rgb(var(--gray));
}
& a:hover {
color: var(--accent);
}
& svg {
width: 1.25rem;
height: 1.25rem;
vertical-align: bottom;
display: inline;
border: 0px;
color: red;
}
& section {
flex: 1;
padding: 1rem 1rem 0;
&.attribution {
flex: 2;
}
}
}
@media (max-width: 600px) {
footer {
flex-direction: column;
max-width: 350px;
}
}
</style>