-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
183 lines (180 loc) · 10.7 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="keywords" content="TOPICO, IDEAS, ARTÍCULOS, MEDIO, ESCRIBIR, LEER">
<meta name="description"
content="Topico es un compendio de articulos, un medio por el cuál podés leer y escribir, es tu sitio web de noticias e interés general.">
<title>Topico - donde las buenas ideas te encuentran a vos.</title>
<link rel="stylesheet" href="./scss/styles.css">
<link href="https://fonts.googleapis.com/css2?family=Crete+Round&display=swap" rel="stylesheet">
</head>
<body>
<div class="indexGrid">
<nav>
<ul>
<li><a href="./index.html" id="logoHome"><img src="./assets/logoTopico.png" alt="Home"> |</a></li>
<li><a href="./nuestrahistoria.html">Nuestra historia</a> |</li>
<li><a href="./membresia.html">Membresía</a> |</li>
<li><a href="./escribir.html">Escribir</a> |</li>
<li><a href="./login.html">Iniciar sesión</a></li>
</ul>
</nav>
<div class="hero">
<div class="hero__h1--font flexCenter">
<h1>Topico es un lugar para escribir, leer y conectarse</h1>
<a href="./login.html" class="boton1">Comenzá a escribir</a>
</div>
<div id="imgHero">
<img src="./assets/books-1245690_640.jpg" alt="libros">
</div>
</div>
<div class="tendencias">
<h2>Tendencias en Topico</h2>
<ol class="tendencias__ol">
<li class="tendencias__ol--ico1">
<h3 class="tendencias__ol__h3--caps">Por qué ya no deberías usar Docker.</h3>
<p class="tendencias__autor"><img src="./assets/iconos/star.svg" alt="icono estrella"> Sofía
Pascal<span class="tendencias__ol__fecha--color"> - 18 Sept</span></p>
<span class="topico">#Docker</span>
</li>
<li class="tendencias__ol--ico2">
<h3 class="tendencias__ol__h3--caps">Cosas totalmente ilógicas que la gente con problemas
financieros hace provocando que sus cuentas permanenzcan en rojo.</h3>
<p class="tendencias__autor"><img src="./assets/iconos/star.svg" alt="icono estrella"> Pedro
Saborido<span class="tendencias__ol__fecha--color"> - 18 Sept</span></p>
<span class="topico">#Dinero</span>
</li>
<li class="tendencias__ol--ico3">
<h3 class="tendencias__ol__h3--caps">Evento Full-Stack Developer Tech Stack 2021.</h3>
<p class="tendencias__autor"> <img src="./assets/iconos/star.svg" alt="icono estrella"> Paula
Giménez<span class="tendencias__ol__fecha--color"> - 15 Sept</span></p>
<span class="topico">#DesarrolloWeb</span>
</li>
<li class="tendencias__ol--ico4">
<h3 class="tendencias__ol__h3--caps">7 cosas estúpidas que la sociedad quiere que hagas.</h3>
<p class="tendencias__autor"> <img src="./assets/iconos/star.svg" alt="icono estrella"> Pedro
Rosemblat<span class="tendencias__ol__fecha--color"> - 17 Sept</span></p>
<span class="topico">#Motivación</span>
</li>
<li class="tendencias__ol--ico5">
<h3 class="tendencias__ol__h3--caps">7 pequeños proyectos que podes hacer como desarrollador para
hacer un dinero extra.</h3>
<p class="tendencias__autor"> <img src="./assets/iconos/star.svg" alt="icono estrella"> Marta
Pérez<span class="tendencias__ol__fecha--color"> - 12 Sept</span></p>
<span class="topico">#DesarrolloSoftware</span>
</li>
<li class="tendencias__ol--ico6">
<h3 class="tendencias__ol__h3--caps">Por qué tener más de un monitor puede ser contraproducente para
el desarrollador.</h3>
<span class="tendencias__autor"> <img src="./assets/iconos/star.svg" alt="icono estrella"> Carlos
Scotch<span class="tendencias__ol__fecha--color"> - 16 Sept</span></p>
<span class="topico">#Productividad</span>
</li>
</ol>
</div>
<main class="publicaciones">
<h3>Ultimas publicaciones</h3>
<form>
<select name="orden">
<option value="Fecha">Fecha</option>
<option value="Mejor valorados">Mejor valorados</option>
<option value="Mas vistos">Más vistos</option>
</select>
</form>
<article class="publicaciones__articulo">
<h4 class="publicaciones__articulo--ml publicaciones__articulo--marron">Máquina de vectores de soporte
(SVM). Machine Learning para principiantes.</h4>
<div class="articulo__contenido">
<img class="articulo__contenido--mx articulo__contenido--161px" src="./assets/machine.jpeg"
alt="hongos variados">
<p class="publicaciones__articulo--ml articulo__contenido--order-width50">Una guía completa para
comenzar a practicar el Machine Learning (ML) en Python para principiantes con ejemplos
prácticos...</p>
</div>
<p class="publicaciones__articulo--ml-10-mb-2">#MachineLearning</p>
</article>
<article class="publicaciones__articulo">
<h4 class="publicaciones__articulo--ml publicaciones__articulo--marron">5 hábitos de los trabajadores
remotos altamente ineficaces</h4>
<div class="articulo__contenido">
<img class="articulo__contenido--mx articulo__contenido--161px" src="./assets/videollamada.jpeg"
alt="videollamada">
<p class="publicaciones__articulo--ml articulo__contenido--order-width50">Por favor, por el amor de
Dios, deja de hacer estas cosas...</p>
</div>
<p class="publicaciones__articulo--ml-10-mb-2">#Teletrabajo</p>
</article>
<article class="publicaciones__articulo">
<h4 class="publicaciones__articulo--ml publicaciones__articulo--marron">Esta tecnología tan esperada
podría finalmente cambiar el mundo</h4>
<div class="articulo__contenido">
<img class="articulo__contenido--mx articulo__contenido--161px"
src="./assets/1_GlIDBz93SkiY0H9Ib7rObQ.jpeg" alt="research">
<p class="publicaciones__articulo--ml articulo__contenido--order-width50">Las baterías de estado
sólido están listas para surgir en los próximos años</p>
</div>
<p class="publicaciones__articulo--ml-10-mb-2">#Tecnología</p>
</article>
<article class="publicaciones__articulo">
<h4 class="publicaciones__articulo--ml publicaciones__articulo--marron">12 herramientas React JS para
desarrolladores</h4>
<div class="articulo__contenido">
<img class="articulo__contenido--mx articulo__contenido--161px" src="./assets/react.png"
alt="Herramientas react">
<p class="publicaciones__articulo--ml articulo__contenido--order-width50">Hoy vamos a indagar en
herramientas y bibliotecas para ayudar a los desarrolladores en la programación de procesos con
React JS!</p>
</div>
<p class="publicaciones__articulo--ml-10-mb-2">#React</p>
</article>
<article class="publicaciones__articulo">
<h4 class="publicaciones__articulo--ml publicaciones__articulo--marron">AlgoExpert vs. HackerRank vs.
LeetCode</h4>
<div class="articulo__contenido">
<img class="articulo__contenido--mx articulo__contenido--161px" src="./assets/challenge.png"
alt="Desafíos de programación">
<p class="publicaciones__articulo--ml articulo__contenido--order-width50">¿Qué es lo mejor para vos?
¿Romperla en entrevistas? ¿Mejorar tu habilidad con los algoritmos?</p>
</div>
<p class="publicaciones__articulo--ml-10-mb-2">#Algoritmos</p>
</article>
</main>
<aside class="indexGrid__aside">
<h3>Descubrí más sobre los tópicos de tu interés</h3>
<br>
<ol class="aside__ol">
<li class="aside__ol--justCntr topico">#MachineLearning</li>
<li class="aside__ol--justCntr topico">#Tecnología</li>
<li class="aside__ol--justCntr topico">#Teletrabajo</li>
<li class="aside__ol--justCntr topico">#Salud</li>
<li class="aside__ol--justCntr topico">#DesarrolloWeb</li>
<li class="aside__ol--justCntr topico">#Productividad</li>
<li class="aside__ol--justCntr topico">#Dinero</li>
<li class="aside__ol--justCntr topico">#DesarrolloSoftware</li>
<li class="aside__ol--justCntr topico">#Motivación</li>
<li class="aside__ol--justCntr topico">#React</li>
<li class="aside__ol--justCntr topico">#Algoritmos</li>
</ol>
<br>
<a class="topico" href="./index.html">Ver todos los Topicos...</a>
</aside>
<footer class="indexGrid__footer">
<ul>
<li><a href="./404.html">Ayuda |</a></li>
<li><a href="./404.html"> Escritores |</a></li>
<li><a href="./404.html"> Blog |</a></li>
<li><a href="./404.html"> Carreras |</a></li>
<li><a href="./404.html"> Privacidad |</a></li>
<li><a href="./404.html"> Términos |</a></li>
<li><a href="./404.html"> Sobre nosotros</a></li>
</ul>
<p class="indexGrid__footer--font-p">Este sitio está inspirado en <a
href="https://medium.com/"><strong>Medium.com</strong></a>, tomando su diseño como
referencia, con el objetivo de practicar su desarrollo.</p>
</footer>
</div>
</body>
</html>