-
Notifications
You must be signed in to change notification settings - Fork 1
Expand file tree
/
Copy pathindex.html
More file actions
272 lines (232 loc) · 18.4 KB
/
index.html
File metadata and controls
272 lines (232 loc) · 18.4 KB
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
<!DOCTYPE html>
<html lang="pt-br">
<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">
<link rel="stylesheet" href="css/principal.css">
<link rel="shortcut icon" href="imagem/photofocus.ico" type="image/x-icon">
<title>PhotoFocus</title>
</head>
<body>
<header>
<nav class="nav-bar">
<div class="logo"></div>
<div class="nav-list">
<ul>
<li class="nav-item"><a href="index.html" class="nav-link">Início</a></li>
<li class="nav-item"><a href="sobre.html" class="nav-link">Sobre</a></li>
<li class="nav-item"><a href="paisagem.html" class="nav-link">Paisagem</a></li>
<li class="nav-item"><a href="retrato.html" class="nav-link">Retrato</a></li>
<li class="nav-item"><a href="jornalismo.html" class="nav-link">Jornalismo</a></li>
<li class="nav-item"><a href="publicidade.html" class="nav-link">Publicidade</a></li>
</ul>
</div>
<div class="mobile-menu-icon">
<button onclick="menuShow()"><img class="icon" src="imgs/menu_.svg" alt=""></button>
</div>
</nav>
<div class="mobile-menu">
<ul>
<li class="nav-item"><a href="index.html" class="nav-link">Início</a></li>
<li class="nav-item"><a href="sobre.html" class="nav-link">Sobre</a></li>
<li class="nav-item"><a href="paisagem.html" class="nav-link">Paisagem</a></li>
<li class="nav-item"><a href="retrato.html" class="nav-link">Retrato</a></li>
<li class="nav-item"><a href="jornalismo.html" class="nav-link">Jornalismo</a></li>
<li class="nav-item"><a href="publicidade.html" class="nav-link">Publicidade</a></li>
</ul>
</div>
</header>
<div class="container">
<div id="slide">
<div class="item" style="background-image: url(imgs/principal/slide1.jpg);" aria-label="Cena ao pôr do sol em uma majestosa cordilheira: tons deslumbrantes de rosa e laranja pintam o céu sobre picos cobertos de neve. Montanhas com bordas recortadas e altas se estendem pela imagem. A luz fraca do dia destaca as encostas nevadas, criando uma atmosfera serena. A neve reflete as cores suaves do pôr do sol. Com o anoitecer, as montanhas se tornam silhuetas, trazendo um toque de mistério. A imagem evoca a grandeza da natureza, símbolo de força e beleza, transmitindo paz e tranquilidade." role="img">
<div class="content">
<div class="name">PAISAGEM</div>
<div class="des">Capturando momentos, contando histórias e celebrando a arte da fotografia.</div>
<a href="paisagem.html"><button style="clear: left;">Veja Mais</button></a>
<button id="mud" onclick="mudaCor1()"></button>
</div>
</div>
<div class="item" style="background-image: url(imgs/principal/slide2.jpg);" aria-label="Cena elegante com uma mulher em vestido vermelho vibrante em uma sala iluminada. Sua postura expressa confiança, com cabelos escuros e expressão serena voltada para a janela. Mãos delicadas repousam no parapeito, e uma mesa com vaso de planta ao lado adiciona frescor ao ambiente. A imagem evoca elegância, beleza e contemplação." role="img">
<div class="content">
<div class="name">RETRATO</div>
<div class="des">Uma ótima fotografia é uma expressão completa do que se sente</div>
<a href="retrato.html"><button>Veja Mais</button></a>
<button id="mud" onclick="mudaCor2()"></button>
</div>
</div>
<div class="item" style="background-image: url(imgs/principal/slide3.jpg)" aria-label="Cena na praia com grupo de pessoas envolvidas em atividades para preservação do oceano. Destaque para um barco onde pessoas seguram placa Salve o Oceano, indicando defesa pela preservação marinha, enfatizando evento futuro relacionado à causa. Homem e criança ao lado de saco de lixo indicam ação de limpeza da praia. Mais à direita, homem e menino no cais celebram. No primeiro plano, crianças brincam, realçando conscientização nas gerações mais jovens. Imagem transmite urgência e união para salvar o oceano, com ambiente praiano tranquilo ao fundo." role="img">
<div class="content">
<div class="name">JORNALISMO</div>
<div class="des">A fotografia é a arte de congelar momentos no tempo, permitindo que as memórias durem para sempre</div>
<a href="jornalismo.html"><button>Veja Mais</button></a>
<button id="mud" onclick="mudaCor3()"></button>
</div>
</div>
<div class="item" style="background-image: url(imgs/principal/slide4.jpg)" aria-label="Cena vibrante com destaque para três xícaras de café em tons de amarelo. Uma xícara contém grãos de café, outra com café fumegante sobre um pires, e a terceira exibe elegância sobre fundo amarelo. Composição harmoniosa em triângulo visualmente agradável. Da textura dos grãos à xícara fumegante, a imagem transmite a essência do café em vários estágios. Celebração do simples prazer de uma xícara de café, convidando à tranquilidade e reflexão." role="img">
<div class="content">
<div class="name">PUBLICIDADE</div>
<div class="des">O foco é a chave para transformar o comum em extraordinário na fotografia</div>
<a href="publicidade.html"><button>Veja Mais</button></a>
<button id="mud" onclick="mudaCor4()"></button>
</div>
</div>
<div class="item" style="background-image: url(imgs/principal/slide5.jpg);" aria-label="Cena noturna com atividades variadas: patinação, evento em palco, patinadores e skate. Pista de gelo iluminada no primeiro plano, com grupo de patinadores e palco com multidão ao lado. Destaque para uma garota de chapéu no meio da imagem. No fundo, pessoas patinando e andando de skate. O texto KAT DR na parte inferior indica possível local ou evento. A imagem captura a energia vibrante de atividades noturnas e de entretenimento." role="img">
<div class="content">
<div class="name">PAISAGEM</div>
<div class="des">O segredo de uma boa fotografia está no foco, na composição e na emoção que ela transmite</div>
<a href="sobre.html"><button>Veja Mais</button></a>
<button id="mud" onclick="mudaCor5()"></button>
</div>
</div>
<div class="item" style="background-image: url(imgs/principal/slide6.jpg);" aria-label="Cena com coleção de óleos essenciais sobre folhas de outono. Frasco azul Blue Ridge Hemp Co CBD Infused Gel no centro, rodeado por folhas. À direita, três frascos de óleo CBD alinhados sobre uma folha. Etiqueta Blue Ridge Hero CBD na parte inferior. Imagem em close de pilha de folhas no canto superior direito, destacando a temporada outonal. No canto inferior esquerdo, frasco de óleo essencial sobre pilha de folhas, simbolizando conexão com a natureza. Rótulo: Blue Ridge Hemp Co CBD Oil na seção superior direita. A imagem destaca os produtos CBD e sua ligação com a natureza outonal." role="img">
<div class="content">
<div class="name">PUBLICIDADE</div>
<div class="des">Fotografar é encontrar a luz perfeita, ajustar o foco e criar uma obra de arte que conta uma história.</div>
<a href="jornalismo.html"><button>Veja Mais</button></a>
<button id="mud" onclick="mudaCor6()"></button>
</div>
</div>
</div>
<div class="buttons">
<button id="prev"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-caret-left-fill" viewBox="0 0 16 16">
<path d="m3.86 8.753 5.482 4.796c.646.566 1.658.106 1.658-.753V3.204a1 1 0 0 0-1.659-.753l-5.48 4.796a1 1 0 0 0 0 1.506z"/>
</svg></button>
<button id="next"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-caret-right-fill" viewBox="0 0 16 16">
<path d="m12.14 8.753-5.482 4.796c-.646.566-1.658.106-1.658-.753V3.204a1 1 0 0 1 1.659-.753l5.48 4.796a1 1 0 0 1 0 1.506z"/>
</svg></button>
</div>
</div>
<main>
<div class="hidden" id="grade">
<div class="angry-grid">
<div id="item-0">
<h1>Mundo da Fotografia</h1>
<p>fotografia é mais do que apenas clicar em um botão. É uma forma de arte, uma maneira de capturar momentos inesquecíveis e contar histórias visuais.</p>
</div>
<div aria-label="Cena de aventureiros cavalgando por uma paisagem montanhosa. Um homem confiante lidera o grupo montado em um corcel poderoso, com uma águia majestosa em suas costas. Ao longe, outros indivíduos indicam mais emoção por vir, criando uma atmosfera de aventura." role="img" class="item-1"> </div>
<div aria-label="Cena noturna com uma árvore enfeitada por lanternas azuis e brancas, criando uma atmosfera mágica sob o luar. O brilho suave das lanternas reflete em enfeites de vidro azul nos galhos, evocando uma sensação tranquila e contemplativa." role="img" class="item-2"> </div>
<div aria-label="Mulher deitada entre flores coloridas, transmitindo tranquilidade. Lábios vermelhos são ponto focal, contrastando com o fundo floral. Vaso com arranjo encantador oferece cores e aromas agradáveis. Olho realçado por sombras marrons destaca expressão e beleza. Sardas em seu rosto contribuem para uma aparência jovial e única. Cabelo preto destaca-se entre as flores, criando uma composição envolvente. A imagem convida a apreciar a harmonia entre a natureza e a forma humana, trazendo sensação de paz e beleza." role="img" class="item-3"> </div>
<div aria-label="Cena de uma cabana pitoresca de madeira próxima a um lago calmo, rodeada por majestosas montanhas. Um trem solitário nos trilhos simboliza uma jornada em curso. Um céu dramático com nuvens suaves e uma pipa colorida representa alegria e aventura. Um barco no lago está pronto para a próxima excursão. A imagem transmite tranquilidade e aconchego na natureza montanhosa, oferecendo um refúgio pacífico." role= "img"class="item-4"> </div>
<div id="item-5">
<p> Explore diferentes estilos de fotografia, desde retratos deslumbrantes até paisagens impressionantes. Descubra técnicas avançadas e inspiração para suas próprias criações.</p>
</div>
<div aria-label="Mulher confiante de cabelos afro em jardim sereno, sentada graciosamente em um banco de pedra. Seus traços delicados são evidenciados pelo close-up do nariz. Um colar intrincado complementa sua beleza natural. Seu cabelo cacheado contribui para sua presença única. Cenário é um jardim pitoresco, acentuando a aura especial do momento." role="img" class="item-6"> </div>
</div>
</div>
<div id="sobre">
<div class="hidden" id="quadrado">
<div id="texto">
<h1>PhotoFocus</h1>
<p>Projetada para ajudar você a aprimorar suas habilidades, descobrir novas paixões e encontrar profissionais talentosos</p>
</div>
</div>
</div>
<div class="hidden" id="visao">
<div id="vis1">
<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" fill="currentColor" class="bi bi-images" viewBox="0 0 16 16">
<path d="M4.502 9a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3z"/>
<path d="M14.002 13a2 2 0 0 1-2 2h-10a2 2 0 0 1-2-2V5A2 2 0 0 1 2 3a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v8a2 2 0 0 1-1.998 2zM14 2H4a1 1 0 0 0-1 1h9.002a2 2 0 0 1 2 2v7A1 1 0 0 0 15 11V3a1 1 0 0 0-1-1zM2.002 4a1 1 0 0 0-1 1v8l2.646-2.354a.5.5 0 0 1 .63-.062l2.66 1.773 3.71-3.71a.5.5 0 0 1 .577-.094l1.777 1.947V5a1 1 0 0 0-1-1h-10z"/>
</svg>
<h2>Dicas</h2>
<p>Acesse dicas práticas e orientações de especialistas para aprimorar suas habilidades. Quer você seja um iniciante ou um profissional experiente.</p>
</div>
<div id="vis2">
<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" fill="currentColor" class="bi bi-person-fill-up" viewBox="0 0 16 16">
<path d="M12.5 16a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7Zm.354-5.854 1.5 1.5a.5.5 0 0 1-.708.708L13 11.707V14.5a.5.5 0 0 1-1 0v-2.793l-.646.647a.5.5 0 0 1-.708-.708l1.5-1.5a.5.5 0 0 1 .708 0ZM11 5a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"/>
<path d="M2 13c0 1 1 1 1 1h5.256A4.493 4.493 0 0 1 8 12.5a4.49 4.49 0 0 1 1.544-3.393C9.077 9.038 8.564 9 8 9c-5 0-6 3-6 4Z"/>
</svg>
<h2> Seja indicado</h2>
<p>Conecte-se com fotógrafos profissionais e especialistas em sua região. Encontre o parceiro perfeito para suas necessidades fotográficas.</p>
</div>
</div>
<div class="hidden" id="cart">
<div id="carts1" >
<div id="cart1" aria-label="Imagem de uma mulher com elegante vestido dourado e batom vermelho vibrante, emanando estilo e graciosidade. Sua postura confiante e radiante a torna o ponto focal, destacando sua elegância sofisticada. O vestido dourado brilhante realça sua figura, e o batom vermelho ousado adiciona um toque de glamour." role="img">
<a href="retrato.html">Veja +</a>
</div>
<div id="cart2" aria-label="Fotografia em preto e branco de um homem indígena com lança, pintura facial tribal e cocar de penas, destacando sua cultura e herança. A estética em escala de cinza enfatiza a atemporalidade e importância da imagem." role="img">
<a href="publicidade.html">Veja +</a>
</div>
</div>
<div id="carts2">
<div id="cart3" aria-label="Imagem do Jeff's Steak House, com letreiro de néon central, céu noturno ao fundo. Lata do Jeff's Grill, homem rindo à direita, letreiro Pilsner Urquell à direita, letreiro do Jeff's Steak House à esquerda. Texto: Bem-vindo ao Jeff's, a casa das pessoas felizes. Rótulos e marcas diversos, criando um ambiente animado e vibrante." role="img">
<a href="jornalismo.html">Veja +</a>
</div>
<div id="cart4" aria-label="Cena na Islândia: estrada sinuosa cercada por natureza intocada e montanhas ao longe com neve nos picos. Campos verdes vibrantes contrastam com o terreno rochoso. Figura solitária a cavalo na montanha e ciclista percorrendo a estrada, proporcionando sensação de tranquilidade e admiração na vastidão da paisagem." role="img">
<a href="paisagem.html">Veja +</a>
</div>
</div>
</div>
<div id="imgforms">
</div>
<div id="box">
<div class="hidden" id="container1">
<div class="top-header">
<h1>Quer ser indicado pelo nosso site?</h1>
</div>
<div class="input-field">
<input type="textarea" class="input" placeholder="Nome" required>
<i class="bx bx-user"></i>
</div>
<div class="input-field">
<input type="email" class="input" placeholder="Email" required>
<i class="bx bx-lock-alt"></i>
</div>
<div class="input-field">
<input type="textarea" class="input" placeholder="Mensagem" required>
<i class="bx bx-lock-alt"></i>
</div>
<div class="input-field">
<input type="submit" class="submit" value="Envie">
</div>
</div>
</div>
</main>
<footer>
<div id="caixa3">
<div class="caixa">
<h1>PhotoFocus</h1>
<br>
<p>
Bem-vindo ao PhotoFocus, o seu destino para explorar o mundo da fotografia de maneira profunda e criativa.
Estamos aqui para inspirar, educar e conectar entusiastas da fotografia como você.
</p>
</div>
<div class="caixa2">
<div id="oi">
<ul class="footer-list">
<li>
<a href="index.html" class="footer-link">Home</a>
</li>
<li>
<a href="sobre.html" class="footer-link">Sobre</a>
</li>
<li>
<a href="retrato.html" class="footer-link">Retrato</a>
</li>
</ul>
</div>
<div id="oi2">
<ul class="footer-list">
<li>
<a href="paisagem.html" class="footer-link">Paisagem</a>
</li>
<li>
<a href="jornalismo.html" class="footer-link">Jornalismo</a>
</li>
<li>
<a href="publicidade.html" class="footer-link">Publicidade</a>
</li>
</ul>
</div>
</div>
</div>
<div id="footer_copyrighp">
<p> © 2023 Copyright </p>
<img src="imagem/logoLinhaBranco.png" alt="">
</div>
</footer>
<script src="js/js.js"></script>
</body>
</html>