-
Notifications
You must be signed in to change notification settings - Fork 0
/
github.html
114 lines (103 loc) · 2.66 KB
/
github.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
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<link rel="icon" type="image/x-icon" href="favicon2.ico">
<link href='https://unpkg.com/boxicons@2.1.1/css/boxicons.min.css' rel='stylesheet'>
<title>Github</title>
</head>
<center>
<!--<style>
body {
margin: 0;
font-family: Arial, Helvetica, sans-serif;
}
.topnav {
overflow: hidden;
background-color: #333;
}
.topnav a {
float: left;
color: #f2f2f2;
text-align: center;
padding: 14px 16px;
text-decoration: none;
font-size: 17px;
}
.topnav a:hover {
background-color: #ddd;
color: black;
}
.topnav a.active {
background-color: #800080;/* here are some alt color codes FF0000, 800080, FFC000 */
color: white;
}
</style>
<div class="topnav">
<a href="index.html">Home</a>
<a href="Updates.html">Updates</a>
<a href="new_page.html">Site History</a>
<a class="active" href="github.html">About Me</a>
</div> -->
<div class="navbar">
<ul>
<li>
<a href="index.html">
<i class='bx bx-home icon'></i>
<i class='bx bxs-home activeIcon'></i>
</a>
</li>
<li class="active">
<a href="github.html">
<i class='bx bx-user icon'></i>
<i class='bx bxs-user activeIcon'></i>
</a>
</li>
<li>
<a href="Updates.html">
<i class='bx bx-heart icon'></i>
<i class='bx bxs-heart activeIcon'></i>
</a>
</li>
<li>
<a href="new_page.html">
<i class='bx bx-cog icon'></i>
<i class='bx bxs-cog activeIcon'></i>
</a>
</li>
<div class="indicator"></div>
</ul>
</div>
<script>
const navBar = document.querySelector(".navbar")
allLi = document.querySelectorAll("li");
allLi.forEach((li, index) => {
li.addEventListener("click" , e =>{
navBar.querySelector(".active").classList.remove("active");
li.classList.add("active");
const indicator = document.querySelector(".indicator");
indicator.style.transform = `translateX(calc(${index * 90}px))`;
});
});
</script>
<div class="blurred"></div>
<div class="middlecoversecond">
<center>
<h1>About Me</h1>
</center>
<img src="img/pfp.png"align="left">
<h2 align="left"href="https://github.com/BrigedMcCarthy">Briged McCarthy</h2>
<p align="left">She/Her or They/Them</p>
<p align="left">🖈 St. Louis</p>
<p style="float: left">🕔</p>
<p style="float: left" id="centraltime"></p>
<script>
const date = new Date();
// Display time in Central (Chicago)
const centraltime = date.toLocaleString("en-US", { timeZone: "America/Chicago", timeStyle: "short" });
document.getElementById("centraltime").innerHTML = " " + centraltime;
</script>
</div>
</center>
<div class="blurred"></div>
</html>