replace-base (_base.scscs)

Tipo: Mixin

Versión: 2.x.x

Prepara un contenedor para reemplazo visual con control de tamaño, display, ocultamiento opcional de texto, posición y z-index.

Es la API base canónica para este patrón y pueden reutilizarla mixins como img-replace y normalize-svg.

Interface

@mixin replace-base($attr: (
    width: auto,
    height: auto,
    display: block,
    ht: true,
    position: false
));

position recibe únicamente un map anidado y reutiliza la sintaxis del mixin position. El valor false desactiva la posición; cuando se usa el map, z se configura dentro de él.

Sintaxis map

Clave Tipo Default Descripción
width | w Medida auto Define la propiedad width.
height | h Medida auto Define la propiedad height.
display | d String block Define la propiedad display.
ht | hide_text Bool true Controla si se aplica el mixin ht para ocultar el texto.
position | p Map false Configura la posición mediante un map con la sintaxis del mixin position.

Ejemplo

SISASS

            

            
<span class="replace_base_example">SISASS</span>

Nota: si necesitas configurar position, hazlo siempre como un map anidado. Por ejemplo, position: (position: relative, z: 2).