fixup! Refactor(web): Update UNSTABLE_EmptyState according to design …

…#DS-1311
lmc-eu · Jun 21, 2024 · 83a6769 · 83a6769
1 parent 73ad68f
commit 83a6769
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 6 deletions.
diff --git a/packages/web/src/scss/components/UNSTABLE_EmptyState/_UNSTABLE_EmptyState.scss b/packages/web/src/scss/components/UNSTABLE_EmptyState/_UNSTABLE_EmptyState.scss
@@ -18,5 +18,6 @@
     display: flex;
     flex-direction: column;
     align-items: center;
+    width: 100%;
     max-width: 400px;
 }
diff --git a/packages/web/src/scss/components/UNSTABLE_EmptyState/index.html b/packages/web/src/scss/components/UNSTABLE_EmptyState/index.html
@@ -14,9 +14,11 @@ <h2 class="docs-Heading">Default</h2>
         <h2 class="typography-heading-xsmall-text">Headline</h2>
         <p class="typography-body-medium-text-regular">In publishing and graphic design, lorem ipsum is common placeholder text used to demonstrate the graphic elements</p>
       </div>
-      <div class="UNSTABLE_ActionLayout">
-        <a class="Button Button--primary Button--medium" href="#">Action</a>
-        <a class="Button Button--secondary Button--medium" href="#">Action</a>
+      <div class="Stack UNSTABLE_EmptyState__section">
+        <div class="UNSTABLE_ActionLayout">
+          <a class="Button Button--primary Button--medium" href="#">Action</a>
+          <a class="Button Button--secondary Button--medium" href="#">Action</a>
+        </div>
       </div>
       <div class="Stack UNSTABLE_EmptyState__section">
         <a href="#" class="link-primary">Link to something</a>
@@ -35,9 +37,11 @@ <h2 class="typography-heading-xsmall-text">Headline</h2>
         <h2 class="typography-heading-xsmall-text">Headline</h2>
         <p class="typography-body-medium-text-regular">In publishing and graphic design, lorem ipsum is common placeholder text used to demonstrate the graphic elements</p>
       </div>
-      <div class="UNSTABLE_ActionLayout">
-        <a class="Button Button--primary Button--medium" href="#">Action</a>
-        <a class="Button Button--secondary Button--medium" href="#">Action</a>
+      <div class="Stack UNSTABLE_EmptyState__section">
+        <div class="UNSTABLE_ActionLayout">
+          <a class="Button Button--primary Button--medium" href="#">Action</a>
+          <a class="Button Button--secondary Button--medium" href="#">Action</a>
+        </div>
       </div>
     </div>