Rename gallery photos to 0001-0010 format

This commit is contained in:
TheMaddax 2025-10-14 13:35:01 -06:00
parent ae8b2625fa
commit a92839f08f
12 changed files with 28 additions and 22 deletions

View file

Before

Width:  |  Height:  |  Size: 670 KiB

After

Width:  |  Height:  |  Size: 670 KiB

View file

Before

Width:  |  Height:  |  Size: 923 KiB

After

Width:  |  Height:  |  Size: 923 KiB

View file

Before

Width:  |  Height:  |  Size: 619 KiB

After

Width:  |  Height:  |  Size: 619 KiB

View file

Before

Width:  |  Height:  |  Size: 1.3 MiB

After

Width:  |  Height:  |  Size: 1.3 MiB

View file

Before

Width:  |  Height:  |  Size: 1.2 MiB

After

Width:  |  Height:  |  Size: 1.2 MiB

View file

Before

Width:  |  Height:  |  Size: 1.1 MiB

After

Width:  |  Height:  |  Size: 1.1 MiB

View file

Before

Width:  |  Height:  |  Size: 989 KiB

After

Width:  |  Height:  |  Size: 989 KiB

View file

Before

Width:  |  Height:  |  Size: 879 KiB

After

Width:  |  Height:  |  Size: 879 KiB

View file

Before

Width:  |  Height:  |  Size: 762 KiB

After

Width:  |  Height:  |  Size: 762 KiB

View file

Before

Width:  |  Height:  |  Size: 696 KiB

After

Width:  |  Height:  |  Size: 696 KiB

View file

@ -11,52 +11,52 @@ interface GalleryItem {
const galleryData: GalleryItem[] = [
{
id: 1,
imageUrl: '/photos/FullSizeRender 2.jpg',
imageUrl: '/photos/0001.jpg',
alt: 'MCDi community gathering',
},
{
id: 2,
imageUrl: '/photos/IMG_1615.jpg',
imageUrl: '/photos/0002.jpg',
alt: 'MCDi community event photo',
},
{
id: 3,
imageUrl: '/photos/IMG_2166.jpg',
imageUrl: '/photos/0003.jpg',
alt: 'MCDi community event photo',
},
{
id: 4,
imageUrl: '/photos/IMG_6067.jpg',
imageUrl: '/photos/0004.jpg',
alt: 'MCDi community event photo',
},
{
id: 5,
imageUrl: '/photos/IMG_6069.jpg',
imageUrl: '/photos/0005.jpg',
alt: 'MCDi community event photo',
},
{
id: 6,
imageUrl: '/photos/IMG_6079.jpg',
imageUrl: '/photos/0006.jpg',
alt: 'MCDi community event photo',
},
{
id: 7,
imageUrl: '/photos/IMG_6080.jpg',
imageUrl: '/photos/0007.jpg',
alt: 'MCDi community event photo',
},
{
id: 8,
imageUrl: '/photos/IMG_6084.jpg',
imageUrl: '/photos/0008.jpg',
alt: 'MCDi community event photo',
},
{
id: 9,
imageUrl: '/photos/IMG_7655.jpg',
imageUrl: '/photos/0009.jpg',
alt: 'MCDi community event photo',
},
{
id: 10,
imageUrl: '/photos/IMG_7657.jpg',
imageUrl: '/photos/0010.jpg',
alt: 'MCDi community event photo',
},
];

View file

@ -1,17 +1,26 @@
# Active Context
## Current Task
Completed: Created new Gallery page with photo grid and modal viewer
Completed: Updated Gallery with optimized community photos (no captions)
## Recent Changes
1. Created new Gallery component (Gallery.tsx):
1. Gallery photo optimization and update:
- Converted 8 HEIC files from Junk directory to JPG using macOS sips tool
- Optimized all 11 photos for web (resized to max 1920px, 80% quality)
- Moved optimized photos to client/public/photos/
- Updated Gallery.tsx to use new community event photos
- Removed all captions per owner request (photos display without text)
- Gallery now shows 10 community event photos in responsive grid
- Modal viewer displays full-size images without captions
- Photos: FullSizeRender 2.jpg, IMG_1615.jpg, IMG_2166.jpg, IMG_6067.jpg, IMG_6069.jpg, IMG_6079.jpg, IMG_6080.jpg, IMG_6084.jpg, IMG_7655.jpg, IMG_7657.jpg
- Committed to Git: ae8b262
2. Previous: Created new Gallery component (Gallery.tsx):
- Responsive photo grid layout (1-4 columns based on screen size)
- Clickable images that enlarge in a modal viewer
- Yellow text captions on red background with black border
- Smooth animations using Framer Motion
- Currently using board member headshots as placeholder images
- Modal features: click outside to close, X button, spring animation
- Maintains website's color scheme (#6B1631 red, yellow-400 text)
- Maintains website's color scheme (#6B1631 red)
- Added to navigation: "About MCDi" dropdown and mobile menu
- Route added: /gallery
@ -46,13 +55,10 @@ Completed: Created new Gallery page with photo grid and modal viewer
- All previous changes successfully deployed to production
## Next Steps
1. Wait for website owner to provide actual gallery photos
2. Replace placeholder headshots with real gallery photos
3. Update captions with appropriate descriptions
4. Commit all changes (Gallery.tsx, App.tsx, Header.tsx) to Git
5. Deploy changes through Portainer (pull and redeploy)
6. Test gallery functionality on production (desktop and mobile)
7. Consider adding video support to gallery in future
1. Deploy changes through Portainer (pull and redeploy)
2. Test gallery functionality on production (desktop and mobile)
3. Verify all 10 photos load correctly
4. Consider adding video support to gallery in future if requested
## Solution Summary
- Problem: Portainer repository deployments require stack.env file in Git repo