satr14/5th-site-expanded
1
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Compare commits

base: satr14:master
Branches Tags
satr14:master
satr14:bg-effect
..
compare: satr14:bg-effect
Branches Tags
satr14:master
satr14:bg-effect

1 commit
master ... bg-effect

Author SHA1 Message Date
Satria
d4ebf69173 add more text 2026-03-24 08:12:17 +07:00
3 changed files with 32 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/lib/index.ts
View file

@ -48,8 +48,8 @@ export default {
title: "satr14's site",
quote: "sometimes you just gotta implement it yourself",
name: "satr14",
roles: ["Web Dev", "Sys Admin", "Hobbyist", "Student"],
description: "Welcome to my over-engineered corner of the Internet! I'm Satria, Im a self-taught hobbyist web developer and homelaber sysadmin from Indonesia. I've been programming since 2021 and spend my free time working on personal projects and experimenting with new technologies.",
roles: ["Web Developer", "Sysadmin", "Hobbyist", "Student"],
description: "I'm Satria, Im a self-taught hobbyist web developer and homelaber sysadmin from Indonesia. I've been programming since 2021 and spend my free time working on personal projects and experimenting with new technologies.",
skills: ["Tailwind", "SvelteKit", "TypeScript", "Bun", "Express", "PocketBase", "Linux", "Nginx", "Docker", "Git", "Bash", "Proxmox", "Nix"],
timezone: "Asia/Jakarta",
location: "Indonesia",

1
src/routes/+layout.svelte
View file

@ -20,7 +20,6 @@
<svelte:head>
<title>{data.title}</title>
<meta name="description" content={data.quote} />
<script defer src="https://a.satr14.my.id/script.js" data-website-id="6af23546-b65d-43d0-88cb-87fe863ea753"></script>
<!-- <meta name="theme-color" content="#00e1ff" /> -->
</svelte:head>

26
src/routes/+page.svelte
View file

@ -52,9 +52,9 @@
<nav class="flex flex-col gap-0 items-center z-50 fixed top-24 sm:top-12 md:top-4 right-0 font-semibold bg-ctp-surface0 pr-4 pl-2 py-1 rounded-l-xl border-y border-l border-ctp-sky">
<a href="https://nixwebr.ing" class="no-underline text-sm text-ctp-text">nix-webring</a>
<div class="text-2xl">
<a href="https://nixwebr.ing/prev/satr14" class="no-underline text-ctp-text">&lt;</a>
<a href="https://nixwebr.ing/prev/satr14" class="no-underline text-ctp-text">&larr;</a>
<a href="https://nixwebr.ing/rand" class="no-underline text-ctp-text">&#9858;</a>
<a href="https://nixwebr.ing/next/satr14" class="no-underline text-ctp-text">&gt;</a>
<a href="https://nixwebr.ing/next/satr14" class="no-underline text-ctp-text">&rarr;</a>
</div>
</nav>
@ -79,24 +79,34 @@
<div class="fixed top-0 left-0 w-full h-full overflow-hidden flex justify-center items-center select-none" transition:blur={{
duration: 1000, easing: cubicOut,
}}>
<div class="font-[Stray,monospace] group whitespace-nowrap text-center text-5xl my-4 cursor-default -rotate-6 leading-10 text-ctp-overlay1 hover:text-ctp-base">
<div class="font-[Stray,monospace] group whitespace-nowrap text-center text-5xl my-4 cursor-default -rotate-6 leading-10 text-ctp-overlay1 hover:text-ctp-surface2">
{#each Array(10) as _,i}
<div class="inline-flex relative overflow-hidden">
<span class="animate-[marquee_10s_linear_infinite] whitespace-nowrap">
<span class="whitespace-nowrap" style="opacity: {i*0.1}; animation: marquee {5 + i * 3}s linear infinite;">
{randomStr(charAmount)}
</span>
<span class="absolute top-0 animate-[marquee2_10s_linear_infinite] whitespace-nowrap">
<span class="absolute top-0 whitespace-nowrap" style="opacity: {i*0.1}; animation: marquee2 {5 + i * 3}s linear infinite;">
{randomStr(charAmount)}
</span>
</div><br>
<span class="block">{randomStr(Math.round(charAmount-data.name.length/2))}<a href="https://git.satr14.my.id/satr14/5th-site-expanded" target="_blank" class="group-hover:px-8 no-underline text-ctp-subtext1 group-hover:text-ctp-text">{data.name.toUpperCase()}</a>{randomStr(Math.round(charAmount-data.name.length/2))}</span>
{/each}
<span class="block">
{randomStr(Math.round(charAmount-data.name.length/2), false)}
<a href="https://git.satr14.my.id/satr14/5th-site-expanded" target="_blank" class="no-underline text-ctp-subtext1 group-hover:text-ctp-text">
{data.name.toUpperCase()}
</a>
{randomStr(Math.round(charAmount-data.name.length/2), false)}
</span>
{#each Array(9) as _,i}
<div class="inline-flex relative overflow-hidden">
<span class="animate-[marquee_10s_linear_infinite_reverse] whitespace-nowrap">
<span class="whitespace-nowrap" style="opacity: {(9-i)*0.1}; animation: marquee {26 - i * 3}s linear infinite reverse;">
{randomStr(charAmount)}
</span>
<span class="absolute top-0 animate-[marquee2_10s_linear_infinite_reverse] whitespace-nowrap">
<span class="absolute top-0 whitespace-nowrap" style="opacity: {(9-i)*0.1}; animation: marquee2 {26 - i * 3}s linear infinite reverse;">
{randomStr(charAmount)}
</span>
</div><br>
{/each}
</div>
</div>