🧑💻: Improve Footer Visibility and Design in Light Mode #313
Description
Title
Improve Footer Visibility and Design in Light Mode
Enhancement Aim
The current footer is not fully visible in light mode, which affects readability and the overall user experience. This enhancement aims to:
1.Adjust the footer color and contrast to ensure it stands out in both light and dark modes.
2.Improve the footer design to align better with the site’s overall aesthetic.
Changes
To make a footer that looks good in both light and dark modes, I first choose colors that provide good contrast and adjust subtly between themes. Here’s how I approach it:
Neutral Base Color: I pick a medium to dark neutral color for the footer’s background, like a dark gray or navy, that contrasts well in both themes.
Highlight Color: I select a highlight color that I can soften in light mode to make it more visually comfortable. For example, in light mode, I might desaturate or lighten the highlight color slightly.
Text Color: I make sure the text color has strong contrast with the background: white or off-white for dark mode, and a darker shade (like black or dark gray) for light mode. This keeps the text readable no matter the mode.
Accent Colors: I use subtle accent colors for things like icons or links—something like teal or muted blue usually works well and adjusts smoothly between modes.
Screenshots 📷
Guidelines
- I have read the guidelines
- I have the link to my latest merged PR
Full Name
Eva Balabantaray
Participant Role
GSSOC