100 lines
1.3 KiB
CSS

header {
display: flex;
flex-direction: column;
margin: 1%;
margin-top: 0%;
}
header a {
text-decoration: none;
color: inherit;
cursor: pointer;
}
figure {
margin: 0px;
height: 10%;
}
#logo {
height: 5rem;
background-color: white;
}
nav a {
text-decoration: none;
color: inherit;
cursor: pointer;
}
nav a li {
background-color: none;
padding: 0.5rem;
border: solid 1px gray;
}
nav a li:hover {
background-color: gray;
}
nav ul {
display: flex;
flex-direction: row;
list-style: none;
margin: 0px;
padding: 0px;
}
.Hide {
display: none;
}
.DropDown {
cursor: default;
position: relative;
}
/* makes dropdown visible */
.DropDown:hover .Hide {
display: block;
position: absolute;
width: 100%;
text-align: center;
}
header div {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
header div button {
border: none;
cursor: pointer;
height: 4rem;
width: 4rem;
align-items: center;
background-color: inherit;
border: solid 2px gray;
border-radius: 1rem;
}
header div button img {
width: 100%;
}
/* for dark mode */
.darkmode {
filter: invert(95%) hue-rotate(180deg);
background-color: white;
}
#root.darkmode #logo.logoAfterDark {
filter: hue-rotate(180deg);
}
#root.darkmode #darkModeToggle {
filter: hue-rotate(180deg);
}