This repository was archived by the owner on Mar 30, 2024. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathZeus.html
More file actions
214 lines (213 loc) · 11.3 KB
/
Copy pathZeus.html
File metadata and controls
214 lines (213 loc) · 11.3 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
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
<html><html>
<head>
<title>Hyperion Computer</title>
<!-- Individual product page
Filename: Zeus.html
Author: Tham Kai Heng 1828711
-->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<link href="https://fonts.googleapis.com/css?family=Ubuntu" rel="stylesheet">
<link rel="stylesheet" href="styles.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.1/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>
<!-- Local fallback, in case jQuery CDN is down-->
<script>window.jQuery || document.write('<script src="js/jquery-3.3.1.min.js"><\/script>')</script>
<link rel="shortcut icon" href="Images/Logo/favicon.ico">
<link rel="apple-touch-icon" href="Images/Logo/apple-touch-icon.png">
<link rel="icon" sizes="192x192" href="Images/Logo/android.png">
</head>
<body>
<header>
<article class="top">
<a href="index.html">
<img class="Logo" src="Images/Logo/Logo.png" alt="Hyperion Computer" title="Home">
</a>
<nav class="topnav" id="myTopnav">
<a href="#overview" class="hvr-underline-from-center">Overview</a>
<a href="#technology" class="hvr-underline-from-center">Technology</a>
<a href="#specifications" class="hvr-underline-from-center">Specifications</a>
<a href="#buy" class="hvr-underline-from-center"><button class="BuyNow">Buy Now</button></a>
<a href="javascript:void(0);" id="burger" class="icon" onclick="">☰</a>
</nav>
</article>
</header>
<!-- Start of content --><main>
<article class="Overview" id="overview">
<section class="Introduction">
<aside class="gridlayout">
<div class="secondarygrid">
<h2 class="desc">Unrivalled Performance</h2>
<p>Experience an unmatched level of performance. Featuring custom liquid cooling and space for even the biggest components.</p>
</div>
<img src="Images/Zeus/Zeus_1.jpg" alt="Zeus1" title="Unmatched Performance">
</aside>
<aside class="gridlayout">
<img src="Images/Zeus/Zeus_2.jpg" alt="Zeus2" title="Tempered Glass">
<div class="secondarygrid">
<h2 class="desc">Tempered Glass</h2>
<p>The tempered glass side panels allows you to showcase your components and cable routing. This is not just a computer, it is a masterpiece.</p>
</div>
</aside>
<img class="computerPreview"src="Images/Zeus/Zeus_Preview.jpg" alt="Preview" title="Zeus">
</section>
</article>
<article class="Technology" id="technology">
<section class="Tech">
<aside class="gridlayout2">
<img src="Images/Zeus/Zeus_4.jpg" alt="Space for 3 radiators" title="3X Radiators">
<div class="secondarygrid2">
<h2 class="desc2">3X Radiators</h2>
<p>Boasting the ultimate liquid cooling loop for excellent thermals, Zeus features 560mm radiators located at the top and bottom and a single 280mm radiator near the power supply.</p>
</div>
</aside>
<aside class="gridlayout2">
<div class="secondarygrid2">
<h2 class="desc2">Large Volume</h2>
<p>With up to 110 liters in capacity, you don't have to sacrifice cooling performance for storage.</p>
</div>
<img src="Images/Zeus/Zeus_5.jpg" alt="100 Litres" title="Large Capacity">
</aside>
</section>
</article>
<article class="Specifications" id="specifications">
<section class="Spec">
<aside class="gridlayout3">
<img src="Images/Zeus/Zeus_wireframe.jpg" alt="wireframe" title="Wireframe">
<div class="secondarygrid3">
<h2>Dimmensions and Weight:</h2>
<p>65.3cm Length x 25.4cm Width x 71.9cm Height ; Up to 34Kg</p><br>
<h2>Front Chassis Connectivity:</h2>
<p>2x USB 3.0 ; 1x Audio/Mic Port ; 1x USB Type-C 3.1 ; Multi-Card Reader</p><br>
<h2>Storage Expandability:</h2>
<p>Up to 8x 3.5" HDDs ; Up to 8x 2.5" SSDs</p><br>
<h2>Memory Expandability:</h2>
<p>Up to 128GB DDR4 System Memory</p><br>
<h2>Wireless & Networking:</h2>
<p>Up to 2x LAN Ports ; Optional 802.11ac Wireless</p>
</div>
</aside>
</section>
</article><br><br>
<article class="Buy" id="buy">
<section class="buyprod">
<h2>Select your CPU</h2>
<hr>
<aside class="gridlayout4">
<div class="cpuselection">
<img class="pricing-techlogo"src="Images/ryzen-7.jpg" alt="Ryzen 7" title="Ryzen 7">
<h2>Starting at<br> $2700</h2>
<button class="configbutton" onclick="window.location.href='Zeus_Ryzen.html'"><span class="fas fa-cog"></span> Customise</button>
<div class="bar">
<br><br><br>
Gaming: <progress value="80" max="100"></progress><br><br>
Workstation: <progress value="65" max="100"></progress>
</div>
<div class="options">
<img class="optionimg" src="Images/config-icon-cpu-v2.jpg" alt="CPU" title="CPU"><span>Up to 8 processor cores</span>
</div>
<div class="options">
<img class="optionimg" src="Images/config-icon-memory-v2.jpg" alt="RAM" title="RAM"><span>Up to 64GB DDR4 RAM</span>
</div>
<div class="options">
<img class="optionimg" src="Images/config-icon-gpu-v2.jpg" alt="GPU" title="GPU"><span>Up to 2 dedicated GPUs</span>
</div>
<div class="options">
<img class="optionimg" src="Images/config-icon-ssd-v2.jpg" alt="SSD" title="SSD"><span>Up to 6TB of Solid State Storage</span>
</div>
<div class="options">
<img class="optionimg" src="Images/config-icon-hdd-v2.jpg" alt="HDD" title="HDD"><span>Up to 15TB HDD Storage</span>
</div>
</div>
<div class="cpuselection">
<img class="pricing-techlogo"src="Images/intel-i9.jpg" alt="intel-i9" title="intel-i9">
<h2>Starting at<br> $2850</h2>
<button class="configbutton" onclick="window.location.href='Zeus_Corei9.html'"><span class="fas fa-cog"></span> Customise</button>
<div class="bar">
<br><br><br>
Gaming: <progress value="95" max="100"></progress><br><br>
Workstation: <progress value="65" max="100"></progress>
</div>
<div class="options">
<img class="optionimg" src="Images/config-icon-cpu-v2.jpg" alt="CPU" title="CPU"><span>Up to 8 processor cores</span>
</div>
<div class="options">
<img class="optionimg" src="Images/config-icon-memory-v2.jpg" alt="RAM" title="RAM"><span>Up to 64GB DDR4 RAM</span>
</div>
<div class="options">
<img class="optionimg" src="Images/config-icon-gpu-v2.jpg" alt="GPU" title="GPU"><span>Up to 2 dedicated GPUs</span>
</div>
<div class="options">
<img class="optionimg" src="Images/config-icon-ssd-v2.jpg" alt="SSD" title="SSD"><span>Up to 6TB of Solid State Storage</span>
</div>
<div class="options">
<img class="optionimg" src="Images/config-icon-hdd-v2.jpg" alt="HDD" title="HDD"><span>Up to 15TB HDD Storage</span>
</div>
</div>
<div class="cpuselection">
<img class="pricing-techlogo"src="Images/threadripper.jpg" alt="threadripper" title="Threadripper">
<h2>Starting at<br> $3200</h2>
<button class="configbutton" onclick="window.location.href='Zeus_threadripper.html'"><span class="fas fa-cog"></span> Customise</button>
<div class="bar">
<br><br><br>
Gaming: <progress value="70" max="100"></progress><br><br>
Workstation: <progress value="95" max="100"></progress>
</div>
<div class="options">
<img class="optionimg" src="Images/config-icon-cpu-v2.jpg" alt="CPU" title="CPU"><span>Up to 32 processor cores</span>
</div>
<div class="options">
<img class="optionimg" src="Images/config-icon-memory-v2.jpg" alt="RAM" title="RAM"><span>Up to 128GB DDR4 RAM</span>
</div>
<div class="options">
<img class="optionimg" src="Images/config-icon-gpu-v2.jpg" alt="GPU" title="GPU"><span>Up to 4 dedicated GPUs</span>
</div>
<div class="options">
<img class="optionimg" src="Images/config-icon-ssd-v2.jpg" alt="SSD" title="SSD"><span>Up to 6TB of Solid State Storage</span>
</div>
<div class="options">
<img class="optionimg" src="Images/config-icon-hdd-v2.jpg" alt="HDD" title="HDD"><span>Up to 15TB HDD Storage</span>
</div>
</div>
<div class="cpuselection">
<img class="pricing-techlogo"src="Images/intel-X.jpg" alt="intel-X" title="Intel Xtreme">
<h2>Starting at<br> $3000</h2>
<button class="configbutton" onclick="window.location.href='Zeus_CoreXtreme.html'"><span class="fas fa-cog"></span> Customise</button>
<div class="bar">
<br><br><br>
Gaming: <progress value="85" max="100"></progress><br><br>
Workstation: <progress value="85" max="100"></progress>
</div>
<div class="options">
<img class="optionimg" src="Images/config-icon-cpu-v2.jpg" alt="CPU" title="CPU"><span>Up to 18 processor cores</span>
</div>
<div class="options">
<img class="optionimg" src="Images/config-icon-memory-v2.jpg" alt="RAM" title="RAM"><span>Up to 128GB DDR4 RAM</span>
</div>
<div class="options">
<img class="optionimg" src="Images/config-icon-gpu-v2.jpg" alt="GPU" title="GPU"><span>Up to 4 dedicated GPUs</span>
</div>
<div class="options">
<img class="optionimg" src="Images/config-icon-ssd-v2.jpg" alt="SSD" title="SSD"><span>Up to 6TB of Solid State Storage</span>
</div>
<div class="options">
<img class="optionimg" src="Images/config-icon-hdd-v2.jpg" alt="HDD" title="HDD"><span>Up to 15TB HDD Storage</span>
</div>
</div>
</aside>
</section>
</article>
</main>
<aside class="backtotop">
<button class="backtotopbutton"><span></span>
</button>
</aside>
<footer>
<p class="trademark">Copyright © 2019 Hyperion <img src="Images/Logo/favicon.ico" alt="Hyperion Logo" style="padding-left: 5px;"> Computer. All Rights Reserved</p>
<p class="location">1 Technology Drive | Singapore 138572</p>
</footer>
<script src="js/javascript.js"></script>
<script src="js/mobilemenu.js"></script>
<script src="js/smoothscroll.js"></script>
</body>
</html>