Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

QR code card

K 80

@lilythelily

Desktop design screenshot for the QR code component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


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

I have to confess that this apparently simple task is full of challenges for me.

For the color of paragraph ("Scan the QR code..."), I applied HSL color code specified in the style guide. But somehow, it looked much much paler compared to the sample design. Was something wrong with my browser...? I checked and double-checked everything I could think of, but couldn't figure out why. Finally I gave up and chose my own gray instead (Cheat!).

Also, I struggled with GitHub as always. Of course, I cannot use the command line, which is more than I can chew. Somehow, my css file wasn't applied to the html.index on GitHub. No matter how many times I deployed, it only showed an ugly html-only page... I almost gave up and deleted my repo. Then, I decided to create new repo and uploaded the files again. Somehow, it worked this time. This is the complete mystery for someone with my current skill and knowledge.

Community feedback

P
Smaylen5 430

@Smailen5

Posted

I'm not sure if it's a typo, but you wrote "html.index" instead of "index.html". This might be the reason for the stylesheet not being found.

Marked as helpful

0

K 80

@lilythelily

Posted

Thank you, @Smailen5 . You are absolutely right. It was my silly typo…. :)

0

Please log in to post a comment

Log in with GitHub
Discord logo

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