SASS

Para poder usar rgba() junto a variables sass y custom properties hay que transformar el valor del color a rgb, no es válido en hexadecimal. A continuación 2 formas de usar variables SASS + custom properties en colores rgba y […]

Leer más...

Ejemplos de uso de las custom properties (o tambien conocidas como variables css) de css junto con las variables de SASS. $color-principal: #222; $color-secundario: #f02; :root { –color-uno: #{$color-principal}; –color-dos: #{$color-secundario}; } Para insertar el valor de variable SASS al […]

Leer más...

Para usar las variables o propiedades personalizadas de css en sass hay que usar el comodín #{$nombre-variable-sass} para indicar el valor de la custom propertie como podemos ver en el siguiente ejemplo: // Variables SASS $color-bg: #f00; // :root { […]

Leer más...

Con SASS podemos crear una variable y usarla dentro de un determinado selector o clase. Para ello usaremos la interpolación de SASS envolviendo la variable dentro de la expresión #{}: Algunos ejemplo de uso: $nombre: "leon"; .header-#{$nombre} { color: black; […]

Leer más...

Si has tenido problemas al declarar variables SASS/SCSS dentro de la pseudo-clase :root de CSS, es posible que no las estés declarando correctamente en sass. Para usar variables SASS dentro de tu variables CSS y que se compilen correctamente debes […]

Leer más...

Colección de los 10 mixins de SASS que más vengo utilizando en la mayoría de proyectos con su correspondiente ejemplo de uso en scss: 1. Media Queries $mobile: 480px; $tabletPortrait: 767px; $tabletLandscape: 1024px; $desktop: 1200px; @mixin breakpoint($media) { @if $media […]

Leer más...

Actualizar Sass o Compass a su última versión estable es tan sencillo como su instalación. Abrimos la consola de Ruby e insertamos los comandos: Para actualizar a la última versión de Sass: gem update sass Para actualizar a la última […]

Leer más...