I took too much time to make this so i'll try to optimize my time next time.
What challenges did you encounter, and how did you overcome them?I didn't remember how to do some things, but I searched it out and got it right I guess.
What specific areas of your project would you like help with?I probably complicated things more than it was supposed to, so any help would be welcome.
Hey @Klyyyf,
Good job on completing this solution. For your css file, you can add @font-face, :root css selector to your css code.
:root {
:root {
--white: hsl(0, 0%, 100%);
--light-gray: hsl(212, 45%, 89%);
--grayish-blue: hsl(220, 15%, 55%);
--dark-blue: hsl(218, 44%, 22%);
}
@font-face {
font-family: Outfit;
src: url("./fonts/Outfit.ttf");
}
Hey @wallace-bc,
You did a great job on your first coding project. One step closer to getting better at coding. That is a giant step and I applaud you for that.
First and foremost you can keep for hsl colors the root pseudo-class
Here's an example:
:root {
--white: hsl(0, 0%, 100%);
--light-gray: hsl(212, 45%, 89%);
--grayish-blue: hsl(220, 15%, 55%);
--dark-blue: hsl(218, 44%, 22%);
}
You can even keep your fonts organized with @font-face
@font-face {
font-family: "Outfit", sans-serif;
src: url(./assets/fonts/Outfit.ttf);
}
Here are some links to help you understand the root pseudo-class and font-face class
Hope this helps
Happy Coding*
Hey @litewskidev, Good Job on your challenge. It looks amazing and it matches just like the design. I hope to take inspiration from this.
Happy Coding!
Good Job on Finishing your First challenge
For your HTML img element src attribute you forgot to add a dot before the slash
Change from:
<img src="/images/image-qr-code.png">
To
<img src="./images/image-qr-code.png">
Also put your attributes stuff below your qr-component code. That should fix it
Hope that helps
When you use the root element make sure to use it. You don’t need to assign the hsl, or rgb to the property if it’s in root.
:root {
-background-color: -background-color: hsl(212, 45%, 89%);
}
background-color: var(-background-color);
After a long break, I am started relearning web development. but I did pretty well now.
What challenges did you encounter, and how did you overcome them?I struggled to find the dimensions of the card.
What specific areas of your project would you like help with?It is a basic project.
Hey. good job on finishing your first front end mentor challenge.
You’re code looks clean, and readable. Good job
For css, you can use the :root pseudo class to put all your css hex, rgb and hsl in there. Root pseudo class documentation.
