From 054fae7d8712b7d69806cadfc3b87f1c58cda6c7 Mon Sep 17 00:00:00 2001 From: Luis GT Date: Sat, 1 Oct 2022 17:25:45 -0500 Subject: [PATCH 1/6] Primeros cambios en css de rama desarrollo_luis --- css/estilos.css | 27 +++++++++++++++++++++++++++ 1 file changed, 27 insertions(+) diff --git a/css/estilos.css b/css/estilos.css index 4258008..be16e72 100644 --- a/css/estilos.css +++ b/css/estilos.css @@ -1,7 +1,34 @@ *{ + box-sizing: border-box; margin: 0; padding: 0; } + +html { + font-size: 62.5%; +} + +/* .container { + display: flex; + flex-wrap: wrap; +} */ + +main { + display: flex; + flex-wrap: wrap; +} + +h1 { + font-size: 4rem; +} + +h2 { + font-size: 3rem; +} + +p{ + font-size: 2rem; +} .clear{ clear: both; From 62c0d6f2398730bd533dccab0825a33f55af304a Mon Sep 17 00:00:00 2001 From: Luis GT Date: Sat, 1 Oct 2022 18:13:28 -0500 Subject: [PATCH 2/6] Colores encabezados --- css/estilos.css | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/css/estilos.css b/css/estilos.css index be16e72..a8a2606 100644 --- a/css/estilos.css +++ b/css/estilos.css @@ -20,8 +20,12 @@ main { h1 { font-size: 4rem; + background-color: #0062d2; + color: #fefefe; + } + h2 { font-size: 3rem; } @@ -44,6 +48,7 @@ p{ max-width: 600px; margin: 50px auto; overflow: hidden; + } .slidemenu label{ From bd82c90e98e5235cfd4ebe50ca45cbd772b3b156 Mon Sep 17 00:00:00 2001 From: Luis GT Date: Sun, 2 Oct 2022 21:31:49 -0500 Subject: [PATCH 3/6] Nav y head azul, padding 25px, Font Rubik --- EjemploDOM.html | 2 ++ css/estilos.css | 42 +++++++++++++++++++++++++++++------------- 2 files changed, 31 insertions(+), 13 deletions(-) diff --git a/EjemploDOM.html b/EjemploDOM.html index 1951eb6..46200cf 100644 --- a/EjemploDOM.html +++ b/EjemploDOM.html @@ -4,6 +4,8 @@ Practica Javacript Prospercity + +
diff --git a/css/estilos.css b/css/estilos.css index a8a2606..00fe10f 100644 --- a/css/estilos.css +++ b/css/estilos.css @@ -1,4 +1,4 @@ -*{ +* { box-sizing: border-box; margin: 0; padding: 0; @@ -8,26 +8,37 @@ html { font-size: 62.5%; } -/* .container { - display: flex; - flex-wrap: wrap; -} */ + main { display: flex; flex-wrap: wrap; } +.section-a { + padding: 25px; +} + +.section-b { + padding: 25px; +} + +.section-c { + padding: 25px; +} + h1 { + padding: 25px; font-size: 4rem; - background-color: #0062d2; - color: #fefefe; + /*background-color: #0062d2;*/ + color: #0062d2; } h2 { - font-size: 3rem; + font-size: 2.5rem; + color: #333366; } p{ @@ -45,9 +56,11 @@ p{ .slidemenu{ font-family: arial, sans-serif; - max-width: 600px; - margin: 50px auto; + /*max-width: 600px; */ + /*margin: 50px auto; */ overflow: hidden; + background-color: #0062d2; + padding: 20px; } @@ -56,14 +69,16 @@ p{ text-align: center; display: block; float: left; - color: #333; + /*color: #333; */ + color: #ccc; opacity: 0.2; } .slidemenu label:hover{ cursor: pointer; - color: #666; + /*color: #666;*/ + color: azure; } .slidemenu label span{ @@ -73,7 +88,8 @@ p{ .slidemenu label .icon{ font-size: 20px; - border: solid 2px #333; + /* border: solid 2px #333; */ + border: solid 2px #fefefe; text-align: center; height: 50px; width: 50px; From d7ebd8f65a92e0117a37be97937b21142c32f884 Mon Sep 17 00:00:00 2001 From: Luis GT Date: Sun, 2 Oct 2022 21:38:37 -0500 Subject: [PATCH 4/6] Estilos con Font Rubik --- css/estilos.css | 1 + 1 file changed, 1 insertion(+) diff --git a/css/estilos.css b/css/estilos.css index 00fe10f..17244c3 100644 --- a/css/estilos.css +++ b/css/estilos.css @@ -6,6 +6,7 @@ html { font-size: 62.5%; + font-family: 'Rubik', sans-serif; } From b63e159ef1c2ec4d3402eaa363c384ed3d678ad4 Mon Sep 17 00:00:00 2001 From: Luis GT Date: Mon, 3 Oct 2022 17:38:47 -0500 Subject: [PATCH 5/6] Cambio de color a los 2 titulos con js --- EjemploDOM.html | 4 ++-- js/main.js | 7 +++++-- 2 files changed, 7 insertions(+), 4 deletions(-) diff --git a/EjemploDOM.html b/EjemploDOM.html index 46200cf..2d7e71b 100644 --- a/EjemploDOM.html +++ b/EjemploDOM.html @@ -41,7 +41,7 @@

Bienvenidos a las noticias

-

+

Hubble y Webb capturan el momento en el que misión de la NASA impacta contra un asteroide

@@ -51,7 +51,7 @@

-

+

Explotarlos vs. desviarlos: ¿qué opciones existen para evitar que un asteroide choque con la Tierra?

diff --git a/js/main.js b/js/main.js index db67841..861f547 100644 --- a/js/main.js +++ b/js/main.js @@ -1,6 +1,9 @@ function changeColor(newColor) { - const elem = document.getElementById('para'); - elem.style.color = newColor; + // const elem = document.getElementById('para'); + const elem1 = document.getElementById('titulo1'); + const elem2 = document.getElementById('titulo2'); + elem1.style.color = newColor; + elem2.style.color = newColor; } let firstHeading = document.querySelector('h1'); From 5096c1e618994659c4b3998ae0298f03d6ce35de Mon Sep 17 00:00:00 2001 From: Jexpalacio11 Date: Thu, 6 Oct 2022 17:26:26 -0500 Subject: [PATCH 6/6] rama principal Iconos --- EjemploDOM.html | 16 +++++++++++----- css/estilos.css | 3 ++- 2 files changed, 13 insertions(+), 6 deletions(-) diff --git a/EjemploDOM.html b/EjemploDOM.html index 2d7e71b..91526c8 100644 --- a/EjemploDOM.html +++ b/EjemploDOM.html @@ -6,26 +6,25 @@ -

+
+ + diff --git a/css/estilos.css b/css/estilos.css index 17244c3..c737dea 100644 --- a/css/estilos.css +++ b/css/estilos.css @@ -79,7 +79,7 @@ p{ .slidemenu label:hover{ cursor: pointer; /*color: #666;*/ - color: azure; + color: #000000; } .slidemenu label span{ @@ -137,4 +137,5 @@ p{ .slidemenu #slide-item-2:checked ~ .slider .bar{ margin-left: 25%; } .slidemenu #slide-item-3:checked ~ .slider .bar{ margin-left: 50%; } .slidemenu #slide-item-4:checked ~ .slider .bar{ margin-left: 75%; } + \ No newline at end of file