_base.scss (archivo)

Versión: 2.x.x

src/_base.scss centraliza utilidades base de SISASS: mixins para tipografía, fondos, layout, componentes UI y helpers responsive, además de funciones de apoyo para mapas, color, listas, strings y unidades. Muchas utilidades aceptan configuración mediante mapas para mantener una API consistente y escalable.

Clasificación de mixins

Categoría Mixins
Texto text, font, tf, gradient-text, font-face, ht
Formularios autofill
Fondos/Color background, bc, background-opacity
Layout/Posición position, wh, whs
Layout/Alineación center-absolute, center-flex-column, center-flex-row
Layout/Espaciado gap
Imágenes cover, contain, img-replace, replace-base
SVG icon-svg, icon-svg-mask, normalize-svg
UI scroll
Reset no-spacing, no-border

Clasificación de funciones

Categoría Funciones
Responsive/Unidades szrem, bp, pb, strip-unit, normalize-px
Cadenas str-replace
Mapas mapv
Color rgb-alpha
Listas list-add-unique, list-add-items, append-points

Uso de parámetros y alias

En SISASS, muchos mixins pueden usarse de dos formas. La primera es con parámetros secuenciales, es decir, pasando los valores en el mismo orden en que aparecen en la firma del mixin. La segunda es con sintaxis map, donde se envía un mapa de claves y valores para nombrar cada opción de forma explícita. Un map se escribe con pares clave: valor, por ejemplo: (position: absolute, y: 10px, x: 20px).

La diferencia práctica es importante: con parámetros secuenciales debes respetar el orden exacto de la firma del mixin, mientras que con sintaxis map el orden de las claves no altera el resultado, porque cada valor se resuelve por nombre. Por ejemplo, @include position(absolute, 10px, 20px); depende del orden, mientras que @include position((x: 20px, position: absolute, y: 10px)); produce la misma configuración aunque las claves estén reordenadas.

En las tablas de parámetros, cuando una entrada aparece como position | p o top | t, significa que todas esas claves apuntan a la misma configuración dentro de la sintaxis map. El nombre ubicado más a la izquierda es el nombre principal y los siguientes son alias. La precedencia se resuelve en ese mismo orden: primero gana el nombre principal, luego el primer alias, después el siguiente, y así sucesivamente. Si una misma opción tiene más de un alias, el valor efectivo será el del primer nombre disponible según el orden documentado.