samluvspizza-next

Refactoring My Portfolio Site to make use of Next.js

Change the fonts that are used to more readable and accessibility friendly fonts

Next.js offers a way to implement and inject a element in the compiled HTML by using their own component imported from 'next/head'.
I used this component to inject a new element with the description of the webpage in the component so that all of the pages that are compiled by Next will have that element.

Fixes Issue #26 by implementing the mobile menu
Fixes issue #25 by adding a meta description so that I can get the viewport and media queries working in css and improve lighthouse score.
Implemented Desktop & Large tablet nav bar that are hidden on mobile and also made sure that the mobile hamburger icon and mobile menu can never appear in desktop and large tablet screen sizes.

Fix Issue #20 and swapped all css selectors to follow the BEM naming convention.
Fix issue #18 by adding two icons from FontAwesome in order for users to be able to click on the links to visit the live project site and the github repo to see the code.
Fix issue #17 by adding making links open in a new tab so that users who are viewing my portfolio site don't leave the site and stay to look at more.
Fix issue #16 by matching the padding within the AboutMe container to the containers of other pages on mobile.
Fix issue #15 by making sure that the contact page title also has a text-shadow similar to the titles on the other pages.
Fix issue #14 by aligning all of the titles to the left in order to increase visual consistency among all the pages since the work experience page looked award with align: right;
Fix issue #13 by applying transitions only to the needed css rules and not all of them.
Fix issue #12 by adding an alt property to the image in the navbar component.

SamPuckett / samluvspizza-next