Interactive card details form

This is a solution to the Interactive card details form challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

Table of contents

• Overview
  • The challenge
  • Screenshots
  • Links
• My process
  • Built with
  • Tests
• Author

Overview

The challenge

Users should be able to:

• View the optimal layout depending on their device's screen size
• See hover and focus states for interactive elements

Screenshots

• Desktop view

• Mobile view

Links

• Fron End Mentor solution
• Live site

My process

Built with

• Semantic HTML5 markup
• CSS custom properties
• Flexbox
• Media queries and responsive design
• JavaScript functions and DOM events
• Regular expresions(RegEx)
• Validations form

Tests

The UI was tested with

Author

• Linkedin - Agustin Emanuel Sanchez
• Frontend Mentor - @agusscript
• CodePen - Agustin Sanchez
• Twitter - @agus_script