Skip to content

Document grid system without storybook#847

Open
choldgraf wants to merge 1 commit into
jupyter-book:mainfrom
choldgraf:doc/grid-system
Open

Document grid system without storybook#847
choldgraf wants to merge 1 commit into
jupyter-book:mainfrom
choldgraf:doc/grid-system

Conversation

@choldgraf
Copy link
Copy Markdown
Contributor

@choldgraf choldgraf commented Apr 2, 2026

This adds a layout.md page to our reference documentation that (I think) uses all of the CSS classes that we demo in the grid system on storybook. It basically just puts them all in divs so you can see how they look, with a little bit of styling to make them look nice.

Demo here


@changeset-bot
Copy link
Copy Markdown

changeset-bot Bot commented Apr 2, 2026

⚠️ No Changeset found

Latest commit: 6bd1116

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

@netlify
Copy link
Copy Markdown

netlify Bot commented Apr 2, 2026

Deploy Preview for myst-theme ready!

Name Link
🔨 Latest commit 6bd1116
🔍 Latest deploy log https://app.netlify.com/projects/myst-theme/deploys/69ceffa53de4370007de0427
😎 Deploy Preview https://deploy-preview-847--myst-theme.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@choldgraf choldgraf added the documentation Improvements or additions to documentation label Apr 2, 2026
Comment thread docs/reference/layout.md
We intentionally leave the primary and secondary sidebars visible so that you can see how they relate to one another in size, but normally you'd remove one or the other if you wanted to use many of these classes.

## `article-grid`

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

It is possible that we might need a:

+++ {"class": "col-screen"}

Here?

I am suspect that the screen does not extend to the edges, when it should ...

Image

Comment thread docs/reference/layout.md

:::::

## `article-left-grid`
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

I am not sure if this is going to work on the same page (or at all .. ) unless we wrap with a "article-left-grid".

The grid is set on the page at the moment.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

documentation Improvements or additions to documentation

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Port the grid system storybook page to MyST Theme docs

2 participants