-
Notifications
You must be signed in to change notification settings - Fork 0
/
classic.html
107 lines (98 loc) · 6.51 KB
/
classic.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
<!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">
<title>Songday</title>
<link rel="stylesheet" href="my.css">
</head>
<body>
<h1>Songday</h1>
<nav class="navbar">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="punk.html">Punk</a></li>
<li><a href="metal.html">Metal</a></li>
<li><a href="classic.html">Classic</a></li>
</ul>
</nav>
<main>
<h3>This is the Classic Rock Page</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Ipsam minus eveniet recusandae dicta similique numquam voluptas quos tempore cupiditate pariatur, laudantium fugit alias quia veritatis nesciunt quaerat molestias adipisci assumenda.</p>
</main>
<!-- Video Grid Section -->
<section>
<h1>Rock and Roll Albums</h1>
<div class="video-grid">
<!-- Replace 'VIDEO_ID_1', 'VIDEO_ID_2', etc., with your actual video IDs -->
<div class="video-item">
<iframe width="560" height="315" src="https://www.youtube.com/embed/ibq2J3hDwR0?si=bRP3rAomJwY7Hx3h" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
<div class="video-item">
<iframe width="560" height="315" src="https://www.youtube.com/embed/iAIxUvd8gWo?si=eV8d0qwUiP9ln-Mj" title="Rush Moving Pictures"
frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
<div class="video-item">
<iframe width="560" height="315" src="https://www.youtube.com/embed/0hLESLXqBLI?si=GD5UIMoSXPS1bt_B" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
<div class="video-item">
<iframe
src="https://www.youtube.com/embed/4ryKUOjCgds"
frameborder="0"
allow="autoplay; encrypted-media"
allowfullscreen
></iframe>
</div>
<div class="video-item">
<iframe width="560" height="315" src="https://www.youtube.com/embed/oNvisutI0RE?si=PiuiR5dqDgPYDdg-" title="A̲e̲r̲o̲s̲mith - T̲o̲ys i̲n t̲h̲e A̲t̲t̲ic"
frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
<div class="video-item">
<iframe src="https://www.youtube.com/embed/tVADdyDFLXY?si=9z1bQgWCXmprGd_p"
title="Led Zeppelin - Presence" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
<div class="video-item">
<iframe width="560" height="315" src="https://www.youtube.com/embed/D4KQae9oMWs?si=pEtV_DmeinTti131" title="Pink Floyd Animals"
frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
allowfullscreen></iframe>
</div>
<div class="video-item">
<iframe width="560" height="315" src="https://www.youtube.com/embed/90zyF3gPF8M?si=svYfP6J1p5b9-fh-" title="Pink Floyd - Meddle " frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
<div class="video-item">
<iframe src="https://www.youtube.com/embed/AnO64VgPKZk?si=pADOqFALFmEDxKz8" title="Montrose-Sammy-Hagar" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
<div class="video-item">
<iframe src="https://www.youtube.com/embed/CEBTrOKfZXc?si=B18x735og_N7EKf2" title="Judas Priest British Steel" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
<div class="video-item">
<iframe src="https://www.youtube.com/embed/tP3Ek_Was_0?si=_tLJl7hlTpcx_c2w" title="Aerosmith 1973" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
<div class="video-item">
<iframe src="https://www.youtube.com/embed/Jf_c-fP06FQ?si=qNy3jakG20gBoqnj" title="Aerosmith Night in the Ruts" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
<div class="video-item">
<iframe src="https://www.youtube.com/embed/Ob-cZIsM9d4?si=FQnH_6bdUJownEjQ" title="Black Sabbath Born " frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
<div class="video-item">
<iframe src="https://www.youtube.com/embed/-c7HTl6uaEI?si=bf9ZkW5F1PXlNsIA" title="Alice Cooper Greatest Hits" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
<div class="video-item">
<iframe src="https://www.youtube.com/embed/LgzSXsSMMUA?si=XiuWxTSwJSh8MObA" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
<div class="video-item">
<iframe width="560" height="315" src="https://www.youtube.com/embed/MslaxkQpTdI?si=a36o35VfSrkck1r7" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
</div>
<!-- Add more video items as needed -->
</div>
</section>
<br>
<img src="rock-and-roll-canada-logl.png" alt="Rock and Roll Canada" class="center">
<br>
<div class="footer">
<a href="https://glensmith.ca">Glen Smith Web Developer Rock and Roll Canada</a>
<img src="glen-smith-web-dev.png" alt="Glen Smith Canadian Web Developer" class="center">
</div>
</body>
</html>