-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
132 lines (117 loc) · 6.09 KB
/
Copy pathindex.html
File metadata and controls
132 lines (117 loc) · 6.09 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
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<title>Banda Phantogram</title>
<link rel="stylesheet" href="/phantogram_web/styles/style.css">
</head>
<body>
<header class="header">
<div class="logo">
<img src="/phantogram_web/images/logoM.png" alt="Logo da Banda Phantogram" width="100" height="100"> </div>
</div>
<nav class="menu">
<ul>
<li><a href="/phantogram_web/index.html">Home</a></li>
<li><a href="/phantogram_web/events.html/about.html">Sobre</a></li>
<li><a href="/phantogram_web/events.html/music.html">Músicas</a></li>
<li><a href="/phantogram_web/events.html/tour.html">Tour</a></li>
<li><a href="/phantogram_web/events.html/gallery.html">Galeria</a></li>
<li><a href="/phantogram_web/events.html/contact.html">Contato</a></li>
</ul>
</nav>
</header>
<main class="index-content">
<section class="banner">
<!-- Banner ou slider destacando as últimas músicas ou shows -->
</section>
<section class="highlighted-songs">
<!-- Destaque das músicas mais populares ou últimos lançamentos -->
</section>
<section class="about-band">
<!-- Resumo sobre a banda -->
</section>
<section class="social-media">
<!-- Links para as redes sociais -->
</section>
<section class="video-gallery">
<h2>Vídeo Promocional ou Galeria de Fotos</h2>
<!-- Para um vídeo promocional -->
<div class="video-container">
<iframe width="560" height="315" src="https://www.youtube.com/embed/wtNnefDtujA" frameborder="0" allowfullscreen></iframe>
</div>
<!-- Para uma galeria de fotos -->
<div class="image-gallery">
<div class="image-item">
<a href="/phantogram_web/events.html/gallery.html">
<img src="/phantogram_web/images/darkig.jpg" alt="Imagem 1">
<svg class="plus-icon" xmlns="http://www.w3.org/2000/svg" width="50" height="50" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<line x1="12" y1="5" x2="12" y2="19"></line>
<line x1="5" y1="12" x2="19" y2="12"></line>
</svg>
</a>
</div>
<div class="image-item">
<a href="/phantogram_web/events.html/gallery.html">
<img src="/phantogram_web/images/phanto.jpg" alt="Imagem 2">
<svg class="plus-icon" xmlns="http://www.w3.org/2000/svg" width="50" height="50" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<line x1="12" y1="5" x2="12" y2="19"></line>
<line x1="5" y1="12" x2="19" y2="12"></line>
</svg>
</a>
</div>
<div class="image-item">
<a href="/phantogram_web/events.html/gallery.html">
<img src="/phantogram_web/images/pha2.jpg" alt="Imagem 3">
<svg class="plus-icon" xmlns="http://www.w3.org/2000/svg" width="50" height="50" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<line x1="12" y1="5" x2="12" y2="19"></line>
<line x1="5" y1="12" x2="19" y2="12"></line>
</svg>
</a>
</div>
<!-- Adicione quantas imagens desejar -->
</div>
</section>
<section class="newsletter">
<!-- Formulário de inscrição para newsletter -->
</section>
<section class="tour-dates">
<!-- Calendário de shows ou próximos eventos -->
</section>
<section class="contact">
<!-- Informações de contato -->
</section>
</main>
<footer class="footer">
<div class="contact-info">
<h3>Contato</h3>
<p>E-mail: contato@phantogram.com</p>
<p>Telefone: (XX) XXXX-XXXX</p>
</div>
<div class="social-links">
<h3>Redes Sociais</h3>
<ul>
<li><a href="https://www.facebook.com/phantogram" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 15V9l5 3-5 3z"/></svg></a></li>
<li><a href="https://twitter.com/phantogram" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M22.46 2.05a9 9 0 01-2.54.695 4.5 4.5 0 001.965-2.485 9.013 9.013 0 01-2.845 1.09 4.498 4.498 0 00-7.677 4.104A12.773 12.773 0 011.52 2.527a4.5 4.5 0 001.398 6.005 4.472 4.472 0 01-2.04-.564v.057a4.5 4.5 0 003.616 4.425 4.482 4.482 0 01-2.034.077 4.5 4.5 0 004.2 3.125 9.048 9.048 0 01-5.585 1.925 12.798 12.798 0 006.918 2.027c8.3 0 12.84-6.876 12.84-12.84 0-.196-.005-.392-.015-.586a9.172 9.172 0 002.252-2.342z"/></svg></a></li>
<li><a href="https://www.instagram.com/phantogram/" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24" stroke="currentColor"><rect width="20" height="20" x="2" y="2" rx="5" ry="5"/><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 10.5a4.5 4.5 0 11-9 0 4.5 4.5 0 019 0z"/></svg></a></li>
<!-- Adicione outros ícones ou links para redes sociais aqui -->
</ul>
</div>
<div class="newsletter">
<h3>Assine nosso Boletim</h3>
<form action="#" method="post">
<input type="email" name="email" placeholder="Seu e-mail" required>
<button type="submit">Assinar</button>
</form>
</div>
<div class="additional-links">
<h3>Links Úteis</h3>
<ul>
<li><a href="https://www.phantogram.com/music" target="_blank">Músicas</a></li>
<li><a href="https://www.phantogram.com/store" target="_blank">Loja</a></li>
<!-- Adicione outros links úteis aqui -->
</ul>
</div>
</footer>
</body>
</html>