Skip to content
Submitted 7 months ago

Article Preview Component

sass/scss, accessibility
Mayen•440
@Mayen007
A solution to the Article preview component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

What challenges did you encounter, and how did you overcome them?

This was my first time using SCSS on a project. I haven't really used the full power of this pre-processor and I hope to use more in future projects.

What specific areas of your project would you like help with?

I would like to get help on working with SCSS and how to get a better looking "arrow" for the share button.

Any other feedback is welcomed.

Code

Please log in to post a comment

Log in

Community feedback

  • Tunde Abdulhamid Sanusi (Tuham)•190
    @tuhamworld

    Weldone on working on the project, and you did quite well despite your first attempt at using SCSS.

    1. To start working on SCSS, here are the steps I would recommend;
    • Create a folder and name it scss.
    • Now create your file (e.g main.scss) inside the scss folder
    • Open a command prompt in the folder and run this command sass --watch main.scss:main.css
    • The purpose of the command prompt is to compile your sass styles into CSS automatically
    • Now link the compiled CSS (main.css) in your index.html folder
    1. In your mobile view, I noticed the share popup box displays on load. You will need to first display all contents of the mobile view, and then when the share icon is clicked on mobile, it will display the mobile share popup box

    Well done once again And cheers

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord