Divider
Use as a separator between content.
import '@vonage/vivid/divider';
or, if you need to use a unique prefix:
import { registerDivider } from '@vonage/vivid';
registerDivider('your-prefix');
<!-- Feel free to edit the code below. The live preview will update as you make changes. --> <script type="module"> import { registerDivider } from 'vivid-bundle'; registerDivider('your-prefix'); </script> <your-prefix-divider></your-prefix-text-divider>
<script setup lang="ts">
import { VDivider } from '@vonage/vivid-vue';
</script>
<template>
<VDivider />
</template>
The role
attribute to express the semantic value of the divider. If it is being use purely for decorative purposes, set it to presentation
.
See the Decorative Divider use case.
<!-- Feel free to edit the code below. The live preview will update as you make changes. --> <vwc-divider role="presentation"></vwc-divider>
Name | Type | Description |
---|---|---|
orientation | horizontal (default), vertical |
Controls the orientation |
role | separator (default), presentation |
Controls the semantic role |