Fix store closure message rendering in dark mode

Force explicit light-mode colors with inline styles so Bulma's dark
mode cannot override the closure banner text and background.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
chris 2026-06-09 21:05:13 -04:00
parent 781f990541
commit f0b60f123d

View File

@ -253,10 +253,10 @@ export default function FeaturedProducts() {
{loading ? (
<SkeletonGrid />
) : storeClosed ? (
<div style={{ textAlign: 'center', padding: '4rem 1rem' }}>
<div style={{ textAlign: 'center', padding: '4rem 1rem', color: '#363636', background: '#fff' }}>
<p style={{ fontSize: '4rem', marginBottom: '1rem' }}>🎈</p>
<h2 className="title is-3">We&rsquo;re temporarily closed</h2>
<p className="has-text-grey" style={{ fontSize: '1.05rem', maxWidth: 480, margin: '0 auto 1.5rem' }}>
<h2 className="title is-3" style={{ color: '#363636' }}>We&rsquo;re temporarily closed</h2>
<p style={{ fontSize: '1.05rem', maxWidth: 480, margin: '0 auto 1.5rem', color: '#7a7a7a' }}>
{closeMessage || 'Online ordering is paused right now. Please check back soon or contact us directly.'}
</p>
<a href="https://beachpartyballoons.com/contact/" className="button is-info is-medium">