Skip to content

Conversation

@oscarcarlstrom
Copy link
Contributor

@oscarcarlstrom oscarcarlstrom commented Jan 7, 2026

Layout documentation page

This PR adds a new documentation page for the layout utilities in Grunnmuren, along with some improvements to the underlying CSS utilities.

Documentation (apps/docs)

  • New /profil/layout page documenting:
    • Container - The container utility for centering content with a max-width and page padding
    • Grid - The 14-column grid system (layout-grid, layout-grid-container, layout-subgrid-*)
    • Spacing - Responsive gap utilities (layout-gap-x, layout-gap-y, layout-grid-gap-x)
  • Added anchor links for easy navigation between sections
  • Added layout link to the main navigation

Tailwind utilities (packages/tailwind)

  • layout-grid-container: Improved to allow overriding col-start, col-end, and col-span values. Previously, all children were forced to col-start-2 col-span-12, making customization impossible.
  • Added missing subgrid utilities: layout-subgrid-13, layout-subgrid-14, and layout-subgrid-full

Storybook

  • Added OverridedColSpans story demonstrating column span overrides
  • Fixed GridContainerWithSubGrids story to use correct column spans

@changeset-bot
Copy link

changeset-bot bot commented Jan 7, 2026

⚠️ No Changeset found

Latest commit: a71bdc3

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@oscarcarlstrom oscarcarlstrom changed the title WIP docs Layout docs Jan 9, 2026
@oscarcarlstrom oscarcarlstrom marked this pull request as ready for review January 9, 2026 14:08
@oscarcarlstrom oscarcarlstrom requested a review from a team as a code owner January 9, 2026 14:08
Comment on lines +125 to +140
&
> *:not([class^="col-span-"]):not([class^="col-end-"]):not(
[class*=" col-span-"]
):not([class*=" col-end-"]):not([class*=" sm:col-span-"]):not(
[class*=" sm:col-end-"]
):not([class^="sm:col-span-"]):not([class^="sm:col-end-"]) {
@apply sm:col-span-12;
}

&
> *:not([class^="col-start-"]):not([class^="col-span-full"]):not(
[class*=" col-start-"]
):not([class*=" col-span-full"]):not([class*=" sm:col-start-"]):not(
[class*=" sm:col-span-full"]
):not([class^="sm:col-start-"]):not([class^="sm:col-span-full"]) {
@apply sm:col-start-2;
Copy link
Collaborator

Choose a reason for hiding this comment

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

denne ble jo helt monster 😅

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Eeeh jepp 😅

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.

3 participants