This is a solution to the Chat app CSS illustration challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
Users should be able to:
- View the optimal layout for the component depending on their device's screen size
- Bonus: See the chat interface animate on the initial load
- Solution URL: Github
- Live Site URL: Github Pages
Started with a vertical design and placing the items on a template. After that, only set clases for elements on each side and added @media-queries to set the different sizes for differents size screens.
- Semantic HTML5 markup
- CSS custom properties
- CSS Grid
- Mobile-first workflow
- @media-queries
Responsive design, but without @media-queries, think can make the process more efficient.
- Website - Cromega08
- Frontend Mentor - @cromega08
- CodePen - @cromega08
I wanna thank me for accomplish this challenge.
Superbus et Hedonistic~