Photography Site Homepage
components.html page demonstrating Atomic Design
Overall CSS Structure
_card.css containing higher level structure and layout
Header and Footer CSS Layout
Header and Footer HTML
FlexBox space-between used to move the logo and nav sections to the left and right of the page
FlexBox centered footer of social icons
Gallery HTML and CSS
Gallery using Grid
Blog Cards using Grid
Hero HTML and CSS for Responsive Design
Hero on a small screen (375px)
Blog Card HTML and CSS Responsive Design
Image Gallery HTML and CSS Responsive Design
Blog Card and Image Gallery layouts on iPhone X

Contact the Author

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store