Mirakl Design
Mirakl Design
  • Getting started
    • Welcome to Roma
      • Design principles
  • Design
    • Components
      • Actions
        • Action menu
        • Buttons
        • Button group
        • File download
        • Save bar
        • Tasklist
        • Contextual Toolbar
      • Datalist
      • Datatable
      • Feedback
        • Alerts
        • Activity Loader
        • Badge (status)
        • Empty state
        • Snackbar
      • Form
        • Fields
        • Pickers
        • Selection controls
        • Tree
      • Images
        • Illustrations
        • Icons
        • Media
      • Navigation
        • Hyperlink
        • Page title
        • Sidebar
        • Top bar
      • Overlays
        • Modal
        • Popover
        • Tooltip
        • Side Drawer
      • Structure
        • Global layout
        • Panel
          • Activable Panel
          • Clickable Panel
          • Expandable Panel
          • Panel tabs
          • Totalizer Panel
        • Card
    • Patterns
      • Advanced selection
      • Configure options
      • Displaying data
      • Displaying history
      • Errors
      • Forms
        • Form - Creation mode
        • Form - Edition mode
        • Form - In a modal
        • Error Management
        • Stepper form
        • Onboarding form
      • Loading
      • Progressive disclosure
  • content
    • Writing for Mirakl
      • Grammar and formatting
    • Vocabulary
      • Mirakl products
      • Which verb to use
Powered by GitBook
On this page
  • Overview
  • Guidelines
  • Content

Was this helpful?

  1. Design
  2. Components
  3. Structure
  4. Panel

Activable Panel

A Panel variant with dynamic display control to bring flexibility in the interface.

Last updated 1 year ago

Was this helpful?

Overview

Activable Panels are dynamic component used to display or hide elements based on user interactions.

Each panel includes a title and a mandatory switch button (with an attached label), allowing users to easily control what they see.

Guidelines

  1. Toggling On Displays Content: When the switch is activated, additional content or features become visible.

  2. Toggling On Hides Content: When the switch is activated, certain content or features are hidden to simplify the view.

Content

  • Clarity is Key: Ensure that the label on the Switch Button is exceptionally clear. Users should understand exactly what will happen when they toggle the switch—whether it will reveal or hide information.

Learn more about how to use Activable Panel in Pattern.

Configure Options