Skip to content

This responsive landing page allows users to submit their email address. The page layout is optimized for different screen sizes, and all interactive elements have hover states. The email submission form includes error messages that inform users if they forget to add their email or provide an incorrectly formatted email address.

Notifications You must be signed in to change notification settings

regal-shabazz/ping-coming-soon-page

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

13 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Frontend Mentor - Ping coming soon page

Design preview for the Ping coming soon page coding challenge

Welcome! 👋

Thanks for checking out this project.

The challenge

The challenge is to build out this Coming Soon page and get it looking as close to the design as possible.

Users should be able to:

  • View the optimal layout for the site depending on their device's screen size
  • See hover states for all interactive elements on the page
  • Submit their email address using an input field
  • Receive an error message when the form is submitted if:
    • The input field is empty. The message for this error should say "Whoops! It looks like you forgot to add your email"
    • The email address is not formatted correctly (i.e. a correct email address should have this structure: [email protected]). The message for this error should say "Please provide a valid email address"

Where to find everything

Your task is to build out the project to the designs inside the /design folder. You will find both a mobile and a desktop version of the design.

The designs are in JPG static format. Using JPGs will mean that you'll need to use your best judgment for styles such as font-size, padding and margin.

You will find all the required assets in the /images folder. The assets are already optimized.

There is also a style-guide.md file containing the information you'll need, such as color palette and fonts.

Feel free to contribute.

Thanks for checking! 🚀

About

This responsive landing page allows users to submit their email address. The page layout is optimized for different screen sizes, and all interactive elements have hover states. The email submission form includes error messages that inform users if they forget to add their email or provide an incorrectly formatted email address.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages