Skip to content
Submitted about 2 years ago

Responsive Space Tourism Website made with Vite+React

accessibility, react, sass/scss, vite
DaFlusher350
@DaFlusher
A solution to the Space tourism multi-page website challenge

Solution retrospective


It was quite a struggle to get the background images to align properly, even with the background said to no-repeat, there were still some grey areas of repeating images. I tried to keep the code DRY by using props and hooks to create reusable components. The height of the side navigation also looks weird in some places. I think it comes from the fact that all the main navigation pages received a page layout component which contained preset styles for navigation. With each of the pages having different heights, 100% no longer worked. I tried using the height: calc(100vh + extra pixels from the navbar), 100vh, 100%. None produced a uniform height for the side nav. In future projects, I would definitely try another approach. Any advice on best practices?.

Code
Loading...

Please log in to post a comment

Log in

Community feedback

No feedback yet. Be the first to give feedback on DaFlusher’s solution.

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord