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)

  1. Create a new project
  2. Configure basic settings
  3. Invite team members
  4. Set up workflows
  5. Launch and monitor

Roman Numerals

  1. Executive summary
  2. Market analysis
  3. Financial projections
  4. Implementation roadmap

Alphabetical

  1. Appendix A: Technical specifications
  2. Appendix B: User testimonials
  3. 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)

  • SSL/TLS encryption enabled
  • Automatic daily backups
  • 99.9% uptime SLA guarantee
  • 24/7 customer support

Danger (X marks)

  • Deprecated API endpoint
  • Unsupported browser version
  • Missing required permissions

Info (Arrows)

  • Navigate to Settings panel
  • Select Integration options
  • Choose your provider
  • Complete authentication

Warning (Exclamation)

  • Rate limit approaching threshold
  • Certificate expires in 30 days
  • Low disk space warning

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

Inline List

Unstyled List

  • No bullets or numbers
  • Just plain text items
  • Perfect for custom styling
  • Or semantic markup needs

Complex Lists with Avatars

👤
Sarah Johnson
Product Manager
Last active: 2 hours ago
👤
Michael Chen
Lead Developer
Last active: 15 minutes ago
👤
Emily Rodriguez
UX Designer
Last active: 1 day ago

Implementation Guide

Available Classes

Unordered Lists (ul)
  • pa-list-basic - Base unordered list
  • pa-list-basic--compact - Reduced spacing
  • pa-list-basic--spacious - Increased spacing
  • pa-list-basic--unstyled - No bullets, no padding
  • pa-list-basic--inline - Horizontal layout
  • pa-list-basic--bordered - Border between items
  • pa-list-basic--striped - Zebra striping
  • pa-list-basic--icon - Checkmarks (success)
  • pa-list-basic--icon pa-list-basic--danger - X marks
  • pa-list-basic--icon pa-list-basic--info - Arrows
  • pa-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 list
  • pa-list-definition--inline - Horizontal key-value pairs
Complex Lists
  • pa-list - Container for complex list items
  • pa-list__item - Individual list item with avatar/content
  • pa-list__avatar - Avatar/icon container
  • pa-list__content - Content wrapper
  • pa-list__title - Primary text
  • pa-list__subtitle - Secondary text
  • pa-list__meta - Metadata text
Type to search or use /p for products, /o for orders, /u for users, /i for invoices

Settings

👤

John Doe

Administrator