-
Notifications
You must be signed in to change notification settings - Fork 1
Expand file tree
/
Copy pathgallery.html
More file actions
153 lines (132 loc) · 5.93 KB
/
gallery.html
File metadata and controls
153 lines (132 loc) · 5.93 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
<html>
<head>
<title>Hack for Homeless</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="assets/css/main.css" />
</head>
<body>
<nav>
<ul class = "nav">
<li class = "nav2">
<a href = "index.html">Home</a>
</li>
<li class = "nav2">
<a href = "join.html">Sign Up</a>
</li>
<li class = "nav2">
<a href = "donate.html">Support</a>
</li>
<li class = "nav2">
<a href = "gallery.html">2024</a>
</li>
<li class = "nav2">
<a href = "about.html">Who Are We?</a>
</li>
</ul>
</nav>
<h6>Hack for Homeless 2024</h6>
<!-- <div class="scroll-container">
<img src="media/pic01.jpeg" alt="Cinque Terre">
<img src="media/pic01.jpeg" alt="Forest">
<img src="media/pic01.jpeg" alt="Northern Lights">
<img src="media/pic01.jpeg" alt="Mountains">
<img src="media/pic01.jpeg" alt="Cinque Terre">
<img src="media/pic01.jpeg" alt="Forest">
<img src="media/pic01.jpeg" alt="Northern Lights">
<img src="media/pic01.jpeg" alt="Mountains">
<img src="media/pic01.jpeg" alt="Cinque Terre">
<img src="media/pic01.jpeg" alt="Forest">
<img src="media/pic01.jpeg" alt="Northern Lights">
<img src="media/pic01.jpeg" alt="Mountains">
</div> -->
<!-- Takes the dimension of the largest image -->
<div class="gallery-container">
<div class="gallery">
<img src="media/gmain1.jpg" alt="Image 1">
<img src="media/gmain2.jpg" alt="Image 2">
<img src="media/gmain3.jpg" alt="Image 3">
<img src="media/gmain4.jpg" alt="Image 1">
<img src="media/gmain5.jpg" alt="Image 2">
<img src="media/gmain6.jpg" alt="Image 3">
</div>
</div>
<script>
document.addEventListener("DOMContentLoaded", function() {
// Select the gallery container
const galleryContainer = document.querySelector('.gallery');
// Clone each image within the gallery container and append it to the gallery
const images = galleryContainer.querySelectorAll('img');
images.forEach(function(image) {
const clone = image.cloneNode(true); // Clone the image with all its attributes
galleryContainer.appendChild(clone); // Append the clone to the gallery container
});
});
</script>
<h2 class = "aboutText">🥇 Boolean Hooligans: Lara De, Kai Sastry, Tanishka Bagade</h2>
<h3>Link to Video: </h3>
<h3>Link to Code: </h3>
<h3>Link to Presentation: </h3>
<div class="scroll-container">
<img src="media/g1_1.jpg" alt="Group 1 with medals">
<img src="media/g1_2.jpg" alt="Group 1 working">
</div>
<h2 class = "aboutText">🥈 Team Awesome: Ben Berol</h2>
<video width="320" height="240" class = "center" controls = "controls">
<source src="benhack.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
<h3>Link to Code: </h3>
<h3>Link to Presentation: </h3>
<div class="scroll-container">
<img src="media/g2_1.jpg" alt="Group 2 with medals">
<img src="media/g2_2.jpg" alt="Group 2 working">
</div>
<h2 class = "aboutText">🥉 Awesome Blossoms: Allison Zhan, Amy Key, Anna Suh, Katie Chen, Emily Hur</h2>
<h3>Link to Video: </h3>
<h3>Link to Code: </h3>
<iframe src="https://docs.google.com/presentation/d/e/2PACX-1vSQy9ApF-ygSwRnZf0NTvqzF4_SsuPCU5JScNZnY8DB8SFT4-uLe76hI6WLmiFY7Mhp0VXl8-5YQwHb/embed?start=false&loop=false&delayms=3000" frameborder="0" width="480" height="284" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true" class = "center"></iframe>
<div class="scroll-container">
<img src="media/g3_1.jpg" alt="Group 3 with medals">
<img src="media/g3_2.jpg" alt="Group 3 working">
</div>
<h2 class = "aboutText">Raptors: Swara Reddy, Sahasra Byreddy, Malika Niyazova, Aneesh Goshal</h2>
<video width="320" height="240" class = "right" controls = "controls">
<source src="/media/presentations/raptorVideo.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
<iframe src="https://docs.google.com/presentation/d/e/2PACX-1vT1aBbvw1luQM6yjr35GCBGJYXAwnUpISmlgku1DB-mHQi9407v9Djo8-p2q6O5SPLEn0raHILBDzB8/embed?start=false&loop=false&delayms=3000" frameborder="0" width="480" height="284" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true" class = "center"></iframe>
<div class="scroll-container">
<img src="media/g4_1.jpg" alt="Group 4 working">
<img src="media/g4_2.jpg" alt="Group 4 presenting">
</div>
<h2 class = "aboutText">Last Place: Avery Hyra, Xavier Kuo, Karol Grondelski, Alec Mahini, Anya Thomas </h2>
<h3>Link to Video: </h3>
<h3>Link to Code: </h3>
<h3>Link to Presentation: </h3>
<div class="scroll-container">
<img src="media/g5_1.jpg" alt="Group 5 posing">
<img src="media/g5_2.jpg" alt="Group 5 working">
</div>
<h2 class = "aboutText">Pixel Coders: Zackery Gast, Veera Anand, Oscar Anderson</h2>
<h3>Link to Video: </h3>
<h3>Link to Code: </h3>
<h3>Link to Presentation: </h3>
<div class="scroll-container">
<img src="media/g6_1.jpg" alt="Group 6 presenting">
<img src="media/g6_2.jpg" alt="Group 6 working">
</div>
<h2 class = "aboutText">Exchange: Abraham Tadesse</h2>
<h3>Link to Video: </h3>
<h3>Link to Code: </h3>
<iframe src="https://docs.google.com/presentation/d/e/2PACX-1vTwA4mPPLz2KwkHN_s219LNceOLmUJET300wRj_3DKJl4YI9MCAT_ZDF6pocgA3NUJuCy3_g-TtD7sc/embed?start=false&loop=false&delayms=3000" frameborder="0" width="480" height="284" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true" class = "center"></iframe>
<div class="scroll-container">
<img src="media/g7_1.jpg" alt="Group 7 working">
<img src="media/g7_2.jpg" alt="Group 7 presenting">
</div>
<footer id="footer">
<p class="copyright">© Mya Taheri + Wendy Abstone.</p>
</footer>
<script src="assets/js/main.js"></script>
</body>
</html>