This is my official portfolio website to showcase projects and skills. Built with astro framework, react and tailwindcss, the idea was to keep the design simple and not have too many distracting animations, and also have functional form that sends user messages to my mail. I'm adding a theme switcher for anyone who prefers switching from light mode to dark mode.
-
- I added a theme switcher button which works fine on my local machine but is unresponsive stopped working when I hosted it on vercel.
solution to 1 - took down website and hosted it again
- I added a theme switcher button which works fine on my local machine but is unresponsive stopped working when I hosted it on vercel.
-
- Font on the
h1had more spacing on safari browser
solution to 2 - Poppins is not a web safe fontso I changed foint family from Poppins to inter
- Font on the
-
- layout shift in hero section
solution to 3. Changed height property from 100dvh to 100vh because dvh unit causes the layout shift
- layout shift in hero section
Client
- Astro
- SCSS
- CSS
- TailwindCSS
- React
Server
| Color | Hex |
|---|---|
| --light-grey-color | rgb(212, 212, 212) |
| --darker-green-color | rgb(10, 17, 15) |
| --dark-green-color | rgb(19, 32, 29) |
| --mid-dark-green-color | rgb(30, 51, 46) |
| --light-green-color | rgb(58, 112, 92) |
| --accent-color | var(--light-green-color) |
Your Name - @iamthebuilder__
Project Link: https://thebuilderekes.github.io/astro-site/