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