arimelody.me/views/index.html

{{define "head"}}
<title>ari melody 💫</title>
<link rel="shortcut icon" href="/img/favicon.png" type="image/x-icon">

<meta name="description" content="home to your local SPACEGIRL 💫">

<meta property="og:title" content="ari melody">
<meta property="og:type" content="website">
<meta property="og:url" content="www.arimelody.space">
<meta property="og:image" content="https://www.arimelody.space/img/favicon.png">
<meta property="og:site_name" content="ari melody">
<meta property="og:description" content="home to your local SPACEGIRL 💫">

<link rel="stylesheet" href="/style/main.css">
<link rel="stylesheet" href="/style/index.css">

<link rel="me" href="https://ice.arimelody.me/@ari">
<link rel="me" href="https://wetdry.world/@ari">

<script type="module" src="/script/index.js" defer></script>
{{end}}

{{define "content"}}
<main>
    {{if .TwitchStatus}}
    <div id="live-banner">
        <div class="live-preview">
            <div>
                <img src="{{.TwitchStatus.Thumbnail 144 81}}" alt="livestream thumbnail" class="live-thumbnail">
                <a href="https://twitch.tv/{{.TwitchStatus.UserName}}" class="live-button">join in!</a>
            </div>
            <div class="live-info">
                <h2>ari melody <span class="live-highlight">LIVE</span> <i class="live-pinger"></i></h2>
                <p class="live-game"><span class="live-game-prefix">streaming:</span> {{.TwitchStatus.GameName}}</p>
                <p class="live-title">{{.TwitchStatus.Title}}</p>
                <p class="live-viewers">{{.TwitchStatus.ViewerCount}} viewers</p>
            </div>
        </div>
    </div>
    {{end}}
    
    <h1 class="typeout">
        # hello, world!
    </h1>

    <p>
    <strong>i'm ari!</strong>
    <br>
    <small>she/her 🏳️‍⚧️🏳️‍🌈💫🦆🇮🇪</small>
    </p>

    <p>
    i'm a <a href="/music">musician</a>, <a href="https://codeberg.org/arimelody?tab=repositories">developer</a>,
    <a href="https://twitch.tv/arispacegirl">streamer</a>, <a href="https://youtube.com/@arispacegirl">youtuber</a>, 
    and probably a bunch of other things i forgot to mention!
    </p>
    <p>
    you're very welcome to take a look around my little space on the internet here,
    or explore any of the other parts i inhabit!
    </p>
    <p>	
    if you're looking to support me financially, that's so cool of you!!
    if you like, you can buy some of my music over on
    <a href="https://arimelody.bandcamp.com">bandcamp</a>
    so you can at least get something for your money.
    thank you very much either way!! 💕
    </p>
    <p>
    for anything else, you can reach me for any and all communications through
    <a href="mailto:ari@arimelody.me">ari@arimelody.me</a>. if your message
    contains anything beyond a silly gag, i strongly recommend encrypting
    your message using my public pgp key, listed below!
    </p>
    <p>
    thank you for stopping by- i hope you have a lovely rest of your day! 💫
    </p>

    <hr>

    <h2 class="typeout">
        ## metadata
    </h2>

    <p>
    <strong>my colours 🌈</strong>
    </p>
    <ul>
        <li>primary: <span class="col-primary" id="hex-primary">#b7fd49</span></li>
        <li>secondary: <span class="col-secondary" id="hex-secondary">#f8e05b</span></li>
        <li>tertiary: <span class="col-tertiary" id="hex-tertiary">#f788fe</span></li>
    </ul>

    <p>
    <strong>my keys 🔑</strong>
    </p>
    <ul>
        <li>pgp: <a href="/keys/ari melody_0x92678188_public.asc" target="_blank">[link]</a></li>
        <li>ssh (ed25519): <a href="/keys/id_ari_ed25519.pub" target="_blank">[link]</a></li>
    </ul>

    <p>
    <strong>where to find me 🛰️</strong>
    </p>
    <ul class="platform-links">
        <li>
            <a href="https://youtube.com/@arispacegirl" title="youtube">
                <img src="/img/brand/youtube.svg" alt="youtube" width="32" height="32"/>
                youtube
            </a>
        </li>
        <li>
            <a href="https://twitch.tv/arispacegirl" title="twitch">
                <img src="/img/brand/twitch.svg" alt="twitch" width="32" height="32"/>
                twitch
            </a>
        </li>
        <li>
            <a href="https://arimelody.bandcamp.com" title="bandcamp">
                <img src="/img/brand/bandcamp.svg" alt="bandcamp" width="32" height="32"/>
                bandcamp
            </a>
        </li>
        <li>
            <a href="https://codeberg.org/arimelody" title="codeberg">
                <img src="/img/brand/codeberg.svg" alt="codeberg" width="32" height="32"/>
                codeberg
            </a>
        </li>
        <li>
            <a href="https://bsky.app/profile/arimelody.space" title="bluesky">
                <img src="/img/brand/bluesky.svg" alt="bluesky" width="32" height="32"/>
                bluesky
            </a>
        </li>
        <li>
            <a href="https://arimelody.space/discord" title="discord">
                <img src="/img/brand/discord.svg" alt="discord" width="32" height="32"/>
                discord
            </a>
        </li>
    </ul>

    <p>
    <strong>projects i've worked on 🛠️</strong>
    </p>
    <ul id="projects">
        <li class="project-item">
            <span aria-hidden=true class="project-icon">⛏️</span>
            <div class="project-info">
                <a href="https://mcq.bliss.town">McStatusFace</a>
                <p>minecraft server query utility</p>
            </div>
        </li>
        <li class="project-item">
            <img src="https://catdance.arimelody.me/img/favicon.png" alt="catdance icon" aria-hidden=true class="project-icon" width="64" height="64">
            <div class="project-info">
                <a href="https://catdance.arimelody.me">catdance</a>
                <p>watch the cat dance 🐱</p>
            </div>
        </li>
        <li class="project-item">
            <img src="https://git.arimelody.me/repo-avatars/6b0a1ffb78cbc6f906f83152ea42a710220174e8f48a3e44f159ae58dacd7a2f" alt="pride flag icon" aria-hidden=true class="project-icon" width="64" height="64">
            <div class="project-info">
                <a href="https://git.arimelody.me/ari/prideflag">pride flag</a>
                <p>progressive pride flag widget for websites</p>
            </div>
        </li>
        <li class="project-item">
            <span aria-hidden=true class="project-icon">👩‍💻</span>
            <div class="project-info">
                <a href="https://github.com/arimelody/ipaddrgen">ipaddrgen</a>
                <p>silly hackerman IP address generator</p>
            </div>
        </li>
        <li class="project-item">
            <img src="https://impact.arimelody.me/favicon.png" alt="impact meme icon" aria-hidden=true class="project-icon" width="64" height="64">
            <div class="project-info">
                <a href="https://impact.arimelody.me/">impact meme</a>
                <p>impact meme generator</p>
            </div>
        </li>
        <li class="project-item">
            <img src="https://codeberg.org/repo-avatars/e67303eeda4fa6d268948e71b7b0837357d8c519772701ffc36b84ae7975319f" alt="OpenTerminal icon" aria-hidden=true class="project-icon" width="64" height="64">
            <div class="project-info">
                <a href="https://term.arimelody.me/">OpenTerminal</a>
                <p>communal online text buffer</p>
            </div>
        </li>
        <li class="project-item">
            <span aria-hidden=true class="project-icon">📜</span>
            <div class="project-info">
                <a href="https://silver.bliss.town/">Silver.js</a>
                <p>lightweight reactive state library</p>
            </div>
        </li>
    </ul>

    <hr>

    <h2 class="typeout">
        ## cool critters
    </h2>

    <div id="web-buttons">
        <a href="https://arimelody.space">
            <img src="/img/buttons/ari melody.gif" alt="ari melody web button" width="88" height="31">
        </a>
        <a href="https://supitszaire.com">
            <img src="/img/buttons/zaire.gif" alt="zaire web button" width="88" height="31">
        </a>
        <a href="https://mae.wtf">
            <img src="/img/buttons/mae.png" alt="vimae web button" width="88" height="31">
        </a>
        <a href="https://girlthi.ng/~thermia/">
            <img src="/img/buttons/thermia.gif" alt="thermia web button" width="88" height="31">
        </a>
        <a href="https://elke.cafe">
            <img src="/img/buttons/elke.gif" alt="elke web button" width="88" height="31">
        </a>
        <a href="https://invoxiplaygames.uk/">
            <img src="/img/buttons/ipg.png" alt="InvoxiPlayGames web button" width="88" height="31">
        </a>
        <a href="https://ioletsgo.gay">
            <img src="/img/buttons/ioletsgo.gif" alt="ioletsgo web button" width="88" height="31">
        </a>
        <a href="https://notnite.com/">
            <img src="/img/buttons/notnite.png" alt="notnite web button" width="88" height="31">
        </a>
        <a href="https://www.da.vidbuchanan.co.uk/">
            <img src="/img/buttons/retr0id_now.gif" alt="retr0id web button" width="88" height="31">
        </a>
        <a href="https://aikoyori.xyz">
            <img src="/img/buttons/aikoyori.gif" alt="aikoyori web button" width="88" height="31">
        </a>
        <a href="https://xenia.blahaj.land/">
            <img src="/img/buttons/xenia.png" alt="xenia web button" width="88" height="31">
        </a>
        <a href="https://stardust.elysium.gay/">
            <img src="/img/buttons/stardust.png" alt="stardust web button" width="88" height="31">
        </a>
        <a href="https://isabelroses.com/">
            <img src="/img/buttons/isabelroses.gif" alt="isabel roses web button" width="88" height="31">
        </a>
        <a href="https://bubblegum.girlonthemoon.xyz/">
            <img src="/img/buttons/girlonthemoon.png" alt="sweet like bubblegum web button" width="88" height="31">
        </a>

        <hr>

        <img src="/img/buttons/misc/debian.gif" alt="powered by debian" width="88" height="31">
        <img src="/img/buttons/misc/girls4notepad.gif" alt="girls 4 notepad" width="88" height="31">
        <img src="/img/buttons/misc/gaywebring.gif" alt="this website is GAY" width="88" height="31">
        <img src="/img/buttons/misc/graphicdesign.gif" alt="graphic design is my passion" width="88" height="31">
        <img src="/img/buttons/misc/gplv3.gif" alt="GPLv3 free software" width="88" height="31">
        <img src="/img/buttons/misc/hl.gif" alt="half-life" width="88" height="31">
        <img src="/img/buttons/misc/h-free-anim.gif" alt="dis site is hentai FREE" width="88" height="31">
        <img src="/img/buttons/misc/sprunk.gif" alt="sprunk" width="88" height="31">
        <img src="/img/buttons/misc/tohell.gif" alt="go straight to hell" width="88" height="31">
        <img src="/img/buttons/misc/virusalert.gif" alt="virus alert! click here" onclick="alert('meow :3')" width="88" height="31">
        <a href="http://wiishopchannel.net/">
            <img src="/img/buttons/misc/wii.gif" alt="wii" width="88" height="31">
        </a>
        <img src="/img/buttons/misc/www2.gif" alt="www" width="88" height="31">
        <img src="/img/buttons/misc/iemandatory.gif" alt="get mandatory internet explorer" width="88" height="31">
        <img src="/img/buttons/misc/learn_html.gif" alt="HTML - learn it today!" width="88" height="31">
        <a href="https://smokepowered.com">
            <img src="/img/buttons/misc/smokepowered.gif" alt="high on SMOKE" width="88" height="31">
        </a>
        <a href="https://epicblazed.com">
            <img src="/img/buttons/misc/epicblazed.png" alt="epic blazed" width="88" height="31">
        </a>
        <img src="/img/buttons/misc/blink.gif" alt="closeup anime blink" width="88" height="31">
    </div>
</main>
{{end}}