Add yello donation button for mobile screens.
This commit is contained in:
parent
5607748390
commit
3294fc2cc6
2 changed files with 25 additions and 7 deletions
|
|
@ -54,6 +54,10 @@ const Header: React.FC = () => {
|
||||||
</svg>
|
</svg>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
{/* Mobile Donate Button - Always visible below header on mobile */}
|
||||||
|
<div className="md:hidden mt-4 flex justify-center">
|
||||||
|
<DonateButton onClick={handleDonateClick} />
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<AnimatePresence>
|
<AnimatePresence>
|
||||||
{isMenuOpen && (
|
{isMenuOpen && (
|
||||||
|
|
@ -71,7 +75,6 @@ const Header: React.FC = () => {
|
||||||
<li><NavItem href="/about" onClick={() => setIsMenuOpen(false)}>About MCDi</NavItem></li>
|
<li><NavItem href="/about" onClick={() => setIsMenuOpen(false)}>About MCDi</NavItem></li>
|
||||||
<li><NavItem href="/calendar" onClick={() => setIsMenuOpen(false)}>Calendar</NavItem></li>
|
<li><NavItem href="/calendar" onClick={() => setIsMenuOpen(false)}>Calendar</NavItem></li>
|
||||||
<li><NavItem href="/joinmcdi" onClick={() => setIsMenuOpen(false)}>Join MCDi</NavItem></li>
|
<li><NavItem href="/joinmcdi" onClick={() => setIsMenuOpen(false)}>Join MCDi</NavItem></li>
|
||||||
<li><DonateButton onClick={handleDonateClick} /></li>
|
|
||||||
</ul>
|
</ul>
|
||||||
</motion.div>
|
</motion.div>
|
||||||
)}
|
)}
|
||||||
|
|
|
||||||
|
|
@ -1,10 +1,18 @@
|
||||||
# Active Context
|
# Active Context
|
||||||
|
|
||||||
## Current Task
|
## Current Task
|
||||||
Added 5 new future events to the calendar system
|
Completed: Made yellow donation button visible on mobile header
|
||||||
|
|
||||||
## Recent Changes
|
## Recent Changes
|
||||||
1. Added 5 new events to eventData.ts:
|
1. Modified Header.tsx to display donation button on mobile:
|
||||||
|
- Added permanent yellow donation button below hamburger menu on mobile devices
|
||||||
|
- Button is always visible in the red header area (no need to open menu)
|
||||||
|
- Removed duplicate donation button from inside mobile menu dropdown
|
||||||
|
- Desktop view unchanged - button remains in top right corner
|
||||||
|
- Mobile header now has extended height to accommodate the button
|
||||||
|
- Button centered and properly styled with same appearance as desktop version
|
||||||
|
|
||||||
|
2. Previous: Added 5 new events to eventData.ts:
|
||||||
- December 13, 2025: Board Meeting at Liquid Planet at The Book Exchange (9-10 AM)
|
- December 13, 2025: Board Meeting at Liquid Planet at The Book Exchange (9-10 AM)
|
||||||
- March 14, 2026: Board Meeting at TBD location (9-10 AM)
|
- March 14, 2026: Board Meeting at TBD location (9-10 AM)
|
||||||
- June 13, 2026: Board Meeting at TBD location (9-10 AM)
|
- June 13, 2026: Board Meeting at TBD location (9-10 AM)
|
||||||
|
|
@ -13,6 +21,12 @@ Added 5 new future events to the calendar system
|
||||||
- All events use Tessa Williams as contact (tessa.williams@deafmissoula.org)
|
- All events use Tessa Williams as contact (tessa.williams@deafmissoula.org)
|
||||||
- Events will automatically appear in calendar view and upcoming events section
|
- Events will automatically appear in calendar view and upcoming events section
|
||||||
|
|
||||||
|
2. Updated intro video:
|
||||||
|
- Replaced mcdi-intro.mp4 with new version
|
||||||
|
- Original video saved as mcdi-intro-old.mp4
|
||||||
|
- Video component in Meet-Board.tsx already configured to work with new file
|
||||||
|
- No code changes needed - video path remains /videos/mcdi-intro.mp4
|
||||||
|
|
||||||
2. Previous completed work:
|
2. Previous completed work:
|
||||||
- Added new meeting minutes for January 11, 2025 and March 8, 2025
|
- Added new meeting minutes for January 11, 2025 and March 8, 2025
|
||||||
- Added 6.jpg to rotating photo carousel
|
- Added 6.jpg to rotating photo carousel
|
||||||
|
|
@ -21,10 +35,11 @@ Added 5 new future events to the calendar system
|
||||||
- All previous changes successfully deployed to production
|
- All previous changes successfully deployed to production
|
||||||
|
|
||||||
## Next Steps
|
## Next Steps
|
||||||
1. Commit and push eventData.ts changes to Git
|
1. Commit and push Header.tsx changes to Git repository
|
||||||
2. Deploy changes through Portainer (pull and redeploy)
|
2. Deploy changes through Portainer (pull and redeploy)
|
||||||
3. Verify new events appear correctly in calendar interface
|
3. Verify mobile donation button appears correctly on production
|
||||||
4. Test event card functionality and contact information
|
4. Verify desktop layout remains unchanged
|
||||||
|
5. Test donation button functionality on mobile devices
|
||||||
|
|
||||||
## Solution Summary
|
## Solution Summary
|
||||||
- Problem: Portainer repository deployments require stack.env file in Git repo
|
- Problem: Portainer repository deployments require stack.env file in Git repo
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue