Usage

HTML

<div class="l-stack">
  <div class="theme container">
    <h2>This is a stacked element</h2>
  </div>
  <div class="theme container">
    <h2>This is a stacked element</h2>
  </div>
  <div class="theme container">
    <h2>This is a stacked element</h2>
  </div>
  <div class="theme container">
    <h2>This is a stacked element</h2>
  </div>
</div>

SCSS

//https://every-layout.dev/layouts/stack/
.l-stack {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: var(--st-gap, var(--vertical-rhythm));
}

Use this layout pattern to create consistent vertical spacing between elements.