-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
288 lines (262 loc) · 9.36 KB
/
index.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
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
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
<!DOCTYPE html>
<!--Start of Simon's edits-->
<html>
<head>
<!--Simon| I formatted everybodys posts to follow Song/Album/Artist convention w same heading orders-->
<title>Team 7 Song Page</title>
</head>
<body>
<h1>Team 7 Song Page</h1>
<h3>Directory</h3>
<!--Rachel has changed this to be directory of all the songs-->
<!--Mark's Comment: Oh, interesting... you could add anchor tags to the list items to make them link to the different sections on the page. See if you can figure it out!-->
<ol>
<li>Earthmover</li>
<li>Fly Me To The Moon</li>
<li>Ancient Aliens</li>
<li>Crush</li>
</ol>
<h4>Simon's current favorite:</h4>
<h1>
<em><span style="color: brown"> Earthmover</span></em>
</h1>
<h2>
<!--Mark's Comment: while this works technically, it's bad form to nest textual types of elements into other textual types of elements, so nesting a div tag within a h tag is frowned upon. The h2 tag tells the browser that this line is a heading. Normally a heading doesn't include images and multiple lines of text-->
Deathconsciousness<br>
<small>Have a Nice Life</small>
<div>
<img src="https://img.discogs.com/gzPzzyhEKRmykldTb-Hu2m5MqYM=/fit-in/600x600/filters:strip_icc():format(jpeg):mode_rgb():quality(90)/discogs-images/R-1308408-1422926327-9891.jpeg.jpg"
alt=" Deathconsciousness" title="Have A Nice Life - Deathconsciousness" width="500" height="500" />
</div>
</h2>
<h3>
Lyrics
</h3>
<p>
<pre>
Carved out of stone
Earth, blood and bone
They knock the mountains down
The earth's grating sounds
They soothe the great machines
That yearn desperately
Just to lay them down
Within her gaping mouth
More than a symbol
More than I bargained for
More than a symbol
More than I bargained for
They wander ridges high
Between the earth and sky
Like spikes upon a crown
We wear upon our brow
And want is not a need
Reserved for human beings
Its fingers on your throat
Is pain that all things know
More than a symbol
More than I bargained for
More than a symbol
More than I bargained for
An army of the golems is stalking, now, the heart's lands
Eating all reality
Producing only dust and sand
Nothing hurts them
Nothing gets under their stone skin
And when their earthen mouths will open up
And just what words should come out but
<strong>"We wish we were dead"</strong>
</pre>
</p>
<!--End of Simons edits-->
<!--Rachel has edited the following song in referring to the site: https://www.w3schools.com/-->
<h4>Rachel's current favorite:</h4>
<h1>
<strong>Fly Me To The Moon</strong>
<!--Emphasis on song's title-->
</h1>
<h2>
<span style="color:red">Bayonetta OST</span>
<!--The game title is highlighted in red-->
<!--Mark's Comment: same comment as above in Simon's section... normally you wouldn't have a div element within a h element-->
<div>
Singer: <em>Brenda Lee</em>
<!--This song is a remix of an older song, so there are two credits-->
<small>Original by Bart Howard</small>
</div>
</h2>
<img src="https://images-na.ssl-images-amazon.com/images/I/618EgDVTEcL._SX522_.jpg" alt="Bayonetta OST Cover"
title="Fly Me To The Moon" width="500" height="500" />
<!--Image of the OST cover for the game-->
<h3>
Lyrics
</h3>
<p><em>
<pre> <!--Lyrics are set to this format as in this HTML file-->
Fly me to the moon
And let me play among the stars
Let me see what Spring is like
On Jupiter and Mars
In other words
Hold my hand
In other words
Darling kiss me
Fill my heart with song
And let me sing for ever more
You are all I long for
All I worship and adore
In other words
Please be true
In other words
I love you
</pre>
</em></p>
<!--End of Rachel's edits-->
<!--Start of Sav's edits || Rachel's formatting is great, so I'm gonna use that as the framework for mine!-->
<h4>Sav's current favorite:</h4>
<h1>
<strong><span style="color:red">Ancient Aliens</span></strong>
</h1>
<h2>
<!--Mark's Comment: sort of the same as in Simon and Rachel's sections... normally a h element is a single line since it's a single heading that marks off a new section or topic to a page. I think I would separate album name from artist with a different tag, maybe an h3, but when we get to CSS, I think I'd actually use div tags and then classify album and artist types of divs-->
Spirit Phone<br>
<small>Lemon Demon</small>
</h2>
<img src="https://t2.genius.com/unsafe/440x440/https%3A%2F%2Fimages.genius.com%2Fa59c476531e25c14ac32901be5699184.900x900x1.jpg"
alt="Spirit Phone Cover" title="Spirit Phone - Lemon Demon" width="500" height="500" />
<h3>
Lyrics
</h3>
<p><em>
<pre>
My mind's this cave
So dark, no moon, no stars
No sound, just hearts and walls of art
Strange things happen
For no reason
That's all I know
My mind's this cave
So dark, no moon, no stars, no stars
No sound, just hearts and walls of art
These creatures I've seen
Some of them edible, some of them mean
That's all I know
I'm not like you
You fly
You burn my eyes, my eyes
You speak in my mind
Your kind all died when you arrived
I saw you making fire
Strange things happen for no reason at all
I can't help you
You're not human
You're not animal
My mind's this cave
So dark, no moon, no stars, no stars
No sound, just hearts and walls of art
And you, you fly
You burn my eyes
You speak in my mind
You seem surprised that I don't hear you
</pre>
</em></p>
<!--End of Sav's edits-->
<!--Start of Kwun's edits || I follow the format above-->
<h4>Kwun's current favorite:</h4>
<h1>
<strong><span style="color:blue">Crush</span></strong>
</h1>
<h2>
<!--Mark's Comment: see my comments in the other sections.-->
Immersion<br>
<small>Pendulum</small> <!--Simon added the album-->
</h2>
<img src="https://images.genius.com/796f8f37316c36b6de592afdb7a0c3db.1000x1000x1.png" alt="Pendulum Immersion Cover"
title="Crush - Pendulum" width="500" height="500" />
<h3>
Lyrics
</h3>
<p><em>
<pre>
I was running out in the cold light,
Wondering where to go
To run away, without you
All my fear is coming home,
And it's ripped out for the show
You can't be me,
I will become you, tonight
I was wandering under black skies,
Clutching at what is mine
No control, left to lose
When I felt that it wouldn't phase me,
I ran and hid like a child
I feel so guilty,
I'll make it up to you, tonight
They're changing my future
Visions I had buried underground,
Return us our futures
I was breaking out of my own skin,
Choking upon release
I'm in no state, to judge you
Scratching itches best left alone,
Chasing memories I used to own
I can't wait until this is over, tonight
They're changing my future
Visions I had buried underground,
Return us our futures
Well the nightmares I've been having have arrived,
They're changing my future
Signs of my creation at my door,
How could you do this to her?
</pre>
</em></p>
<!--End of Kwun's song edits-->
<style>
th {
text-align: left;
}
</style>
<!--I add this style to table, so the header will match the content-->
<!--Mark's Comment: I'm guessing this is not needed since the default alignment for text is left. Also, as you'll see when we get to CSS, usually you want style blocks within the head of the document.-->
<table style="width:100%">
<!--Simon| dunno how to format this very nicely, but it's there!-->
<tr>
<th>Artist</th>
<th>Album</th>
<th>Song</th>
</tr>
<tr>
<td>Have A Nice Life</td>
<td>Deathconsciousness</td>
<td>Earthmover</td>
</tr>
<tr>
<!--Rachel added the song-->
<td>Bart Howard</td>
<td>Bayonetta OST</td>
<td>Fly Me To The Moon</td>
</tr>
<tr>
<!--Sav added this song-->
<td>Lemon Demon</td>
<td>Spirit Phone</td>
<td>Ancient Aliens</td>
</tr>
<tr>
<!--Kwun added this song-->
<td>Pendulum</td>
<td>Immersion</td>
<td>Crush</td>
</tr>
</table>
<h3>Memorable Mentions</h3>
<!--Rachel| Please add one more song you think is good in this list.-->
<ul>
<li>Shut up And Groove by <em>Heize</em></li>
<!--Rachel added another song-->
<li>White Ball by ミラクルミュージカル</li>
<!--Sav added another song-->
<li>Waving My Dick in The Wind by <em>Ween</em></li>
</ul>
</body>
</html>