Kaisaan/kaisaan.github.io
1
Fork 0
mirror of https://github.com/Kaisaan/kaisaan.github.io.git synced 2025-06-18 08:45:38 -04:00
Code Issues Actions Packages Projects Releases Wiki Activity

Add navbar with dropdown

Browse Source 
TODO: Rewrite pages
This commit is contained in:
Kaisaan 2021-07-26 20:52:42 -04:00
parent 46b334ea66
commit 0e1d13cea2
7 changed files with 322 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

92
assets/css/style.css
View File

@ -1,16 +1,100 @@
body {
margin: 0px;
font-family: 'Roboto', sans-serif;
background-color: #EFEFEF;
}
p {
margin-top: 0;
margin-top: 0px;
margin-right: 8px;
margin-left: 8px;
}
h2 {
margin-bottom: 0;
margin-bottom: 0px;
margin-right: 8px;
margin-left: 8px;
}
h3 {
margin-bottom: 0;
}
margin-bottom: 0px;
margin-right: 8px;
margin-left: 8px;
}
/* Navbar container */
.navbar {
overflow: hidden;
background-color: #333;
font-family: Arial;
}
/* Links inside the navbar */
.navbar a {
float: left;
font-size: 16px;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
/* Add a color to the active/current link */
.navbar a.active {
background-color: rgb(7, 97, 30);
color: white;
}
/* The dropdown container */
.dropdown {
float: left;
overflow: hidden;
}
/* Dropdown button */
.dropdown .dropbtn {
font-size: 16px;
border: none;
outline: none;
color: white;
padding: 14px 16px;
background-color: inherit;
font-family: inherit; /* Important for vertical align on mobile phones */
margin: 0; /* Important for vertical align on mobile phones */
}
/* Add a red background color to navbar links on hover */
.navbar a:hover, .dropdown:hover .dropbtn {
background-color: rgb(37, 148, 65);
}
/* Dropdown content (hidden by default) */
.dropdown-content {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;
}
/* Links inside the dropdown */
.dropdown-content a {
float: none;
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
text-align: left;
}
/* Add a grey background color to dropdown links on hover */
.dropdown-content a:hover {
background-color: rgb(37, 148, 65);
color: white;
}
/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
display: block;
}

55
index.html
View File

@ -9,43 +9,30 @@
</head>
<body>
<center><h1>Welcome to Kaisaan's Website!</h1></center>
<div class="navbar">
<a class="active" href="index.html">Home</a>
<div class="dropdown">
<button class="dropbtn">About Me
</button>
<div class="dropdown-content">
<a href="pages/outside.html">Outside</a>
<a href="pages/online.html">Online</a>
</div>
</div>
<div class="dropdown">
<button class="dropbtn">Projects
</button>
<div class="dropdown-content">
<a href="pages/school.html">School</a>
<a href="pages/personal.html">Personal</a>
</div>
</div>
<a href="pages/social.html">Socials</a>
</div>
<center><h1>Welcome to Kaisaan's Website!</h1></center>
<h2>Hello World!</h2>
<p>Hello there I'm Kaisaan Siddiqui, just another person on the internet. On this website I plan on talking about my passions and achievements.</p>
<h2>Academics</h2>
<p>After graduating highschool with both an Ontario Second School Diploma (OSSD) and an Internation Baccalaureate (IB) Diploma, I am currently enrolled to have a BSc in Computer Science at York University.</p>
<h3>University</h3>
<p>I am currently set to graduate in 2025 with a Bachelor of Science (BSc) in Computer Science at York University. At York, I am currently a member of the Yama Anime and Manga Association (YAMA).</p>
<h3>Highschool</h3>
<p>At highschool I was in the International Baccalaureate Diploma Program (IBDP) and was a part of various clubs. I was the leader of my School's Improv Club for two years. I was also the founder and president of my high school's Anime Club for three years. During this time I made a small group of close friends. We talk with each other often on Discord and even occasionally meet up and play games.</p>
<h3>Elementary</h3>
<p>While I moved cities before the start of Grade 5, I had scored high enough in the Canadian Cognitive Abilities Test (CCAT) in Grade 4 to be considered a "Gifted Student". From Grades 5 through 8 I was a part of the In-School Enhanced Learning Program (ISELP). It was through this program that I met some of my close friends. Besides having extra work during school, I was able to participate in various events thanks to ISELP. One of these events included the <a href="https://www.thelearningpartnership.ca/programs/investigate-invent-innovate" target="_blank"><i>Investigate! Invent! Innovate!</i> (I3)</a> Event in Grade 6.</p>
<h2>Gaming</h2>
<p>Video Games have been a very large part about my life. With my first console being a Nintendo DSi XL, I have grown up with Nintendo systems. While I have played a lot of games throughout the years, I have many games that I have <i>not</i> played yet. You can see my full gaming backlog Google Doc <a href="https://docs.google.com/document/d/1ljYxrFMEG2iYl3pFuay-poqy8-6tQXxLb3wWhXZz0Ls/edit?usp=sharing" target="_blank">here</a> (commenting is enabled so feel free to add any more suggestions).</p>
<h3>Mario</h3>
<p>The Super Mario series is what introduced me into videogaming. With the first game that I recall playing was <i>New Super Mario Bros.</i> on my cousin's DSi. In the present day I have played pretty much every mainline Mario game. Some of my favourites include <i>Super Mario Galaxy 2</i>, <i>Super Mario 64 DS</i>, and <i>New Super Luigi U</i>.</p>
<h3>Mega Man</h3>
<p>The Mega Man series is something that I only got into very recently. It started when my friend suggested I play through all the Mega Man games that were written in my backlog. Sometime in June of 2020, I played through about 34 Mega Man games within the span of 4 weeks. After that Mega Marathon, I had moved on to other franchises. Currently, I have pretty much played every single game in the main timeline (Classic, X, Zero, ZX, Legends) except for <i>Mega Man X Command Mission</i> and <i>The Misadvantures of Tron Bonne</i>. I will get to the Battle Network and Star Force games soon&trade;. My favourite Mega Man games are the <i>Mega Man Zero</i> series. The graphics, music, story, and gameplay all com together to make a really beautiful four part series about Zero and his reawakening to fight for everlasting peace.<br>
My favourite part of Mega Man is defintely the music (just like with all videogames I play), though I also enjoy the gameplay a lot. I love sharing my passion for Mega Man through various ways. For example, I have made this <a href="https://docs.google.com/presentation/d/1JgxUnDyHX_vdvqDs0jmtJ6ypNwKcwzOvcIwNdjCpUGk/edit?usp=sharing" target="_blank">presentation that introducing newcomers to Mega Man</a>. I created and presented this slideshow for YAMA's powerpoint night in their Discord server.<br>
I also have been researching information for multiple Mega Man iceberg images. I plan on creating analysis videos for my Youtube channel. Since there is a lot of information to research, I would appreciate any contributions from others. You can find my research Google Doc <a href="https://docs.google.com/document/d/16bIRYDRNaMYKEAmgVlkSx3GJYX9kCTNNDZ1WbICMsSo/edit?usp=sharing" target="_blank">here</a>.</p>
<h3>Sonic</h3>
<p>Sonic the Hedgehog is a very interesting series with how Sega has handled its Mascot's games. Despite this, I have played most of the games in Sonic's series. Some of my favourite titles are the <i>Sonic Rush</i> duology and the DS version of <i>Sonic Colors</i>.</p>
<h3>Castlevania</h3>
<p>The Castlevania series is another series that I only recently got into and have been enjoying a lot. Thanks to a friend that spent over half an hour detailing which games to play and which to avoid, I had the motivation to play through the series. I have adapted their list into a <a href="https://docs.google.com/document/d/1KPP4GFr5WB_y4EeafY1CouzN_ldw6j-jso75c_J4yyk/edit?usp=sharing" target="_blank">Google Doc</a> that also includes a list of optional patches to get to improve the experience. One of my favourite Castlevania games is <i>Castlevania: The Adventure ReBirth</i>.</p>
<h3>Other</h3>
Besides all these singleplayer games I have talked about above, I occasionally play mutliplayer games. One game that I have recently got into was <i>100% Orange Juice</i>, a board game that plays similar to Mario Party but makes use of cards and turn-based battles. I also occasionally play Minecraft, Fortnite, Roblox, and Terraria. I also have a plethora of games that I've collected on Steam through free sales.
<h2></h2>
<h2>Contact</h2>
<p>I have linked to some of my Social Media platforms below. I primarily use Discord but I am available on other platforms.<br>
<b>Discord</b>: Kaisaan#6181<br>
<b>Discord Server</b>: <a href="https://discord.gg/NFax4qadkN" target="_blank">Invite Link</a><br>
<b>Instagram</b>: <a href="https://www.instagram.com/kaisaansiddiqui/" target="_blank">@kaisaansiddiqui</a><br>
<b>Reddit</b>: <a href="https://www.reddit.com/user/kaisaans" target="_blank">u/kaisaans</a><br>
<b>Steam</b>: <a href="https://steamcommunity.com/id/kaisaan/" target="_blank">kaisaan</a><br>
<b>Steam Group</b>: <a href="https://steamcommunity.com/groups/kaisaan" targer="_blank">Link</a><br>
<b>Twitter</b>: <a href="https://twitter.com/KaisaanSiddiqui" target="_blank">@KaisaanSiddiqui</a><br>
<b>Youtube Channel</b>: <a href="https://www.youtube.com/channel/UC364Tgsm480XvCL0JDY8sEg" target="_blank">Kaisaan Siddiqui</a><br>
<h2>Source</h2>
<p>You can find the source code for this website on <a href="https://github.com/Kaisaan/kaisaan.github.io" target="_blank">Github</a>.</p>
</body>

49
pages/online.html Normal file
View File

@ -0,0 +1,49 @@
<!DOCTYPE html>
<html>
<head>
<title>Kaisaan Yummy Site</title>
<link rel="stylesheet" href="../assets/css/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=Roboto&display=swap" rel="stylesheet">
</head>
<body>
<div class="navbar">
<a href="../index.html">Home</a>
<div class="dropdown">
<button class="dropbtn">About Me
</button>
<div class="dropdown-content">
<a href="outside.html">Outside</a>
<a class="active" href="online.html">Online</a>
</div>
</div>
<div class="dropdown">
<button class="dropbtn">Projects
</button>
<div class="dropdown-content">
<a href="school.html">School</a>
<a href="personal.html">Personal</a>
</div>
</div>
<a href="social.html">Socials</a>
</div>
<center><h1>Welcome to Kaisaan's Website!</h1></center>
<h2>Gaming</h2>
<p>Video Games have been a very large part about my life. With my first console being a Nintendo DSi XL, I have grown up with Nintendo systems. While I have played a lot of games throughout the years, I have many games that I have <i>not</i> played yet. You can see my full gaming backlog Google Doc <a href="https://docs.google.com/document/d/1ljYxrFMEG2iYl3pFuay-poqy8-6tQXxLb3wWhXZz0Ls/edit?usp=sharing" target="_blank">here</a> (commenting is enabled so feel free to add any more suggestions).</p>
<h3>Mario</h3>
<p>The Super Mario series is what introduced me into videogaming. With the first game that I recall playing was <i>New Super Mario Bros.</i> on my cousin's DSi. In the present day I have played pretty much every mainline Mario game. Some of my favourites include <i>Super Mario Galaxy 2</i>, <i>Super Mario 64 DS</i>, and <i>New Super Luigi U</i>.</p>
<h3>Mega Man</h3>
<p>The Mega Man series is something that I only got into very recently. It started when my friend suggested I play through all the Mega Man games that were written in my backlog. Sometime in June of 2020, I played through about 34 Mega Man games within the span of 4 weeks. After that Mega Marathon, I had moved on to other franchises. Currently, I have pretty much played every single game in the main timeline (Classic, X, Zero, ZX, Legends) except for <i>Mega Man X Command Mission</i> and <i>The Misadvantures of Tron Bonne</i>. I will get to the Battle Network and Star Force games soon&trade;. My favourite Mega Man games are the <i>Mega Man Zero</i> series. The graphics, music, story, and gameplay all com together to make a really beautiful four part series about Zero and his reawakening to fight for everlasting peace.<br>
My favourite part of Mega Man is defintely the music (just like with all videogames I play), though I also enjoy the gameplay a lot. I love sharing my passion for Mega Man through various ways. For example, I have made this <a href="https://docs.google.com/presentation/d/1JgxUnDyHX_vdvqDs0jmtJ6ypNwKcwzOvcIwNdjCpUGk/edit?usp=sharing" target="_blank">presentation that introducing newcomers to Mega Man</a>. I created and presented this slideshow for YAMA's powerpoint night in their Discord server.<br>
I also have been researching information for multiple Mega Man iceberg images. I plan on creating analysis videos for my Youtube channel. Since there is a lot of information to research, I would appreciate any contributions from others. You can find my research Google Doc <a href="https://docs.google.com/document/d/16bIRYDRNaMYKEAmgVlkSx3GJYX9kCTNNDZ1WbICMsSo/edit?usp=sharing" target="_blank">here</a>.</p>
<h3>Sonic</h3>
<p>Sonic the Hedgehog is a very interesting series with how Sega has handled its Mascot's games. Despite this, I have played most of the games in Sonic's series. Some of my favourite titles are the <i>Sonic Rush</i> duology and the DS version of <i>Sonic Colors</i>.</p>
<h3>Castlevania</h3>
<p>The Castlevania series is another series that I only recently got into and have been enjoying a lot. Thanks to a friend that spent over half an hour detailing which games to play and which to avoid, I had the motivation to play through the series. I have adapted their list into a <a href="https://docs.google.com/document/d/1KPP4GFr5WB_y4EeafY1CouzN_ldw6j-jso75c_J4yyk/edit?usp=sharing" target="_blank">Google Doc</a> that also includes a list of optional patches to get to improve the experience. One of my favourite Castlevania games is <i>Castlevania: The Adventure ReBirth</i>.</p>
<h3>Other</h3>
Besides all these singleplayer games I have talked about above, I occasionally play mutliplayer games. One game that I have recently got into was <i>100% Orange Juice</i>, a board game that plays similar to Mario Party but makes use of cards and turn-based battles. I also occasionally play Minecraft, Fortnite, Roblox, and Terraria. I also have a plethora of games that I've collected on Steam through free sales.
<h2></h2>
</body>
</html>

43
pages/outside.html Normal file
View File

@ -0,0 +1,43 @@
<!DOCTYPE html>
<html>
<head>
<title>Kaisaan Yummy Site</title>
<link rel="stylesheet" href="../assets/css/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=Roboto&display=swap" rel="stylesheet">
</head>
<body>
<div class="navbar">
<a href="../index.html">Home</a>
<div class="dropdown">
<button class="dropbtn">About Me
</button>
<div class="dropdown-content">
<a class="active" href="outside.html">Outside</a>
<a href="online.html">Online</a>
</div>
</div>
<div class="dropdown">
<button class="dropbtn">Projects
</button>
<div class="dropdown-content">
<a href="school.html">School</a>
<a href="personal.html">Personal</a>
</div>
</div>
<a href="social.html">Socials</a>
</div>
<center><h1>Welcome to Kaisaan's Website!</h1></center>
<h2>Academics</h2>
<p>After graduating highschool with both an Ontario Second School Diploma (OSSD) and an Internation Baccalaureate (IB) Diploma, I am currently enrolled to have a BSc in Computer Science at York University.</p>
<h3>University</h3>
<p>I am currently set to graduate in 2025 with a Bachelor of Science (BSc) in Computer Science at York University. At York, I am currently a member of the Yama Anime and Manga Association (YAMA).</p>
<h3>Highschool</h3>
<p>At highschool I was in the International Baccalaureate Diploma Program (IBDP) and was a part of various clubs. I was the leader of my School's Improv Club for two years. I was also the founder and president of my high school's Anime Club for three years. During this time I made a small group of close friends. We talk with each other often on Discord and even occasionally meet up and play games.</p>
<h3>Elementary</h3>
<p>While I moved cities before the start of Grade 5, I had scored high enough in the Canadian Cognitive Abilities Test (CCAT) in Grade 4 to be considered a "Gifted Student". From Grades 5 through 8 I was a part of the In-School Enhanced Learning Program (ISELP). It was through this program that I met some of my close friends. Besides having extra work during school, I was able to participate in various events thanks to ISELP. One of these events included the <a href="https://www.thelearningpartnership.ca/programs/investigate-invent-innovate" target="_blank"><i>Investigate! Invent! Innovate!</i> (I3)</a> Event in Grade 6.</p>
<h2></h2>
</body>
</html>

36
pages/personal.html Normal file
View File

@ -0,0 +1,36 @@
<!DOCTYPE html>
<html>
<head>
<title>Kaisaan Yummy Site</title>
<link rel="stylesheet" href="../assets/css/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=Roboto&display=swap" rel="stylesheet">
</head>
<div class="navbar">
<a href="../index.html">Home</a>
<div class="dropdown">
<button class="dropbtn">About Me
</button>
<div class="dropdown-content">
<a href="outside.html">Outside</a>
<a href="online.html">Online</a>
</div>
</div>
<div class="dropdown">
<button class="dropbtn">Projects
</button>
<div class="dropdown-content">
<a href="school.html">School</a>
<a class="active" href="personal.html">Personal</a>
</div>
</div>
<a href="social.html">Socials</a>
</div>
<body>
<center><h1>Welcome to Kaisaan's Website!</h1></center>
<h2>Hello World!</h2>
<p>Hello there I'm Kaisaan Siddiqui, just another person on the internet. On this website I plan on talking about my passions and achievements.</p>
</body>
</html>

36
pages/school.html Normal file
View File

@ -0,0 +1,36 @@
<!DOCTYPE html>
<html>
<head>
<title>Kaisaan Yummy Site</title>
<link rel="stylesheet" href="../assets/css/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=Roboto&display=swap" rel="stylesheet">
</head>
<div class="navbar">
<a href="../index.html">Home</a>
<div class="dropdown">
<button class="dropbtn">About Me
</button>
<div class="dropdown-content">
<a href="outside.html">Outside</a>
<a href="online.html">Online</a>
</div>
</div>
<div class="dropdown">
<button class="dropbtn">Projects
</button>
<div class="dropdown-content">
<a class="active" href="school.html">School</a>
<a href="personal.html">Personal</a>
</div>
</div>
<a href="social.html">Socials</a>
</div>
<body>
<center><h1>Welcome to Kaisaan's Website!</h1></center>
<h2>Hello World!</h2>
<p>Hello there I'm Kaisaan Siddiqui, just another person on the internet. On this website I plan on talking about my passions and achievements.</p>
</body>
</html>

49
pages/social.html Normal file
View File

@ -0,0 +1,49 @@
<!DOCTYPE html>
<html>
<head>
<title>Kaisaan Yummy Site</title>
<link rel="stylesheet" href="../assets/css/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=Roboto&display=swap" rel="stylesheet">
</head>
<body>
<div class="navbar">
<a href="../index.html">Home</a>
<div class="dropdown">
<button class="dropbtn">About Me
</button>
<div class="dropdown-content">
<a href="outside.html">Outside</a>
<a href="online.html">Online</a>
</div>
</div>
<div class="dropdown">
<button class="dropbtn">Projects
</button>
<div class="dropdown-content">
<a href="school.html">School</a>
<a href="personal.html">Personal</a>
</div>
</div>
<a class="active" href="social.html">Socials</a>
</div>
<center><h1>Welcome to Kaisaan's Website!</h1></center>
<h2>Hello World!</h2>
<p>Hello there I'm Kaisaan Siddiqui, just another person on the internet. On this website I plan on talking about my passions and achievements.</p>
<h2>Contact</h2>
<p>I have linked to some of my Social Media platforms below. I primarily use Discord but I am available on other platforms.<br>
<b>Discord</b>: Kaisaan#6181<br>
<b>Discord Server</b>: <a href="https://discord.gg/NFax4qadkN" target="_blank">Invite Link</a><br>
<b>Instagram</b>: <a href="https://www.instagram.com/kaisaansiddiqui/" target="_blank">@kaisaansiddiqui</a><br>
<b>Reddit</b>: <a href="https://www.reddit.com/user/kaisaans" target="_blank">u/kaisaans</a><br>
<b>Steam</b>: <a href="https://steamcommunity.com/id/kaisaan/" target="_blank">kaisaan</a><br>
<b>Steam Group</b>: <a href="https://steamcommunity.com/groups/kaisaan" targer="_blank">Link</a><br>
<b>Twitter</b>: <a href="https://twitter.com/KaisaanSiddiqui" target="_blank">@KaisaanSiddiqui</a><br>
<b>Youtube Channel</b>: <a href="https://www.youtube.com/channel/UC364Tgsm480XvCL0JDY8sEg" target="_blank">Kaisaan Siddiqui</a><br>
<h2>Source</h2>
<p>You can find the source code for this website on <a href="https://github.com/Kaisaan/kaisaan.github.io" target="_blank">Github</a>.</p>
</body>
</html>