alexlebens/site-profile
1
0
Fork 0
Code Issues 1 Pull Requests Actions Activity

add astro native SPA transition

Browse Source
This commit is contained in:
Alex Lebens
2025-07-15 21:56:33 -05:00
parent 22d5b50f73
commit e07210638e
11 changed files with 40 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/pages/index.astro
View File

@@ -23,7 +23,10 @@ const allTags = [...new Set(posts.flatMap((post) => post.tags || []))].slice(0,
<Layout title=`Home | ${global.name}`>
<!-- Hero Section with mobile responsiveness -->
<section class="theme-transition-all px-4 py-10 sm:px-6 sm:py-16 md:py-20">
<section
class="theme-transition-all px-4 py-10 sm:px-6 sm:py-16 md:py-20"
transition:animate="slide"
>
<div class="relative mx-auto max-w-2xl">
<!-- Adjusted blob positions and sizes for mobile appearance -->
<div
@@ -278,7 +281,7 @@ const allTags = [...new Set(posts.flatMap((post) => post.tags || []))].slice(0,
<script>
// Add hover effect for cards on touch devices
document.addEventListener('DOMContentLoaded', () => {
document.addEventListener('astro:page-load', () => {
const isTouchDevice = 'ontouchstart' in window || navigator.maxTouchPoints > 0;
if (isTouchDevice) {