diff --git a/m1/examen-m1/index.html b/m1/examen-m1/index.html index e69de29..956c03f 100644 --- a/m1/examen-m1/index.html +++ b/m1/examen-m1/index.html @@ -0,0 +1,46 @@ + + + + + + + + Curs Mean Stack + + +
+
+

Curs Mean-stack 2019

+ +
+
+
+

alumnes

+
+
+

recursos

+
+
+
+ + +
+ + + \ No newline at end of file diff --git a/m1/examen-m1/paisaje-natural-item-5.jpg b/m1/examen-m1/paisaje-natural-item-5.jpg new file mode 100644 index 0000000..9222e46 Binary files /dev/null and b/m1/examen-m1/paisaje-natural-item-5.jpg differ diff --git a/m1/examen-m1/reset.scss b/m1/examen-m1/reset.scss new file mode 100644 index 0000000..03e66b3 --- /dev/null +++ b/m1/examen-m1/reset.scss @@ -0,0 +1,4 @@ +body{ + margin:0; + padding: 0; +} \ No newline at end of file diff --git a/m1/examen-m1/style.css b/m1/examen-m1/style.css new file mode 100644 index 0000000..1820e11 --- /dev/null +++ b/m1/examen-m1/style.css @@ -0,0 +1,131 @@ +@charset "UTF-8"; +/*documento reset*/ +body { + margin: 0; + padding: 0; +} + +/*declaración de fuentes y colores*/ +/*construccion grid*/ +/*.grid{ + font-size:2em; + display: grid /*inline-grid*/ +/* grid-template-rows: 4rem 8rem 4rem ; /*repeat (4, 4rem)*/ +/* grid-template-columns: repeat(3, 32rem);*/ +/*desastre en la constrccion del grid. Faltan dos horas, utilizaré flex.*/ +/*ni flex. Tradicional . los nervios me tienen artenazado, joder!*/ +body { + width: 85vh; + height: 1200px; + margin: auto; + font: 100% Helvetica, sans-serif; +} + +header { + width: 75vh; + height: 200px; + background-image: url(https://concepto.de/wp-content/uploads/2019/02/paisaje-natural-item-5.jpg); + display: block; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; +} + +header h1 { + font-weight: bold; + color: whitesmoke; + position: relative; + left: 25%; + top: 30%; +} + +header .nav { + position: relative; + list-style: none; + top: 50%; +} + +header .nav ul { + list-style: none; + display: inline-block; + color: #333; + text-align: center; +} + +header .nav ul li { + position: relative; + text-decoration: none; + left: 45%; + display: inline; + text-align: center; + color: whitesmoke; + font-size: medium; +} + +main { + width: 75vh; + height: 200px; +} + +main .cub { + width: 33%; + height: 200px; + background-color: rgba(224, 224, 224, 0.74); + border: 1px solid whitesmoke; + border-radius: 25px; + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + -ms-border-radius: 5px; + -o-border-radius: 5px; + margin: 20px; +} + +main .cub p { + text-align: center; + color: rgba(236, 236, 236, 0.89); + font-size: 350%; +} + +main .cub:hover { + background-color: whitesmoke; + transition: background-color, 0.9; + -webkit-transition: background-color, 0.9; + -moz-transition: background-color, 0.9; + -ms-transition: background-color, 0.9; + -o-transition: background-color, 0.9; +} + +main .cub1 { + position: relative; + float: right; +} + +main .cub2 { + position: relative; + float: left; +} + +main div { + clear: both; +} + +footer { + width: 75vh; + height: 100px; + background-color: #333; + color: whitesmoke; + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + -webkit-box-align: end; + -ms-flex-align: end; + align-items: flex-end; +} + +footer small { + font: 75% Helvetica, sans-serif; +} +/*# sourceMappingURL=style.css.map */ \ No newline at end of file diff --git a/m1/examen-m1/style.css.map b/m1/examen-m1/style.css.map new file mode 100644 index 0000000..849e06f --- /dev/null +++ b/m1/examen-m1/style.css.map @@ -0,0 +1,10 @@ +{ + "version": 3, + "mappings": "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", + "sources": [ + "style.scss", + "reset.scss" + ], + "names": [], + "file": "style.css" +} \ No newline at end of file diff --git a/m1/examen-m1/style.scss b/m1/examen-m1/style.scss index e69de29..753b078 100644 --- a/m1/examen-m1/style.scss +++ b/m1/examen-m1/style.scss @@ -0,0 +1,132 @@ +/*documento reset*/ + +@import"reset.scss"; + + +/*declaración de fuentes y colores*/ + +$font-stack: Helvetica, sans-serif; +$footer-color:#333; +$main-color:whitesmoke; +/*construccion grid*/ +/*.grid{ + font-size:2em; + display: grid /*inline-grid*/; + /* grid-template-rows: 4rem 8rem 4rem ; /*repeat (4, 4rem)*/ + /* grid-template-columns: repeat(3, 32rem);*/ +/*desastre en la constrccion del grid. Faltan dos horas, utilizaré flex.*/ +/*ni flex. Tradicional . los nervios me tienen artenazado, joder!*/ + +body{ + width:85vh; + height: 1200px; + margin: auto; + font: 100% $font-stack; + +} + +header{ + width: 75vh; + height: 200px; + background-image:url(https://concepto.de/wp-content/uploads/2019/02/paisaje-natural-item-5.jpg); + display:block; + justify-content:center; + + + h1{ + font-weight:bold; + color: $main-color; + position: relative; + left:25%; + top:30%; + } + + + +.nav{ + position:relative; + list-style: none; + top:50%; + + + + ul{ + list-style: none; + display:inline-block; + color:#333; + text-align: center; + + + + li{ + position: relative; + text-decoration: none; + left: 45%; + + display: inline; + text-align: center; + color: $main-color; + font-size:medium; + + } + } +} +} +main{ + width: 75vh; + height:200px; + + .cub{ + width:33%; + height: 200px; + background-color: rgba(224, 224, 224, 0.74); + border:1px solid $main-color; + border-radius:25px; + -webkit-border-radius:5px ; + -moz-border-radius:5px ; + -ms-border-radius:5px ; + -o-border-radius:5px ; + margin:20px; + p{ + text-align: center; + color: rgba(236, 236, 236, 0.89); + font-size:350%; + } +} +.cub:hover{ + background-color:whitesmoke; + transition: background-color, 0.9; + -webkit-transition: background-color, 0.9; + -moz-transition: background-color, 0.9; + -ms-transition: background-color, 0.9; + -o-transition: background-color, 0.9; +} +.cub1{ + position: relative; + float: right; + +} +.cub2{ + position: relative; + float: left; + +} +div{ + clear: both; +} +} +footer{ + width: 75vh; + height: 100px; + background-color: $footer-color; + color:$main-color; + display:flex; + justify-content: center; + align-items: flex-end; + small{ + font: 75% $font-stack; + } +} + + +