Skip to content
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

Narrow layout tweaks #98

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Narrow layout tweaks #98

wants to merge 1 commit into from

Conversation

vancura
Copy link
Collaborator

@vancura vancura commented Feb 14, 2025

This PR introduces a new narrow layout based on the request by @mtrunkat in #18. Marek, please try this branch and let me know if it works better for you now.

Detailed changelog:

  • Adjust CodeSwitcher component padding by adding pb-1 to ensure consistent spacing.
  • Update GitHubHeader component to include responsive styles for medium-sized screens with md:mx-auto, md:max-w-3xl, and md:px-0.
  • Modify the anchor positioning in the HeadingLinks component by changing the left offset to -left-6 for better alignment.
  • Reduce the WIDE_SCREEN_WIDTH in the configuration from 1710 to 1664 for improved responsiveness.
  • Apply a maximum width of 3xl and center alignment on medium-sized screens for elements like paragraphs, lists, tables, and blockquotes.
  • Ensure headings (h1, h2, h3, and h4) are also centered with appropriate padding adjustments on medium-sized screens.

Fixes #18

/c @netmilk – can you please try this? There are a couple of highly visible changes.

- Adjust `CodeSwitcher` component padding by adding `pb-1` to ensure consistent spacing.
- Update `GitHubHeader` component to include responsive styles for medium-sized screens with `md:mx-auto`, `md:max-w-3xl`, and `md:px-0`.
- Modify the anchor positioning in the `HeadingLinks` component by changing the left offset to `-left-6` for better alignment.
- Reduce the `WIDE_SCREEN_WIDTH` in the configuration from 1710 to 1664 for improved responsiveness.
- Apply a maximum width of 3xl and center alignment on medium-sized screens for elements like paragraphs, lists, tables, and blockquotes.
- Ensure headings (`h1`, `h2`, `h3`, and `h4`) are also centered with appropriate padding adjustments on medium-sized screens.
@vancura vancura added the enhancement New feature or request label Feb 14, 2025
@vancura vancura requested a review from mtrunkat February 14, 2025 14:31
@vancura vancura self-assigned this Feb 14, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Layout: Adjust the breakpoint behavior
1 participant