index.html - website

1 
2 
3 
4 
5 
6 
7 
8 
9 
10 
11 
12 
13 
14 
15 
16 
17 
18 
19 
20 
21 
22 
23 
24 
25 
26 
27 
28 
29 
30 
31 
32 
33 
34 
35 
36 
37 
38 
39 
40 
41 
42 
43 
44 
45 
46 
47 
48 
49 
50 
51 
52 
53 
54 
55 
56 
57 
58 
59 
60 
61 
62 
63 
64 
65 
66 
67 <!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">

        <title>Hewwo! - zaphyra.eu</title>

        <link href="style.css" rel="stylesheet">
    </head>
    <body>
        <article>
            <header>
                <b>zaphyra.eu</b>
            </header>
            <section>
                <h1>Hewwo!</h1>
                <img class="avatar" width="175" src="avatar.jpg">
                <p>
                    My name is katja <small>(she/her)</small> also known as <i>zaphyra <small>(it/its, she/her)</small></i> 
                    and i'm a <span class="queer">queer</span> computer-toucher. Which is just a nice way of saying that i
                    like <del>to suffer</del> maintain some infrastructure.
                </p>
                <p>
                    When it comes to computers... i am very passionate about doing things declaratively (i use nixos, btw),
                    like to selfhost things and prefer to use decentralized/federated protocols, absolutely hate
                    proprietary stuff.
                </p>
                <p>
                    Appart from that i sometimes thinker with electronics and really enjoy trains 
                    <small>(as in the thing that moves <em>and</em> the infrastructure around that)</small>.
                    I also used to do a bit of photography in the past, but sadly had to stop doing that because
                    of <i>$reasons</i>...
                </p>
                <p>
                    It's possible to catch me in: <abbr title="i regularly visit: cccda, rzl, cccffm">some</abbr>
                    hackspaces, smaller chaos-events, demoparties or regional-trains in germany.
                </p>
                <p>
                    You also can have a look at some of my <a href="./projects.html">./projects.html</a> or find out how
                    to <a href="./contact.html">./contact.html</a> me.
                </p>
            </section>
            <footer>
                <p><a href="imprint.html">./imprint.html</a></p>
                <div class="badges">
                    <img src="./badges/made-with-my-paws.gif">
                    <img src="./badges/css-is-difficult.gif">
                    <img src="./badges/firefox.gif">
                    <img src="./badges/ublock.png">
                    <img src="./badges/powered-by-nixos.png">
                    <img src="./badges/powered-by-estrogen.gif">
                    <img src="./badges/trans-rights.png">
                    <img src="./badges/transbian.png">
                    <img src="./badges/adhd.png">
                    <img src="./badges/piracy.gif">
                </div>
            </footer>
        </article>

        <div class="flags">
            <div class="disability" title="disability flag"></div>
            <div class="trans" title="transgender flag"></div>
            <div class="sapphic" title="sapphic flag"></div>
        </div>
    </body>
</html>