-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathalbum.html
132 lines (121 loc) · 6.77 KB
/
album.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
<!DOCTYPE html>
<html lang="es">
<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">
<title>Disco León - Subterráneo</title>
<link rel="stylesheet" href="album-styles.css">
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap" rel="stylesheet">
<link rel="icon" href="icono.png" type="image/png">
<!-- Open Graph Meta Tags para Social Cards -->
<meta property="og:title" content="Disco León - Subterráneo">
<meta property="og:description" content="Subterráneo es la vibrante esencia de León, Nicaragua, transformada en música.">
<meta property="og:image" content="bio.jpg">
<meta property="og:url" content="https://subterraneomusic.com/index.html">
<meta property="og:type" content="website">
<meta property="og:locale" content="es_ES">
<!-- Twitter Card Meta Tags -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Disco León - Subterráneo">
<meta name="twitter:description" content="Subterráneo es la vibrante esencia de León, Nicaragua, transformada en música.">
<meta name="twitter:image" content="bio.jpg">
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-4E923NB3HQ"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-4E923NB3HQ');
</script>
</head>
<body>
<!-- Menú de Navegación -->
<nav class="navbar">
<div class="nav-container">
<a href="index.html" class="nav-logo">
<img src="SUBTERRANEOLOGO.png" alt="Subterráneo Logo" class="logo-img">
</a>
<button class="nav-toggle" id="nav-toggle">
<span class="nav-toggle-icon"></span>
</button>
<ul class="nav-menu" id="nav-menu">
<li class="nav-item"><a href="index.html" class="nav-link">Inicio</a></li>
<li class="nav-item"><a href="band-page.html" class="nav-link">Biografía</a></li>
<li class="nav-item"><a href="mapa-leon.html" class="nav-link">Ruta Subterráneo</a></li>
<li class="nav-item"><a href="album.html" class="nav-link">Disco León</a></li>
<li class="nav-item"><a href="store.html" class="nav-link">Tienda</a></li>
</ul>
</div>
</nav>
<!-- Encabezado con la portada del álbum -->
<header class="album-header" style="padding-top: 100px;">
<img src="portada disco león2.png" alt="Portada del álbum Disco León" class="album-cover">
<h1>Disco León</h1>
<p>Este álbum conceptual es un viaje musical a través de las estaciones del subterraneo imaginario. Cada canción es una estación única que nos sumerge en el universo del latin funk, disco y city pop de León.</p>
</header>
<!-- Lista de canciones con descripciones -->
<section class="tracklist">
<!-- Lista de canciones con descripciones -->
<section class="tracklist">
<h2>Lista de Canciones</h2>
<ul>
<li class="track">
<h3>Funky Love</h3>
<p>Una estación llena de groove y romance.</p>
<a href="https://open.spotify.com/intl-es/track/6aQX82GweFeq01KG1qO0bO?si=ce55531e572a4143" class="btn-listen">Escuchar en Spotify</a>
</li>
<li class="track">
<h3>Amanecer</h3>
<p>La estación más alta de la ruta, con melodías vibrantes y electrónicas</p>
<a href="https://open.spotify.com/intl-es/track/0Z59Ert8jWHxIcTjd7yxDi?si=039634ee12d845ed" class="btn-listen">Escuchar en Spotify</a>
</li>
<li class="track">
<h3>La Pega</h3>
<p>Una estación especial que captura los sonidos de la ciudad.</p>
<a href="https://open.spotify.com/intl-es/track/5H3yKYaPa70nsn7vtVozoo?si=c9574ad0b1fe43a1" class="btn-listen">Escuchar en Spotify</a>
</li>
<li class="track">
<h3>Toda la noche</h3>
<p>Esta estación te lleva a una fiesta interminable bajo las luces de la ciudad.</p>
<a href="https://open.spotify.com/intl-es/track/3Sjp5ZVLKzLqTi8ll8IEeP?si=d483654936c54238" class="btn-listen">Escuchar en Spotify</a>
<a href="https://www.youtube.com/watch?v=3mcLxD68d5U" class="btn-watch" target="_blank">Ver en YouTube</a>
</li>
<li class="track">
<h3>Disco León</h3>
<p>La estación principal del subterráneo imaginario, donde el funk se encuentra con la poesía.</p>
<a href="https://open.spotify.com/intl-es/track/0gFGBpd6LiPLFMVidC9wg0?si=bbdd4c35722e4a01" class="btn-listen">Escuchar en Spotify</a>
<a href="https://www.youtube.com/watch?v=3mcLxD68d5U" class="btn-watch" target="_blank">Ver en YouTube</a>
</li>
<li class="track">
<h3>Lavanda</h3>
<p>Una estación perfumada y melódica, que te envuelve con su suavidad y encanto.</p>
<a href="https://open.spotify.com/intl-es/track/1RR4Ssmc640PaBIm8dEfeb?si=64bb95b83ab8426d" class="btn-listen">Escuchar en Spotify</a>
</li>
<li class="track">
<h3>El Vuelo</h3>
<p>La última estación de este viaje, como un tren que despega hacia nuevos horizontes.</p>
<a href="https://open.spotify.com/intl-es/track/5JvSykCQFREhciHEVyHuYq?si=debcc93bc7f842d0" class="btn-listen">Escuchar en Spotify</a>
</li>
</ul>
</section>
<!-- Pie de página -->
<footer class="footer">
<div class="footer-content">
<div class="social-links">
<a href="https://www.instagram.com/subterraneoni/" target="_blank"><img src="logo_ig.svg" alt="Instagram" class="social-icon"></a>
<a href="https://open.spotify.com/intl-es/artist/4j7E7qZ1spg0ysrBhAwFdf?si=lIIH2FeLTzqSjG_rDJkvtA" target="_blank"><img src="logo_spotify.svg" alt="Spotify" class="social-icon"></a>
<a href="https://www.youtube.com/@subterraneonicaragua" target="_blank"><img src="logo_yt.svg" alt="YouTube" class="social-icon"></a>
<a href="https://www.tiktok.com/@subterraneoni" target="_blank"><img src="logo_tiktok.svg" alt="TikTok" class="social-icon"></a>
</div>
<p>© 2024 Subterráneo. Todos los derechos reservados.</p>
</div>
</footer>
<script>
// Toggle del menú de navegación en móvil
document.getElementById('nav-toggle').addEventListener('click', function () {
document.getElementById('nav-menu').classList.toggle('active');
});
</script>
</body>
</html>