somaye-beiranvand / FrontendMentor-clipboard-landing-page-master

Frontend Mentor - Clipboard landing page solution

This is a solution to the Clipboard landing page challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

Table of contents

• Overview
  • The challenge
  • Links
• My process
  • Built with
  • Useful resources
• Acknowledgments

Overview

The challenge

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

Links

• Live Site URL: clipboard-landing-page-master

My process

Built with

• HTML5 markup
• CSS custom properties
• Flexbox
• Mobile-first workflow
• bootstrap 5
• Styled Components - For footer section

Useful links

• HTML CSS Support - a great extension for vscode editor which helped me with the completion of bootstrap classes.

just follow these steps to enjoy this amazing tool

[1] in your vscode go to file/preferences/setting

[2] search for quickSuggestions

[3] do this settings

"editor.quickSuggestions": {
        "other": true,
        "comments": false,
        "strings": true
    },

[4] install "HTML CSS Support" extension

[5] have fun 😉

• Designer Tools -Helpful to Measure and align elements within Chrome

• FireShot -FireShot takes full web page screenshots.

• google-webfonts-helper -a wonderful website to find fonts in all web formats and weights.

Acknowledgments

thanks Alireza Mohammadi and his website websila that helped me experience the enjoy of coding.🌺