-
check_circle_outlineMódulo 1 | 21 clases
Primera sesión
expand_more-
done_all
Clase 1
1.- Introducción
-
done_all
Clase 2
2.- Configurar el servidor
-
done_all
Clase 3
3.- Prepros
-
done_all
Clase 4
4.- HAML y encabezado HTML
-
done_all
Clase 5
5.- Preparando los assets
-
done_all
Clase 6
6.- Organizar archivos CSS en parciales
-
done_all
Clase 7
7.- Definir paleta colores
-
done_all
Clase 8
8.- Degradados
-
done_all
Clase 9
9.- Grids y CDN
-
done_all
Clase 10
10.- Google Fonts
-
done_all
Clase 11
11.- Extend y selectores anidados
-
done_all
Clase 12
12.- Finalizar hora
-
done_all
Clase 13
13.- Título y organización en clases
-
done_all
Clase 14
14.- Botones 3D
-
done_all
Clase 15
15.- Card
-
done_all
Clase 16
16.- Grid y contenedores
-
done_all
Clase 17
17.- Flexboxgrid para nuestros items
-
done_all
Clase 18
18.- Cáscada y nth-child
-
done_all
Clase 19
19.- Pseudo elementos
-
done_all
Clase 20
20.- Separator
-
done_all
Clase 21
21.- YouTube Player responsive
-
2 comentario(s)
este es mi codigo en app.css
@import "comon"; @import "colors";
html,body{ margin:0px; font-family: 'Roboto', sans-serif;
} .workshop-background{
background:linear-gradient(to bottom,#6d7783 0%,#49505a 100%); padding-bottom:100px; } en index.haml !!! 5 %html %head %link{href:"./app.css",rel:"stylesheet"} %link{href:"https://cdn.jsdelivr.net/gridlex/2.0.8/gridlex.min.css",rel:"stylesheet"} %link{href:"https://fonts.googleapis.com/css?family=Roboto:400,700,300",rel:"stylesheet"} %meta{charset:"utf-8"} %title proyecto %body .workshop-background .row.center-xs .col-xs-10.col-sm-8.col-md-6 .box %header.white-text.text-center .inline-block %img{src:"./imagenes/tl.png",height:60} iniciamos en y en _colors.scss $colors: ( yellow: #ecc000, pink: #d40053, green: #009966, blue: #5297ce, white: #fff, black:#000 );
@each $color,$value in $colors{ .#{$color}{ background-color:$value; } .#{$color}-text{ color:$value; } .btn--#{$color}{ background-color:$value; box-shadow:3px 3px 0px 3px darken($value, 15); } }
Clase 11