From 6825bb8f4ee9c87b83880bd70e5d9b59dcadef17 Mon Sep 17 00:00:00 2001
From: Katie Langerman <18661030+langermank@users.noreply.github.com>
Date: Thu, 18 Apr 2024 09:05:37 -0700
Subject: [PATCH] Fix note syntax in migration guide (#760)
* fix note syntax
* cleanup
---
content/foundations/primitives/migrating.mdx | 12 ++++++------
1 file changed, 6 insertions(+), 6 deletions(-)
diff --git a/content/foundations/primitives/migrating.mdx b/content/foundations/primitives/migrating.mdx
index 46cf87775..74a357a9e 100644
--- a/content/foundations/primitives/migrating.mdx
+++ b/content/foundations/primitives/migrating.mdx
@@ -36,7 +36,7 @@ Use these values for the internal `padding` (including `p`, `px`, `py`, `pr`, et
##### Stack margin
- Prefer not using `margin` since it leaks space outside of components. Try to convert margins to container `padding` and/or flex layout `gap`.
+ Prefer not using margin since it leaks space outside of components. Try to convert margins to container padding and/or flex layout gap.
See padding values above; there are no `margin` primitives.
@@ -66,7 +66,7 @@ This is typically the CSS `gap` in `flex` (with `flex-direction: column`) or `gr
[Control stacks](https://primer.style/foundations/primitives/size#controls) are horizontal (inline) rows containing inline interactive items next to each other. For example, a set of buttons or labels. These are usually `display: flex` or `inline-flex` with `flex-direction: row`.
- The size of the control stack depends on the size of the controls inside of it. For example, a stack containing a small
icon button is a 'small' stack.
+ The size of the control stack depends on the size of the controls inside of it. For example, a stack containing a 'small' icon button is a 'small' stack.
##### Control stack padding / margin
@@ -224,7 +224,7 @@ These are typically used for breakpoints, heights and widths.
- CSS variables cannot be used in `@media` or `@container` query expressions. The plain pixel value must be used instead. Stay tuned for future media query support.
+ CSS variables cannot be used in '@media' or '@container' query expressions. The plain pixel value must be used instead. Stay tuned for future media query support.
`sx` breakpoint keyword | `sx` size keyword | resolved value | primitive
@@ -262,9 +262,9 @@ For values that have no replacement listed, use the raw value or find a replacem
| $font-weight-semibold | `--base-text-weight-medium` |
| $font-weight-normal | `--base-text-weight-normal` |
| $font-weight-light | `--base-text-weight-light` |
-| $lh-condensed-ultra | 1` |
-| $lh-condensed | 1.25` |
-| $lh-default | 1.5` |
+| $lh-condensed-ultra | 1 |
+| $lh-condensed | 1.25 |
+| $lh-default | 1.5 |
| $body-font | `--fontStack-system` |
| $mono-font | `--fontStack-monospace` |
| $body-font-size | `--text-body-size-medium` |