Botões

Raised button

Uso

Este botão deve ser utilizado para as
principais ações, como: Salvar, Associar, Filtrar, Cadastrar ...

Utilize-o quando desejar enfatizar a ação (Associar);
Quando o usuário deve utilizá-lo para
finalizar o atual processo (Salvar);
Em diálogos, para unificar a ação do botão com o conteúdo de diálogo;

Flat button

Uso

Será utilizado para representar uma ação secundária, mas  que também
estão disponíveis (Limpar);

Serão empregados para diminuir e previnir
os erros do usuário, sendo aplicado em ações que
podem resultar perca de dados (Excluir, Cancelar) ;

Dimensões

As dimensões irão variar de acordo com o tamanho do texto e fonte presentes no botão. A variação é fixa, sempre deve existir 8 px de borda interna superior e inferior e 16 px na esquerda e na direita.

Flat and Raised

• Altura mínima : 30 px
• Margem esquerda / direita: 16 px
• Margem superior / inferior: 8 px
• Texto desabilitado: 25% de opacidade.
• Cores: #fffff / #838383

---

Check Box

Tamanho ideal: 20 x 20 px

Desmarcada

• Cor: rgba (1,1,1,0.5)
• Borda: 2 px

Marcada

• Cor: #f19f58
• 
  
• Começar, Pausar e Finalizar uma tarefa
• • Tamanho padrão do botão: 30 x 30px
  • Largura e altura mínimas do ícone: 10 px
  • Largura e altura máximas do ícone: 15 px

   

• 
  

Botões de Ação

Os botões de ação aparecem no canto direito da barra superior do Sistema Herakles. São circulares, possuem cor sólida, ícone centralizado e uma sutil sombra abaixo, para adicionar um pouco de profundidade à interface.

Ao serem clicados apresentam a animação representada ao lado e as demais opção são apresentadas.