---
const today = new Date();
---

<footer>
    &copy; 2022-{today.getFullYear()} Emiliko Mirror. No rights reserved.
    <div class="social-links">
        <a href="mailto:izuko@ualberta.ca" target="_blank">
            <span class="sr-only">Email</span>
            <svg class="email-logo" fill="#000000" height="32" width="32" id="Capa_1" viewBox="0 0 75.294 75.294">
                <style>
                    svg.email-logo path{fill: #000;}
                    svg.email-logo:hover path{fill: var(--accent-color)}
                </style>
                <g>
                    <path d="M66.097,12.089h-56.9C4.126,12.089,0,16.215,0,21.286v32.722c0,5.071,4.126,9.197,9.197,9.197h56.9
                        c5.071,0,9.197-4.126,9.197-9.197V21.287C75.295,16.215,71.169,12.089,66.097,12.089z M61.603,18.089L37.647,33.523L13.691,18.089
                        H61.603z M66.097,57.206h-56.9C7.434,57.206,6,55.771,6,54.009V21.457l29.796,19.16c0.04,0.025,0.083,0.042,0.124,0.065
                        c0.043,0.024,0.087,0.047,0.131,0.069c0.231,0.119,0.469,0.215,0.712,0.278c0.025,0.007,0.05,0.01,0.075,0.016
                        c0.267,0.063,0.537,0.102,0.807,0.102c0.001,0,0.002,0,0.002,0c0.002,0,0.003,0,0.004,0c0.27,0,0.54-0.038,0.807-0.102
                        c0.025-0.006,0.05-0.009,0.075-0.016c0.243-0.063,0.48-0.159,0.712-0.278c0.044-0.022,0.088-0.045,0.131-0.069
                        c0.041-0.023,0.084-0.04,0.124-0.065l29.796-19.16v32.551C69.295,55.771,67.86,57.206,66.097,57.206z"/>
                </g>
            </svg>
        </a>
        <a href="https://discord.com/users/180472559148597249" target="_blank">
            <span class="sr-only">Discord</span>
            <svg class="discord-logo" width="32" height="32" viewBox="0 0 127.14 96.36">
                <style>
                    svg.discord-logo{fill:#000;}
                    svg.discord-logo:hover{fill:var(--accent-color);}
                </style>
                <path
                    d="M107.7,8.07A105.15,105.15,0,0,0,81.47,0a72.06,72.06,0,0,0-3.36,6.83A97.68,97.68,0,0,0,49,6.83,72.37,72.37,0,0,0,45.64,0,105.89,105.89,0,0,0,19.39,8.09C2.79,32.65-1.71,56.6.54,80.21h0A105.73,105.73,0,0,0,32.71,96.36,77.7,77.7,0,0,0,39.6,85.25a68.42,68.42,0,0,1-10.85-5.18c.91-.66,1.8-1.34,2.66-2a75.57,75.57,0,0,0,64.32,0c.87.71,1.76,1.39,2.66,2a68.68,68.68,0,0,1-10.87,5.19,77,77,0,0,0,6.89,11.1A105.25,105.25,0,0,0,126.6,80.22h0C129.24,52.84,122.09,29.11,107.7,8.07ZM42.45,65.69C36.18,65.69,31,60,31,53s5-12.74,11.43-12.74S54,46,53.89,53,48.84,65.69,42.45,65.69Zm42.24,0C78.41,65.69,73.25,60,73.25,53s5-12.74,11.44-12.74S96.23,46,96.12,53,91.08,65.69,84.69,65.69Z"/>
            </svg>
        </a>
        <a href="https://anilist.co/user/akemiko" target="_blank">
            <span class="sr-only">Anilist</span>
            <svg class="anilist-logo" width="32px" height="32px" viewBox="0 0 32 32">
                <style>
                    svg.anilist-logo rect{fill:#000; fill-opacity:1; stroke:none;}
                    svg.anilist-logo path {stroke:none; fill-rule:nonzero; fill-opacity:1;}
                    svg.anilist-logo path.light {fill:#fff;}
                    svg.anilist-logo path.dark {fill:#aaa;}
                    svg.anilist-logo:hover path.dark{fill: var(--accent-color);}
                </style>
                <g id="surface1">
                    <rect rx="8" x="0" y="0" width="32" height="32" />
                    <path
                        class="dark"
                        d="M 20.121094 20.203125 L 20.121094 8.539062 C 20.121094 7.867188 19.753906 7.5 19.085938 7.5 L 16.808594 7.5 C 16.140625 7.5 15.773438 7.867188 15.773438 8.539062 L 15.773438 14.078125 C 15.773438 14.234375 17.273438 14.957031 17.3125 15.113281 C 18.453125 19.585938 17.558594 23.167969 16.476562 23.335938 C 18.25 23.425781 18.441406 24.277344 17.125 23.695312 C 17.324219 21.308594 18.113281 21.3125 20.375 23.605469 C 20.394531 23.628906 20.839844 24.5625 20.867188 24.5625 L 26.214844 24.5625 C 26.882812 24.5625 27.25 24.195312 27.25 23.523438 L 27.25 21.242188 C 27.25 20.574219 26.882812 20.203125 26.214844 20.203125 Z M 20.121094 20.203125 "/>
                    <path
                        class="light"
                        d="M 10.667969 7.5 L 4.6875 24.5625 L 9.332031 24.5625 L 10.34375 21.609375 L 15.40625 21.609375 L 16.394531 24.5625 L 21.019531 24.5625 L 15.0625 7.5 Z M 11.402344 17.828125 L 12.851562 13.101562 L 14.441406 17.828125 Z M 11.402344 17.828125 "/>
                </g>
            </svg>
        </a>
        <a href="https://www.linkedin.com/in/akemi-izuko" target="_blank">
            <span class="sr-only">LinkedIn</span>
            <svg class="linkedin-logo" width="32px" height="32px" viewBox="0 0 24 24">
                <style>
                    svg.linkedin-logo path{fill: #000}
                    svg.linkedin-logo:hover path{fill: var(--accent-color);}
                </style>
                <path
                    d="M19 0h-14c-2.761 0-5 2.239-5 5v14c0 2.761 2.239 5 5 5h14c2.762 0 5-2.239 5-5v-14c0-2.761-2.238-5-5-5zm-11 19h-3v-11h3v11zm-1.5-12.268c-.966 0-1.75-.79-1.75-1.764s.784-1.764 1.75-1.764 1.75.79 1.75 1.764-.783 1.764-1.75 1.764zm13.5 12.268h-3v-5.604c0-3.368-4-3.113-4 0v5.604h-3v-11h3v1.765c1.396-2.586 7-2.777 7 2.476v6.759z"/>
            </svg>
        </a>
        <a href="https://git.mami2.moe/akemi?tab=activity" target="_blank">
            <span class="sr-only">Forgejo</span>
            <svg class="forgejo-logo" viewBox="0 0 212 212" aria-hidden="true" width="32" height="32">
                <style>
                    svg.forgejo-logo path{stroke-width: 25}
                    svg.forgejo-logo circle{stroke-width: 15}
                    svg.forgejo-logo .light{fill: none; stroke: #aaa;}
                    svg.forgejo-logo .dark{fill: none; stroke: #000;}
                    svg.forgejo-logo:hover .light{stroke: var(--accent-color);}
                </style>
                <g transform="translate(6,6)">
                    <path class="light" d="M58 168 v-98 a50 50 0 0 1 50-50 h20" />
                    <path class="dark" d="M58 168 v-30 a50 50 0 0 1 50-50 h20" />
                    <circle class="light" cx="142" cy="20" r="18" />
                    <circle class="dark" cx="142" cy="88" r="18" />
                    <circle class="dark" cx="58" cy="180" r="18" />
                </g>
            </svg>
        </a>
        <a href="https://gitlab.com/aizuko" target="_blank">
            <span class="sr-only">Codeberg</span>
            <svg class="gitlab-logo" width="32" height="32" viewBox="80 90 210 210">
                <style>
                    .cls-1{fill:#000;}
                    svg.gitlab-logo .cls-2{fill:#777;}
                    svg.gitlab-logo .cls-3{fill:#aaa;}
                    svg.gitlab-logo:hover .cls-2{fill:var(--accent-color);}
                    svg.gitlab-logo:hover .cls-3{fill:var(--accent-color);}
                </style>
                <g>
                    <path
                        class="cls-1"
                        d="M282.83,170.73l-.27-.69-26.14-68.22a6.81,6.81,0,0,0-2.69-3.24,7,7,0,0,0-8,.43,7,7,0,0,0-2.32,3.52l-17.65,54H154.29l-17.65-54A6.86,6.86,0,0,0,134.32,99a7,7,0,0,0-8-.43,6.87,6.87,0,0,0-2.69,3.24L97.44,170l-.26.69a48.54,48.54,0,0,0,16.1,56.1l.09.07.24.17,39.82,29.82,19.7,14.91,12,9.06a8.07,8.07,0,0,0,9.76,0l12-9.06,19.7-14.91,40.06-30,.1-.08A48.56,48.56,0,0,0,282.83,170.73Z"/>
                    <path
                        class="cls-2"
                        d="M282.83,170.73l-.27-.69a88.3,88.3,0,0,0-35.15,15.8L190,229.25c19.55,14.79,36.57,27.64,36.57,27.64l40.06-30,.1-.08A48.56,48.56,0,0,0,282.83,170.73Z"/>
                    <path
                        class="cls-3"
                        d="M153.43,256.89l19.7,14.91,12,9.06a8.07,8.07,0,0,0,9.76,0l12-9.06,19.7-14.91S209.55,244,190,229.25C170.45,244,153.43,256.89,153.43,256.89Z"/>
                    <path
                        class="cls-2"
                        d="M132.58,185.84A88.19,88.19,0,0,0,97.44,170l-.26.69a48.54,48.54,0,0,0,16.1,56.1l.09.07.24.17,39.82,29.82s17-12.85,36.57-27.64Z"/>
                </g>
            </svg>
        </a>
        <a href="https://github.com/aizuko" target="_blank">
            <span class="sr-only">Github</span>
            <svg class="github-logo" viewBox="0 0 16 16" aria-hidden="true" width="32" height="32">
                <style>
                    svg.github-logo{fill:#000;}
                    svg.github-logo:hover{fill:var(--accent-color);}
                </style>
                <path
                    d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z" />
            </svg>
        </a>
        <a href="https://codeberg.org/akemi?tab=activity" target="_blank">
            <span class="sr-only">Codeberg</span>
            <svg class="codeberg-logo" width="32" height="32" aria-hidden="true" viewBox="0 0 24 24" fill="#000">
                <style>
                    svg.codeberg-logo{fill:#000;}
                    svg.codeberg-logo:hover{fill:var(--accent-color);}
                </style>
              <path
                d="M11.955.49A12 12 0 0 0 0 12.49a12 12 0 0 0 1.832 6.373L11.838 5.928a.187.14 0 0 1 .324 0l10.006 12.935A12 12 0 0 0 24 12.49a12 12 0 0 0-12-12 12 12 0 0 0-.045 0zm.375 6.467 4.416 16.553a12 12 0 0 0 5.137-4.213z">
              </path>
            </svg>
        </a>
    </div>
    </div>
</footer>

<style>
    footer {
        padding: 2em 1em 6em 1em;
        background: linear-gradient(var(--gray-gradient)) no-repeat;
        color: rgb(var(--gray));
        text-align: center;
        margin-top: 60px;
    }
    .social-links {
        display: flex;
        justify-content: center;
        gap: 1em;
        margin-top: 1em;
    }
    .social-links a {
        text-decoration: none;
        color: rgb(var(--gray));
    }
    .social-links a:hover {
        color: rgb(var(--gray-dark));
    }
</style>