chore: added margins to storys to prevent overflow from preview conta…

…iner (#88)
daisyui · Apr 15, 2022 · ac11a6d · ac11a6d
1 parent 6a69ef4
commit ac11a6d
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 15 deletions.
diff --git a/.storybook/story-layout.js b/.storybook/story-layout.js
@@ -49,10 +49,8 @@ const StoryLayout = ({ children, title, description, source }) => {
                 <div
                   className="preview border-base-300 bg-base-200 rounded-b-box rounded-tr-box
                             flex min-h-[6rem] min-w-[18rem] flex-wrap items-center justify-center gap-2
-                            overflow-x-hidden border bg-cover bg-top p-4"
-                  style={{
-                    backgroundSize: '5px 5px',
-                  }}
+                            overflow-x-hidden overflow-y-hidden border bg-cover bg-top p-4"
+                  style={{ backgroundSize: '5px 5px' }}
                 >
                   {children}
                 </div>

diff --git a/src/Dropdown/Dropdown.stories.tsx b/src/Dropdown/Dropdown.stories.tsx
@@ -15,13 +15,14 @@ export default {
 
 export const Default: Story<DropdownProps> = (args) => {
   return (
-    <Dropdown {...args}>
-      <Dropdown.Toggle>Click</Dropdown.Toggle>
-      <Dropdown.Menu className="w-52">
-        <Dropdown.Item>Item 1</Dropdown.Item>
-        <Dropdown.Item>Item 2</Dropdown.Item>
-        <Dropdown.Item>Item 3</Dropdown.Item>
-      </Dropdown.Menu>
-    </Dropdown>
+    <div className="mb-32">
+      <Dropdown {...args}>
+        <Dropdown.Toggle>Click</Dropdown.Toggle>
+        <Dropdown.Menu className="w-52">
+          <Dropdown.Item>Item 1</Dropdown.Item>
+          <Dropdown.Item>Item 2</Dropdown.Item>
+        </Dropdown.Menu>
+      </Dropdown>
+    </div>
   )
 }
diff --git a/src/Tooltip/Tooltip.stories.tsx b/src/Tooltip/Tooltip.stories.tsx
@@ -11,9 +11,11 @@ export default {
 
 export const Default: Story<TooltipProps> = (args) => {
   return (
-    <Tooltip {...args}>
-      <Button>Hover me</Button>
-    </Tooltip>
+    <div className='my-6'>
+      <Tooltip {...args}>
+        <Button>Hover me</Button>
+      </Tooltip>
+    </div>
   )
 }
 Default.args = {