diff --git a/PLATZIFANS.md b/PLATZIFANS.md index 0edcf69..bb221dd 100644 --- a/PLATZIFANS.md +++ b/PLATZIFANS.md @@ -5,5 +5,5 @@ Estos son lo Platzifans que están colaborando con esta iniciativa | Nombre | Cuenta GitHub | Nick Developer | |---|---|---| | Carlos Alfonso Garcia Gonzales | [calocaleta](https://github.com/calocaleta) | Calo Caleta | +|Rafael Barreto Camacho|[rafo18](https://github.com/rafo18)|rafo18| -| Rafael Barreto Camacho | https://github.com/rafo18 | rafo18 diff --git a/assets/img/m2i8G6H7d3d3H7K9.jpg b/assets/img/m2i8G6H7d3d3H7K9.jpg new file mode 100644 index 0000000..009630a Binary files /dev/null and b/assets/img/m2i8G6H7d3d3H7K9.jpg differ diff --git a/assets/img/notificacion.png b/assets/img/notificacion.png new file mode 100644 index 0000000..71a58b4 Binary files /dev/null and b/assets/img/notificacion.png differ diff --git a/assets/img/search.png b/assets/img/search.png new file mode 100644 index 0000000..1b45f58 Binary files /dev/null and b/assets/img/search.png differ diff --git a/assets/img/searchIcon.png b/assets/img/searchIcon.png new file mode 100644 index 0000000..9075295 Binary files /dev/null and b/assets/img/searchIcon.png differ diff --git a/index.html b/index.html index 559b9c3..6276220 100644 --- a/index.html +++ b/index.html @@ -4,18 +4,41 @@ - PlatziFans! - + + + + + Document -
-

Bienvenido a PlatziFans!

-
+
+ -
-

Este es el lugar donde nos juntamos todos los Fans de Platzi que hemos llevado cursos y queremos ponerlo en práctica.

-
+
+
+ + +
+
- +
+ +
+
- \ No newline at end of file + + diff --git a/style.css b/style.css deleted file mode 100644 index 607148d..0000000 --- a/style.css +++ /dev/null @@ -1,13 +0,0 @@ -.header { - background: blue; - color: white; - text-align: center; -} - - -.main { - display: flex ; - width: 50%; - height: 100vp; - background: red; -} \ No newline at end of file diff --git a/style/style.css b/style/style.css new file mode 100644 index 0000000..8998128 --- /dev/null +++ b/style/style.css @@ -0,0 +1,95 @@ +*{ + margin: 0; + padding: 0; + box-sizing: border-box; + font-family: 'Roboto', sans-serif; +} + +html { + font-size: 62.5%; +} + +.nav-bar { + display: grid; + grid-template-columns: 1fr 1fr 1fr; + justify-content: center; + align-items: center; + height: auto; + width: 100%; + background: #121f3d; + border-bottom: 1px solid #0f1931 ; + padding: 12px; +} +.nav-logo { + display: flex; + justify-items: center; + flex-direction: row; +} + +.nav-bar .nav-logo .logo img { + width: 25px; + margin-right: 5px; + +} + +.nav-bar .nav-logo .platzi img{ + width: 60px; +} + +.nav-bar .nav-input { + justify-self: end; + justify-content: end; + width: 400px; + height: 35px; + border: 1px solid #40587c; + border-radius: 10px; + display: flex; + justify-items: center; + align-items: center; + padding-right: 5px; + background-color: #03091e; +} + +.nav-bar .nav-bar .nav-input-container { + display: flex; + justify-items: center; + align-items: center; +} + +.nav-bar .nav-input-container input { + width: 350px; + border: none; + background-color: #03091e; + font-size: 1.5rem; + outline: none; + color: white; + +} + +.nav-right { + list-style: none; + display: flex; + align-items: center; + justify-content: center; + gap: 20px; + font-size: 1.5rem; + color: white; +} + +.nav-right li a { + color: white; + text-decoration: none; + font-size: 1.4rem; + font-weight: 600; +} + +.nav-right li a:hover { + color: #b7bbc4; +} + +.nav-right .campana { + background-image: url('../assets/img/notificacion.png'); + background-position: center; + background-size: contain; + background-repeat: no-repeat; +} \ No newline at end of file