Frontend Mentor - Pod request access landing page solution

This is a solution to the Pod request access landing page challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

The challenge

Users should be able to:

  • View the optimal layout depending on their device's screen size
  • See hover states for interactive elements
  • Receive an error message when the form is submitted if:
    • The Email address field is empty should show "Oops! Please add your email"
    • The email is not formatted correctly should show "Oops! Please check your email"

Built with

  • Semantic HTML5 markup
  • CSS custom properties
  • Flexbox
  • Custom JS validation email input field
  • Mobile-first workflow