fix(docs): show headings and icons in post cards (#2022)

swisspost · Oct 2, 2023 · 966f2eb · 966f2eb
1 parent d487840
commit 966f2eb
Show file tree

Hide file tree

Showing 6 changed files with 14 additions and 14 deletions.
diff --git a/packages/documentation/cypress/snapshots/components/card.snapshot.ts b/packages/documentation/cypress/snapshots/components/card.snapshot.ts
@@ -1,7 +1,7 @@
 describe('Card', () => {
   it('default', () => {
     cy.visit('/iframe.html?id=snapshots--card');
-    cy.get('.card', { timeout: 30000 }).should('be.visible');
+    cy.get('.card post-icon', { timeout: 30000 }).should('be.visible');
     cy.percySnapshot('Cards', { widths: [1440] });
   });
 });
diff --git a/packages/documentation/src/stories/components/alert/alert.snapshot.stories.ts b/packages/documentation/src/stories/components/alert/alert.snapshot.stories.ts
@@ -36,7 +36,7 @@ export const Alert: Story = {
           : null}
                     ${args.icon !== 'null'
                       ? html`
-                        <post-icon aria-hidden="true" class="alert-icon" name=${args.icon}/>
+                        <post-icon aria-hidden="true" class="alert-icon" name=${args.icon}></post-icon>
                       `
                       : null}
                     ${args.action

diff --git a/packages/documentation/src/stories/components/button/button.stories.ts b/packages/documentation/src/stories/components/button/button.stories.ts
@@ -221,7 +221,7 @@ const Template = {
       `;
     } else {
       const icon = html`
-        <post-icon aria-hidden="true" name=${args.icon}/>
+        <post-icon aria-hidden="true" name=${args.icon}></post-icon>
       `;
       const iconOnlyContent = html`
         <span class="visually-hidden">${args.text}</span>

diff --git a/packages/documentation/src/stories/components/card/card.stories.ts b/packages/documentation/src/stories/components/card/card.stories.ts
@@ -354,10 +354,10 @@ export const CustomContent: Story = {
     showHeader: true,
     showFooter: true,
     customHeader: `<div class="card-header d-flex">
-  <post-icon aria-hidden="true" class="fs-small-huge" name="3217"/>
+  <post-icon aria-hidden="true" class="fs-small-huge" name="3217"></post-icon>
   <h3 class="fw-bold mb-0 me-auto">Detaloj de la Uzanto</h3>
   <a href="#" aria-labelledby="detaloj-title">
-    <post-icon aria-hidden="true" class="fs-large" name="3020"/>
+    <post-icon aria-hidden="true" class="fs-large" name="3020"></post-icon>
     <span class="visually-hidden">Administrado de kontoj</span>
   </a>
 </div>`,
@@ -367,14 +367,14 @@ export const CustomContent: Story = {
       Mr<br>Pronomo Familinomo<br>Strato 1<br>1234 Urbo
     </address>
     <a href="#">
-      <post-icon aria-label="Redaktu adreson" class="fs-large" name="3193"/>
+      <post-icon aria-label="Redaktu adreson" class="fs-large" name="3193"></post-icon>
       <span class="visually-hidden">Redaktu adreson</span>
     </a>
   </li>
   <li class="list-group-item d-flex align-items-center justify-content-between">
     <p class="mb-0">Lingvo: <span class="fw-bold">Germana</span></p>
     <a href="#">
-      <post-icon aria-label="Redakti lingvon" class="fs-large" name="3193"/>
+      <post-icon aria-label="Redakti lingvon" class="fs-large" name="3193"></post-icon>
       <span class="visually-hidden">Redakti lingvon</span>
     </a>
   </li>

diff --git a/packages/documentation/src/stories/components/table/table.stories.ts b/packages/documentation/src/stories/components/table/table.stories.ts
@@ -181,11 +181,11 @@ export const TableWithButtons: Story = {
         <td>
           <button class="btn btn-secondary btn-icon btn-md">
             <span class="visually-hidden">Edit</span>
-            <post-icon aria-hidden="true" name="2012"/>
+            <post-icon aria-hidden="true" name="2012"></post-icon>
           </button>
           <button class="btn btn-primary btn-icon btn-md ms-2">
             <span class="visually-hidden">Edit</span>
-            <post-icon aria-hidden="true" name="3193"/>
+            <post-icon aria-hidden="true" name="3193"></post-icon>
           </button>
         </td>
       </tr>
@@ -196,11 +196,11 @@ export const TableWithButtons: Story = {
         <td>
           <button class="btn btn-secondary btn-icon btn-md">
             <span class="visually-hidden">Edit</span>
-            <post-icon aria-hidden="true" name="2012"/>
+            <post-icon aria-hidden="true" name="2012"></post-icon>
           </button>
           <button class="btn btn-primary btn-icon btn-md ms-2">
             <span class="visually-hidden">Edit</span>
-            <post-icon aria-hidden="true" name="3193"/>
+            <post-icon aria-hidden="true" name="3193"></post-icon>
           </button>
         </td>
       </tr>
@@ -211,11 +211,11 @@ export const TableWithButtons: Story = {
         <td>
           <button class="btn btn-secondary btn-icon btn-md">
             <span class="visually-hidden">Edit</span>
-            <post-icon aria-hidden="true" name="2012"/>
+            <post-icon aria-hidden="true" name="2012"></post-icon>
           </button>
           <button class="btn btn-primary btn-icon btn-md ms-2">
             <span class="visually-hidden">Edit</span>
-            <post-icon aria-hidden="true" name="3193"/>
+            <post-icon aria-hidden="true" name="3193"></post-icon>
           </button>
         </td>
       </tr>

diff --git a/packages/documentation/src/stories/components/toast/toast.stories.ts b/packages/documentation/src/stories/components/toast/toast.stories.ts
@@ -370,7 +370,7 @@ function render(args: Args, context: StoryContext) {
   const toastIcon =
     !args.noIcon && args.icon !== 'null'
       ? html`
-        <post-icon aria-hidden="true" name=${args.icon}/>
+        <post-icon aria-hidden="true" name=${args.icon}></post-icon>
       `
       : null;