-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathEternalPossession.html
93 lines (88 loc) · 3.65 KB
/
EternalPossession.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
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="with=device-width, initial-scale=1.0">
<title>Joshua Briggs</title>
<link rel="stylesheet" href="style.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Lato:wght@100;300;400;700;900&display=swap" rel="stylesheet">
<link rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/swiper@8/swiper-bundle.min.css"/>
</head>
<body>
<section class="header">
<nav>
<!-- Displays all the photos in the top left -->
<a><img src="images/HTML.svg"</a>
<a><img src="images/CSS.png"</a>
<div class="nav-links">
<ul>
<!-- Displays all the navigation tools -->
<li><a href="Portfolio.html">PORTFOLIO</a></li>
<li><a href="Contact.html">CONTACT</a></li>
</ul>
</div>
</nav>
<div class="video-header">
<h1>Eternal Possession</h1>
</div>
<div class="slide-container">
<!-- Slider main container -->
<div class="swiper">
<!-- Additional required wrapper -->
<div class="swiper-wrapper">
<!-- Slides -->
<div class="swiper-slide"><img src="images/EPMM.png"></div>
<div class="swiper-slide"><img src="images/EPGF.png"></div>
<div class="swiper-slide"><img src="images/EPES.png"></div>
<div class="swiper-slide"><img src="images/EPKF.png"></div>
<div class="swiper-slide"><img src="images/EPOH.png"></div>
...
</div>
<!-- If we need pagination -->
<div class="swiper-pagination"></div>
<!-- If we need navigation buttons -->
<div class="swiper-button-prev"></div>
<div class="swiper-button-next"></div>
</div>
</div>
<!-- Displays all the text in the bottom of the page -->
<div class="video-body">
<div class="video-text">
<div class="video-info">
<div class="video-questions">
<p>Game type:</p>
<p>Process of making the game:</p>
<p>Software:</p>
<p>Coding language:</p>
</div>
<div class="video-answers">
<p>2D platformer, army manager game, the player must stratagise to fight the enemy team, using a mix of troops to deplete your enemies resources and conquer the empire.</p>
<p>To win this game, you'll need to use your strategic skills to push your army past the opponent's defences. Every troop that successfully reaches their base will gradually weaken their overall health. However, if the enemy manages to deplete your army's health, your troops will become increasingly enraged, resulting in a boost in both health and damage output.</p>
<p>Unity & Visual Studio</p>
<p>C#</p>
</div>
</div>
</div>
</section>
</div>
<script src="https://cdn.jsdelivr.net/npm/swiper@8/swiper-bundle.min.js"></script>
<script>
const swiper = new Swiper('.swiper', {
// Optional parameters
loop: true,
// If we need pagination
pagination: {
el: '.swiper-pagination',
clickable: true,
},
// Navigation arrows
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
});
</script>
</body>
</html>