diff --git a/src/app.tsx b/src/app.tsx index b31be89..74ccf5c 100644 --- a/src/app.tsx +++ b/src/app.tsx @@ -27,21 +27,18 @@ function AppLayout(props: { children: any }) { let lastScrollY = 0; - // Use onMount to avoid hydration issues - window operations are client-only onMount(() => { const windowWidth = createWindowWidth(); createEffect(() => { const currentIsMobile = isMobile(windowWidth()); - // Show bars when switching to desktop if (!currentIsMobile) { setLeftBarVisible(true); setRightBarVisible(true); } }); - // Hide leftbar on mobile after 500ms with translation animation const currentIsMobile = isMobile(windowWidth()); if (currentIsMobile) { setTimeout(() => { @@ -50,7 +47,6 @@ function AppLayout(props: { children: any }) { } }); - // Auto-hide on scroll (mobile only) onMount(() => { const windowWidth = createWindowWidth(); @@ -59,7 +55,6 @@ function AppLayout(props: { children: any }) { const currentIsMobile = isMobile(windowWidth()); if (currentIsMobile && currentScrollY > MOBILE_CONFIG.SCROLL_THRESHOLD) { - // Scrolling down past threshold - hide left bar on mobile if (currentScrollY > lastScrollY) { setLeftBarVisible(false); } @@ -75,7 +70,6 @@ function AppLayout(props: { children: any }) { }); }); - // ESC key to close sidebars on mobile onMount(() => { const windowWidth = createWindowWidth(); @@ -99,7 +93,6 @@ function AppLayout(props: { children: any }) { }); }); - // Global swipe gestures to reveal/hide bars onMount(() => { const windowWidth = createWindowWidth(); let touchStartX = 0; @@ -117,7 +110,6 @@ function AppLayout(props: { children: any }) { const deltaY = touchEndY - touchStartY; const currentIsMobile = isMobile(windowWidth()); - // Only trigger if horizontal swipe is dominant if (currentIsMobile && Math.abs(deltaX) > Math.abs(deltaY)) { if (deltaX > MOBILE_CONFIG.SWIPE_THRESHOLD) { setLeftBarVisible(true); @@ -140,7 +132,6 @@ function AppLayout(props: { children: any }) { if (typeof window === "undefined") return; const currentIsMobile = isMobile(window.innerWidth); - // Only hide left bar on mobile when it's visible if (currentIsMobile && leftBarVisible()) { const target = e.target as HTMLElement; const isInteractive = target.closest( diff --git a/src/components/ActivityHeatmap.tsx b/src/components/ActivityHeatmap.tsx index 1666e8b..36b3a77 100644 --- a/src/components/ActivityHeatmap.tsx +++ b/src/components/ActivityHeatmap.tsx @@ -10,22 +10,18 @@ export const ActivityHeatmap: Component<{ contributions: ContributionDay[] | undefined; title: string; }> = (props) => { - // Generate last 12 weeks of days const weeks = createMemo(() => { const today = new Date(); const weeksData: { date: string; count: number }[][] = []; - // Start from 12 weeks ago const startDate = new Date(today); - startDate.setDate(startDate.getDate() - 84); // 12 weeks + startDate.setDate(startDate.getDate() - 84); - // Create a map for quick lookup const contributionMap = new Map(); props.contributions?.forEach((c) => { contributionMap.set(c.date, c.count); }); - // Generate weeks for (let week = 0; week < 12; week++) { const weekData: { date: string; count: number }[] = []; @@ -68,7 +64,6 @@ export const ActivityHeatmap: Component<{ when={props.contributions && props.contributions.length > 0} fallback={
- {/* Skeleton grid matching heatmap dimensions */}
{() => ( @@ -80,7 +75,6 @@ export const ActivityHeatmap: Component<{ )}
- {/* Centered spinner overlay */}
diff --git a/src/components/Bars.tsx b/src/components/Bars.tsx index 02e01aa..5e1ac2a 100644 --- a/src/components/Bars.tsx +++ b/src/components/Bars.tsx @@ -26,20 +26,14 @@ function formatDomainName(url: string): string { return withoutWww.charAt(0).toUpperCase() + withoutWww.slice(1); } -/** - * Converts a banner photo URL to its thumbnail version - * Replaces the filename with -small variant (e.g., image.jpg -> image-small.jpg) - */ function getThumbnailUrl(bannerPhoto: string | null): string { if (!bannerPhoto) return "/blueprint.jpg"; - // Check if URL contains a file extension const match = bannerPhoto.match(/^(.+)(\.[^.]+)$/); if (match) { return `${match[1]}-small${match[2]}`; } - // Fallback to original if no extension found return bannerPhoto; } @@ -77,7 +71,6 @@ export function RightBarContent() { }; onMount(() => { - // Fetch all data client-side only to avoid hydration mismatch const fetchData = async () => { try { const [ghCommits, gtCommits, ghActivity, gtActivity] = @@ -101,7 +94,6 @@ export function RightBarContent() { } }; - // Defer API calls to next tick to allow initial render to complete first setTimeout(() => { fetchData(); }, 0); @@ -168,7 +160,6 @@ export function RightBarContent() { - {/* Git Activity Section */}
{ setIsMounted(true); - // Set up window resize listener for reactive styling const handleResize = () => { setWindowWidth(window.innerWidth); }; window.addEventListener("resize", handleResize); - // Terminal-style appearance animation for "Get Lost" button const glitchChars = "!@#$%^&*()_+-=[]{}|;':\",./<>?~`"; const originalText = "What's this?"; let glitchInterval: NodeJS.Timeout; - // Delay appearance to match terminal vibe setTimeout(() => { - // Make visible immediately so typing animation is visible setGetLostVisible(true); - // Type-in animation with random characters resolving let currentIndex = 0; const typeInterval = setInterval(() => { if (currentIndex <= originalText.length) { let displayText = originalText.substring(0, currentIndex); - // Add random trailing characters if (currentIndex < originalText.length) { const remaining = originalText.length - currentIndex; for (let i = 0; i < remaining; i++) { @@ -301,14 +286,11 @@ export function LeftBar() { clearInterval(typeInterval); setGetLostText(originalText); - // Start regular glitch effect after typing completes glitchInterval = setInterval(() => { if (Math.random() > 0.9) { - // 10% chance to glitch let glitched = ""; for (let i = 0; i < originalText.length; i++) { if (Math.random() > 0.7) { - // 30% chance each character glitches glitched += glitchChars[Math.floor(Math.random() * glitchChars.length)]; } else { @@ -323,11 +305,10 @@ export function LeftBar() { } }, 150); } - }, 140); // Type speed (higher is slower) - }, 500); // Initial delay before appearing + }, 140); + }, 500); if (ref) { - // Focus trap for accessibility on mobile const handleKeyDown = (e: KeyboardEvent) => { const isMobile = window.innerWidth < BREAKPOINTS.MOBILE; @@ -346,13 +327,11 @@ export function LeftBar() { ] as HTMLElement; if (e.shiftKey) { - // Shift+Tab - going backwards if (document.activeElement === firstElement) { e.preventDefault(); lastElement.focus(); } } else { - // Tab - going forwards if (document.activeElement === lastElement) { e.preventDefault(); firstElement.focus(); @@ -392,12 +371,9 @@ export function LeftBar() { }, 0); }); - // Refetch user info whenever location changes createEffect(() => { - // Track location changes location.pathname; - // Only refetch if component is mounted if (isMounted()) { fetchUserInfo(); } @@ -433,7 +409,6 @@ export function LeftBar() { }} style={getMainNavStyles()} > - {/* Hamburger menu button - positioned at right edge of navbar */}
- {/* Navigation Links */}
    @@ -591,7 +564,6 @@ export function LeftBar() {
- {/* Get Lost button - outside Typewriter to allow glitch effect */}