Styled lists for content organization - from basic bullets to icon lists and definition lists.
Basic Unordered Lists
Default Spacing
- Dashboard with real-time metrics
- User management and permissions
- Advanced reporting tools
- API integration capabilities
- Multi-language support
Compact Spacing
- Reduced vertical spacing
- Perfect for dense content
- Saves vertical space
- Easy to scan quickly
Spacious Layout
- More breathing room between items
- Better for longer content blocks
- Improved readability
Ordered Lists
Numeric (Default)
- Create a new project
- Configure basic settings
- Invite team members
- Set up workflows
- Launch and monitor
Roman Numerals
- Executive summary
- Market analysis
- Financial projections
- Implementation roadmap
Alphabetical
- Appendix A: Technical specifications
- Appendix B: User testimonials
- Appendix C: Pricing structure
Definition Lists
Standard Layout
- API Key
- A unique identifier used to authenticate requests to the API
- Webhook
- HTTP callbacks that send real-time data to your application when events occur
- OAuth 2.0
- Industry-standard protocol for authorization allowing third-party access
Inline Layout
- Status
- Active
- Created
- 2025-01-15
- Modified
- 2025-10-05
- Author
- John Doe
Icon Lists
Success (Checkmarks)
Danger (X marks)
Info (Arrows)
Warning (Exclamation)
Bordered & Striped Lists
Bordered List
- User Management Module
- Content Management System
- Analytics Dashboard
- Email Campaign Tools
- Reporting Engine
Striped List
- Monthly subscription: $99/month
- Annual subscription: $990/year (2 months free)
- Enterprise plan: Custom pricing
- Educational discount: 50% off
Inline & Unstyled Lists
Complex Lists with Avatars
👤
Sarah Johnson
Product Manager
👤
Michael Chen
Lead Developer
👤
Emily Rodriguez
UX Designer
Implementation Guide
Available Classes
Unordered Lists (ul)
pa-list-basic
- Base unordered listpa-list-basic--compact
- Reduced spacingpa-list-basic--spacious
- Increased spacingpa-list-basic--unstyled
- No bullets, no paddingpa-list-basic--inline
- Horizontal layoutpa-list-basic--bordered
- Border between itemspa-list-basic--striped
- Zebra stripingpa-list-basic--icon
- Checkmarks (success)pa-list-basic--icon pa-list-basic--danger
- X markspa-list-basic--icon pa-list-basic--info
- Arrowspa-list-basic--icon pa-list-basic--warning
- Exclamation marks
Ordered Lists (ol)
pa-list-ordered
- Base ordered list (numeric)pa-list-ordered--roman
- Roman numerals (I, II, III)pa-list-ordered--alpha
- Lowercase letters (a, b, c)
Definition Lists (dl)
pa-list-definition
- Standard definition listpa-list-definition--inline
- Horizontal key-value pairs
Complex Lists
pa-list
- Container for complex list itemspa-list__item
- Individual list item with avatar/contentpa-list__avatar
- Avatar/icon containerpa-list__content
- Content wrapperpa-list__title
- Primary textpa-list__subtitle
- Secondary textpa-list__meta
- Metadata text