1. Dashboard
  2. Interface
  3. Componentes

Componentes

Abas, Acordeões e outros elementos da interface do usuário.
Exemlpo para Acordeão

Acordeão

Este componente disponibiliza uma lista de itens colapsados e expandíveis através de clique no cabeçalho.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris porta vitae est eu pulvinar. Nam hendrerit ipsum quis tortor posuere, nec cursus turpis finibus.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris porta vitae est eu pulvinar. Nam hendrerit ipsum quis tortor posuere, nec cursus turpis finibus.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris porta vitae est eu pulvinar. Nam hendrerit ipsum quis tortor posuere, nec cursus turpis finibus.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris porta vitae est eu pulvinar. Nam hendrerit ipsum quis tortor posuere, nec cursus turpis finibus.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris porta vitae est eu pulvinar. Nam hendrerit ipsum quis tortor posuere, nec cursus turpis finibus.
Exemplo Colapsado

Caixa Colapsada

Simples maneira de ocultar e mostrar um elemento com uma transição css
Lorem ipsum
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris porta vitae est eu pulvinar.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris porta vitae est eu pulvinar. Nam hendrerit ipsum quis tortor posuere, nec cursus turpis finibus.
Tooltips - Dicas Dinâmicas

Tooltips

Permite disponibilizar dicas dinâmicas em vários lugares, transições animadas e outros.
Popup Clicável

Popup

Disponibiliza dicas dinâmicas em formato popup em vários lugares, transições animadas e outros.

Lorem ipsum dolor sit amet, consectetuer adipiscing

Phasellus bibendum faucibus leo a mollis. Morbi consectetur, dui imperdiet commodo finibus, erat nisi scelerisque risus, a suscipit sapien est nec nulla.

Praesent laoreet consequat purus, non vehicula nulla fermentum nec. Donec tincidunt, elit vel efficitur sollicitudin, lorem elit vestibulum quam,

Donec quam felis

Praesent laoreet consequat purus, non vehicula nulla fermentum nec. Donec tincidunt, elit vel efficitur sollicitudin, lorem elit vestibulum quam,

Phasellus bibendum faucibus leo a mollis. Morbi consectetur, dui imperdiet commodo finibus, erat nisi scelerisque risus, a suscipit sapien est nec nulla.

Lorem ipsum dolor sit amet, consectetuer adipiscing

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris blandit eros eu nunc feugiat, vitae tempus sapien dignissim. Mauris hendrerit sapien

Praesent laoreet consequat purus, non vehicula nulla fermentum nec. Donec tincidunt, elit vel efficitur sollicitudin, lorem elit vestibulum quam,

Donec quam felis

Praesent laoreet consequat purus, non vehicula nulla fermentum nec. Donec tincidunt, elit vel efficitur sollicitudin, lorem elit vestibulum quam,

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris blandit eros eu nunc feugiat, vitae tempus sapien dignissim. Mauris hendrerit sapien

Lorem ipsum dolor sit amet, consectetuer adipiscing

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris blandit eros eu nunc feugiat, vitae tempus sapien dignissim. Mauris hendrerit sapien

Praesent laoreet consequat purus, non vehicula nulla fermentum nec. Donec tincidunt, elit vel efficitur sollicitudin, lorem elit vestibulum quam,

Lorem ipsum dolor sit amet, consectetuer adipiscing

Praesent laoreet consequat purus, non vehicula nulla fermentum nec. Donec tincidunt, elit vel efficitur sollicitudin, lorem elit vestibulum quam,

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris blandit eros eu nunc feugiat, vitae tempus sapien dignissim. Mauris hendrerit sapien

Donec quam felis

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris blandit eros eu nunc feugiat, vitae tempus sapien dignissim. Mauris hendrerit sapien

Praesent laoreet consequat purus, non vehicula nulla fermentum nec. Donec tincidunt, elit vel efficitur sollicitudin, lorem elit vestibulum quam,

Lorem ipsum dolor sit amet, consectetuer adipiscing

Praesent laoreet consequat purus, non vehicula nulla fermentum nec. Donec tincidunt, elit vel efficitur sollicitudin, lorem elit vestibulum quam,

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris blandit eros eu nunc feugiat, vitae tempus sapien dignissim. Mauris hendrerit sapien

Donec quam felis

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris blandit eros eu nunc feugiat, vitae tempus sapien dignissim. Mauris hendrerit sapien

Praesent laoreet consequat purus, non vehicula nulla fermentum nec. Donec tincidunt, elit vel efficitur sollicitudin, lorem elit vestibulum quam,

Barras de Progresso

Barras de Progresso

Possibilitam o feedback no decorrer de uma ação.
Barras de Progresso Leves
Versão leve de barra de progresso
15%
30%
45%
60%
Barra de progresso listrada
75%
Barra de progresso ativa
90%
Versão Mini
Exemplos de Dropdown

Dropdown

Lista de itens exibidos em cascata que podem ser ativados por clique ou dinamicamente.