fixup! Feat(web): Introduce Skeleton component #DS-1625

lmc-eu · Jan 23, 2025 · e3d509c · e3d509c
1 parent c76f0f8
commit e3d509c
Showing 1 changed file with 12 additions and 13 deletions.
diff --git a/packages/web/src/scss/components/Skeleton/README.md b/packages/web/src/scss/components/Skeleton/README.md
@@ -14,20 +14,20 @@ The `Skeleton--text` class is used to create a text skeleton.
 </div>
 ```
 
-## Headline
+## Heading
 
-The `Skeleton--headline` class is used to create a headline skeleton.
+The `Skeleton--heading` class is used to create a heading skeleton.
 
 ```html
-<div class="Skeleton Skeleton--headline" aria-busy="true" aria-live="polite">
+<div class="Skeleton Skeleton--heading" aria-busy="true" aria-live="polite">
   <div class="Skeleton__item Skeleton__item--text Skeleton__item--small" aria-hidden="true"></div>
   <div class="Skeleton__item Skeleton__item--text Skeleton__item--small" aria-hidden="true"></div>
 </div>
 ```
 
-### Text, Headline Sizes
+### Text, Heading Sizes
 
-The Skeleton component supports the following sizes for text and headline skeletons:
+The Skeleton component supports the following sizes for text and heading skeletons:
 
 - `Skeleton__item--xsmall`
 - `Skeleton__item--small`
@@ -45,11 +45,11 @@ Use CSS custom properties to define the width, height, and radius of the shape.
 
 - The default radius is `--spirit-radius-300`
 
-```html
---spirit-skeleton-shape-width: number{px}; --spirit-skeleton-shape-height: number{px}; --spirit-skeleton-shape-radius:
-var(--spirit-radius-200); --spirit-skeleton-shape-tablet-radius: var(--spirit-radius-300);
---spirit-skeleton-shape-desktop-radius: var(--spirit-radius-400);
-```
+- `--spirit-skeleton-shape-width: number{px};`
+- `--spirit-skeleton-shape-height: number{px};`
+- `--spirit-skeleton-shape-radius:var(--spirit-radius-200);`
+- `--spirit-skeleton-shape-tablet-radius: var(--spirit-radius-300);`
+- `--spirit-skeleton-shape-desktop-radius: var(--spirit-radius-400);`
 
 ```html
 <div class="Skeleton Skeleton--shape" aria-busy="true" aria-live="polite">
@@ -64,9 +64,8 @@ var(--spirit-radius-200); --spirit-skeleton-shape-tablet-radius: var(--spirit-ra
 
 - For circle there is class `Skeleton__item--circle`
 
-```html
---spirit-skeleton-shape-width: number{px}; --spirit-skeleton-shape-height: number{px};
-```
+- `--spirit-skeleton-shape-width: number{px};`
+- `--spirit-skeleton-shape-height: number{px};`
 
 ```html
 <div class="Skeleton Skeleton--shape" aria-busy="true" aria-live="polite">