Add and integrate controls story

chromaui · Jun 21, 2022 · c58dc1c · c58dc1c
1 parent 99b2158
commit c58dc1c
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 0 deletions.
diff --git a/src/components/Task.stories.js b/src/components/Task.stories.js
@@ -50,3 +50,12 @@ Archived.args = {
     state: "TASK_ARCHIVED",
   },
 };
+const longTitleString = `This task's name is absurdly large. In fact, I think if I keep going I might end up with content overflow. What will happen? The star that represents a pinned task could have text overlapping. The text could cut-off abruptly when it reaches the star. I hope not!`;
+
+export const LongTitle = Template.bind({});
+LongTitle.args = {
+  task: {
+    ...Default.args.task,
+    title: longTitleString,
+  },
+};
diff --git a/src/components/Task.vue b/src/components/Task.vue
@@ -22,6 +22,7 @@
         :id="'title-' + task.id"
         name="title"
         placeholder="Input title"
+        style="text-overflow: ellipsis"
       />
     </label>
     <button