Blocks

Tabs

Divide content into meaningful, related sections with help of tabs. Each active tab displays its own unique content and help to focus on one particular view while keeping all available content options in view.

Components

Block components consist of simple components (such as buttons, inputs, etc.) and used to build complex structures such as section components. You can combine different blocks to create unique sections.

TABL is primary component name for tabs blocks, where TA - tabs, BL - blocks and last 2 digits is a sequence number.

TABL01 /
Heads Up!

This is demo placeholder. You can place inside any type of content (text, images, components, custom code etc.)

Heads Up!

This is demo placeholder. You can place inside any type of content (text, images, components, custom code etc.)

Heads Up!

This is demo placeholder. You can place inside any type of content (text, images, components, custom code etc.)

Heads Up!

This is demo placeholder. You can place inside any type of content (text, images, components, custom code etc.)

Heads Up!

This is demo placeholder. You can place inside any type of content (text, images, components, custom code etc.)

Heads Up!

This is demo placeholder. You can place inside any type of content (text, images, components, custom code etc.)

Heads Up!

This is demo placeholder. You can place inside any type of content (text, images, components, custom code etc.)

Heads Up!

This is demo placeholder. You can place inside any type of content (text, images, components, custom code etc.)

Heads Up!

This is demo placeholder. You can place inside any type of content (text, images, components, custom code etc.)

Heads Up!

This is demo placeholder. You can place inside any type of content (text, images, components, custom code etc.)

Heads Up!

This is demo placeholder. You can place inside any type of content (text, images, components, custom code etc.)

Heads Up!

This is demo placeholder. You can place inside any type of content (text, images, components, custom code etc.)

How to

Add block components

Block components should be nested inside of parent wrapper and shouldn't be nested inside of any row, as they already have it. Just select and copy any component from the styleguide and paste them to your project. Or you can search the component's name in the Component panel (Shift + A) or use quick search (Ctrl + E).

Style components

Before making any changes you need to unlink component. Right-click on the symbol’s label and choose unlink from symbol. You can style components whatever you like.