updates of css

This commit is contained in:
transatoshi
2025-01-26 21:47:37 -08:00
parent 16cab174ee
commit 6aee5959d5
7 changed files with 67 additions and 56 deletions

View File

@@ -13,17 +13,21 @@ body {
text-wrap: balance;
}
h3 {
font-size: 15.5px;
font-family: monospace;
}
input[type="text"] {
width: 430px;
}
/* Add a black background color to the top navigation */
.topnav {
background-color: #333;
background-color: black;
overflow: hidden;
padding-left: 10px;
}
/* Style the links inside the navigation bar */
.topnav a {
float: left;
display: block;
@@ -34,30 +38,28 @@ body {
font-size: 17px;
}
/* Change the color of links on hover */
.topnav a:hover {
background-color: #fef102;
color: black;
background-color: black;
color: #fef102;
}
/* Add an active class to highlight the current page */
.topnav a.active {
background-color: #fef102;
color: black;
border-right: black 2px solid;
}
/* Add an active class to highlight the current page */
.topnav a.grey {
border-right: black 2px solid;
}
.topnav a.active2 {
background-color: #fef102;
color: black;
}
.responsive {
max-width: 95%;
max-width: 94.1%;
height: auto;
margin: 10px auto 0px auto;
border: #fef102 solid 0px;
border-radius: 30px 30px 0px 0px;
border-radius: 5px;
box-shadow:0 0 10px #fef102;
text-align: center;
display: block;
@@ -81,9 +83,9 @@ body {
font-size: 16px
font-weight: 800;
border: #fef102 solid 0px;
border-radius: 0 0 10px 10px;
border-radius: 0 0 5px 5px;
box-shadow: 0 0 10px #fef102;
width: 83%;
width: 70%;
height: auto;
margin: -15px auto 30px auto;
display: block;
@@ -105,6 +107,7 @@ body {
color: black;
display: block;
box-shadow: 0 0 10px #fef102;
border-radius: 0 0 5px 5px;
background-color: #fef102;
}
@@ -184,12 +187,17 @@ body {
}
.topnav {
display: block;
justify-content: center;
margin: 0 auto;
overflow: hidden;
background-color: #333;
background-color: #fef102;
width: 87%;
border-radius: 0 0 5px 5px;
box-shadow: 0 0 10px #fef102;
}
.topnav a {
float: left;
display: block;
color: whitesmoke;
text-align: center;
@@ -198,29 +206,32 @@ body {
}
.topnav a:hover {
background-color: #fef102;
color: black;
background-color: black;
color: #fef102;
}
.topnav .icon {
display: none;
}
/* Responsive styles */
@media screen and (max-width: 600px) {
.topnav a {
display: none; /* Hide all links by default */
display: none;
}
.topnav a.icon {
float: right;
display: block; /* Show the hamburger icon */
color: #fef102;
float: none;
display: block;
}
.topnav .icon:hover {
color: #fef102;
}
.topnav.responsive {
position: relative;
}
.topnav.responsive a {
display: block; /* Show links when the menu is responsive */
float: none; /* Remove float */
display: block;
float: none;
}
}