Button
O componente v-btn
substitui o tema do botão html padrão pelo material design com grande variedade de opções. Qualquer classe de ajuda de cor pode ser usada para alterar a cor do fundo ou texto.
API
Components.Buttons.
Components.Buttons.
Components.Buttons.
Expande o botão para 100% do espaço disponível
Components.Buttons.
Components.Buttons.
Components.Buttons.
Remove a sombra do botão
Components.Buttons.
Components.Buttons.
Components.Buttons.
Torna o bottão redondo
Components.Buttons.
Remove a cor de fundo do botão
Components.Buttons.
Designa o botão como ícone - redondo e plano
Controla o estado ativo do botão
Botão de tamanho grande
Components.Buttons.
Components.Buttons.
Adiciona uma animação de ícone de carregamento
Components.Buttons.
O botão terá um contorno
Components.Buttons.
Components.Buttons.
Aplica a diretiva v-ripple
O botão terá cantos arredondados
Botão de tamanho pequeno
Components.Buttons.
Components.Buttons.
Components.Buttons.
Components.Buttons.
Define o tipo do botão
Controla visibilidade
Exemplos
Plano
Botões planos não tem sombra ou fundo. O contorno do botão é exibido somente ao passar o mouse.
Em relevo
Os botões em relevo têm sombra que aumenta quando clicado. Este é o estilo padrão.
Rebaixado
Botões rebaixados ainda mantêm a sua cor de fundo, mas não tem sombra.
Variantes de Botão com Menu Suspenso
Os botões com menu suspenso são seleções normais com estilo adicional.
Ícone
Ícones podem ser usados para o contúdo principal de um botão.
Flutuante
Botões flutuantes são redondos e geralmente contêm um ícone.
Carregamento
Usando a propriedade de carregamento (loading), você pode notificar um usuário de que está ocorrendo um processamento. O comportamento padrão é usar um componente v-progress-circular
, mas isso pode ser personalizado.
Dimensionamento
Botões podem receber diferentes opções de tamanhos para se adequarem a uma infinidade de cenários.
Contorno
Botões com contorno herdam suas bordas da cor atual aplicada.
Arredondado
Botões arredondados comportam da mesma maneira que botões comuns, mas possuem cantos arredondadas.
Bloco
Botões de bloco preenchem toda a largura disponível.