Skip to content

feat: add new sponsor logos and update layout for better responsiveness #71

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Bhav-ikkk merged 1 commit into from
Apr 5, 2026
Merged

feat: add new sponsor logos and update layout for better responsiveness #71

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file added public/sponsors/WhatsApp_Image_2026-04-04_at_11.37.13-removebg-preview.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/sponsors/WhatsApp_Image_2026-04-04_at_11.37.49-removebg-preview.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
6 changes: 5 additions & 1 deletion src/views/home/FeaturedEvents.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -725,7 +725,7 @@ export default function FeaturedEvents({ categoryEvents = [], loading = false })
</Box>

{/* ── Cards carousel ─────────────────────────────────────────── */}
<Box sx={{ position: 'relative', overflow: 'hidden', minHeight: { xs: 430, md: 480 } }}>
<Box sx={{ position: 'relative', overflow: 'hidden', minHeight: { xs: 1400, sm: 700, md: 480 } }}>
<AnimatePresence mode='wait' custom={direction}>
<MotionBox
key={current.categoryId}
Expand All @@ -736,6 +736,10 @@ export default function FeaturedEvents({ categoryEvents = [], loading = false })
exit='exit'
transition={{ duration: 0.45, ease: [0.22, 1, 0.36, 1] }}
sx={{
position: 'absolute',
top: 0,
left: 0,
width: '100%',
Comment on lines +739 to +742
Copy link

Copilot AI Apr 5, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Setting the carousel grid to position: 'absolute' removes it from the document flow, so the parent’s height no longer matches the content and must be managed separately. If you keep absolute positioning for the slide animation, ensure the parent height is driven by the grid’s actual height (not only a breakpoint-based minHeight) to prevent overlap/clipping on different content sizes.

Copilot uses AI. Check for mistakes.
display: 'grid',
gridTemplateColumns: {
xs: '1fr',
Expand Down
161 changes: 114 additions & 47 deletions src/views/home/HeroSection.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -529,63 +529,130 @@ export default function HeroSection({ loading = false }) {
<Box
sx={{
display: 'flex',
flexDirection: 'column',
alignItems: 'center',
justifyContent: 'center',
gap: 2.5,
flexDirection: { xs: 'column', md: 'row' },
alignItems: { xs: 'center', md: 'stretch' },
justifyContent: { xs: 'center', md: 'space-between' },
gap: { xs: 4, md: 4, lg: 6 },
mt: { xs: 2.5, md: 3.5 },
pt: { xs: 2, md: 3 },
borderTop: `1px solid ${heroBorder}`
borderTop: `1px solid ${heroBorder}`,
width: '100%',
px: { md: 6, lg: 10 }
}}
>
{/* Heading */}
<Typography
sx={{
fontWeight: 700,
fontSize: { xs: '1.1rem', md: '1.3rem' },
color: c.primary,
letterSpacing: 1,
textTransform: 'uppercase'
}}
>
Community Partners
</Typography>
{/* Left: Powered by Eicher */}
<Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center', gap: 2, flex: { md: 1 } }}>
<Typography
sx={{
fontWeight: 700,
fontSize: { xs: '1.1rem', md: '1.3rem' },
color: c.primary,
letterSpacing: 1,
textTransform: 'uppercase',
whiteSpace: 'nowrap'
}}
>
Powered by Eicher
</Typography>
{/* Logo wrapper — grows to fill remaining column height so logo aligns with centre */}
<Box sx={{ display: 'flex', alignItems: 'center', justifyContent: 'center', flex: 1 }}>
<Box
component='img'
src='/sponsors/EICHER__1_-removebg-preview.png'
alt='Powered by Eicher'
sx={{
width: { xs: 140, sm: 170, md: 200 },
height: 'auto',
objectFit: 'contain',
filter: isDark ? 'drop-shadow(0 0 8px rgba(255,255,255,0.10))' : 'drop-shadow(0 2px 6px rgba(0,0,0,0.12))',
transition: 'transform 0.3s ease',
'&:hover': { transform: 'scale(1.08)' }
}}
/>
</Box>
</Box>

{/* Logos */}
<Box
sx={{
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
gap: { xs: 2, sm: 3, md: 5 }
}}
>
<Box
component='img'
src='/sponsors/shekunj.png'
alt='Shekunj - Community Partner'
{/* Centre: Community Partners (existing) */}
<Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center', gap: 2, flex: { md: 2 } }}>
<Typography
sx={{
width: { xs: 140, sm: 170, md: 250 },
height: 'auto',
objectFit: 'contain',
filter: isDark ? 'drop-shadow(0 0 8px rgba(255,255,255,0.10))' : 'drop-shadow(0 2px 6px rgba(0,0,0,0.12))',
transition: 'transform 0.3s ease',
'&:hover': { transform: 'scale(1.08)' }
fontWeight: 700,
fontSize: { xs: '1.1rem', md: '1.3rem' },
color: c.primary,
letterSpacing: 1,
textTransform: 'uppercase'
}}
/>
>
Community Partners
</Typography>
<Box
component='img'
src='/sponsors/mayor.png'
alt='Mayor - Community Partner'
sx={{
width: { xs: 140, sm: 170, md: 200 },
height: 'auto',
objectFit: 'contain',
filter: isDark ? 'drop-shadow(0 0 8px rgba(255,255,255,0.10))' : 'drop-shadow(0 2px 6px rgba(0,0,0,0.12))',
transition: 'transform 0.3s ease',
'&:hover': { transform: 'scale(1.08)' }
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
gap: { xs: 2, sm: 3, md: 5 },
flex: 1
}}
/>
>
<Box
component='img'
src='/sponsors/shekunj.png'
alt='Shekunj - Community Partner'
sx={{
width: { xs: 140, sm: 170, md: 250 },
height: 'auto',
objectFit: 'contain',
filter: isDark ? 'drop-shadow(0 0 8px rgba(255,255,255,0.10))' : 'drop-shadow(0 2px 6px rgba(0,0,0,0.12))',
transition: 'transform 0.3s ease',
'&:hover': { transform: 'scale(1.08)' }
}}
/>
<Box
component='img'
src='/sponsors/mayor.png'
alt='Mayor - Community Partner'
sx={{
width: { xs: 140, sm: 170, md: 200 },
height: 'auto',
objectFit: 'contain',
filter: isDark ? 'drop-shadow(0 0 8px rgba(255,255,255,0.10))' : 'drop-shadow(0 2px 6px rgba(0,0,0,0.12))',
transition: 'transform 0.3s ease',
'&:hover': { transform: 'scale(1.08)' }
}}
/>
</Box>
</Box>

{/* Right: Nutrition Partner - Sanchi */}
<Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center', gap: 2, flex: { md: 1 } }}>
<Typography
sx={{
fontWeight: 700,
fontSize: { xs: '1.1rem', md: '1.3rem' },
color: c.primary,
letterSpacing: 1,
textTransform: 'uppercase',
whiteSpace: 'nowrap'
}}
>
Nutrition Partner
</Typography>
{/* Logo wrapper — grows to fill remaining column height so logo aligns with centre */}
<Box sx={{ display: 'flex', alignItems: 'center', justifyContent: 'center', flex: 1 }}>
<Box
component='img'
src='/sponsors/SANCHI__1__page-0001-removebg-preview.png'
alt='Nutrition Partner - Sanchi'
sx={{
width: { xs: 140, sm: 170, md: 200 },
height: 'auto',
objectFit: 'contain',
filter: isDark ? 'drop-shadow(0 0 8px rgba(255,255,255,0.10))' : 'drop-shadow(0 2px 6px rgba(0,0,0,0.12))',
transition: 'transform 0.3s ease',
'&:hover': { transform: 'scale(1.08)' }
}}
/>
</Box>
</Box>
</Box>
</MotionBox>
Expand Down
4 changes: 3 additions & 1 deletion src/views/home/SponsorsSection.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,9 @@ const SPONSOR_CATEGORIES = [
{ name: 'Pisarv', src: '/sponsors/WhatsApp_Image_2026-04-03_at_13.02.15-removebg-preview.png' },
{ name: 'Universal Informatics', src: '/sponsors/Universal_Logo-removebg-preview.png' },
{ name: 'Study Metro', src: '/sponsors/sm_logo-removebg-preview.png' },
{ name: 'Encode AI', src: '/sponsors/image.png' }
{ name: 'Encode AI', src: '/sponsors/image.png' },
{ name: 'Quelwebs', src: '/sponsors/WhatsApp_Image_2026-04-04_at_11.37.13-removebg-preview.png' },
{ name: 'study swift', src: '/sponsors/WhatsApp_Image_2026-04-04_at_11.37.49-removebg-preview.png' }
Copy link

Copilot AI Apr 5, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The new sponsor entry uses inconsistent casing ('study swift') compared to the other sponsor names (Title Case) and will also be used as the image alt text. Please confirm the correct brand casing (likely Study Swift) and align formatting/indentation with the surrounding array items.

Suggested change
{ name: 'study swift', src: '/sponsors/WhatsApp_Image_2026-04-04_at_11.37.49-removebg-preview.png' }
{ name: 'Study Swift', src: '/sponsors/WhatsApp_Image_2026-04-04_at_11.37.49-removebg-preview.png' }

Copilot uses AI. Check for mistakes.
Comment on lines +49 to +51
Copy link
Copy Markdown

@coderabbitai coderabbitai Bot Apr 5, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟡 Minor

Normalize sponsor name casing for consistent brand/alt text quality.

On Line 51, study swift is lowercased while other brand names are title-cased. Since this value is used in alt, keep naming consistent.

Suggested fix 
-       { name: 'study swift', src: '/sponsors/WhatsApp_Image_2026-04-04_at_11.37.49-removebg-preview.png' }
+       { name: 'Study Swift', src: '/sponsors/WhatsApp_Image_2026-04-04_at_11.37.49-removebg-preview.png' }
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
{ name: 'Encode AI', src: '/sponsors/image.png' },
{ name: 'Quelwebs', src: '/sponsors/WhatsApp_Image_2026-04-04_at_11.37.13-removebg-preview.png' },
{ name: 'study swift', src: '/sponsors/WhatsApp_Image_2026-04-04_at_11.37.49-removebg-preview.png' }
{ name: 'Encode AI', src: '/sponsors/image.png' },
{ name: 'Quelwebs', src: '/sponsors/WhatsApp_Image_2026-04-04_at_11.37.13-removebg-preview.png' },
{ name: 'Study Swift', src: '/sponsors/WhatsApp_Image_2026-04-04_at_11.37.49-removebg-preview.png' }
🤖 Prompt for AI Agents 
Verify each finding against the current code and only fix it if needed.

In `@src/views/home/SponsorsSection.js` around lines 49 - 51, Normalize the
sponsor name casing in the sponsors list used by the SponsorsSection component:
change the entry with name 'study swift' in the sponsors array to title-case
(e.g., 'Study Swift') so its alt text and branding match the other entries;
update the name string in the sponsors array where the objects are declared to
maintain consistent casing across renderings.

]
}
]
Expand Down
Loading