diff options
Diffstat (limited to '')
| -rw-r--r-- | index.html | 451 |
1 files changed, 224 insertions, 227 deletions
@@ -8,7 +8,6 @@ <link rel="icon" href="./favicon.ico" type="image/x-icon"> </head> <body> - <div class="workspace"> <input class="radio" type="radio" id="close" name="windows_box" value=""> @@ -24,245 +23,243 @@ <input class="radio" type="radio" id="projects-vanillaos" name="projects_menu"> <ul id="home-menu" class="menu left"> - <li><label>Home</label></li> + <li><label>Home</label></li> <li> - <label for="home-info" class="menu-button">Info - </label> - </li> + <label for="home-info" class="menu-button">Info + </label> + </li> <li> - <label for="home-contact" class="menu-button">Contact - </label> - </li> + <label for="home-contact" class="menu-button">Contact + </label> + </li> </ul> <ul id="projects-menu" class="menu left"> - <li><label>Projects</label></li> + <li><label>Projects</label></li> + <li> + <label for="projects-personal" class="menu-button">Personal</label> + </li> <li> - <label for="projects-personal" class="menu-button">Personal</label> - </li> + <label for="projects-shards" class="menu-button">Project Shards</label> + </li> <li> - <label for="projects-shards" class="menu-button">Project Shards</label> - </li> - <li> - <label for="projects-crystal" class="menu-button">Crystal Linux</label> - </li> - <li> - <label for="projects-vanillaos" class="menu-button">Vanilla OS</label> - </li> + <label for="projects-crystal" class="menu-button">Crystal Linux</label> + </li> + <li> + <label for="projects-vanillaos" class="menu-button">Vanilla OS</label> + </li> </ul> <div class="dock"> - <div class="dockelement"> - <label for="home" title="About me"> <img src="avatar.png" alt="Home"> - </label> - </div> - <div class="dockelement"> - <label for="projects" title="Projects"><img src="projects.png" alt="Projects"> - </label> - </div> - <div class="dockelement"> - <div class="clock"> - <p id="time" class="time"> - 12:00 - </p> - <div class="cal"> - <p id="day" class="day"> - MON - </p> - <p id="date" class="date"> - 6 - </p> - <p id="month" class="month"> - JUL - </p> - </div> - </div> - </div> - <a class="dockelement" href="https://www.youtube.com/watch?v=duPJqfKiA78" title="Triple Baka!!"> - <img src="./kasane-teto.gif" alt="kasane teto dancing"> - <div class="embedded"></div> - </a> - <a class="dockelement" href="https://www.freebsd.org" title="Powered by FreeBSD"> - <img class="square" src="https://www.freebsd.org/gifs/daemon-phk.png" alt="freebsd beastie"> - <div class="embedded"></div> - </a> - <a class="dockelement" title="Milk outside a bag of milk outside a bag of milk" href="https://nikita-kryukov.itch.io/milk-outside-a-bag-of-milk-outside-a-bag-of-milk"> - <img class="square" src="./milkoutsideabagofmilk.png" alt="milk chan looking up, surrounded by the text 'milk outside a bag of milk'"> - <div class="embedded"></div> - </a> - + <div class="dockelement"> + <label for="home" title="About me"> <img src="avatar.png" alt="Home"> + </label> + </div> + <div class="dockelement"> + <label for="projects" title="Projects"><img src="projects.png" alt="Projects"> + </label> + </div> + <div class="dockelement"> + <div class="clock"> + <p id="time" class="time"> + 12:00 + </p> + <div class="cal"> + <p id="day" class="day"> + MON + </p> + <p id="date" class="date"> + 6 + </p> + <p id="month" class="month"> + JUL + </p> + </div> + </div> + </div> + <a class="dockelement" href="https://www.youtube.com/watch?v=duPJqfKiA78" title="Triple Baka!!"> + <img src="./kasane-teto.gif" alt="kasane teto dancing"> + <div class="embedded"></div> + </a> + <a class="dockelement" href="https://www.freebsd.org" title="Powered by FreeBSD"> + <img class="square" src="https://www.freebsd.org/gifs/daemon-phk.png" alt="freebsd beastie"> + <div class="embedded"></div> + </a> + <a class="dockelement" title="Milk outside a bag of milk outside a bag of milk" href="https://nikita-kryukov.itch.io/milk-outside-a-bag-of-milk-outside-a-bag-of-milk"> + <img class="square" src="./milkoutsideabagofmilk.png" alt="milk chan looking up, surrounded by the text 'milk outside a bag of milk'"> + <div class="embedded"></div> + </a> </div> - <div id="home-window" class="window"> <div class="title-bar"> <span>ABOUT.rtf — /home/lain</span> <div class="controls"> - <label for="close"> - <img src="./close.svg" width="18" height="18" alt="close"> - </label> + <label for="close"> + <img src="./close.svg" width="18" height="18" alt="close"> + </label> </div> </div> <div class="content" id="home-content-info"> - <div> + <div> <p>Hi!! I'm <b>Rose</b> (or Xenia or axtlos). I'm an 18 year old programmer specialising in osdev and systems programming.</p> - <br> - <p>I mostly use C for my projects, but also have experience with Rust, Go, Fortran and Python (see the projects window for more info).</p> - <br> - <p>I am currently studying computer science and work at Nokia as a software developer.</p> - </div> - <div style="justify-content: center; align-items: center; text-align: center;"> - <img src="./firefly.png" alt="a firefly resting on a finger"> - </div> - <div> - <hr style="justify-content: center; border-top:2px solid #A0A0A0; width: 100%"> - <p>Click the buttons in the left menu to view extra information or the deskapps in the right to open different windows! The windows can also be moved around.</p> - </div> + <br> + <p>I mostly use C for my projects, but also have experience with Rust, Go, Fortran and Python (see the projects window for more info).</p> + <br> + <p>I am currently studying computer science and work at Nokia as a software developer.</p> + </div> + <div style="justify-content: center; align-items: center; text-align: center;"> + <img src="./firefly.png" alt="a firefly resting on a finger"> + </div> + <div> + <hr style="justify-content: center; border-top:2px solid #A0A0A0; width: 100%"> + <p>Click the buttons in the left menu to view extra information or the deskapps in the right to open different windows! The windows can also be moved around.</p> + </div> + </div> + <div class="content" id="home-content-contact"> + <div> + <p>I can be contacted through these platforms</p> + <p>Note that I will ignore messages that simply say "hello!" or something similar, please include a tiny introduction</p> + <br> + <h2>XMPP</h2> + <p>My goto for instant messaging, where I'll be available the most</p> + <p><b>axtlos@disroot.org</b></p> + <hr style="border-top:2px solid #A0A0A0; width: 100%"> + <br> + <h2>IRC</h2> + <p>I have a bouncer running, so I should see most messages even when I am not online.</p> + <p><b>axtlos</axtlos@disroot.orgb> on <b>libera.chat</b></p> + <hr style="border-top:2px solid #A0A0A0; width: 100%"> + <br> + <h2>EMAIL</h2> + <p>Ol' Reliable</p> + <p>Recommended if it's an urgent topic</p> + <p><b><a href="mailto:rose@pinkro.se">rose@pinkro.se</a></b></p> + </div> </div> - <div class="content" id="home-content-contact"> - <div> - <p>I can be contacted through these platforms</p> - <p>Note that I will ignore messages that simply say "hello!" or something similar, please include a tiny introduction</p> - <br> - <h2>XMPP</h2> - <p>My goto for instant messaging, where I'll be available the most</p> - <p><b>axtlos@disroot.org</b></p> - <hr style="border-top:2px solid #A0A0A0; width: 100%"> - <br> - <h2>IRC</h2> - <p>I have a bouncer running, so I should see most messages even when I am not online.</p> - <p><b>axtlos</b> on <b>libera.chat</b></p> - <hr style="border-top:2px solid #A0A0A0; width: 100%"> - <br> - <h2>EMAIL</h2> - <p>Ol' Reliable</p> - <p>Recommended if it's an urgent topic</p> - <p><b>axtlos@disroot.org</b></p> - </div> - </div> </div> <div id="projects-window" class="window"> <div class="title-bar"> <span>PROJECTS.rtf — /home/lain</span> <div class="controls"> - <label for="close"> - <img src="./close.svg" width="18" height="18" alt="close"> - </label> + <label for="close"> + <img src="./close.svg" width="18" height="18" alt="close"> + </label> </div> </div> <div class="content" id="projects-content-personal"> - <div> + <div> <h1 style="text-align:center">Personal Projects</h1> - <p style="text-align:center">Personal Projects that aren't part of any bigger organization/project</p> - <br> - <h2>runc</h2> - <a href="https://codeberg.org/axtlos/runc">https://codeberg.org/axtlos/runc</a> - <p>Easily execute source files like shell scripts based on a static configuration</p> - <br> - <h2>extlib</h2> - <a href="https://codeberg.org/axtlos/extlib">https://codeberg.org/axtlos/extlib</a> - <p>C library that adds some handy functions</p> - <br> - <h2>FsVerify</h2> - <a href="https://github.com/axtloss/fsverify">https://github.com/axtloss/fsverify</a> - <p>Block based filesystem verification for immutable linux distributions written in golang and C</p> - <br> - <h2>BVG - Basic Vector Graphics</h2> - <a href="https://github.com/axtloss/fsverify/tree/main/fbwarn">https://github.com/axtloss/fsverify/tree/main/fbwarn</a> - <p>Custom made vector graphics format for use with FsVerify, the parser (fbwarn) is written in C using raylib</p> - <br> - <h2>FsGuard</h2> - <a href="https://github.com/linux-immutability-tools/fsguard">https://github.com/linux-immutability-tools/fsguard</a> - <p>File tree based filesysetm integrity verification, fully written in go and in use by Vanilla OS through fswarn</p> - <br> - <h2>JshipIT</h2> - <a href="https://github.com/axtloss/JshipIT">https://github.com/axtloss/JshipIT</a> - <p>OCI client written in Java similar to podman/docker with a focus on using containers as a form of isolated environments, similar to Distrobox and Toolbox</p> - </div> + <p style="text-align:center">Personal Projects that aren't part of any bigger organization/project</p> + <br> + <h2>runc</h2> + <a href="https://codeberg.org/axtlos/runc">https://codeberg.org/axtlos/runc</a> + <p>Easily execute source files like shell scripts based on a static configuration</p> + <br> + <h2>extlib</h2> + <a href="https://codeberg.org/axtlos/extlib">https://codeberg.org/axtlos/extlib</a> + <p>C library that adds some handy functions</p> + <br> + <h2>FsVerify</h2> + <a href="https://github.com/axtloss/fsverify">https://github.com/axtloss/fsverify</a> + <p>Block based filesystem verification for immutable linux distributions written in golang and C</p> + <br> + <h2>BVG - Basic Vector Graphics</h2> + <a href="https://github.com/axtloss/fsverify/tree/main/fbwarn">https://github.com/axtloss/fsverify/tree/main/fbwarn</a> + <p>Custom made vector graphics format for use with FsVerify, the parser (fbwarn) is written in C using raylib</p> + <br> + <h2>FsGuard</h2> + <a href="https://github.com/linux-immutability-tools/fsguard">https://github.com/linux-immutability-tools/fsguard</a> + <p>File tree based filesysetm integrity verification, fully written in go and in use by Vanilla OS through fswarn</p> + <br> + <h2>JshipIT</h2> + <a href="https://github.com/axtloss/JshipIT">https://github.com/axtloss/JshipIT</a> + <p>OCI client written in Java similar to podman/docker with a focus on using containers as a form of isolated environments, similar to Distrobox and Toolbox</p> + </div> + </div> + <div class="content" id="projects-content-shards"> + <div> + <h1 style="text-align:center">Project Shards</h1> + <p style="text-align:center">Immutable linux distribution using systemd-sysupdate to manage atomic updates</p> + <br> + <br> + <h2>shards-build-definitions</h2> + <a href="https://github.com/project-shards/shards-build-definitions">https://github.com/project-shards/shards-build-definitions</a> + <p>The apache buildstream project for building Project Shards images.</p> + <br> + <h2>Shards Installer</h2> + <a href="https://github.com/Project-Shards/shards-installer">https://github.com/Project-Shards/shards-installer</a> + <p>The Project Shards installer. Written in libadwaita with C</p> + </div> </div> - <div class="content" id="projects-content-shards"> + <div class="content" id="projects-content-crystal"> <div> - <h1 style="text-align:center">Project Shards</h1> - <p style="text-align:center">Immutable linux distribution using systemd-sysupdate to manage atomic updates</p> - <br> - <br> - <h2>shards-build-definitions</h2> - <a href="https://github.com/project-shards/shards-build-definitions">https://github.com/project-shards/shards-build-definitions</a> - <p>The apache buildstream project for building Project Shards images.</p> - <br> - <h2>Shards Installer</h2> - <a href="https://github.com/Project-Shards/shards-installer">https://github.com/Project-Shards/shards-installer</a> - <p>The Project Shards installer. Written in libadwaita with C</p> - </div> - </div> - <div class="content" id="projects-content-crystal"> - <div> <h1 style="text-align:center">Crystal Linux</h1> - <p style="text-align:center">An Arch Linux based Linux Distribution</p> - <br> - <h2>Jade</h2> - <a href="https://gitlab.com/crystal-linux/software/jade">https://gitlab.com/crystal-linux/software/jade</a> - <p>Installer backend for Crystal Linux, written in rust</p> - <br> - <h2>Jade-GUI</h2> - <a href="https://github.com/crystal-linux/software/jade-gui">https://gitlab.com/crystal-linux/software/jade-gui</a> - <p>Graphical frontend for Jade, written in python using gtk4 and libadwaita</p> - </div> - </div> - <div class="content" id="projects-content-vanillaos"> + <p style="text-align:center">An Arch Linux based Linux Distribution</p> + <br> + <h2>Jade</h2> + <a href="https://gitlab.com/crystal-linux/software/jade">https://gitlab.com/crystal-linux/software/jade</a> + <p>Installer backend for Crystal Linux, written in rust</p> + <br> + <h2>Jade-GUI</h2> + <a href="https://github.com/crystal-linux/software/jade-gui">https://gitlab.com/crystal-linux/software/jade-gui</a> + <p>Graphical frontend for Jade, written in python using gtk4 and libadwaita</p> + </div> + </div> + <div class="content" id="projects-content-vanillaos"> <div> - <h1 style="text-align:center">Vanilla OS</h1> - <p style="text-align:center">Immutable linux distribution based on Debian sid</p> - <br> - <h2>VIB</h2> - <a href="https://vib.vanillaos.org">https://vib.vanillaos.org</a> - <p>Buildsystem to create oci images out of yaml files, written in go</p> - <h2>Vanilla System Operator</h2> - <a href="https://github.com/vanilla-os/vanilla-system-operator">https://github.com/vanilla-os/vanilla-system-operator</a> - <p>Tool to manage Vanilla OS installations, including waydroid app management</p> - </div> + <h1 style="text-align:center">Vanilla OS</h1> + <p style="text-align:center">Immutable linux distribution based on Debian sid</p> + <br> + <h2>VIB</h2> + <a href="https://vib.vanillaos.org">https://vib.vanillaos.org</a> + <p>Buildsystem to create oci images out of yaml files, written in go</p> + <h2>Vanilla System Operator</h2> + <a href="https://github.com/vanilla-os/vanilla-system-operator">https://github.com/vanilla-os/vanilla-system-operator</a> + <p>Tool to manage Vanilla OS installations, including waydroid app management</p> + </div> </div> </div> <div class="bottom-bar-wrapper"> - <div class="bottom-bar"> - <a href="https://pinkro.se" target="_blank" rel="noopener noreferrer" title="rose garden"> - <img src="rose_88x31.png" alt="button that says 'rose', a rose grows out of the o, on the left the character milk chan is visible, a very pale girl with shoulder length brown hair wearing a black hoodie"> - </a> - <a href="https://chronovore.dev" target="_blank" rel="noopener noreferrer" title="legiayayana's orbit"> - <img src="https://chronovore.dev/button/chronovore.png" alt="button that says 'ada', text is overlayed a photograph of neptune, which in this image is a blue gas giant"> - </a> - <a href="https://futile.eu" target="_blank" rel="noopener noreferrer" title="futile"> - <img src="https://futile.eu/static/buttons/futile.png" alt="button that says 'futile'"> - </a> - <a href="https://schmool.cool" target="_blank" rel="noopener noreferer" title="schmoolcool"> - <img src="https://schmool.cool/88x31/butterfly.gif" alt="schmoolcool"> - </a> - <a href="https://vostok.one/~michal/" target="_blank" rel="noopener noreferer" title="michal"> - <img src="michal.gif" alt="michal"> - </a> - <a href="https://astral.im" target="_blank" rel="noopener noreferer" title="astral"> - <img src="https://astral.im/astral.gif" alt="astral"> - </a> - <a href="https://arimelody.me" target="_blank" rel="noopener noreferer" title="ari melody"> - <img src="https://arimelody.me/img/buttons/ari%20melody.gif" alt="ari melody web button"> - </a> - <a href="https://naonexe.straw.page" target="_blank" rel="noopener noreferer" title="naonexe"> - <img src="https://files.strawcdn.com/straw/lfZburKfWezYAoKtuHlF.gif" alt="two nuclear hazard and a biohazard sign next to each other jumping around"> - </a> - <div> - <iframe src="https://increm.net/badge?key=xenia" title="incremnet badge" width="88" height="31" style="background-color: #d4d0c8; border: none;"></iframe> - </div> - <a href="https://nyaa.si/view/964646" target="_blank" rel="noopener noreferrer" title="watch lain now!!"> - <img src="lain.gif" alt="lain" width="88" height="31"> - </a> - <a href="https://validator.w3.org/nu/?doc=https%3A%2F%2Fpinkro.se" target="_blank" rel="noopener noreferrer" title="valid html5"> - <img src="w3cvalid.png" alt="valid html 5" width="88" height="31"> - </a> - <a><img src="copland88x31.png" alt="copland os now!" width="88" height="31"></a> - <a><img src="transrights.png" alt="trans rights now!" width="88" height="31"></a> - <a><img src="xeniatransnow.png" alt="use linux now!" width="88" height="31"></a> - </div> + <div class="bottom-bar"> + <a href="https://pinkro.se" target="_blank" rel="noopener noreferrer" title="rose garden"> + <img src="rose_88x31.png" alt="button that says 'rose', a rose grows out of the o, on the left the character milk chan is visible, a very pale girl with shoulder length brown hair wearing a black hoodie"> + </a> + <a href="https://chronovore.dev" target="_blank" rel="noopener noreferrer" title="legiayayana's orbit"> + <img src="https://chronovore.dev/button/chronovore.png" alt="button that says 'ada', text is overlayed a photograph of neptune, which in this image is a blue gas giant"> + </a> + <a href="https://futile.eu" target="_blank" rel="noopener noreferrer" title="futile"> + <img src="https://futile.eu/static/buttons/futile.png" alt="button that says 'futile'"> + </a> + <a href="https://schmool.cool" target="_blank" rel="noopener noreferer" title="schmoolcool"> + <img src="https://schmool.cool/88x31/butterfly.gif" alt="schmoolcool"> + </a> + <a href="https://vostok.one/~michal/" target="_blank" rel="noopener noreferer" title="michal"> + <img src="michal.gif" alt="michal"> + </a> + <a href="https://astral.im" target="_blank" rel="noopener noreferer" title="astral"> + <img src="https://astral.im/astral.gif" alt="astral"> + </a> + <a href="https://arimelody.me" target="_blank" rel="noopener noreferer" title="ari melody"> + <img src="https://arimelody.me/img/buttons/ari%20melody.gif" alt="ari melody web button"> + </a> + <a href="https://naonexe.straw.page" target="_blank" rel="noopener noreferer" title="naonexe"> + <img src="https://files.strawcdn.com/straw/lfZburKfWezYAoKtuHlF.gif" alt="two nuclear hazard and a biohazard sign next to each other jumping around"> + </a> + <div> + <iframe src="https://increm.net/badge?key=xenia" title="incremnet badge" width="88" height="31" style="background-color: #d4d0c8; border: none;"></iframe> + </div> + <a href="https://nyaa.si/view/964646" target="_blank" rel="noopener noreferrer" title="watch lain now!!"> + <img src="lain.gif" alt="lain" width="88" height="31"> + </a> + <a href="https://validator.w3.org/nu/?doc=https%3A%2F%2Fpinkro.se" target="_blank" rel="noopener noreferrer" title="valid html5"> + <img src="w3cvalid.png" alt="valid html 5" width="88" height="31"> + </a> + <a><img src="copland88x31.png" alt="copland os now!" width="88" height="31"></a> + <a><img src="transrights.png" alt="trans rights now!" width="88" height="31"></a> + <a><img src="xeniatransnow.png" alt="use linux now!" width="88" height="31"></a> + </div> </div> </div> <script> @@ -271,21 +268,21 @@ let offsetX = 0, offsetY = 0, isDragging = false; titleBar.addEventListener('mousedown', (e) => { - isDragging = true; - offsetX = e.clientX - windowEl.offsetLeft; - offsetY = e.clientY - windowEl.offsetTop; - windowEl.style.zIndex = 1000; + isDragging = true; + offsetX = e.clientX - windowEl.offsetLeft; + offsetY = e.clientY - windowEl.offsetTop; + windowEl.style.zIndex = 1000; }); document.addEventListener('mousemove', (e) => { - if (isDragging) { + if (isDragging) { windowEl.style.left = `${e.clientX - offsetX}px`; windowEl.style.top = `${e.clientY - offsetY}px`; - } + } }); document.addEventListener('mouseup', () => { - isDragging = false; + isDragging = false; }); }); </script> @@ -294,30 +291,30 @@ let link = document.querySelectorAll(".menu-button"); link.forEach(function(elem) { - elem.addEventListener("mousedown", () => { - elem.classList.add("ripple-effect"); - setTimeout(() => { - elem.classList.remove("ripple-effect"); - }, 1000); - }) + elem.addEventListener("mousedown", () => { + elem.classList.add("ripple-effect"); + setTimeout(() => { + elem.classList.remove("ripple-effect"); + }, 1000); + }) }); </script> <script> function updateClockAndCalendar() { - const now = new Date(); - const hours = now.getHours(); - const minutes = now.getMinutes(); + const now = new Date(); + const hours = now.getHours(); + const minutes = now.getMinutes(); - const displayHours = hours < 10 ? `0${hours}` : hours; - const displayMinutes = minutes < 10 ? `0${minutes}` : minutes; - document.getElementById('time').textContent = `${displayHours}:${displayMinutes}`; - - const days = ['SUN', 'MON', 'TUE', 'WED', 'THU', 'FRI', 'SAT']; - const months = ['JAN', 'FEB', 'MAR', 'APR', 'MAY', 'JUN', 'JUL', 'AUG', 'SEP', 'OCT', 'NOV', 'DEC']; - document.getElementById('day').textContent = days[now.getDay()]; - document.getElementById('date').textContent = now.getDate(); - document.getElementById('month').textContent = months[now.getMonth()]; + const displayHours = hours < 10 ? `0${hours}` : hours; + const displayMinutes = minutes < 10 ? `0${minutes}` : minutes; + document.getElementById('time').textContent = `${displayHours}:${displayMinutes}`; + + const days = ['SUN', 'MON', 'TUE', 'WED', 'THU', 'FRI', 'SAT']; + const months = ['JAN', 'FEB', 'MAR', 'APR', 'MAY', 'JUN', 'JUL', 'AUG', 'SEP', 'OCT', 'NOV', 'DEC']; + document.getElementById('day').textContent = days[now.getDay()]; + document.getElementById('date').textContent = now.getDate(); + document.getElementById('month').textContent = months[now.getMonth()]; } |