This is a solution to the Results summary component 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 interface depending on their device's screen size
- See hover and focus states for all interactive elements on the page
- Bonus: Use the local JSON data to dynamically populate the content
- Solution URL: Github URL repository
- Live Site URL: Live site deployed by netlify
- Semantic HTML5 markup
- Vanilla CSS
- CSS custom properties for colors and fonts
- Flexbox
- CSS Grid with auto-fit and minmax for responsive design
- CSS reset - Modern CSS reset.
- Image compressor - This online image optimizer uses a smart combination of the best optimization and lossy compression algorithms to shrink JPEG, GIF and PNG images to the minimum possible size while keeping the required level of quality.
- @font-face generator - Modern and simple css @font-face generator.
- Box Shadow CSS Generator - A CSS generator that helps you demonstrate and quickly generate CSS declarations for your website.
For all authors who publish open source ressources and contents freely available and make Internet more awesome.