Skip to main content
LocalTapiola Turva

Grid ready

Grid component provides structure for other components using Flexbox based layout system. Grid doesn’t provide customizable options at the moment.

Examples

Open in new window
<duet-grid>
  <duet-input expand label="Etunimi" placeholder="Matti"></duet-input>
  <duet-input expand label="Sukunimi" placeholder="Meikäläinen"></duet-input>
</duet-grid>
Open in new window
<duet-grid>
  <duet-input expand label="Username" placeholder="user@example.com"></duet-input>
  <duet-input expand label="Password" placeholder="password"></duet-input>
  <duet-spacer size="small"></duet-spacer>
  <duet-button variation="primary">Login</duet-button>
</duet-grid>

Integration

For integration, events and theming guidelines, please see Using Components. That page explains how to implement and use Duet’s components across different technologies like Angular, React or Vanilla JavaScript.