224 lines
9.1 KiB
Svelte
224 lines
9.1 KiB
Svelte
<script>
|
|
import AudioPlayer from './lib/AudioPlayer.svelte';
|
|
import { onMount } from 'svelte';
|
|
|
|
let dayCounter = '0.00000000';
|
|
|
|
function updateCounter() {
|
|
const startDate = new Date('2011-09-19T00:00:00');
|
|
const now = new Date();
|
|
const diffMs = now.getTime() - startDate.getTime();
|
|
const years = diffMs / (1000 * 60 * 60 * 24 * 365.25);
|
|
dayCounter = years.toFixed(8);
|
|
}
|
|
|
|
onMount(() => {
|
|
updateCounter();
|
|
const interval = setInterval(updateCounter, 10);
|
|
return () => clearInterval(interval);
|
|
});
|
|
|
|
const contacts = [
|
|
{ label: 'email', href: 'mailto:lain@iwakurahome.ru', text: 'lain@iwakurahome.ru' },
|
|
{ label: 'telegram', href: 'https://t.me/systemxplore', text: '@systemxplore' },
|
|
{ label: 'github', href: 'https://github.com/cryptexctl', text: '@cryptexctl' },
|
|
{ label: 'Codeberg', href: 'https://codeberg.org/IwakuraLain', text: '@IwakuraLain' },
|
|
{ label: 'Sourcehut', href: 'https://sr.ht/~iwakuralain', text: '~iwakuralain' }
|
|
];
|
|
|
|
const projects = [
|
|
{ text: 'OpenSSH hardened fork', href: 'https://git.iwakurahome.ru/lain/openssh-0bsdforeveryone' },
|
|
{ text: 'cursed-ping (BSD patch)', href: 'https://git.iwakurahome.ru/lain/cursed-ping' },
|
|
{ text: 'This website', href: 'https://git.iwakurahome.ru/lain/mybio-svelte' }
|
|
];
|
|
|
|
const devices = [
|
|
{ dev: 'Thinkpad X230', os: 'Fedora/Void/OpenBSD', ram: '15GB', disk: '512GB', state: 'Changed Wi-Fi card to AR9485' },
|
|
{ dev: 'Pixel 3a', os: 'Android 15 // PixelBuilds/LineageOS', ram: '4GB', disk: '64GB', state: 'Cracked on the screen, but still works!!' },
|
|
{ dev: 'Macbook Air M3', os: 'macOS 14.7.5 (fuck macOS 15)', ram: '16GB', disk: '512GB', state: 'Stock' },
|
|
{ dev: 'iPhone 14 Pro Max', os: 'iOS 16.3', ram: '4GB', disk: '256GB', state: 'Stock, jailbroken + TrollStore installed' },
|
|
{ dev: 'iPhone 7 Plus', os: 'iOS 15.5', ram: '3GB', disk: '32GB', state: 'Battery replaced, jailbroken + TrollStore installed, not using (using only for frida debugging)' },
|
|
{ dev: 'Samsung Galaxy Nexus', os: 'Android 4.2.3 // CyanogenMod', ram: '1GB', disk: '16GB', state: 'Stock!!' },
|
|
{ dev: 'Nothing Phone 1', os: 'Android 15 // DerpFest', ram: '8GB', disk: '256GB', state: 'Magisk installed. I hardly use it, but it\'s here' },
|
|
{ dev: 'Orange Pi Zero 3', os: 'None rn (fucking sdcards)', ram: '4GB', disk: 'NONE GB lol', state: 'Everything work, but i lost tf antenna' }
|
|
];
|
|
|
|
const badges = [
|
|
{ img: '/pictures/fckgoogle.gif', href: 'https://duckduckgo.com/', alt: 'fckgoogle' },
|
|
{ img: '/pictures/ddg.gif', href: 'https://duckduckgo.com/', alt: 'ddg' },
|
|
{ img: '/pictures/catboybinary.png', href: 'https://catboy.page/', alt: 'catboy' },
|
|
{ img: '/pictures/jsonp.gif', href: 'https://jsopn.com/?glunging=true', alt: 'jsonp' },
|
|
{ img: '/pictures/otomir.png', href: 'https://otomir23.me/', alt: 'otomir' },
|
|
{ img: '/pictures/myslivets.png', href: 'https://myslivets.com/', alt: 'myslivets' },
|
|
{ img: '/pictures/flipper.gif', href: 'https://flipperzero.one', alt: 'flipper' },
|
|
{ img: '/pictures/anythingbutchrome.gif', href: '', alt: 'fuckchrome' },
|
|
{ img: '/pictures/senko.gif', href: 'https://senko.dev/', alt: 'senko' },
|
|
{ img: '/pictures/9banner.png', href: 'https://plan9.rocks/', alt: 'plan9' },
|
|
{ img: '/pictures/bisexual.gif', href: '', alt: 'bi' },
|
|
{ img: '/pictures/hatems.jpg', href: '', alt: 'hatems' },
|
|
{ img: '/pictures/piracy.gif', href: '', alt: 'piracy' },
|
|
{ img: '/pictures/mybutton.png', href: 'https://fuckyougoogle.xyz/', alt: 'mybutton' },
|
|
{ img: '/pictures/edwardcode.gif', href: 'https://edwardcode.net/', alt: 'edwardcode' },
|
|
{ img: '/pictures/furrygiena.gif', href: 'https://zbookcmd.github.io/', alt: 'furrygiena' },
|
|
{ img: '/pictures/powered-by-debian.gif', href: '', alt: 'poweredbydebian' },
|
|
{ img: '/pictures/made-with-macos.gif', href: '', alt: 'madewithmacos' }
|
|
];
|
|
</script>
|
|
|
|
<div class="crt curved">
|
|
<div class="scanlines"></div>
|
|
<div class="aperture"></div>
|
|
<header class="site-header">
|
|
<div class="head-wrap">
|
|
<div class="brand">
|
|
Lain <span class="handle">@systemxplore</span> {dayCounter}
|
|
</div>
|
|
<nav class="nav">
|
|
<a class="{location.pathname === '/' ? 'current' : ''}" href="/">whoami</a>
|
|
</nav>
|
|
</div>
|
|
</header>
|
|
|
|
<main class="container">
|
|
<section>
|
|
<p><strong>he/him</strong>, developer from <span class="location">Moscow, Russia</span></p>
|
|
<p>interested in backend development, system administration and security.</p>
|
|
|
|
<h3>contacts/profiles:</h3>
|
|
<ul>
|
|
{#each contacts as c}
|
|
<li>{c.label}: <a href={c.href} rel="me" target="_blank">{c.text}</a></li>
|
|
{/each}
|
|
</ul>
|
|
|
|
<h3>some projects:</h3>
|
|
<ul>
|
|
<li><a href={projects[0].href} target="_blank">{projects[0].text}</a></li>
|
|
<li>
|
|
<a href="https://github.com/x3lfyn/cursed-ping" target="_blank">x3lfyn/cursed-ping</a>
|
|
<span>patched for BSD systems: </span>
|
|
<a href={projects[1].href} target="_blank">lain/cursed-ping</a>
|
|
</li>
|
|
<li><span>and my website: </span> <a href={projects[2].href} target="_blank">lain/mybio-svelte</a></li>
|
|
</ul>
|
|
|
|
<blockquote class="promo">
|
|
<p>fast ad of my favorite VPN</p>
|
|
<p><a href="https://t.me/vpngen" target="_blank">VPN Generator</a></p>
|
|
<p>fast ad of my favorite VPN</p>
|
|
</blockquote>
|
|
|
|
<h3>my devices:</h3>
|
|
<div class="table-wrap">
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>Device</th>
|
|
<th>OS</th>
|
|
<th>RAM</th>
|
|
<th>Disk</th>
|
|
<th>State</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{#each devices as d}
|
|
<tr>
|
|
<td>{d.dev}</td>
|
|
<td>{d.os}</td>
|
|
<td>{d.ram}</td>
|
|
<td>{d.disk}</td>
|
|
<td>{d.state}</td>
|
|
</tr>
|
|
{/each}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<AudioPlayer />
|
|
|
|
<div class="divider"></div>
|
|
|
|
<div class="badges">
|
|
{#each badges as b}
|
|
{#if b.href}
|
|
<a href={b.href} target="_blank"><img src={b.img} alt={b.alt} /></a>
|
|
{:else}
|
|
<img src={b.img} alt={b.alt} />
|
|
{/if}
|
|
{/each}
|
|
</div>
|
|
</section>
|
|
</main>
|
|
</div>
|
|
|
|
<style>
|
|
@font-face {
|
|
font-family: Fantasque;
|
|
src: url('/fonts/FantasqueSansMono-Regular.woff2');
|
|
}
|
|
@font-face {
|
|
font-family: Fantasque;
|
|
src: url('/fonts/FantasqueSansMono-Bold.woff2');
|
|
font-weight: bold;
|
|
}
|
|
@font-face {
|
|
font-family: Fantasque;
|
|
src: url('/fonts/FantasqueSansMono-Italic.woff2');
|
|
font-style: italic;
|
|
}
|
|
@font-face {
|
|
font-family: Fantasque;
|
|
src: url('/fonts/FantasqueSansMono-BoldItalic.woff2');
|
|
font-style: italic;
|
|
font-weight: bold;
|
|
}
|
|
|
|
:root {
|
|
--green: #00ff00;
|
|
--green-2: #00cc00;
|
|
--bg-0: #0b0b0b;
|
|
--bg-1: #121212;
|
|
--bg-2: #1a1a1a;
|
|
}
|
|
|
|
a { color: var(--green); text-decoration: underline; }
|
|
a:hover { color: #00aa00; }
|
|
|
|
.container { max-width: 820px; margin: 0 auto; padding: 2rem 1.2rem; }
|
|
h3 { color: var(--green); margin: 0.6rem 0; }
|
|
strong { color: var(--green-2); }
|
|
p, ul { margin: 8px 0; }
|
|
ul { padding-left: 1.2rem; }
|
|
|
|
.location { color: var(--green); }
|
|
|
|
.promo { border: 2px dashed var(--green); border-radius: 14px; padding: 0.8rem 1rem; background: var(--bg-1); }
|
|
.promo p { margin: 0.2rem 0; text-align: center; }
|
|
|
|
.divider { height: 1px; margin: 1.2rem 0; background: linear-gradient(90deg, transparent, var(--green) 40%, var(--green) 60%, transparent); opacity: .7; border-bottom: 1px solid rgba(0,255,0,.35); }
|
|
|
|
.table-wrap { overflow-x: auto; border-radius: 14px; border: 1px solid var(--green); }
|
|
table { border-collapse: collapse; width: 100%; }
|
|
th, td { border: 1px solid var(--green); padding: 0.5rem; text-align: left; }
|
|
th { background: var(--bg-2); color: var(--green); }
|
|
tr:nth-child(even) { background: #0f0f0f; }
|
|
tr:nth-child(odd) { background: var(--bg-2); }
|
|
|
|
.badges { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 10px; align-items: center; }
|
|
.badges img { width: 100%; height: auto; display: block; }
|
|
|
|
.site-header { background: var(--bg-2); padding: 0.8rem 1rem; border-bottom: 1px solid var(--green); }
|
|
.head-wrap { max-width: 60rem; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; }
|
|
.brand { font-weight: 600; }
|
|
.handle { padding: 2px 6px; background: #0f0f0f; font-family: Fantasque, monospace; }
|
|
.nav { display: flex; gap: 8px; }
|
|
.nav a { color: var(--green); padding: 0 6px; }
|
|
.current { padding: 0 6px; font-weight: 700; color: var(--green); text-decoration: underline; }
|
|
|
|
.crt{ position:relative;}
|
|
.crt::before{content:"";position:fixed;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,0.08) 0px,rgba(0,0,0,0.08) 1px,transparent 2px,transparent 4px);mix-blend-mode:multiply;}
|
|
.crt::after{content:"";position:fixed;inset:-10vh -10vw -10vh -10vw;pointer-events:none;background:radial-gradient(ellipse at center, rgba(0,255,0,0.05) 0%, rgba(0,0,0,0.35) 60%, rgba(0,0,0,0.85) 100%);}
|
|
.container, .site-header, .promo, table, .badges img { filter: drop-shadow(0 0 0.15rem rgba(0,255,0,.6)); }
|
|
|
|
</style>
|