/base-apparel-coming-soon-master

This is a solution to the base apparel coming soon master on Frontend Mentor

Primary LanguageSCSS

Base Apparel coming soon page challenge hub

The challenge | Links | Built with | What I learned | Resources | Author

🌋 The challenge

Your challenge is to build out this coming soon page and get it looking as close to the design as possible.

Your 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
  • Receive an error message when the form is submitted if:
    • The input field is empty
    • The email address is not formatted correctly

🔗 Links

👷‍♂️ Built with

  • JavaScript
  • Sass
  • HTML

👨‍🎓 What I learned

  • understand how to do a custom styling for elements that are invalid
  • copy the css of a figma element
  • I understand that background-color with linear-gradient doesn't make any sense

😬 Author

<style style="display: none"> .icon { transform: translateY(3px); width: 20px; height: 20px; } .links { display: flex; justify-content: center; gap: 10px; margin-bottom: 50px; } a { cursor: pointer; : none; } .img__project { width: 800px; margin: 0 auto; } .line-1{ position: relative; top: 50%; width: 100%; margin: 0 auto; font-size: 180%; text-align: center; white-space: nowrap; overflow: hidden; transform: translateY(-50%); } /* Animation */ .anim-typewriter{ animation: typewriter 4s steps(44) 1s 1 normal both } @keyframes typewriter{ from{width: 0;} to{width: 24em;} } </style>