Storybook Deployment Fix #8

2025-08-20T19:28:51Z

an.di commented

2025-08-20 19:28:51 +00:00

Fix GitHub Pages Asset Loading for Storybook

Overview

This PR resolves asset loading issues in the Storybook deployment on GitHub Pages.
All absolute paths were converted to relative paths, and the base path was configured for the communityrulestorybook repository.

Deployment is currently on my personal GitHub account and will be migrated to the MEDLab server in the future.

Changes

Updated Storybook base path to /communityrulestorybook/
Added <base href> tags in managerHead and previewHead
Configured Vite base option for sub-path hosting
Converted all component asset paths from /assets/... → assets/...
- SectionNumber, Header, HomeHeader, HeroBanner, ContentLockup, HeaderTab, Footer, Logo
Fixed Avatar and AvatarContainer story asset references
Added .nojekyll file to prevent Jekyll processing
Rebuilt Storybook with corrected configuration

How to Test

Visit: https://adilallo.github.io/communityrulestorybook/
Verify:
- Avatars load in Header and HomeHeader
- Section number images appear in NumberedCards
- Hero image displays in HeroBanner
- Logos and decorative elements render in Footer and Logo
- All story examples load assets correctly
Check browser console for no 404 errors
Confirm layout and assets work across mobile, tablet, and desktop

Notes

Fixes apply only to asset paths and configuration, no functional changes
Current deployment is temporary on personal GitHub Pages
Migration to MEDLab server planned in the future

# Fix GitHub Pages Asset Loading for Storybook ## Overview This PR resolves asset loading issues in the Storybook deployment on GitHub Pages. All absolute paths were converted to relative paths, and the base path was configured for the `communityrulestorybook` repository. Deployment is currently on my personal GitHub account and will be migrated to the MEDLab server in the future. ## Changes - Updated Storybook **base path** to `/communityrulestorybook/` - Added `<base href>` tags in **managerHead** and **previewHead** - Configured **Vite base** option for sub-path hosting - Converted all component asset paths from `/assets/...` → `assets/...` - **SectionNumber**, **Header**, **HomeHeader**, **HeroBanner**, **ContentLockup**, **HeaderTab**, **Footer**, **Logo** - Fixed **Avatar** and **AvatarContainer** story asset references - Added `.nojekyll` file to prevent Jekyll processing - Rebuilt Storybook with corrected configuration ## How to Test 1. Visit: `https://adilallo.github.io/communityrulestorybook/` 2. Verify: - Avatars load in Header and HomeHeader - Section number images appear in NumberedCards - Hero image displays in HeroBanner - Logos and decorative elements render in Footer and Logo - All story examples load assets correctly 3. Check browser console for **no 404 errors** 4. Confirm layout and assets work across **mobile, tablet, and desktop** ## Notes - Fixes apply only to **asset paths and configuration**, no functional changes - Current deployment is **temporary on personal GitHub Pages** - Migration to **MEDLab server** planned in the future

an.di added 12 commits 2025-08-20 19:28:51 +00:00

Hero Banner xsm breakpoint a04a5a6eeb

Hero Banner sm breakpoint 968d687bad

Hero Banner md breakpoint 1a9339479d

Hero Banner lg breakpoint a5352d98ef

Hero Banner xl breakpoint af986c9ba3

Fix button md breakpoint sizing issue 2910631d56

Fix xl breakpoint header + footer 452603f4f6

Hero Banner Storybook added 445e812e9c

Content Lockup button fixed 6e274124c3

Replace absolute image paths e871c9de4b

Base name reconfiguration f3b0daa2c0