luismiddleton/frontend-assessment

MindArc Frontend Assessment

Introduction

Thanks for taking the time to complete this frontend technical assessment. We will be focusing on code quality (reusability, readability, maintainability, etc.) and your eye for detail. Feel free to add libraries and edit the HTML files as required. Bonus points if SASS/LESS is used.

Estimated Time: 45m - 1h

Exercise 1

Build a responsive page based on the designs.

Working file

exercise1.html

Designs

• exercise1-desktop.png
• exercise1-mobile.png

Assets

• Desktop banner - http://via.placeholder.com/1440x650
• Mobile banner - http://via.placeholder.com/600x600
• Content images - http://via.placeholder.com/400x300

Exercise 2

Convert the HTML to an accordion.

Working file

exercise2.html

Requirements

1. Only 1 accordion should be open at a time.
2. Open the first accordion on load.
3. If the open accordion is clicked, close it.

Bonus points

• Improve the user experience with meaningful animations/transitions.
• Make it prettier.