Specify Layout with Storybook Parameters

[00:00] Storybook uses parameters to configure the environment around a story. Layouts use a common parameter named layout. Simply define a parameters object with a layout property and the layout we'd like to use. Here, I'll change from the default to full screen. Full screen as a layout makes a lot [00:20] of sense for pages like this where you wanna see the whole page and no additional padding. Storybook's default is padded which we saw before. Let's change that back to full screen and jump over to button. In addition to full screen and padded, there's a third option called centered. Now this [00:40] time I'm gonna apply this just to one story so you can see how these compose. We'll add our parameters object to the story with the property layout centered. This centered layout looks great for atomic components. But because I applied this layout just to [01:00] a single story, any other stories are not going to have that layout. Now you may want to do this intentionally, but if you want all stories inside of a component to share the same layout, simply move those parameters up into the component meta. This ensures that all of these stories inherit this default [01:19] value. This is just one of the ways that you can use parameters inside of Storybook, but all the patterns shown here will apply to most add ons in Storybook config that you encounter.