feat: ギャラリーにチャットを追加

tuqulore · Sep 13, 2021 · 4213a1a · 4213a1a
1 parent 4fd4b61
commit 4213a1a
Showing 1 changed file with 30 additions and 0 deletions.
diff --git a/packages/tailwindcss/stories/Chat.stories.js b/packages/tailwindcss/stories/Chat.stories.js
@@ -0,0 +1,30 @@
+export default {
+  title: "Galleries/Chat",
+};
+
+const avatarImage = require("./assets/avatar_photo.jpg");
+
+const Template = () => {
+  return `
+    <div class="container max-w-2xl">
+        <div class="mb-4 flex">
+            <div class="avatar flex-shrink-0 mr-4">
+                <a href="#">
+                    <img src="${avatarImage}" alt="城田 亜利沙" />
+                </a>
+            </div>
+            <div>
+                <div class="flex items-center mb-2">
+                    <div class="font-bold mr-4"><a href="#">城田 亜利沙</a></div>
+                    <div class="text-xs">9:15</div>
+                </div>
+                <div class="balloon">
+                あっという間の時間でしたが困難の多かった東京オリンピックの一番最後の式典で選手の方々、関係者の方々の労をねぎらう役目を頂けて光栄でした
+                </div>
+            </div>
+        </div>
+    </div>
+    `;
+};
+
+export const Default = Template.bind({});