feat: rework footer, add copyright

This commit is contained in:
Adrien Allard 2024-06-10 18:11:00 +02:00
parent 8ce5c102dd
commit 14d80a2ca6
2 changed files with 25 additions and 8 deletions

View File

@ -1,26 +1,31 @@
<div class="footer">
<div class="footer--content">
<img class="footer--logo" src="/img/footer-logo.png">
<div class="footer--copyright">
{% trans %}
Copyright © Frog Collective 2024. All rights reserved.
{% endtrans %}
</div>
<div class="footer--links">
<a href="mailto:contact@frog-collective.com">
<a class="footer--link" href="mailto:contact@frog-collective.com">
<img src="/img/mail-fill.svg" alt-text=="{{ gettext('Mail') }}"></img>
</a>
<a href="https://frog-collective.itch.io/" target="_blank">
<a class="footer--link" href="https://frog-collective.itch.io/" target="_blank">
<img src="/img/itchio-fill.svg" alt-text="Itch.io"></img>
</a>
<a href="https://www.youtube.com/@FrogCoGames" target="_blank">
<a class="footer--link" href="https://www.youtube.com/@FrogCoGames" target="_blank">
<img src="/img/youtube-fill.svg" alt-text=="Youtube"></img>
</a>
<a href="https://www.twitch.tv/frogcollective" target="_blank">
<a class="footer--link" href="https://www.twitch.tv/frogcollective" target="_blank">
<img src="/img/twitch-fill.svg" alt-text=="Twitch"></img>
</a>
<a href="https://mastodon.social/@frogcollective" target="_blank">
<a class="footer--link" href="https://mastodon.social/@frogcollective" target="_blank">
<img src="/img/mastodon-fill.svg" alt-text=="Mastodon"></img>
</a>
<a href="https://x.com/FrogCoGames" target="_blank">
<a class="footer--link" href="https://x.com/FrogCoGames" target="_blank">
<img src="/img/twitter-x-line.svg" alt-text=="Twitter - X"></img>
</a>
<a href="https://www.facebook.com/profile.php?id=61560180067337" target="_blank">
<a class="footer--link" href="https://www.facebook.com/profile.php?id=61560180067337" target="_blank">
<img src="/img/facebook-circle-fill.svg" alt-text=="Facebook"></img>
</a>
</div>

View File

@ -28,9 +28,16 @@
width: 100px;
}
&--copyright {
display: flex;
align-self: center;
padding: var(--space-medium);
}
&--links {
flex: 1 1 1px;
display: flex;
align-self: center;
align-items: center;
justify-content: end;
@ -39,9 +46,14 @@
}
img {
width: 2em;
width: 1.8em;
filter: invert(100%);
}
}
&--link {
@extend %button;
display: flex;
padding: var(--space-xsmall);
}
}