Fixing The Overflow Issue

Changed default attribute in html from overflow being shown to hidden.
This commit is contained in:
a-box31
2022-12-23 05:06:22 -05:00
parent ade281602f
commit 6de8db0780
3 changed files with 34 additions and 17 deletions
+23 -8
View File
@@ -10,6 +10,7 @@ html {
height:100%; height:100%;
margin:0; margin:0;
padding:0; padding:0;
overflow-x: hidden;
} }
body { body {
@@ -24,7 +25,8 @@ body {
/* Better Scroll Bar */ /* Better Scroll Bar */
body::-webkit-scrollbar { body::-webkit-scrollbar {
width: .5rem width: .7rem;
height: .7rem;
} }
body::-webkit-scrollbar-track{ body::-webkit-scrollbar-track{
@@ -39,6 +41,7 @@ body::-webkit-scrollbar-thumb {
/* header portion */ /* header portion */
.main-header { .main-header {
margin: 0 auto; margin: 0 auto;
@@ -56,28 +59,23 @@ header{
} }
.brand-name { .brand-name {
/* class for band name: should be centered wherever it is */ /* class for band name: should be centered wherever it is */
text-align: center; text-align: center;
/* heading elements like h1 all have margins: let the margins be 0 */ /* heading elements like h1 all have margins: let the margins be 0 */
margin: 0; margin: 0;
font-size: 1em; font-size: 1em;
/* changing the everything tag's font set on the heading to be different */ /* changing the everything tag's font set on the heading to be different */
font-family: Rajdhani, sans-serif, poppins; font-family: Rajdhani, sans-serif, poppins;
/* /*
Since heading are by default bolded, the font-weight can be changed to Since heading are by default bolded, the font-weight can be changed to
normalize the bolded text normalize the bolded text
*/ */
font-weight: normal; font-weight: normal;
/* All band names should be white */ /* All band names should be white */
color: white; color: white;
} }
.band-name-large { .band-name-large {
font-size: 2em; font-size: 2em;
} }
@@ -127,7 +125,7 @@ header{
} }
@media (max-width: 1350px){ @media (max-width: 800px){
.toggle-button { .toggle-button {
display: flex; display: flex;
} }
@@ -158,6 +156,23 @@ header{
.navbar-links.active { .navbar-links.active {
display: flex; display: flex;
} }
.brand-name {
/* class for band name: should be centered wherever it is */
text-align: center;
/* heading elements like h1 all have margins: let the margins be 0 */
margin: 0;
font-size: .8em;
/* changing the everything tag's font set on the heading to be different */
font-family: Rajdhani, sans-serif, poppins;
/*
Since heading are by default bolded, the font-weight can be changed to
normalize the bolded text
*/
font-weight: normal;
/* All band names should be white */
color: white;
}
} }
+9 -7
View File
@@ -167,15 +167,22 @@
// var clon = temp.content.cloneNode(true); // var clon = temp.content.cloneNode(true);
// document.body.appendChild(clon); // document.body.appendChild(clon);
// } // }
const toggleButton = document.getElementsByClassName('toggle-button')[0];
const navbarLinks = document.getElementsByClassName('navbar-links')[0];
if (toggleButton){
toggleButton.addEventListener('click', () => {
navbarLinks.classList.toggle('active')
})
}
</script> </script>
</head> </head>
<body> <body>
<div class="box-area"> <div class="box-area">
<header> <header>
<div class="main-header"> <div class="main-header">
<nav class="navigation"> <nav class="navigation">
@@ -198,19 +205,15 @@
<li> <li>
<a href="myGuilds" id="guildslink" class="nav-link"><i class="fa-solid fa-server" alt="Servers" style="scale: 2; color: rgb(11, 189, 189);"></i></a> <a href="myGuilds" id="guildslink" class="nav-link"><i class="fa-solid fa-server" alt="Servers" style="scale: 2; color: rgb(11, 189, 189);"></i></a>
</li> </li>
<li> <li>
<a href="calendar" id="callink" class="nav-link"><i class="fa-solid fa-calendar" alt="Calendar" style="scale: 2; color: lightgrey;"></i></a> <a href="calendar" id="callink" class="nav-link"><i class="fa-solid fa-calendar" alt="Calendar" style="scale: 2; color: lightgrey;"></i></a>
</li> </li>
<li> <li>
<a href="https://docs.selmerbot.com" target="_blank" class="nav-link"><i class="fa-solid fa-book" style="scale: 2; color: white;" alt="WIKI"></i></a> <a href="https://docs.selmerbot.com" target="_blank" class="nav-link"><i class="fa-solid fa-book" style="scale: 2; color: white;" alt="WIKI"></i></a>
</li> </li>
<li> <li>
<a href="premium" class="nav-link"><i class="fa-solid fa-crown" style="scale: 2; color: gold;" alt="PREMIUM"></i></a> <a href="premium" class="nav-link"><i class="fa-solid fa-crown" style="scale: 2; color: gold;" alt="PREMIUM"></i></a>
</li> </li>
<li> <li>
<a href="team" class="nav-link"><i class="fa-solid fa-user-gear" style="scale: 2; color: rgb(12, 216, 5);" alt="AUTHOR"></i></a> <a href="team" class="nav-link"><i class="fa-solid fa-user-gear" style="scale: 2; color: rgb(12, 216, 5);" alt="AUTHOR"></i></a>
</li> </li>
@@ -464,7 +467,6 @@
</li> </li>
</ul> </ul>
</footer> </footer>
</div> </div>
</body> </body>
</html> </html>
+2 -2
View File
@@ -21,7 +21,6 @@ const mongouri = process.env.mongouri;
const client = new MongoClient(mongouri, { useNewUrlParser: true, useUnifiedTopology: true, serverApi: ServerApiVersion.v1 }); const client = new MongoClient(mongouri, { useNewUrlParser: true, useUnifiedTopology: true, serverApi: ServerApiVersion.v1 });
const connection = client.connect(); const connection = client.connect();
const bot = new Client({ const bot = new Client({
intents: [ intents: [
Intents.FLAGS.GUILDS, Intents.FLAGS.GUILDS,
@@ -628,4 +627,5 @@ app.get("*",(req,res) => {
res.sendFile("404.html", {root: 'HTML'}); res.sendFile("404.html", {root: 'HTML'});
}) })
app.listen(port, () => console.log(`App listening on port ${port}`)); app.listen(port, () => console.log(`App listening on port ${port}`));