-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
104 lines (80 loc) · 3.85 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
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Wolfboy248 | Main page</title>
<meta content="Wolfboy248" property="og:title" />
<meta content="video gamming" property="og:description" />
<meta content="https://embed.com/this-is-the-site-url" property="og:url" />
<meta content="https://embed.com/embedimage.png" property="og:image" />
<meta content="#43B581" data-react-helmet="true" name="theme-color" />
<style>
</style>
<link rel="stylesheet" href="styles.css">
<link rel="icon" type="image/png" href="favicon.png">
</head>
<body>
<header>
<div class="header"></div>
</header>
<!--<div class="bg"></div> not used anymore-->
<div id="bg" style="transition: all 0.2s ease-in-out;" class="bg"></div>
<a href="el phrog.png" download=><div class="top-bar">Wolfboy248</div></a>
<a href="https://wolfboy248.github.io/new-website/"><div class="home-icon"></div></a>
<a target="blank" href="https://youtu.be/iVSmnWuDBBc"><div class="youtubebutton">Youtube</div></a>
<a target="blank" href="https://steamcommunity.com/profiles/76561199088257098/"><div class="steambutton">Steam</div></a>
<a target="blank" href="https://www.speedrun.com/user/Wolfboy248"><div class="speedrunbutton">Speedrun</div></a>
<a href="github.html"><div class="githubrepobutton">Github Repos</div></a>
<div style="z-index: 10000;" class="dropdown">
<button class="dropdownbtn">More</button>
<div class="dropdown-content">
<a style="border-radius: 15px 15px 0px 0px;" href="gamesettings.html">Settings</a>
<a href="pcspecs.html">PC Specs</a>
<a style="border-radius: 0px 0px 15px 15px;" href="tetris.html">Tetris</a>
</div>
</div>
<div class="middlebg">
<div class="newvideo">Latest Video</div>
</div>
<iframe class="ytembed" width="560" height="315" src="https://www.youtube.com/embed/iVSmnWuDBBc" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
<div class="ytborder"></div>
</body>
<footer>
<button class="bg-toggle" id="test-button">
</button>
<button type="hidden" class="bg-toggle" style="background-color: red; opacity: 100%; top: 92%;" id="test-button2">
</button>
</footer>
<script>
const bg = document.querySelector('#bg');
console.log(bg.style);
const testBtn = document.querySelector('#test-button');
const testBtn2 = document.querySelector('#test-button2')
const opacity = localStorage.getItem("opacity");
if (opacity) {
bg.style.opacity = opacity;
testBtn2.style.opacity = opacity == 0 ? 1 : 0;
}
console.log(testBtn.style);
testBtn2.style.opacity = '0';
testBtn.addEventListener('click', () => {
bg.style.opacity = '0%';
testBtn.type.hidden = false;
testBtn2.style.top = '92%';
sessionStorage.setItem(bg, opacity);
// Save the opacity value to localStorage
localStorage.setItem("opacity", 0);
});
testBtn2.addEventListener('click', () => {
bg.style.opacity = '100%';
testBtn.style.opacity = '100%';
testBtn.type.hidden = false;
testBtn.style.top = '92%';
testBtn2.style.top = '-10000%';
testBtn.style.backgroundColor = 'blue';
// Save the opacity value to localStorage
localStorage.setItem("opacity", 1);
});
</script>
</html>