Lists
Use Lists to style and format ordered and unordered lists.
How to use it
Default
Use Lists to style and format ordered (<ol>
) and unordered (<ul>
) lists.
Nesting
You can nest lists, setting the marker type
for an outline style treatment.
Size
Lists come in small, medium, and large. The default size is medium.
Configuration
- Name9.1.0•View source•View on npm
- Installnpm install @zendeskgarden/react-typography
- Depsnpm install react react-dom styled-components @zendeskgarden/react-theming
- Importimport { OrderedList, UnorderedList } from '@zendeskgarden/react-typography'
API
OrderedList
Extends OlHTMLAttributes<HTMLOListElement>
Prop name | Type | Default | Description |
---|---|---|---|
size | 'small' | 'medium' | 'large' | 'medium' | Adjusts the vertical spacing between list items |
type | 'decimal' | 'decimal-leading-zero' | 'lower-alpha' | 'lower-roman' | 'upper-alpha' | 'upper-roman' | 'decimal' | Sets the marker style |
OrderedList.Item
Extends LiHTMLAttributes<HTMLLIElement>
UnorderedList
Extends HTMLAttributes<HTMLUListElement>
Prop name | Type | Default | Description |
---|---|---|---|
size | 'small' | 'medium' | 'large' | 'medium' | Adjusts the vertical spacing between list items |
type | 'square' | 'circle' | 'disc' | 'disc' | Sets the marker style |
UnorderedList.Item
Extends LiHTMLAttributes<HTMLLIElement>