All comments

• 

  Charles Barros• 70

  @charbavito

  Submitted almost 2 years ago

  This is my proposal of solution to the QR code component challenge from Frontend Mentor website and my very first non-tutorial project in front-end carrer. The challenge consists of creating a simple static page using the jpg design file as reference and using only HTML5 and CSS3. As I said, this was my first non-tutorial Front-end project, so everything was a great learning experience, however, I emphasize that the alignment techniques both with Flexbox and with display block and also relative and absolute positions were great learnings in this challenge.

  

  HTML5, CSS3, Flexbox, VScode, Git and Github

  2

  60

  

  P

  Abdelrhman Ahmed• 170

  @MrBlackvanta

  Posted almost 2 years ago

  Hey @charbavito congratulation on solving your first challenge you did a great job, I loved you're code very much.

  A couple of hints tho to really complete this challenge:-

  • Change the font-weight of the heading to 700
  • Add a box-shadow to the card.

  You're more than welcome to contact me if you ever get stuck in you're upcoming challenges at [email protected]

  Marked as helpful

  1

  This comment has received 1 replyShow
• 

  Emmanuel K. Flomoku• 20

  @Flomoku231

  Submitted almost 2 years ago

  The project was good and I learn a lot. I found it difficult in importing the font family in my code. I tried my best but it was not working for me. I am sure of every code that I wrote in this project. I am hoping to do more projects in order to learn something new everyday.

  Thanks!

  

  QR Code using HTML & CSS

  3

  40

  

  P

  Abdelrhman Ahmed• 170

  @MrBlackvanta

  Posted almost 2 years ago

  Hey EMMANUEL congratulation on solving the challenge, lovely work.

  as for the code try to use google fonts go to the website, select the font family you want, select the weights you want then in the right sidebar you shall find a link that looks like this

  <link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link href="https://fonts.googleapis.com/css2?family=Kumbh+Sans:wght@400;700&display=swap" rel="stylesheet">

  copy it and paste in your html head before the CSS link tag and then apply it in your CSS using the font-family property like this font-family: 'Kumbh Sans', sans-serif;

  0

  This comment has received 2 repliesShow
• 

  Ana Z.• 240

  @vace328

  Submitted almost 2 years ago

  

  FAQ Accordion Card using Vanilla JS and SASS/SCSS

  1

  30

  

  P

  Abdelrhman Ahmed• 170

  @MrBlackvanta

  Posted almost 2 years ago

  Hey @vace328 Congratulation on solving this challenge <3

  You're just few steps from perfection.

  • Try to add box-shadow to the card.
  • When a question is clicked and you hover it the text shouldn't turn orange.
  • If you really challenge yourself try to do the Bonus point (Complete the challenge without using JavaScript)

  0

  This comment has received 1 replyShow
• 

  Zia ur Rehman• 10

  @ZiaSandhu

  Submitted about 2 years ago

  

  QR Code Component

  1

  20

  

  P

  Abdelrhman Ahmed• 170

  @MrBlackvanta

  Posted about 2 years ago

  You did great buddy, but here are somethings you really need to consider:-

  • body background color is not right.
  • Container border radius is missing.
  • Container box shadow is missing.
  • Header color is not right.
  • Header font weight is not right.
  • Paragraph color is not right.

  0