Merge pull request #1743 from dusk-network/feature-1742

explorer: Fix loading state padding
dusk-network · May 15, 2024 · ccab20d · ccab20d
2 parents 0672d65 + 15d5e24
commit ccab20d
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 2 deletions.
diff --git a/explorer/src/lib/components/__tests__/__snapshots__/DataCard.spec.js.snap b/explorer/src/lib/components/__tests__/__snapshots__/DataCard.spec.js.snap
@@ -169,7 +169,9 @@ exports[`DataCard > should render the \`DataCard\` in the loading state 1`] = `
     <!--&lt;Button&gt;-->
   </header>
    
-  <p>
+  <p
+    class="data-card__loading-notice"
+  >
     Loading...
   </p>
   

diff --git a/explorer/src/lib/components/data-card/DataCard.css b/explorer/src/lib/components/data-card/DataCard.css
@@ -2,6 +2,10 @@
   padding: 1rem 0;
 }
 
+.data-card__loading-notice {
+  padding: 0 1.125rem;
+}
+
 .data-card__header {
   display: flex;
   justify-content: space-between;

diff --git a/explorer/src/lib/components/data-card/DataCard.svelte b/explorer/src/lib/components/data-card/DataCard.svelte
@@ -41,7 +41,7 @@
     />
   </header>
   {#if loading && data === null}
-    <p>Loading...</p>
+    <p class="data-card__loading-notice">Loading...</p>
   {:else if error || hasEmptyData}
     <DataAlert on:retry {error} />
   {:else if data}