diff --git a/src/components/alert.stories.tsx b/src/components/alert.stories.tsx
index e02feba..2ff3953 100644
--- a/src/components/alert.stories.tsx
+++ b/src/components/alert.stories.tsx
@@ -27,9 +27,9 @@ export const All: Story = {
   render: () => (
     <StoryPage>
       <StoryPageHeader title="Alert" />
-      <StorySection title="Overview">
+      <StorySection title="Variants">
         <StateBoard
-          min={320}
+          min={360}
           states={[
             {
               id: "default",
@@ -42,13 +42,6 @@ export const All: Story = {
                 </Alert>
               ),
             },
-          ]}
-        />
-      </StorySection>
-      <StorySection title="Variants">
-        <StateBoard
-          min={320}
-          states={[
             {
               id: "destructive",
               label: "Destructive",
@@ -65,7 +58,7 @@ export const All: Story = {
       </StorySection>
       <StorySection title="Usage">
         <StateBoard
-          min={320}
+          min={360}
           states={[
             {
               id: "no-icon",
diff --git a/src/components/sonner.stories.tsx b/src/components/sonner.stories.tsx
index 8dd3396..0ffe972 100644
--- a/src/components/sonner.stories.tsx
+++ b/src/components/sonner.stories.tsx
@@ -22,7 +22,7 @@ function Trigger({ onClick, children }: { onClick: () => void; children: ReactNo
 function Board({ ids }: { ids: string[] }) {
   return (
     <StateBoard
-      min={220}
+      min={360}
       states={[
         {
           id: "types",