Nebula is Frontend Mentor Project where you can practice with layouts and basic JavaScript card carousel. Coding card carousel for crew, technology and destination was new for me, However I managed to code a beautiful effect.
Started the project with simple HTML5 boilerplate and created separate SCSS and JavaScript folder for scalability.Then I went on creating variables for colors, font sizes and font weights. I created separate file for each universal section of website such as navigation bar and footer. Made use of "Global.scss" file to create base styling for the project which include all margins, paddings, font sizes, font color, and button styles. I placed all images and svg in separate folder for better debugging. Firstly the navigation bar was coded for mobile and then moved to the larger display sizes. Natural responsiveness approach was used to reduce the use of media queries. The Destination was quite interesting to code as it involved new features that were new to me. The Technology, and Crew page both followed a same struture for card effect. The rest all development was combination of flex, grid and long hours of debugging.