Fundación - Table Sass Reference

Variables

Puede cambiar los estilos de los componentes utilizando las siguientes variables SASS que se enumeran en la tabla.

No Señor. Nombre y descripción Tipo Valor por defecto
1

$table-background

Aplica el color de fondo de la tabla.

Color $ blanco
2

$table-color-scale

Especifica la escala para oscurecer las filas y el borde de la tabla rayada.

Número 5%
3

$table-border

Define el estilo del borde de la tabla.

Lista Escala inteligente sólida de 1 px ($ fondo de tabla, $ escala de color de tabla)
4

$table-padding

Proporciona acolchado de la mesa.

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

$table-hover-scale

Especifica la escala para oscurecer las filas de la tabla rayada al pasar el mouse.

Número 2%
6

$table-row-hover

Aplica el color para filas estándar al pasar el mouse.

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

$table-row-stripe-hover

Aplica el color para filas con rayas al pasar el mouse.

Lista oscurecer ($ fondo de tabla, $ escala de color de tabla + $ escala de desplazamiento de tabla)
8

$table-striped-background

Proporciona el color de fondo para las filas a rayas.

Color escala inteligente ($ fondo de tabla, $ escala de color de tabla)
9

$table-stripe

Muestra la raya en las filas de la tabla. Si una fila es par, las filas pares tendrán un color de fondo y si una fila es impar, las filas impares tendrán un color de fondo. Si la fila está vacía o cualquier otro valor, las filas de la tabla no tendrán rayas.

Palabra clave incluso
10

$table-head-background

Especifica el color del fondo del encabezado.

Color escala inteligente ($ fondo de tabla, $ escala de color de tabla / 2)
11

$table-foot-background

Especifica el color del fondo del pie de página.

Color escala inteligente ($ fondo de tabla, $ escala de color de tabla)
12

$table-head-font-color

Define el color de fuente de un encabezado.

Color $ body-font-color
13

$show-header-for-stacked

Muestra el valor predeterminado para el encabezado cuando se utilizan tablas apiladas.

Booleano falso

Mixins

Puede usar los mixins para construir la estructura de clases CSS para sus componentes como se describe a continuación:

mesa

Agrega estilos para tablas y los estilos se pueden incluir usando la siguiente combinación:

@include table($stripe);

Utiliza el parámetro tal como se define en la siguiente tabla:

No Señor. Descripción de parámetros Tipo Valor por defecto
1

$stripe

Muestra la raya en las filas de la tabla usando un valor par, impar o ninguno. Incluso es el valor predeterminado.

Palabra clave $ table-stripe

desplazamiento de tabla

Desplaza la tabla horizontalmente usando la siguiente combinación:

@include table-scroll;

mesa flotante

Se desplaza sobre las filas de la tabla utilizando la siguiente combinación:

@include table-hover;

pila de mesa

Agrega estilos para la mesa apilada.

@include table-stack($header);

Utiliza el parámetro tal como se define en la siguiente tabla:

No Señor. Descripción de parámetros Tipo Valor por defecto
1

$header

Muestra el encabezado cuando la tabla está apilada.

Booleano $ show-header-for-stacked