[Curso] SASS de 0 a 100

Curso de SASS馃寛 de 0 a 100 [06.- mixin]

En este tutorial vamos a aprender a implementar mixin en sass pero ami me gusta definir a mixin como funciones.
Codigo: https://github.com/programadornovato/sass/commit/e45d0a4e65c5f7ba4ef48f1fc1299a1c3915a011

//index.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="rutaCss/estilo.css">
    <title>Document</title>
</head>
<body>
    <div id="rec1"></div>
    <div id="rec2"></div>
    <div id="rec3"></div>
</body>
</html>




//rutaSass/_mixin.scss
@mixin forma($color:#111,$ancho:100px,$alto:100px) {
    background-color:$color;
    width: $ancho;
    height: $alto;
}
#rec1{
    @include forma(red,300px,50px);
}
#rec2{
    @include forma(#aaa,400px,20px);
}
#rec3{
    @include forma(green,100px,50px);
}





//rutaSass/estilo.scss
// Importamos las variables de los colores
//@import "colores";
// Importamos lala estructura
//@import "estructura";
@import "mixin";
/*
este comentario si pasa
*/

? Visual Studio Code Review: https://www.youtube.com/watch?v=VEySgnoG2k4
? Live Server: https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer
? Pagina oficial: https://sass-lang.com/
? Visual Studio Code Review: https://www.youtube.com/watch?v=VEySgnoG2k4

? Facebook: https://facebook.com/ProgramadorNovatoOficial
? Twitter: https://twitter.com/programadornova
? Linkedin: https://www.linkedin.com/in/programadornovato/
? Instagram: https://www.instagram.com/programadornovato/

Codigos en gdrive: https://drive.google.com/file/d/15i6j231DHduFTUHQKillgATNWKGDUiGw/view?usp=sharing
? Esta lista de reproducci贸n: https://www.youtube.com/playlist?list=PLCTD_CpMeEKQXywJB8KMN_-GccZuVf9ag
Gracias por apoyar este canal: https://www.patreon.com/programadornovato?fan_landing=true

Eugenio Chaparro

Entradas recientes

馃煝Editar c贸digo de un m贸dulo en Dolibarr [04]

馃煝Editar c贸digo de un m贸dulo en Dolibarr [04]

En este tutorial vamos editar el c贸digo de nuestro m贸dulo personas para poder personalizar algunas…

2 meses hace
馃煝Crear un sub_m贸dulo en Dolibarr [03]

馃煝Crear un sub_m贸dulo en Dolibarr [03]

En este tutorial vamos a crear un sub m贸dulo llamado seguridad que ser谩 muy parecido…

2 meses hace
馃煝Modificar un m贸dulo en Dolibarr [02]

馃煝Modificar un m贸dulo en Dolibarr [02]

En este tutorial aprenderemos a editar el objeto personas del modulo persona que creamos en…

2 meses hace
馃煝Constructor de m贸dulos en Dolibarr

馃煝Constructor de m贸dulos en Dolibarr

Como mencionamos anteriormente Dolibarr es un proyecto realizado sobre la base de una pol铆tica clara:…

2 meses hace
馃煝Tickets en Dolibarr [19]

馃煝Tickets en Dolibarr [19]

Los ticket en dolibarr nos ayudan a comunicar inconveniente en nuestros productos y servicios dentro…

2 meses hace
馃煝Agenda en Dolibarr [18]

馃煝Agenda en Dolibarr [18]

Las agendas en dolibarr nos ayudan a ver las actividades realizadas en proceso y por…

2 meses hace