SDivider <s-divider>

import { SDivider } from 'polaris-vue-elements'

Example

Content above the divider.Content below the divider.A stronger divider variant.

<script setup>
import { SDivider, SParagraph } from 'polaris-vue-elements'
</script>

<template>
  <SParagraph>Content above the divider.</SParagraph>
  <SDivider />
  <SParagraph>Content below the divider.</SParagraph>
  <SDivider color="strong" />
  <SParagraph color="subdued">A stronger divider variant.</SParagraph>
</template>

Props

Prop	Type	Description
color	"base" | "strong"	The visual prominence of the divider line. - base: Standard divider for most separations (default) - strong: More prominent divider for major section breaks
direction	"block" | "inline"	The orientation of the divider line, using logical properties. - inline: Horizontal divider for separating vertically stacked content - block: Vertical divider for separating horizontally arranged content