Docs(web-react): Switch Avatar demo spacings to v3 design token value…

…s #DS-1450
lmc-eu · Aug 29, 2024 · 21fbbd0 · 21fbbd0
1 parent 94db076
commit 21fbbd0
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 6 deletions.
diff --git a/packages/web-react/src/components/UNSTABLE_Avatar/demo/AvatarIcon.tsx b/packages/web-react/src/components/UNSTABLE_Avatar/demo/AvatarIcon.tsx
@@ -5,14 +5,14 @@ import { UNSTABLE_Avatar } from '../UNSTABLE_Avatar';
 
 const AvatarIcon = () => (
   <>
-    <div className="d-flex" style={{ gap: 'var(--spirit-space-400)' }}>
+    <div className="d-flex" style={{ gap: 'var(--spirit-space-500)' }}>
       {DEMO_SIZES.map(({ size, boxSize }) => (
         <UNSTABLE_Avatar key={`${size}`} elementType="a" href="#" size={size} aria-label="Profile of Jiří Bárta">
           <Icon name="profile" boxSize={boxSize} />
         </UNSTABLE_Avatar>
       ))}
     </div>
-    <div className="d-flex" style={{ gap: 'var(--spirit-space-400)' }}>
+    <div className="d-flex" style={{ gap: 'var(--spirit-space-500)' }}>
       {DEMO_SIZES.map(({ size, boxSize }) => (
         <UNSTABLE_Avatar
           key={`${size}`}

diff --git a/packages/web-react/src/components/UNSTABLE_Avatar/demo/AvatarImage.tsx b/packages/web-react/src/components/UNSTABLE_Avatar/demo/AvatarImage.tsx
@@ -4,14 +4,14 @@ import UNSTABLE_Avatar from '../UNSTABLE_Avatar';
 
 const AvatarImage = () => (
   <>
-    <div className="d-flex" style={{ gap: 'var(--spirit-space-400)' }}>
+    <div className="d-flex" style={{ gap: 'var(--spirit-space-500)' }}>
       {DEMO_SIZES.map(({ size }) => (
         <UNSTABLE_Avatar key={`${size}`} elementType="a" href="#" size={size} aria-label="Profile of Jiří Bárta">
           <img src="https://picsum.photos/id/823/162/162" alt="Jiří Bárta" aria-hidden="true" />
         </UNSTABLE_Avatar>
       ))}
     </div>
-    <div className="d-flex" style={{ gap: 'var(--spirit-space-400)' }}>
+    <div className="d-flex" style={{ gap: 'var(--spirit-space-500)' }}>
       {DEMO_SIZES.map(({ size }) => (
         <UNSTABLE_Avatar
           key={`${size}`}

diff --git a/packages/web-react/src/components/UNSTABLE_Avatar/demo/AvatarText.tsx b/packages/web-react/src/components/UNSTABLE_Avatar/demo/AvatarText.tsx
@@ -4,14 +4,14 @@ import { UNSTABLE_Avatar } from '../UNSTABLE_Avatar';
 
 const AvatarText = () => (
   <>
-    <div className="d-flex" style={{ gap: 'var(--spirit-space-400)' }}>
+    <div className="d-flex" style={{ gap: 'var(--spirit-space-500)' }}>
       {DEMO_SIZES.map(({ size }) => (
         <UNSTABLE_Avatar key={`${size}`} elementType="a" href="#" size={size} aria-label="Profile of Jiří Bárta">
           <span aria-hidden="true">JB</span>
         </UNSTABLE_Avatar>
       ))}
     </div>
-    <div className="d-flex" style={{ gap: 'var(--spirit-space-400)' }}>
+    <div className="d-flex" style={{ gap: 'var(--spirit-space-500)' }}>
       {DEMO_SIZES.map(({ size }) => (
         <UNSTABLE_Avatar
           key={`${size}`}