~mika/www.m1kadev.nl

d38822d87e8cc8888050783fc365394c42146242 — m1ka 3 months ago 90be314
add :3 animation
7 files changed, 65 insertions(+), 2 deletions(-)

M pages/index.fxg
A scripts/rotate-colon-three.js
D static/.DS_Store
M styles/base.css
A styles/index.css
M templates/pages/colophon.thtml
A templates/pages/index.thtml
M pages/index.fxg => pages/index.fxg +1 -1
@@ 1,4 1,4 @@
====== haii :3 i'm mika ======
====== haii :3 i'm mika !! ======

haii! i'm mika (also //m1ka//, //m1kadev//). i'm a (mostly backend) developer from <#https://wikipedia.org/wiki/The_Netherlands The Netherlands>. besides programming, i also like to play music and cook.


A scripts/rotate-colon-three.js => scripts/rotate-colon-three.js +4 -0
@@ 0,0 1,4 @@
addEventListener("DOMContentLoaded", _ => {
    const header = document.getElementsByTagName("main").item(0).children[0];
    header.innerHTML = "haii <span id=\"colon-three\">3</span> i'm mika !!";
});
\ No newline at end of file

D static/.DS_Store => static/.DS_Store +0 -0
M styles/base.css => styles/base.css +0 -1
@@ 127,7 127,6 @@ img#codeberg {
    height: 2rem;
}


@media (min-width: 900px) {

    .link-group {

A styles/index.css => styles/index.css +32 -0
@@ 0,0 1,32 @@
@keyframes rotate {
    0% {
        transform: rotate(90deg) scaleY(-1);
    }

    50% {
        transform: rotate(90deg) scaleY(1);
    }

    100% {
        transform: rotate(90deg) scaleY(-1);
    }
}

#colon-three {
    display: inline-block;
    font-style: normal;
    font-family: "Comic Sans MS", "Comic Sans", "Comic Neue", sans-serif;

    animation-name: rotate;
    animation-duration: 90s;
    animation-iteration-count: infinite;
    animation-timing-function: steps(1);
}

#colon-three::before {
    content: ":";
}

#colon-three:hover::before {
    content: ";";
}
\ No newline at end of file

M templates/pages/colophon.thtml => templates/pages/colophon.thtml +2 -0
@@ 5,6 5,8 @@
    {{ &base_header }}
    <title>{{ location }} - m1kadev</title>
    {{ &ogp }}

    <script src="/scripts/dyn-codeberg-logo.js"></script>
</head>

<body>

A templates/pages/index.thtml => templates/pages/index.thtml +26 -0
@@ 0,0 1,26 @@
<!DOCTYPE html>
<html lang="en-GB">

<head>
    {{ &base_header }}
    <script src="/scripts/dyn-codeberg-logo.js"></script>
    <script src="/scripts/rotate-colon-three.js"></script>

    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Comic+Neue&display=swap" rel="stylesheet">
    <link href="/styles/index.css" rel="stylesheet">


    <title>{{ location }} - m1kadev</title>
    {{ &ogp }}
</head>

<body>
    {{ &navbar }}
    <main>
        {{ &fxg_content }}
        {{ &footer }}
    </main>
</body>
</html>
\ No newline at end of file