Soracom

Design System
  1. Home
  2. Design system
  3. Containers
  4. Controls

Controls

A control is a generic container that contains a set of page controls such as buttons and selects.

Overview

ds-controls is a control bar component, typically used above a ds-datatable to group sets of ds-button-bars.

Options

Basic usage

At at simplest, ds-controls expects a single div which contains the required button.

html
Copy

Multiple ds-controls will automatically include a dotted rule to separate the items visually.

html
Copy

If ds-controls contains more than one child element - they are spaced apart:

Multiple child elements

html
Copy

ds-button-bar can be used as child element to have groups of controls:

Example using div container

html
Copy

Examples

Above ds-datatables the following contents/order is recommended.

Recommended ds-datatable controls

html
Copy