-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
157 lines (151 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
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" href="/assets/favicon/favicon.ico" type="image/x-icon">
<title>Newsquill</title>
<link rel="stylesheet" href="/src/css/index.css">
<link rel="stylesheet" href="/src/css/style.css">
</head>
<body class="pagina-inicial">
<header class="cabecalho">
<div class="mini-container-nav">
<nav class="navbar">
<a href="index.html" class="nav-link">Home</a>
<a href="ultimas-noticias.html" class="nav-link">Notícias Recentes</a>
<a href="/pages/adicao-noticia.html" class="nav-link">Adicionar Notícias</a>
</nav>
</div>
<figure class="mini-container-logo">
<img src="/assets/images/logo.png" alt="Logo do Site" class="logo">
</figure>
<div class="mini-container-busca">
<div class="barra-pesquisa">
<button class="botao-pesquisar">
<img src="/assets/svg/lupa.svg" alt="Ícone lupa de pesquisa">
</button>
<input type="search" placeholder="Pesquisar" class="barra-pesquisa-pesquisar">
</div>
</div>
</header>
<main class="container">
<div class="pagina-inicial-medio-container">
<div class="pagina-inicial-imagem-noticia-primaria">
<!-- <img src="/assets/images/noticia-yun-li-album.png" alt="Capa de notícia"> -->
<h1 class="pagina-inicial-titulo-noticia-nivel-primario">Yun Li Anuncia Lançamento do Álbum "Bons Tempos" para 17 de Agosto com Trailer Oficial</h1>
</div>
<hr>
<section class="pagina-inicial-sessao-noticias-terciarias">
<article class="pagina-inicial-noticia-terciaria">
<h3 class="titulos-noticias-nivel-terciario">Astronauta Pede Silêncio: Nasa Encontra "Planta Inusitada" Na Iss</h3>
<p class="descricao-noticia-terciaria">Na Estação Espacial Internacional durante uma transmissão ao vivo, um astronauta foi flagrado segurando uma sacola com um conteúdo inusitado dentro, maconha.</p>
</article>
<article class="pagina-inicial-noticia-terciaria">
<h3 class="titulos-noticias-nivel-terciario">Estudo Mostra: 100% Dos Apostadores Desistem Antes De Ficarem Ricos</h3>
<p class="descricao-noticia-terciaria">O estudo analisou o comportamento de milhares de apostadores em diversos jogos de azar ao redor do mundo, e constatou que o principal motivo para a desistência é a falta de dinheiro para continuar apostando.</p>
</article>
<article class="pagina-inicial-noticia-terciaria">
<h3 class="titulos-noticias-nivel-terciario">Peru Inova Ao Treinar Macacos Snipers Para Reforçar Forças Armadas</h3>
<p class="descricao-noticia-terciaria">Este novo projeto, apelidado de "Operação Bananas Táticas", visa agregar uma nova dimensão às estratégias militares do país, prometendo uma combinação inusitada de macaquice e alta precisão balística.</p>
</article>
</section>
<hr>
<section class="pagina-inicial-sessao-noticias-secundarias">
<div class="pagina-inicial-noticia-secundaria" style="margin-bottom: 30px;"> <!--o JOAO adicionou esse "style"-->
<img src="/assets/images/noticia-churros-grecia.png" alt="Capa de notícia">
<article class="pagina-inicial-artigo-noticia-secundaria">
<h2 class="titulo-noticia-secundaria">Arqueólogos estudam churros gigantes na grécia</h2>
<p class="descricao-noticia-secundaria">Um grupo de arqueólogos está desvendou mistério fascinante em uma nova escavação: estátuas gigantes de churros. Esses monumentos deliciosos e recheados estão intrigando os especialistas, que buscam entender seu e propósito na antiga civilização grega.</p>
</article>
</div>
<div class="pagina-inicial-noticia-secundaria">
<img src="/assets/images/noticia-filha-engravidou-em-piscina.png" alt="Capa de notícia">
<article class="pagina-inicial-artigo-noticia-secundaria">
<h2 class="titulo-noticia-secundaria">mãe afirma que filha engravidou após entrar em piscina de hotel</h2>
<p class="descricao-noticia-secundaria">Segundo a senhora Jurlena dos Santos, sua filha, Clara, teria engravidado após um mergulho na piscina de um hotel. O inusitado depoimento está provocando debates e levantando questões incomuns sobre os efeitos colaterais de produtos encontrados dentro de piscinas públicas.</p>
</article>
</div>
</section>
<hr>
<section class="pagina-inicial-sessao-noticias-terciarias">
<div class="pagina-inicial-noticia-terciaria">
<img src="/assets/images/noticia-crianca-aleatoria.png" alt="Capa de notícia">
<article class="pagina-inicial-artigo-noticia-terciaria">
<h3 class="titulos-noticias-nivel-terciario">veja como vive esta criança aleatória</h3>
<p class="descricao-noticia-terciaria">A vida impressionante de um pequeno ser que ninguém conhece. Prepare-se para descobrir os detalhes surpreendentes da rotina diária de Lucas Trago, garoto de 7 anos que vive na cidade de Sobradinho, Piauí.</p>
</article>
</div>
<div class="pagina-inicial-noticia-terciaria">
<img src="/assets/images/noticia-governo-em-risco.png" alt="Capa de notícia">
<article class="pagina-inicial-artigo-noticia-terciaria">
<h3 class="titulos-noticias-nivel-terciario">Governo mundial em risco?</h3>
<p class="descricao-noticia-terciaria">Jovem está criando furor que vai além do seu país, desafiando não só o governo autoritário local, mas também o governo mundial. O garoto, que se autodenomina “O Futuro Rei dos Piratas”, está causando ondas em uma escala global com sua ousada rebeldia.</p>
</article>
</div>
<div class="pagina-inicial-noticia-terciaria">
<img src="/assets/images/noticia-pm-apreende-jovem.png" alt="Capa de notícia">
<article class="pagina-inicial-artigo-noticia-terciaria">
<h3 class="titulos-noticias-nivel-terciario">pm apreende jovem de 7 anos com entorpecentes</h3>
<p class="descricao-noticia-terciaria">O menino ignorou a ordem de parada e iniciou uma longa fuga de 4h. A perseguição envolveu diversas viaturas e helicópteros, que tentaram interceptar a bicicleta de rodinhas em diversas ocasiões antes de disparos fossem realizados.</p>
</article>
</div>
</section>
</div>
<aside class="pagina-inicial-aside">
<h2 class="pagina-inicial-titulo-aside">Ultímas Notícias</h2>
<div class="pagina-inicial-noticias-aside">
<section class="pagina-inicial-noticia-aside">
<img src="/assets/images/noticia-exposicao-arte-contemporanea.png" alt="Capa de notícia">
<h3 class="pagina-inicial-titulos-noticias-nivel-terciario"><a class="pagina-inicial-titulos-noticias-nivel-terciario" href="#">Exposição Internacional de Arte Contemporânea Atrai Visitantes de Todo o Mundo</a></h3>
</section>
<section class="pagina-inicial-noticia-aside">
<img src="/assets/images/noticia-preservacao-biodeiversidade.png" alt="Capa de notícia">
<h3 class="pagina-inicial-titulos-noticias-nivel-terciario"><a class="pagina-inicial-titulos-noticias-nivel-terciario" href="#">Nova Política Nacional de Preservação da Biodiversidade Entra em Vigor</a></h3>
</section>
<section class="pagina-inicial-noticia-aside">
<img src="/assets/images/noticia-transporte-publico-sustentavel.png" alt="Capa de notícia">
<h3 class="pagina-inicial-titulos-noticias-nivel-terciario"><a class="pagina-inicial-titulos-noticias-nivel-terciario" href="#">Sistema de Transporte Público Sustentável Inaugurado em Grande Cidade</a></h3>
</section>
<section class="pagina-inicial-noticia-aside">
<img src="/assets/images/noticia-reestruturacao-industriais.png" alt="Capa de notícia">
<h3 class="pagina-inicial-titulos-noticias-nivel-terciario"><a class="pagina-inicial-titulos-noticias-nivel-terciario" href="/pages/detalhe-noticia.html">Reestruturação de Setores Industriais Visa Impulsionar a Economia Nacional</a></h3>
</section>
<section class="pagina-inicial-noticia-aside">
<img src="/assets/images/noticia-computacao-quantica.png" alt="Capa de notícia">
<h3 class="pagina-inicial-titulos-noticias-nivel-terciario"><a class="pagina-inicial-titulos-noticias-nivel-terciario" href="#">Avanços em Computação Quântica Abertos ao Público com Novo Super computador</a></h3>
</section>
</div>
</aside>
</main>
<nav class="paginacao">
<button class="icon-setas">
<img src="/assets/svg/seta-esquerda.svg" alt="Seta esquerda da paginação">
</button>
<button class="botao-paginacao-selecionado">
<a class="link-paginacao" href="home.html">1</a>
</button>
<button style="margin: 5px;" class="botao-paginacao"> <!--O Joao adicionou o "style="margin: 5px;" para separar tudo os botaozin-->
<a class="link-paginacao" href="pagina02">2</a>
</button>
<button class="botao-paginacao">
<a class="link-paginacao" href="pagina03">3</a>
</button>
<button class="icon-setas">
<img src="/assets/svg/seta-direta.svg" alt="Seta direita da paginação">
</button>
</nav>
<footer class="rodape">
<p class="marca-d-agua">© 2024 Newsquill | Todos os direitos reservados.</p>
<div class="creditos">
<p class="sobre-desenvolvedores">Desenvolvido por:</p>
<ul class="desenvolvedores">
<li>Rudney Viana</li>
<li>João Müller</li>
<li>Leonardo Urman</li>
<li>Gabriel Mattia</li>
</ul>
</div>
</footer>
</body>
</html>