This is a solution to the PayAPI multi-page website challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

• Overview
  • The challenge
  • Links
• My process
  • Built with
  • What I learned
  • Continued development
  • Useful resources
• Author

Users should be able to:

• View the optimal layout for each page depending on their device's screen size
• See hover states for all interactive elements throughout the site
• Receive an error message when the contact form is submitted if:
  • The Name, Email Address or Message fields are empty should show "This field can't be empty"
  • The Email Address is not formatted correctly should show "Please use a valid email address"

• Solution URL: Github
• Live Site URL: Vercel

• Semantic HTML5 markup
• Flexbox
• CSS Grid
• Desktop-first workflow
• 7-1 Sass Architecture
• BEM

Recalled HTML markup and Sass 7-1 architecture. Used basics Sass features and tried to follow Web accessibility standards. Optimized images for different screens.

Will focus on more advance Sass techniques, and try to use more generic classes in styling.

• Mobile menu - Nice mobile menu designs.
• Form validation - Great article and code base to validate form.

• Frontend Mentor - @wdbyb
• Linkedin - @yuriy-vinivitin