Base Apparel coming soon page - Flexbox / JS DOM

Hello @aazs-edu. Congratulations on completing this challenge!!!🎉

I have a few tips you might be interested in to improve your solution.

HTML 📃:

• To improve accessibility, wrap your code below in <form>

<div class="email-input">
      <input type="email" placeholder="Email Address" />
      <img class="invalid-icon hide" src="images/icon-error.svg" alt="icon-error">
     <button id="submitBtn"><img src="images/icon-arrow.svg" alt="" /></button>
 </div>
   <div class="invalid-feedback hide">
      <p class="invalid-feedback-msg">Please provide a valid email</p>
   </div>

The arrow and error icon are decorative which means you can leave alt attribute blank and add aria-hidden:true; so it can be ignored by screen readers.

More info📚:

• aria-hidden

<div class="img-box">
      <img class="hero-desktop" src="images/hero-desktop.jpg" alt="hero" />
 </div>

Mobile and hero images must have more descriptive alt text.

Example:

<img class="hero-desktop" src="images/hero-desktop.jpg" alt="a woman in orange shirt standing in front of a green tree and red wall" />

Here is my solution to this challenge Base Apparel Coming Page

Hope you find this useful and don't hesitate to reach out if you have any questions