Skip to content

refactor: update main pages to use Container component #91

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.

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
merged 1 commit into from
Jun 7, 2025

Conversation

nullcoder
Copy link
Owner

Update main pages to use the newly created Container component for consistent spacing and layout.

Changes

  • Replace custom container styles with Container component across main pages
  • Homepage: Remove custom max-w-4xl and p-8 in favor of Container
  • Create page: Replace generic container mx-auto py-8 with Container
  • Gist view page: Replace generic container mx-auto py-8 with Container

Benefits

  • Consistent responsive padding across all pages:
    • Mobile: 16px horizontal padding
    • Tablet (768px+): 32px horizontal padding
    • Desktop (1024px+): 48px horizontal padding
  • Centralized control over layout constraints
  • Default max-width of 1280px for optimal reading experience
  • Easy to switch variants if needed in the future

Notes

  • Header component continues to use its own container implementation, which is appropriate for maintaining full-width background with contained content
  • All pages now use the default Container variant (1280px max-width)
  • The py-8 class is preserved as a custom class on Container for vertical spacing

Related

- Replace custom container styles with Container component
- Update homepage to use Container instead of custom max-w-4xl
- Update create page to use Container instead of generic container class
- Update gist view page to use Container for consistency
- Maintain existing header container implementation (appropriate for full-width background)

This provides consistent spacing and responsive padding across all main pages:
- Mobile: 16px padding
- Tablet: 32px padding
- Desktop: 48px padding

Co-Authored-By: Claude <claude@ghostpaste.dev>
@nullcoder nullcoder merged commit 4a3fd79 into main Jun 7, 2025
1 check was pending
@nullcoder nullcoder deleted the refactor/use-container-component branch June 7, 2025 06:57
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant