trafficlunar/website
1
0
Fork 0
mirror of https://github.com/trafficlunar/website.git synced 2026-06-28 06:04:09 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: snappier feel

Browse source 
- adds transitions on page load with starting-style
- change header's feel (unintentional but like iOS 26)
- change some colors about
This commit is contained in:
trafficlunar 2025-11-14 22:22:06 +00:00
parent e3d41cf239
commit 15dfd08c20
14 changed files with 246 additions and 178 deletions
Download patch file Download diff file Expand all files Collapse all files

12
src/pages/index.astro
View file

@ -10,7 +10,7 @@ import LocationIcon from "../assets/icons/location.svg";
---
<Layout>
<section>
<section class="transition-all duration-300 delay-100 starting:opacity-0 starting:translate-y-4">
<legend>about</legend>
<p>
Hey! I'm <strong class="text-peach">trafficlunar</strong>. I'm a <Age client:only /> year old self-proclaimed full-stack developer.
@ -31,11 +31,13 @@ import LocationIcon from "../assets/icons/location.svg";
<Tools />
<div class="flex items-center gap-4 text-subtext0 text-sm font-medium my-4">
<hr class="flex-grow border-surface1" />
<div
class="flex items-center gap-4 text-subtext0 text-sm font-medium my-4 transition-all duration-300 delay-250 starting:opacity-0 starting:translate-y-4"
>
<hr class="grow border-surface1" />
<span>projects</span>
<hr class="flex-grow border-surface1" />
<hr class="grow border-surface1" />
</div>
<Projects client:only />
<Projects client:load />
</Layout>

18
src/pages/status.astro
View file

@ -6,21 +6,11 @@ import Computer from "../components/Computer.svelte";
---
<Layout>
<section class="!mb-0 !pt-3">
<legend>status</legend>
<Music client:load />
<div class="flex items-center gap-4 text-subtext0 text-sm font-medium mb-4">
<hr class="flex-grow border-surface1" />
<span>last.fm</span>
<hr class="flex-grow border-surface1" />
</div>
<Music client:only />
<section class="pt-0! transition-all duration-300 delay-200 starting:opacity-0 starting:translate-y-4">
<legend>computer</legend>
<div class="flex items-center gap-4 text-subtext0 text-sm font-medium mt-4">
<hr class="flex-grow border-surface1" />
<span>computer</span>
<hr class="flex-grow border-surface1" />
</div>
<Computer client:only />
<Computer client:load />
</section>
</Layout>

11
src/pages/uses.astro
View file

@ -1,11 +0,0 @@
---
import Layout from "../layouts/Layout.astro";
---
<Layout>
<section>
<legend>uses</legend>
<p>Coming soon...</p>
</section>
</Layout>