This project showcases five of the places that I go to the most for lunch. The site includes a map of the locations, photos of the food and locations, descriptions and food reccomendations. The site features parallax images and a responsive layout.
View live siteI usee Figma to create a mockup for this project. After gathering the content for the page, I created the layout and added in the photos.
View prototypeAfter determining the design of the page and style of the map, I coded the site using Bootstrap HTML and CSS.
View live siteI included an interactive map in this project to show the locations of the restaurants mentioned. I used Mapbox to create and style this map. The locations of the restaurants were added to the map using JavaScript and GeoJSON. The buttons next to the map allow you to fly between each of the locations on the map.
I used a parallax effect on some of the images in this site. To achieve this effect I used CSS to set the background attachment to fixed on the parallax images.