UI inhancement

[Abhinandan-basotra]

UI Layout Issue: Sponsor Section Appears Misaligned and Excessively Spaced

Description
The Sponsors section on the website currently looks visually unbalanced and cluttered. There is excessive vertical spacing between sponsor tiers (Platinum, Gold, Silver, PGDay), and the logos are not aligned consistently. This makes the page feel sparse, messy, and less professional.

The issue is especially noticeable on larger screens, where large empty white spaces appear between sections, breaking visual flow and readability.

Steps to Reproduce

1. Open the Sponsors section on the website
   Example URL: https://eventyay.com/e/88882f3e (or relevant page)
2. Scroll to the Supported By / Sponsors section
3. Observe spacing and alignment between sponsor categories and logos

Expected Behavior

Sponsor tiers should be visually compact and evenly spaced
Logos should be:

1. Properly aligned (grid or flex-based layout)
2. Centered within their sections
3. Consistent in size (with responsive scaling)
4. Overall layout should feel balanced and professional

Screenshots

[Abhinandan-basotra]

I would like to work on this issue. I plan to fix the layout by reducing excessive spacing between sponsor sections, aligning logos using a responsive grid, and normalizing logo sizes for better visual consistency across screen sizes. Please let me know if I can proceed.

[Adarsh1442005]

Hi, I want to contribute to the UI enhancement. Can I take it UP??

[devprashant19]

Hello there. I would like to work on the issue.
My approach will be as follows-
1.Inspect the Sponsors section layout using dev tools to identify excessive margins, padding, and breakpoint-specific spacing issues.
2.Standardize vertical spacing between sponsor tiers by replacing hardcoded values with a consistent spacing system.
3.Refactor the logo containers using CSS Grid or Flexbox to ensure proper alignment and centering.
4.Normalize logo sizes using max-width, aspect-ratio, and responsive scaling to maintain consistency.
5.Test the updated layout across screen sizes and refine spacing to achieve a clean, professional appearance.

[Uniquerudra]

Hello 👋, I would like to work on this issue.

Here’s my proposed approach:

Analyze the current layout – Use browser dev tools to inspect the Sponsors section, identifying excessive margins, padding, and spacing inconsistencies across breakpoints.

Standardize vertical spacing – Replace hardcoded spacing with a consistent system to create a visually balanced hierarchy between sponsor tiers (Platinum, Gold, Silver, PGDay).

Align logos properly – Refactor the logo containers using CSS Grid or Flexbox to ensure proper alignment, centering, and uniform distribution.

Normalize logo sizes – Apply max-width, maintain aspect ratios, and use responsive scaling for consistency across devices.

Test across screen sizes – Verify layout on different devices, refine spacing, and ensure a clean, professional appearance.

Looking forward to contributing and improving the visual balance of the Sponsors section!

[omkar200412]

The issue in the Sponsors section is mainly due to poor layout structuring rather than just spacing, causing excessive white gaps and misaligned logos that make the page look unbalanced, especially on larger screens. To fix this, the sponsor tiers should be organized using a responsive grid or flexbox layout so that logos are evenly aligned and centered within each tier, while maintaining consistent logo sizes using max-height constraints. Additionally, replacing random margins with a uniform gap system between sections will ensure balanced vertical spacing, resulting in a cleaner, more compact, and professional appearance across all screen sizes.