-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
310 lines (290 loc) · 16.4 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
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.min.js">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter&family=Poppins:wght@400;600&display=swap" rel="stylesheet">
<link rel="shortcut icon" href="../assets/favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="../nervaLandingPage/landingPage.css">
<title>Nerva • HomePage</title>
</head>
<body>
<header>
<div class="container flex-row">
<div class="header__logo">
<a href="#hero"><img src="../assets/logo.png" alt="Nerva Logo"></a>
</div>
<nav>
<ul class="header__menu flex-row">
<li><a href="#hero">Home</a></li>
<li><a href="#about">Sobre</a></li>
<li><a href="#services">Funcionalidades</a></li>
<li><a href="#projects">Estudos</a></li>
</ul>
</nav>
<div class="right flex-center">
<a href="../nervaTasks/nervaTasks.html" target="_blank" class="btn btn-secondary">Começar</a>
<div class="menu-btn">
<i class="fas fa-bars"></i>
</div>
</div>
</div>
</header>
<section id="hero" class="container flex-row">
<div class="hero__content">
<h1 class="title"> Seja Eficente, Seja Produtivo.</h1>
<p class="text" title="A ordem é um pequeno passo para o céu">
"Ordo est parvus gradus ad caelum."
</p>
<a href="../nervaTasks/nervaTasks.html" class="btn btn-primary">Testar Funcionalidades</a>
</div>
<div class="hero__img" >
<img src="../assets/Add tasks.gif" alt="">
</div>
</section>
<section id="about" class="container flex-center flex-column">
<h5 class="section-subheading">Sobre o projeto</h5>
<h2 class="section-heading text-center"></h2>
<div class="features text-center">
<div class="feature" style="--color: #005eff">
<div class="feature__icon">
<i class="fa-solid fa-globe"></i>
</div>
<h3 class="feature__title">ODS - ONU</h3>
<p class="feature__text">O projeto está diretamente alinhado com os Objetivos de Desenvolvimento Sustentável (ODS) propostos pela Organização das Nações Unidas (ONU), refletindo nosso compromisso em abraçar práticas e ações que visam um impacto positivo e alinhado aos princípios estabelecidos pelos ODS. </p>
</div>
<div class="feature" style="--color: #fe6786">
<div class="feature__icon">
<i class="fa-solid fa-book"></i>
</div>
<h3 class="feature__title">Educação de Qualidade</h3>
<p class="feature__text">O projeto foca no objetivo 4 (Educação de Qualidade) da ODS, especificamente, objetivo 4.4 - Até 2030, aumentar substancialmente o número de jovens e adultos que tenham habilidades relevantes, inclusive competências técnicas e profissionais, para emprego trabalho decente e empreendedorismo. </p>
</div>
<div class="feature" style="--color: #5cd8a5">
<div class="feature__icon">
<i class="fa-solid fa-tree"></i>
</div>
<h3 class="feature__title">Sustentabilidade</h3>
<p class="feature__text">O projeto tem como foco promover a sustentabilidade, tanto no contexto organizacional quanto pessoal. Alinhado com a ODS, o método sustentável do projeto é cultivar hábitos conscientes que contribuam para um ambiente mais equilibrado e sustentável. Visando além produtividade: O impacto social positivo.</p>
</div>
</div>
<div class="about__details flex-center">
<div class="about__details-content">
<h1>Organize, Planeje, Cumpra.</h1>
<p>Explore o Nerva, construa a sua jornada produtiva! Com recursos intuitivos e flexíveis, ele simplifica suas tarefas. Crie, organize e atinja seus objetivos com facilidade. Nerva possui funcionalidades que permitem filtrar, classificar e até destacar tarefas de estudo, acompanhadas pela possibilidade de uso do método Pomodoro. É hora de transformar suas tarefas em uma aventura produtiva!</p>
<a href="../nervaTasks/nervaTasks.html" class="btn btn-primary" target="_blank">Começar</a>
</div>
<div class="about__details-img">
<img src="../assets/Completed.gif" alt="Completed">
</div>
</div>
<div class="about__details flex-cente distance">
<div class="about__details-content">
<h1><div class="quotes"><i class="fa-solid fa-quote-left"></i> </div>Por quê Nerva?</h1>
<p>O nome 'Nerva' foi escolhido por sua conexão com a história romana, sendo reconhecido como um dos '<strong>Cinco Bons Imperadores</strong>'. Nerva reflete a ideia de liderança equilibrada, sabedoria e estabilidade, atributos estes,tem relação com o foco do projeto.</p>
<div class="nerva__N">
<h3>Marcus Cocceius Nerva</h3>
<p>(32-98 DC)</p>
</div>
</div>
<div class="about__details-img">
<img src="../assets/nerva.png" alt="Nerva">
</div>
</div>
</section>
<section id="services" style="background: url(../assets/services-bg.png); background-repeat: no-repeat; background-position: top; background-size: 100% 80%;">
<div class="container">
<h5 class="section-subheading"> O que oferecemos?</h5>
<h2 class="section-heading right">
Funcionalidades <br>atuais do Nerva.
</h2>
<div class="services">
<div class="service">
<div class="service-icon">
<i class="fa-regular fa-square-plus"></i>
</div>
<h3 class="services__title">Adicionar Tarefas</h3>
<p class="service__text">Faça acontecer! Adicione suas tarefas de forma simplificada e eficiente, transformando seus planos em ação imediata.</p>
<div class="arrow-icon">
<i class="fas fa-arrow-right"></i>
</div>
</div>
<div class="service">
<div class="service-icon">
<i class="fa-solid fa-calendar-days"></i>
</div>
<h3 class="services__title">Organização em Datas</h3>
<p class="service__text">Tempo é valioso! Organize suas tarefas por datas, garantindo que cada momento conte na busca pelos seus objetivos.</p>
<div class="arrow-icon">
<i class="fas fa-arrow-right"></i>
</div>
</div>
<div class="service">
<div class="service-icon">
<i class="fa-solid fa-book"></i>
</div>
<h3 class="services__title">Estudos</h3>
<p class="service__text">Aprender é sempre uma jornnada! Adicione tarefas relacionadas a estudos. Por quê não? Nunca é tarde para aprendizado.</p>
<div class="arrow-icon">
<i class="fas fa-arrow-right"></i>
</div>
</div>
<div class="service">
<div class="service-icon">
<i class="fa-regular fa-clock"></i>
</div>
<h3 class="services__title">Método Pomodoro</h3>
<p class="service__text">Potencialize seu tempo! Tenha a possibilidade de usar o Pomodoro, método comprovado focado para maximizar sua produtividade nos estudos.</p>
<div class="arrow-icon">
<i class="fas fa-arrow-right"></i>
</div>
</div>
<div class="service">
<div class="service-icon">
<i class="fa-solid fa-sort"></i>
</div>
<h3 class="services__title">Filtragem Organizada </h3>
<p class="service__text">Domine sua lista! Mantenha o controle, use nossos filtros de datas para uma organização impecável das suas listas de tarefas.</p>
<div class="arrow-icon">
<i class="fas fa-arrow-right"></i>
</div>
</div>
<div class="service">
<div class="service-icon">
<i class="fa-solid fa-tags"></i>
</div>
<h3 class="services__title">Tags (Construção)</h3>
<p class="service__text">Tags!Tags!Tags! Organize suas tarefas com Tags personalizadas, simplificando a organização das suas listas de tarefas.</p>
<div class="arrow-icon">
<i class="fa-regular fa-hourglass-half"></i>
</div>
</div>
</div>
</div>
</section>
<section id="projects" style="background: url(../assets/services-bg.png); background-repeat: no-repeat; background-position: left; background-size: 100% 100%; background-attachment: fixed;">
<div class="container">
<h5 class="section-subheading">Aprenda Mais!</h5>
<h2 class="section-heading">Matérias para se apronfudar em nossos objetivos.</h2>
<div class="projects">
<div class="project">
<div class="project__img">
<img src="../assets/At the office.gif" alt="ONU">
</div>
<div class="project__content">
<h3 class="project__category">ONU</h3>
<h3 class="project__title">Objetivos de Desenvolvimento Sustentável</h3>
<p class="project__text">Tenha mais informações sobre os objetivos de desenvolvimento sustentável promovidos pela agenda da ONU.</p>
<a href="https://brasil.un.org/pt-br/sdgs" target="_blank" class="btn btn-secondary">Clique Aqui <i class="fas fa-arrow-right"></i></a>
</div>
</div>
<div class="project">
<div class="project__img">
<img src="../assets/college project.gif" alt="ODS">
</div>
<div class="project__content">
<h3 class="project__category">ODS</h3>
<h3 class="project__title">Objetivo 4 - Educação de Qualidade</h3>
<p class="project__text">Tenha mais informações sobre o objetivo 4 da ODS - Educação de qualidade para promoção da sustentabilidade.</p>
<a href="https://brasil.un.org/pt-br/sdgs/4" target="_blank" class="btn btn-secondary">Clique Aqui <i class="fas fa-arrow-right"></i></a>
</div>
</div>
<div class="project">
<div class="project__img">
<img src="../assets/Bullet journal.gif" alt="GTD">
</div>
<div class="project__content">
<h3 class="project__category">Produtividade</h3>
<h3 class="project__title">Conheça o método GTD</h3>
<p class="project__text">Tenha mais informações sobre o método Getting Things Done (GTD) sobre produtividade, utilizado de base para o projeto.</p>
<a href="https://gettingthingsdone.com/" target="_blank" class="btn btn-secondary">Clique Aqui <i class="fas fa-arrow-right"></i></a>
</div>
</div>
<div class="project">
<div class="project__img">
<img src="../assets/Online article.gif" alt="Artigo">
</div>
<div class="project__content">
<h3 class="project__category">Artigo</h3>
<h3 class="project__title">Meu artigo para o projeto </h3>
<p class="project__text"><strong>(Construção)</strong> Conheça meu artigo desenvolvido para a fundamentação téorica do projeto.</p>
<a href="#"class="btn btn-secondary">Clique Aqui <i class="fa-regular fa-hourglass-half"></i></a>
</div>
</div>
</div>
</div>
</section>
<footer>
<div class="container">
<div class="footer__content">
<div class="footer__details">
<div class="footer__logo">
<a href="#"><img src="../assets/logo.png" alt="logo"></a>
</div>
</div>
<div class="footer_menu">
<h3 class="footer__menu__menu-title">Links Rápidos</h3>
<ul class="footer__menu__list">
<li><a href="#">Home</a></li>
<li><a href="#">Sobre</a></li>
<li><a href="#">Funcionalidades</a></li>
<li><a href="#">Estudos</a></li>
</ul>
</div>
<div class="footer__details hide-details">
<div class="details">
<div class="detail">
<div class="detail__icon">
<i class="fa-solid fa-user-tie"></i>
</div>
<div class="detail__content">
<h3>Criador</h3>
<a href="https://github.com/remyfonseca" target="_blank">
<p>Remy</p>
</a>
</div>
</div>
<div class="detail">
<div class="detail__icon">
<i class="fa-solid fa-envelope"></i>
</div>
<div class="detail__content">
<h3>Email</h3>
<p>remyydev@gmail.com</p>
</div>
</div>
<div class="detail">
<div class="detail__icon">
<i class="fa-solid fa-map-pin"></i>
</div>
<div class="detail__content">
<h3>Localização</h3>
<p>Salvador, BA.</p>
</div>
</div>
</div>
</div>
</div>
<div class="footer__bottom">
<div class="footer__bottom-icons">
<a href="https://github.com/remyfonseca" target="_blank" class="github">
<i class="fa-brands fa-github"></i>
</a>
<a href="https://www.linkedin.com/in/remyfonseca/" target="_blank" class="linkedIn">
<i class="fa-brands fa-linkedin"></i>
</a>
<a href="#" class="youtube">
<i class="fa-brands fa-youtube"></i>
</a>
</div>
<p>© 2023 <a href="https://github.com/remyfonseca" target="_blank">Remy</a>. Todos os Direitos Reservados.</p>
</div>
</div>
</footer>
<script src="../nervaLandingPage/landingPage.js"></script>
</body>
</html>