-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
157 lines (137 loc) · 7.14 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
<!DOCTYPE html>
<html lang="en">
<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="description" content="O Relógio do Clima é um gráfico que marca o prazo mais importante de todos: o do Mundo.
O tempo nele presente indica a janela temporal disponível para evitarmos que os efeitos mais
nefastos relativos ao aquecimento global se tornem irreversíveis." />
<meta name="author" content="Inês Glavão & Margarida Souto">
<link rel="canonical" href="https://climateclock.pt/">
<meta property="og:type" content="website">
<meta property="og:title" content="Climate Clock Coimbra">
<meta property="og:url" content="https://climateclock.pt/">
<meta property="og:image" content="img/banner.jpg">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="627">
<meta property="og:site_name" content="Climate Clock Coimbra">
<meta property="og:description" content="O Relógio do Clima é um gráfico que marca o prazo mais importante de todos: o do Mundo.
O tempo nele presente indica a janela temporal disponível para evitarmos que os efeitos mais
nefastos relativos ao aquecimento global se tornem irreversíveis.">
<meta name="twitter:image" content="img/banner.jpg">
<meta name="twitter:title" content="Climate Clock Coimbra">
<meta name="twitter:description" content="O Relógio do Clima é um gráfico que marca o prazo mais importante de todos: o do Mundo.
O tempo nele presente indica a janela temporal disponível para evitarmos que os efeitos mais
nefastos relativos ao aquecimento global se tornem irreversíveis.">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<link rel="icon" type="image/png" href="img/favicon-32x32.png" sizes="32x32" />
<link rel="icon" type="image/png" href="img/favicon-16x16.png" sizes="16x16" />
<link rel="stylesheet" type="text/css" href="CSS/style.css">
<link rel="stylesheet" type="text/css" href="CSS/home.css">
<title>Climate Clock Coimbra</title>
</head>
<body>
<header>
<nav>
<div class="menuNav">
<a href="index.html"><img src="img/Logo_CCC_Pequeno-07.png" alt="logo-claro" width=150px></a>
<div id="hamburguer">
<span class="barra" id="barraCima"></span>
<span class="barra" id="barraMeio"></span>
<span class="barra" id="barraBaixo"></span>
</div>
<div id="menu">
<div class="menuInfo">
<ul>
<li><a href="index.html">HOME</a></li>
<li><a href="sobre.html">SOBRE</a></li>
<li><a href="parceiros.html">PARCEIROS</a></li>
<li><a href="sugestoes.html">SUGESTÕES SUSTENTÁVEIS</a></li>
</ul>
</div>
</div>
</nav>
</header>
<main>
<section id="fundo">
<div class="relogio">
<script src="https://climateclock.world/widget-v2.js" async pos></script>
<climate-clock />
</div>
<img src="img/UniversidadeCoimbra.png" alt="universidade_coimbra">
</section>
<section id="ciencia">
<h1>CIÊNCIA</h1>
<div class="cartoes">
<div class="cartoes-popup" id="popup">
<div class="popup-info">
<div class="texto-popup">
<h2 id="titulo"></h2>
<p id="informacao"></p>
</div>
<a href="#ciencia" id="fechar">
<span class=cruz id="cruz-cima"></span>
<span class=cruz id="cruz-baixo"></span>
</a>
</div>
</div>
<div class="cartao" id="ciencia1">
<h2>O que é o Relógio?</h2>
<p>O Relógio do Clima é um gráfico que marca o prazo mais importante de todos: o do Mundo.
O tempo nele presente indica a janela temporal disponível para evitarmos que os efeitos mais
nefastos relativos ao aquecimento global se tornem irreversíveis.</p>
<div class="mais-info botao-mais">
<a href="#ciencia" id="cartao1">Ler Mais</a>
</div>
</div>
<div class="cartao" id="ciencia2">
<h2>De onde vêm os dados em que se baseia o Relógio?</h2>
<p>O relógio baseia-se na investigação científica realizada pelos membros do IPCC (Painel
Intergovernamental sobre Mudanças Climáticas, do inglês Intergovernmental Panel on Climate
Change).</p>
<div class="mais-info botao-mais">
<a href="#ciencia" id="cartao2">Ler Mais</a>
</div>
</div>
<div class="cartao" id="ciencia3">
<h2>Porquê existir o Relógio do Clima?</h2>
<p>O relógio pretende consciencializar a população no sentido de serem alterados
comportamentos para evitar que seja ultrapassado o ponto de não retorno de 1.5º C
no aquecimento global.</p>
<div class="mais-info botao-mais">
<a href="#ciencia" id="cartao3">Ler Mais</a>
</div>
</div>
<div class="cartao" id="ciencia4">
<h2>O que podemos mudar?</h2>
<p>Qualquer mudança nas nossas prioridades e ações atuais podem evitar desastres
climáticos e definir o destino do nosso planeta. É necessário agir rápido, em
escala e de maneira coordenada, remando todos para o mesmo lado!</p>
<div class="mais-info">
<div class="botao-mais">
<a href="#ciencia" id="cartao4">Ler Mais</a>
</div>
</div>
</div>
</div>
</section>
</main>
<footer>
<h1>#ActInTime</h1>
<section id="contactos">
<div class="info">
<p>Climate Clock Coimbra <br>
</div>
<div class="icones">
<a href="https://www.instagram.com/climateclock.coimbra/?hl=pt" target="_blank"><img
src="img/Instagram.png" alt="instagram_icon" /></a>
<a href="https://www.linkedin.com/company/climate-clock-coimbra" target="_blank"><img
src="img/linkedIn.png" alt="linkedin_icon" /></a>
</div>
</section>
</footer>
<script src="JS/menu.js"></script>
<script src="JS/cartoesciencia.js"></script>
</body>