-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
235 lines (222 loc) · 11.4 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
<!DOCTYPE html>
<!-- HOME -->
<html lang="en">
<head>
<meta charset="UTF-8">
<!-- BOOTSTRAP -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
crossorigin="anonymous"></script>
<!-- CSS -->
<link href="styles.css" rel="stylesheet">
<title>Minecraft P-SET 8 | Home</title>
<link rel="icon" type="image/png" href="images/logos/grass.png">
<meta name="theme-color" content="#8bb0fb">
<!-- FOR MOBILE RESPONSIVENESS -->
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<!-- JAVASCRIPT -->
<script src="script.js"></script>
<!-- MAIN SQUARE -->
<div id="main-square">
<!-- NAVBAR -->
<nav>
<!--
STEVE ABOVE NAVBAR
IT'S INSIDE <NAV> BECAUSE HE NEEDS TO BE BETWEEN NAV WIDTH
-->
<img alt="Steve Character" id="steve" height="32" width="24" src="images/steve/0.png">
<!--
WASD BUTTONS ON RIGHT SIDE
IT'S INSIDE <NAV> WITHOUT REASON
-->
<div id="wasd">
<p>Try in your keyboard:</p>
<button type="button" id="w" disabled>w</button><br>
<button type="button" id="a">a</button>
<button type="button" id="s" disabled>s</button>
<button type="button" id="d">d</button>
</div>
<!-- STUFF INSIDE NAVBAR -->
<div id="nav-space">
<!-- MINECRAFT LOGO ON LEFT SIDE -->
<a id="logo" href="#"><img alt="Minecraft Logo" width="200" src="images/logos/minecraft.svg"></a>
<!-- MENU OPTIONS ON RIGHT SIDE-->
<ul id="menu">
<li><a class="pag" href="#">Home</a></li>
<li><a class="pag" href="java.html">Java</a></li>
<li><a class="pag" href="bedrock.html">Bedrock</a></li>
<li><a class="pag" href="about.html">About</a></li>
</ul>
</div>
</nav>
<!-- CONTENT -->
<article>
<h1>Minecraft</h1>
<section>
<h2 class="title">Definition</h2>
<p>
[Minecraft] - the word has it origins traced back to the english language,
result of combining two words: [Mine] and [Craft], and those two words
defines the foundation of this wonderful game, that is, mining and crafting.
</p>
</section>
<section>
<h2 class="title">What is it</h2>
<p>
Minecraft is a sandbox game where you can create your own worlds and
experiences using building blocks and resources. It is available on multiple
platforms such as computers, smartphones, tablets and consoles.
<br><br>
But actually, that definition is a little lame, so let's try again.
<br><br>
Minecraft is a game that combines elements of multiple types of games as
construction, exploration, survival and adventure. The thing is that it does
in a fully modifiable three-dimensional procedurally generated world, that
is it's a random world every time you create a new one, so the gameplay is
never the same. And the world is infinite! Ok, maybe not infinite but it is.
Definitely one of the funniest games to play with friends.
</p>
</section>
<section>
<h2 class="title">Want to know more about it</h2>
<p>
Check the <a href="https://minecraft.fandom.com/wiki/Minecraft_Wiki"
target="_blank">Minecraft Wiki</a>, it has pretty much everything you would
ever want to know about the game
</p>
<img alt="Castle Picture" height="110" width="110" src="images/icons/castle.png">
</section>
<section>
<h2 class="title">That looks awesome, what more can you do in it</h2>
<p>It has a lot of features that make it so fun like:</p>
<!-- FROM BOOTSTRAP -->
<div class="accordion" id="accordion-index">
<div class="accordion-item">
<h2 class="accordion-header" id="headingOne">
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
You can build and explore your own world using different kinds of blocks.
</button>
</h2>
<div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordion-index">
<div class="accordion-body">
<p>
Those blocks are one-cubic-meter-sized and there are hundreds of
different blocks. In addition to blocks, the environment features
plants, mobs and items.
</p>
<img alt="Blocks Picture" height="100" width="100" src="images/icons/blocks.png">
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="headingTwo">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
You can play in different modes such as survival, creative, adventure,
spectator, or hardcore.
</button>
</h2>
<div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo" data-bs-parent="#accordion-index">
<div class="accordion-body">
<ul>
<li>
In survival mode you can die by many ways like starved, drowned,
burned, killed by monsters, and more, so you have to collect
items, and survive. The game has achievements so even though the
game does not tell you the objective is accomplish those achievements
and in the process kill the bosses like the EnderDragon or the
Wither. You can die as many times as you want but you could lose
your items in the process.<br><br>
</li>
<li>
In creative mode you are immortal and it allow you to build
anything you want because you have all the items and, you can fly
and more, so the only thing holding you back in that mode is your
creativity.<br><br>
</li>
<li>
In adventure mode you can die but your interaction with the world
is limited, that is to experience a story that someone made for example.<br><br>
</li>
<li>
In spectator mode you can fly and pass through blocks, that is
to watch whatever there are to be watched.<br><br>
</li>
<li>
In hardcore mode you can die only once, and the world is erased
if you die and you lose all the progress, that is for the sigmas.
</li>
</ul>
<img alt="Alex Picture" height="110" width="110" src="images/icons/alex.png">
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="headingThree">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
You can join a community of millions of players who create and share
mods, maps, skins, and more.
</button>
</h2>
<div id="collapseThree" class="accordion-collapse collapse" aria-labelledby="headingThree" data-bs-parent="#accordion-index">
<div class="accordion-body">
<p>
The game already has a bunch of options to make whatever you desire
but as it is easy modifiable the community creates thousands of smart
new features to the game, way more than Mojang could even implement,
that you can easily try out.
</p>
<img alt="Book Picture" height="90" width="90" src="images/icons/book.png">
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="headingFour">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
You can play with your friends in your own world or in servers and that
is where shit gets real fun.
</button>
</h2>
<div id="collapseFour" class="accordion-collapse collapse" aria-labelledby="headingFour" data-bs-parent="#accordion-index">
<div class="accordion-body">
<p>
The game's open-ended model allows players to create structures, creations
and artwork on various competitive or collaborative multiplayer servers,
including a lot of very well implemented stuff to build minigames and
features, allowing for many different experiences, the community is very
creative. Besides if you want to play the normal game with your friends
you can enter their single-player maps and play together.
</p>
<img alt="Multiplayer Picture" height="110" width="110" src="images/icons/multiplayer.png">
</div>
</div>
</div>
</div>
</section>
<section>
<h2 class="title">The god that created it</h2>
<div id="about-notch" class="flex">
<img alt="Notch Picture" height="200" width="200" src="images/photos/the_god.jpg">
<p>
Minecraft was created by <a href="https://pt.wikipedia.org/wiki/Markus_Persson"
target="_blank">Markus Persson</a>, a Swedish person named Markus... And he
is a video game programmer, designer, genius, billionaire, playboy and a
philanthropist. Who is also known as Notch.
<br><br>
He and his team worked on the game at <a href="https://pt.wikipedia.org/wiki/Mojang_Studios"
target="_blank">Mojang Studios</a> until 2014, when the game was sold
to Microsoft for U$ 2.5 billion.
<br><br>
Notch has since left Mojang and is no longer working in the game.
</p>
</div>
</section>
</article>
<footer>Problem Set 8 - Homepage [CS50] - <a id="to-top" href="#">Return to top</a></footer>
</div>
</body>
</html>