Fundação - Referência da Tabela Sass

Variáveis

Você pode alterar os estilos dos componentes usando as seguintes variáveis ​​SASS, conforme listado na tabela.

Sr. Não. Nome e Descrição Tipo Valor padrão
1

$table-background

Aplica a cor de fundo da tabela.

 Cor $ branco
2

$table-color-scale

Ele especifica a escala para escurecimento das linhas e borda da tabela listrada.

 Número 5%
3

$table-border

Ele define o estilo da borda da mesa.

 Lista Escala inteligente sólida de 1px ($ table-background, $ table-color-scale)
4

$table-padding

Ele fornece preenchimento da mesa.

 Número rem-calc (8 10 10)
5

$table-hover-scale

Ele especifica a escala para escurecer as linhas da tabela listrada ao passar o mouse.

 Número 2%
6

$table-row-hover

Aplica a cor para linhas padrão ao pairar.

 Lista escurecer ($ table-background, $ table-hover-scale)
7

$table-row-stripe-hover

Aplica a cor para linhas listradas ao pairar.

 Lista escurecer ($ table-background, $ table-color-scale + $ table-hover-scale)
8

$table-striped-background

Ele fornece a cor de fundo para linhas listradas.

 Cor escala inteligente ($ table-background, $ table-color-scale)
9

$table-stripe

Mostra a faixa nas linhas da tabela. Se uma linha for par, então as linhas pares terão uma cor de fundo e se uma linha for ímpar, então as linhas ímpares terão uma cor de fundo. Se a linha estiver vazia ou qualquer outro valor, as linhas da tabela não terão listras.

 Palavra chave até
10

$table-head-background

Ele especifica a cor de fundo do cabeçalho.

 Cor escala inteligente ($ table-background, $ table-color-scale / 2)
11

$table-foot-background

Ele especifica a cor de fundo do rodapé.

 Cor escala inteligente ($ table-background, $ table-color-scale)
12

$table-head-font-color

Ele define a cor da fonte de um cabeçalho.

 Cor $ body-font-color
13

$show-header-for-stacked

Mostra o valor padrão do cabeçalho ao usar tabelas empilhadas.

 boleano falso

Mixins

Você pode usar os mixins para construir a estrutura de classes CSS para seus componentes, conforme descrito abaixo -

tabela

Ele adiciona estilos para tabelas e estilos podem ser incluídos usando o seguinte mixin -

@include table($stripe);

Ele usa o parâmetro conforme definido na tabela a seguir -

Sr. Não. Parâmetro e Descrição Tipo Valor padrão
1

$stripe

Mostra a faixa nas linhas da tabela usando valor par, ímpar ou nenhum. Even é o valor padrão.

 Palavra-chave $ table-stripe

rolagem de mesa

Ele rola a tabela horizontalmente usando o seguinte mixin -

@include table-scroll;

pairar na mesa

Ele paira sobre as linhas da mesa usando o seguinte mixin -

@include table-hover;

pilha de mesa

Adiciona estilos para a mesa empilhada.

@include table-stack($header);

Ele usa o parâmetro conforme definido na tabela a seguir -

Sr. Não. Parâmetro e Descrição Tipo Valor padrão
1

$header

Mostra o cabeçalho quando a tabela está empilhada.

 boleano $ show-header-for-stacked