Fix light/dark mode transition for projects section

This commit is contained in:
Patrick Schwarzer 2025-05-12 15:30:07 +02:00
parent ff21444fed
commit 4289a373a1

View file

@ -257,11 +257,15 @@ body.light-mode .home-container a:hover {
align-items: center;
color: rgb(216, 216, 216);
}
body.light-mode .projects-container {
color: rgb(216, 216, 216);
}
.projects-container h1 {
font-size: 2rem;
margin-bottom: 2rem;
color: rgb(216, 216, 216);
}
body.light-mode .projects-container {
body.light-mode .projects-container h1 {
color: #3a3a3a;
}
.projects {
@ -284,6 +288,16 @@ body.light-mode .project {
.project h1 {
margin-bottom: 1.25rem;
font-size: 1.5rem;
color: rgb(216, 216, 216);
}
body.light-mode .project h1 {
color: #3a3a3a;
}
.project p {
color: rgb(216, 216, 216);
}
body.light-mode .project p {
color: #3a3a3a;
}
.project ul {
display: flex;
@ -295,6 +309,10 @@ body.light-mode .project {
.project li {
margin: 0.5em;
font-size: 0.85rem;
color: rgb(216, 216, 216);
}
body.light-mode .project li {
color: #3a3a3a;
}
.project a {
display: inline-flex;
@ -327,3 +345,12 @@ body.light-mode .project a:hover {
color: white;
background-color: #5865f2;
}
/* <a> transition fix */
.project a,
.home-container a,
footer a {
transition: background-color 0.3s ease, transform 0.15s ease;
}