feat: ギャラリーにloading追加

tuqulore · Sep 13, 2021 · 906c124 · 906c124
1 parent 4213a1a
commit 906c124
Showing 1 changed file with 30 additions and 0 deletions.
diff --git a/packages/tailwindcss/stories/LoadingCard.stories.js b/packages/tailwindcss/stories/LoadingCard.stories.js
@@ -0,0 +1,30 @@
+export default {
+  title: "Galleries/LoadingCard",
+};
+
+const Template = () => {
+  return `
+      <div class="card w-96 h-48 flex items-center justify-center mx-auto">
+          <div class="spinner">
+              <svg viewBox="25 25 50 50">
+                  <circle cx="50" cy="50" r="20"></circle>
+              </svg>
+          </div>
+      </div>
+      `;
+};
+export const Default = Template.bind({});
+
+const HeadingTemplate = () => {
+  return `
+      <div class="card w-96 h-48 flex items-center justify-center flex-col mx-auto">
+        <div class="font-bold mb-4">読み込み中です</div>
+          <div class="spinner">
+              <svg viewBox="25 25 50 50">
+                  <circle cx="50" cy="50" r="20"></circle>
+              </svg>
+          </div>
+      </div>
+      `;
+};
+export const Heading = HeadingTemplate.bind({});