How roxxsujal7/portfolio_roxx works
This repository is a static, interactive portfolio for Sujal, presenting his engineering profile, work, and contact links through an illustrated Spider-Verse interface. The principal workflow is a visitor exploring the portfolio, navigating its sections, and optionally switching themes or following an external contact link. The README documents the work showcase, SEO/social previews, motion, accessibility, and theme behavior. The page and component source were not sampled, so page composition and asset wiring are represented conservatively; implementation details for motion and theme are supported by the sampled scripts.
Main entry points: index.astro Portfolio Page · theme.ts Theme Switcher · motion.ts Motion System · global.css Global Styles
Components 17
Portfolio Experience
- Portfolio Page
src/pages/index.astro - Profile Content
src/pages/index.astro - Project Showcase
src/pages/index.astro - Contact Links
src/pages/index.astro
Interactive Behavior
- Motion System
src/scripts/motion.ts - Theme Switcher
src/scripts/theme.ts - Theme Preference
Visual Presentation
- Global Styles
src/styles/global.css - Note Component
src/components/Note.astro - Spider Component
src/components/Spider.astro - Web Component
src/components/Web.astro - Thumbnail Component
src/components/Thumb.astro - Portfolio Artwork
src/assets
Social Identity
- Social Preview
public
Other components
- Visitor
- Social Platforms
- Browser Storage
Connections 18
- Visitor → Portfolio Page: opens
- Portfolio Page → Profile Content: presents
- Portfolio Page → Project Showcase: presents
- Portfolio Page → Contact Links: presents
- Portfolio Page → Motion System: enables motion
- Portfolio Page → Theme Switcher: enables themes
- Motion System → Portfolio Page: animates
- Theme Switcher → Browser Storage: reads and writes
- Browser Storage → Theme Switcher: restores preference
- Theme Switcher → Theme Preference: persists
- Portfolio Page → Global Styles: styled by
- Portfolio Page → Note Component: uses
- Portfolio Page → Spider Component: uses
- Portfolio Page → Web Component: uses
- Portfolio Page → Thumbnail Component: uses
- Portfolio Page → Portfolio Artwork: illustrated with
- Visitor → Social Platforms: follows contact links
- Social Platforms → Social Preview: shares preview