feat: Add footer from website
This commit is contained in:
parent
9bf14d65f8
commit
d91088bc42
GPG key ID:
83B789081A0878FB
2 changed files with 88 additions and 1 deletions
|
|
@ -19,6 +19,7 @@ body {
|
|||
align-items: center;
|
||||
flex-direction: column;
|
||||
max-width: 100vw;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.content {
|
||||
|
|
@ -26,7 +27,7 @@ body {
|
|||
padding: 8px 16px;
|
||||
width: calc(100vw - 32px);
|
||||
max-width: 720px;
|
||||
flex: 1;
|
||||
/* flex: 1; */
|
||||
background-color: var(--background-2);
|
||||
border: 1px solid var(--accent);
|
||||
border-radius: 4px;
|
||||
|
|
@ -63,3 +64,54 @@ a {
|
|||
.nav-button:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.footer {
|
||||
margin-bottom: 16px;
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.icon-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
.icon-row > * {
|
||||
margin-right: 16px;
|
||||
}
|
||||
.icon-row svg {
|
||||
transition: fill 200ms ease;
|
||||
fill: white;
|
||||
}
|
||||
.hover-email:hover {
|
||||
fill: var(--accent);
|
||||
}
|
||||
.hover-discord:hover {
|
||||
fill: #5865F2;
|
||||
}
|
||||
.hover-github:hover {
|
||||
fill: #24292f;
|
||||
}
|
||||
.hover-mastodon:hover {
|
||||
fill: #3c99dc;
|
||||
}
|
||||
.hover-reddit:hover {
|
||||
fill: #ff4500;
|
||||
}
|
||||
.hover-twitch:hover {
|
||||
fill: #6441a5;
|
||||
}
|
||||
.hover-twitter:hover {
|
||||
fill: #00acee;
|
||||
}
|
||||
.hover-code:hover {
|
||||
fill: #3a86ff;
|
||||
}
|
||||
.icon {
|
||||
height: 1.2em;
|
||||
fill: var(--foreground-dim);
|
||||
vertical-align: sub;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -14,6 +14,41 @@
|
|||
<body>
|
||||
<div class="page-container">
|
||||
{% block content %}{% endblock %}
|
||||
<footer class="footer">
|
||||
<div class="icon-row">
|
||||
<!-- Icons used here are taken from the sets on https://iconify.design -->
|
||||
<a href="mailto:ash@ashhhleyyy.dev" target="_blank">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" title="Email (personal)" alt="Email (personal)" class="hover-email" width="24px" height="24px" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path d="M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm-.4 4.25l-7.07 4.42c-.32.2-.74.2-1.06 0L4.4 8.25a.85.85 0 1 1 .9-1.44L12 11l6.7-4.19a.85.85 0 1 1 .9 1.44z"/></svg>
|
||||
</a>
|
||||
<a href="mailto:contact@ashhhleyyy.dev" target="_blank">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" title="Email (other)" alt="Email (other)" class="hover-email" width="24px" height="24px" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path d="M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm-.4 4.25l-7.07 4.42c-.32.2-.74.2-1.06 0L4.4 8.25a.85.85 0 1 1 .9-1.44L12 11l6.7-4.19a.85.85 0 1 1 .9 1.44z"/></svg>
|
||||
</a>
|
||||
<a href="https://discord.com/users/828168927762841601" target="_blank">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" title="Discord" alt="Discord" class="hover-discord" width="24px" height="24px" preserveAspectRatio="xMidYMid meet" viewBox="0 0 640 512"><path d="M524.531 69.836a1.5 1.5 0 0 0-.764-.7A485.065 485.065 0 0 0 404.081 32.03a1.816 1.816 0 0 0-1.923.91a337.461 337.461 0 0 0-14.9 30.6a447.848 447.848 0 0 0-134.426 0a309.541 309.541 0 0 0-15.135-30.6a1.89 1.89 0 0 0-1.924-.91a483.689 483.689 0 0 0-119.688 37.107a1.712 1.712 0 0 0-.788.676C39.068 183.651 18.186 294.69 28.43 404.354a2.016 2.016 0 0 0 .765 1.375a487.666 487.666 0 0 0 146.825 74.189a1.9 1.9 0 0 0 2.063-.676A348.2 348.2 0 0 0 208.12 430.4a1.86 1.86 0 0 0-1.019-2.588a321.173 321.173 0 0 1-45.868-21.853a1.885 1.885 0 0 1-.185-3.126a251.047 251.047 0 0 0 9.109-7.137a1.819 1.819 0 0 1 1.9-.256c96.229 43.917 200.41 43.917 295.5 0a1.812 1.812 0 0 1 1.924.233a234.533 234.533 0 0 0 9.132 7.16a1.884 1.884 0 0 1-.162 3.126a301.407 301.407 0 0 1-45.89 21.83a1.875 1.875 0 0 0-1 2.611a391.055 391.055 0 0 0 30.014 48.815a1.864 1.864 0 0 0 2.063.7A486.048 486.048 0 0 0 610.7 405.729a1.882 1.882 0 0 0 .765-1.352c12.264-126.783-20.532-236.912-86.934-334.541ZM222.491 337.58c-28.972 0-52.844-26.587-52.844-59.239s23.409-59.241 52.844-59.241c29.665 0 53.306 26.82 52.843 59.239c0 32.654-23.41 59.241-52.843 59.241Zm195.38 0c-28.971 0-52.843-26.587-52.843-59.239s23.409-59.241 52.843-59.241c29.667 0 53.307 26.82 52.844 59.239c0 32.654-23.177 59.241-52.844 59.241Z"/></svg>
|
||||
</a>
|
||||
<a href="https://github.com/ashhhleyyy" target="_blank">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" title="GitHub" alt="GitHub" class="hover-github" width="24px" height="24px" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path d="M12 2A10 10 0 0 0 2 12c0 4.42 2.87 8.17 6.84 9.5c.5.08.66-.23.66-.5v-1.69c-2.77.6-3.36-1.34-3.36-1.34c-.46-1.16-1.11-1.47-1.11-1.47c-.91-.62.07-.6.07-.6c1 .07 1.53 1.03 1.53 1.03c.87 1.52 2.34 1.07 2.91.83c.09-.65.35-1.09.63-1.34c-2.22-.25-4.55-1.11-4.55-4.92c0-1.11.38-2 1.03-2.71c-.1-.25-.45-1.29.1-2.64c0 0 .84-.27 2.75 1.02c.79-.22 1.65-.33 2.5-.33c.85 0 1.71.11 2.5.33c1.91-1.29 2.75-1.02 2.75-1.02c.55 1.35.2 2.39.1 2.64c.65.71 1.03 1.6 1.03 2.71c0 3.82-2.34 4.66-4.57 4.91c.36.31.69.92.69 1.85V21c0 .27.16.59.67.5C19.14 20.16 22 16.42 22 12A10 10 0 0 0 12 2Z"/></svg>
|
||||
</a>
|
||||
<a href="https://tech.lgbt/@ash" target="_blank">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" title="Mastodon" alt="Mastodon" class="hover-mastodon" width="24px" height="24px" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path d="M20.94 14c-.28 1.41-2.44 2.96-4.97 3.26c-1.31.15-2.6.3-3.97.24c-2.25-.11-4-.54-4-.54v.62c.32 2.22 2.22 2.35 4.03 2.42c1.82.05 3.44-.46 3.44-.46l.08 1.65s-1.28.68-3.55.81c-1.25.07-2.81-.03-4.62-.5c-3.92-1.05-4.6-5.24-4.7-9.5l-.01-3.43c0-4.34 2.83-5.61 2.83-5.61C6.95 2.3 9.41 2 11.97 2h.06c2.56 0 5.02.3 6.47.96c0 0 2.83 1.27 2.83 5.61c0 0 .04 3.21-.39 5.43M18 8.91c0-1.08-.3-1.91-.85-2.56c-.56-.63-1.3-.96-2.23-.96c-1.06 0-1.87.41-2.42 1.23l-.5.88l-.5-.88c-.56-.82-1.36-1.23-2.43-1.23c-.92 0-1.66.33-2.23.96C6.29 7 6 7.83 6 8.91v5.26h2.1V9.06c0-1.06.45-1.62 1.36-1.62c1 0 1.5.65 1.5 1.93v2.79h2.07V9.37c0-1.28.5-1.93 1.51-1.93c.9 0 1.35.56 1.35 1.62v5.11H18V8.91Z"/></svg>
|
||||
</a>
|
||||
<a href="https://reddit.com/u/ash_b_" target="_blank">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" title="Reddit" alt="Reddit" class="hover-reddit" width="24px" height="24px" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path d="M14.5 15.41c.08.09.08.28 0 .39c-.73.7-2.09.76-2.5.76c-.39 0-1.75-.06-2.46-.76c-.1-.11-.1-.3 0-.39c.11-.1.28-.1.38 0c.46.46 1.41.59 2.08.59c.69 0 1.66-.13 2.1-.59c.11-.1.28-.1.4 0m-3.75-2.37c0-.57-.47-1.04-1.04-1.04c-.57 0-1.04.47-1.04 1.04c0 .57.47 1.05 1.04 1.04c.57 0 1.04-.47 1.04-1.04M14.29 12c-.57 0-1.04.5-1.04 1.05s.47 1.04 1.04 1.04c.57 0 1.04-.48 1.04-1.04c0-.55-.47-1.05-1.04-1.05M22 12c0 5.5-4.5 10-10 10S2 17.5 2 12S6.5 2 12 2s10 4.5 10 10m-3.33 0c0-.81-.67-1.46-1.45-1.46c-.4 0-.76.16-1.02.41c-1-.72-2.37-1.18-3.9-1.24l.67-3.13l2.17.47c.02.55.48.99 1.04.99c.57 0 1.04-.47 1.04-1.04c0-.57-.47-1.04-1.04-1.04c-.41 0-.77.24-.93.59l-2.43-.52c-.07-.03-.14 0-.19.04c-.06.04-.09.1-.1.17l-.74 3.48c-1.55.05-2.95.51-3.97 1.24c-.26-.25-.62-.4-1.01-.4c-.81 0-1.46.65-1.46 1.44c0 .61.36 1.11.86 1.34c-.02.16-.03.28-.03.44c0 2.22 2.61 4.07 5.82 4.07c3.23 0 5.85-1.82 5.85-4.07c0-.14-.01-.28-.04-.44c.5-.23.86-.74.86-1.34Z"/></svg>
|
||||
</a>
|
||||
<a href="https://twitch.tv/ashle3eyyy" target="_blank">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" title="Twitch" alt="Twitch" class="hover-twitch" width="24px" height="24px" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path d="M11.64 5.93h1.43v4.28h-1.43m3.93-4.28H17v4.28h-1.43M7 2L3.43 5.57v12.86h4.28V22l3.58-3.57h2.85L20.57 12V2m-1.43 9.29l-2.85 2.85h-2.86l-2.5 2.5v-2.5H7.71V3.43h11.43Z"/></svg>
|
||||
</a>
|
||||
<a href="https://twitter.com/@AshhhleyyyB" target="_blank">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" title="Twitter" alt="Twitter" class="hover-twitter" width="24px" height="24px" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path d="M22.46 6c-.77.35-1.6.58-2.46.69c.88-.53 1.56-1.37 1.88-2.38c-.83.5-1.75.85-2.72 1.05C18.37 4.5 17.26 4 16 4c-2.35 0-4.27 1.92-4.27 4.29c0 .34.04.67.11.98C8.28 9.09 5.11 7.38 3 4.79c-.37.63-.58 1.37-.58 2.15c0 1.49.75 2.81 1.91 3.56c-.71 0-1.37-.2-1.95-.5v.03c0 2.08 1.48 3.82 3.44 4.21a4.22 4.22 0 0 1-1.93.07a4.28 4.28 0 0 0 4 2.98a8.521 8.521 0 0 1-5.33 1.84c-.34 0-.68-.02-1.02-.06C3.44 20.29 5.7 21 8.12 21C16 21 20.33 14.46 20.33 8.79c0-.19 0-.37-.01-.56c.84-.6 1.56-1.36 2.14-2.23Z"/></svg>
|
||||
</a>
|
||||
<a href="https://ashhhleyyy.dev/git/" target="_blank">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" title="Source Code" alt="Source Code" class="hover-code" width="24px" height="24px" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path d="m8.086 18.611l5.996-14.004a1 1 0 0 1 1.878.677l-.04.11l-5.996 14.004a1 1 0 0 1-1.878-.677l.04-.11l5.996-14.004L8.086 18.61Zm-5.793-7.318l4-4a1 1 0 0 1 1.497 1.32l-.083.094L4.414 12l3.293 3.293a1 1 0 0 1-1.32 1.498l-.094-.084l-4-4a1 1 0 0 1-.083-1.32l.083-.094l4-4l-4 4Zm14-4.001a1 1 0 0 1 1.32-.083l.093.083l4.001 4.001a1 1 0 0 1 .083 1.32l-.083.095l-4.001 3.995a1 1 0 0 1-1.497-1.32l.084-.095L19.584 12l-3.293-3.294a1 1 0 0 1 0-1.414Z"/></svg>
|
||||
</a>
|
||||
</div>
|
||||
<p>
|
||||
Copyright (c) 2022-2022 Ashhhleyyy. All rights reserved unless otherwise noted.
|
||||
</p>
|
||||
</footer>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
Loading…
Reference in a new issue