freeCodeCamp/curriculum/challenges/spanish/03-front-end-libraries/sass/split-your-styles-into-smaller-chunks-with-partials.spanish.md

id	title	required	challengeType	videoUrl	localeTitle
587d7dbf367417b2b2512bbc	Split Your Styles into Smaller Chunks with Partials	src raw https://cdnjs.cloudflare.com/ajax/libs/sass.js/0.10.9/sass.sync.min.js true	0		Divide tus estilos en trozos más pequeños con parciales

Description

Partials en Sass son archivos separados que contienen segmentos de código CSS. Estos son importados y utilizados en otros archivos Sass. Esta es una excelente manera de agrupar código similar en un módulo para mantenerlo organizado. Los nombres de los partials comienzan con el carácter de subrayado ( _ ), que le dice a Sass que es un pequeño segmento de CSS y que no debe convertirlo en un archivo CSS. Además, los archivos Sass terminan con la extensión de archivo .scss . Para llevar el código en el partial a otro archivo Sass, use la directiva @import . Por ejemplo, si todos sus mixins se guardan en un partial llamado "_mixins.scss", y se necesitan en el archivo "main.scss", esta es la forma de usarlos en el archivo principal:

// En el archivo main.scss

@import 'mixins'

Tenga en cuenta que el guión bajo no es necesario en la declaración de import : Sass entiende que es partial . Una vez que se importa un partial en un archivo, todas las variables, mixins y otros códigos están disponibles para su uso.

Instructions

Escriba una declaración @import para importar un partial llamado _variables.scss en el archivo main.scss.

Tests

tests:
  - text: 'Su código debe usar la directiva <code>@import</code> , y no debe incluir el subrayado en el nombre del archivo.'
    testString: 'assert(code.match(/@import\s+?("|")variables\1/gi), "Your code should use the <code>@import</code> directive, and should not include the underscore in the file name.");'

Challenge Seed

// The main.scss file

Solution

// solution required