-
Notifications
You must be signed in to change notification settings - Fork 5
/
Copy pathindex.html
49 lines (43 loc) · 1.82 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
<html>
<header>
<title>NZXT Starfield Web Integration</title>
<link rel="stylesheet" href="./public/css/style.css" />
</header>
<body>
<svg id="svg" viewBox="0 0 100 100" width="640" height="640">
<!-- Rainbow -->
<clipPath id="clip">
<path id="clip_path"></path>
</clipPath>
<line id="ray_1"></line>
<line id="ray_2"></line>
<line id="ray_3"></line>
<line id="ray_4"></line>
<use clip-path="url(#clip)" href="#ray_1" stroke="#304B7A" />
<use clip-path="url(#clip)" href="#ray_2" stroke="#D9A64A" />
<use clip-path="url(#clip)" href="#ray_3" stroke="#DD6434" />
<use clip-path="url(#clip)" href="#ray_4" stroke="#C82238" />
<!-- Date -->
<path id="date_path"></path>
<text>
<textPath id="date" href="#date_path" startOffset="0">Thursday 13 July 2323 CE</textPath>
</text>
<!-- CPU temp -->
<g transform="translate(31, 23)">
<text id="cpu_temp" class="temp" x="0" y="0">42°C</text>
<path class="temp_outline" stroke-width="1.5px" d="M -13.5 2 L -13.5 5 L 13.5 5 L 13.5 2"></path>
<text class="temp_label" x="0" y="11">CPU TEMP</text>
</g>
<!-- GPU temp -->
<g transform="translate(37, 80)">
<text id="gpu_temp" class="temp" dominant-baseline="central" x="0" y="0">69°C</text>
<polygon class="temp_outline" stroke-width="1px" style="stroke: #C82238" points="-2.165,0 2.165,-2.5 2.165,2.5" transform="translate(19, 0)"></polygon>
<text class="temp_label" dominant-baseline="central" style="text-anchor: start;" x="23" y="-0.2">GPU TEMP</text>
</g>
<!-- Lines -->
<path id="line_1" class="line"></path>
<path id="line_2" class="line"></path>
</svg>
</body>
<script type="module" src="./public/js/main.js"></script>
</html>