fixup! Feat(web): Add spacing property to Grid #DS-1388

lmc-eu · Jul 25, 2024 · d3d6294 · d3d6294
1 parent 679b5a7
commit d3d6294
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 8 deletions.
diff --git a/packages/web/src/scss/components/Grid/README.md b/packages/web/src/scss/components/Grid/README.md
@@ -80,12 +80,12 @@ the consistency between the spacing and the design tokens.
 
 If you need to set custom spacing from a specific breakpoint, use the `--grid-spacing-y-{breakpoint}` or the `--grid-spacing-x-{breakpoint}` property,
 e.g. `--grid-spacing-y-tablet: var(--spirit-space-800)`. The breakpoint value must be one of the breakpoint tokens
-except for the `mobile` breakpoint you don't need the suffix at all. The spacing is set to all larger breakpoints
+except for the `mobile` breakpoint where you don't need the suffix at all. The spacing is set to all larger breakpoints
 automatically if you don't set them explicitly. E.g. if you set only `--grid-spacing-y-tablet: var(--spirit-space-800)`
 the spacing will be set to `var(--spirit-space-800)` for `tablet` and `desktop` breakpoints while on the `mobile`
 breakpoint the default spacing will be used.
 
-Custom spacing from tablet up:
+Custom vertical spacing from tablet up:
 
 ```html
 <div class="Grid Grid--cols-2 Grid--tablet--cols-3" style="--grid-spacing-y-tablet: var(--spirit-space-1200)">

diff --git a/packages/web/src/scss/components/Grid/index.html b/packages/web/src/scss/components/Grid/index.html
@@ -244,9 +244,9 @@ <h2 class="docs-Heading">Nested Grid with Grid Item</h2>
             <div
               class="GridItem"
               style="
-              --grid-item-column-start: 1;
-              --grid-item-column-end: span 4;
-            "
+                --grid-item-column-start: 1;
+                --grid-item-column-end: span 4;
+              "
             >
               <div class="docs-Box docs-Box--small">
                 First Nested Content
@@ -255,9 +255,9 @@ <h2 class="docs-Heading">Nested Grid with Grid Item</h2>
             <div
               class="GridItem"
               style="
-              --grid-item-column-start: 6;
-              --grid-item-column-end: span 5;
-            "
+                --grid-item-column-start: 6;
+                --grid-item-column-end: span 5;
+              "
             >
               <div class="docs-Box docs-Box--small">
                 Second Nested Content