Skip to content

[BUG] Desktop UI visual and layout issues #70

@syed-reza98

Description

@syed-reza98

🐛 Bug Description

The desktop view of the Sharothee Wedding website does not look visually appealing or polished. Common issues include:

  • Excessive whitespace and large gaps between grid columns, resulting in sparse layouts
  • Imbalanced grid layouts (e.g., asymmetric content spans, uneven card heights)
  • Overly large headings and faint font weights reducing hierarchy and legibility
  • Decorative absolute elements overlapping or distracting from content
  • Inconsistent border radius and card/button sizing
  • Gallery grid images too small and spaced out
  • Muted text colors may lack sufficient contrast for readability
  • Some sections inherit mobile-first styles, resulting in disconnected desktop layouts

Overall, the site lacks visual harmony and consistency in desktop view, affecting the user experience.

🔄 Steps to Reproduce

  1. Navigate to the homepage and main sections on a desktop browser (>1024px).
  2. Observe hero, story, gallery, and quick links sections.
  3. Notice excessive whitespace, grid imbalances, and inconsistent card/button sizes.
  4. Look at headings and muted text for contrast issues.
  5. Review gallery grid for image size and spacing problems.
  6. Check for overlapping decorative elements and overall layout harmony.

✅ Expected Behavior

The desktop view should look visually cohesive, with balanced grid layouts, consistent card/button sizing, clear text hierarchy, proper contrast, and decorative elements that enhance rather than distract from content. Gallery images should be appropriately sized and spaced, and all sections should have consistent padding and alignment.

📱 Device

Desktop

🌐 Browser

Edge

📺 Screen Size

Desktop (> 1024px)

👤 User Type

Guest

🎯 Guest Impact

  • Blocks RSVP process
  • Affects wedding day functionality
  • Visual/UX issue only
  • Admin panel only

📸 Screenshots

No response

🔗 Additional Context

These issues are primarily visual/UX concerns but can negatively affect the perception of the wedding website for guests and admins. Addressing these will improve overall experience and consistency.

🔴 Priority

High (Affects user experience)

Metadata

Metadata

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions