Merge pull request #1125 from PrefectHQ/fix/p-divider-not-always-stre…

…tching Fix p-divider sometimes has 0 width.
PrefectHQ · Feb 27, 2024 · cadb3d2 · cadb3d2
2 parents 7303dae + 9a8e830
commit cadb3d2
Showing 1 changed file with 10 additions and 3 deletions.
diff --git a/src/components/Divider/PDivider.vue b/src/components/Divider/PDivider.vue
@@ -1,18 +1,25 @@
 <template>
-  <div class="flex items-center gap-x-2">
-    <hr class="p-divider">
+  <div class="p-divider">
+    <hr class="p-divider__line">
 
     <template v-if="$slots.default">
       <div class="p-divider__text">
         <slot />
       </div>
-      <hr class="p-divider">
+      <hr class="p-divider__line">
     </template>
   </div>
 </template>
 
 <style>
   .p-divider { @apply
+    flex
+    items-center
+    gap-x-2
+    w-full
+  }
+
+  .p-divider__line { @apply
     border-none
     h-[1px]
     bg-divider