Skip to content
OverviewSolutions
8
Comments
14
LarryTheFatCat
@LarryTheFatCat

All comments

  • LarryTheFatCat•50
    @LarryTheFatCat

    Hey, @vanzasetia!

    Great work on this Guru Leveled challenge, the replication was very precise and the overall code looks great! Fix up the 2 very simple issues on the HTML report and overall great job!

  • LarryTheFatCat•50
    @LarryTheFatCat

    Hey! Nice work on this challenge,

    Couple of things here:

    1.- Try to fix the 2 issues that FrontEndMentor report has shown, that's always a good first step

    2.- For ur input, the point where the text is being added should be incremented more to the left, this can be achievable if you use the text-indent attribute in CSS, you can use this to set a certain amount using what unit of measurement you care to use

    3.- Try having it so when the text gets to a point where it collapses on itself when the browser is resized centered so it can look a lot better! (this is noticable when the max-width is below 365, use media query or modify if you have time)

    Great job with this challenge, and happy coding!

    Marked as helpful
  • LarryTheFatCat•50
    @LarryTheFatCat

    Hey!

    Looks like you've submitted it under the wrong project!

  • LarryTheFatCat•50
    @LarryTheFatCat

    Hey!

    Excellent Job with this challenge!

    Cool that you added a title that goes with the QR code!

    Just one issue:

    Try to fix the HTML Validation Report that is posted... Other than that good job!

  • LarryTheFatCat•50
    @LarryTheFatCat

    Hey!

    Nice work on this challenge

    Looks like you forgot box shadow, that's alright, take a look online about how to use ```box-shadow`` and try to implement into the project!

    I find it odd that your card tends to smash itself into smaller and smaller pieces if the browser is resized, though I like how you used a media query to try and fix it; though it is not required since this is a very challenge!

    Take a look at the HTML validation report and try to fix it other then that, great job!

    Marked as helpful
  • LarryTheFatCat•50
    @LarryTheFatCat

    Please check the livesite preview before providing feedback, I don't really know why it looks bad with that image preview.

  • LarryTheFatCat•50
    @LarryTheFatCat

    just testing smth...

  • LarryTheFatCat•50
    @LarryTheFatCat

    Hey!

    Nice work on the challenge!

    Small card! That's alright,

    Couple things:

    1.- Very small card, but that was very cool how you still made it look like the image! 2.- Fix the 1 accessibility issue, should be a very easy fix 3.- If you can, try to fix the <p> attribute text color, that should be changed and you can do that by doing

    color: {selected-color}

    Other then that, nice work!

    Marked as helpful
  • LarryTheFatCat•50
    @LarryTheFatCat

    Hey!

    Nice work on this challenge!

    Couple things:

    1.- Great work on not getting any accessibility issues as well as no issues on validation report! 2.- Good Job on getting the color perfect! 3.- Only issue I believe that should be fixed and updated is the for the image compared to the actual card box, if you can please fix it that would be great...

    Overall, good job!

    Marked as helpful
  • LarryTheFatCat•50
    @LarryTheFatCat

    Hey!

    Nice work on the challenge!

    Overall, I like what you did with the attribution, creative!

    Make sure to get the colour scheme correct, as well as font-colour, all you have left to do is fix the accessbilIty issues, and you should be good 2 go! Nice work!

    Marked as helpful
  • LarryTheFatCat•50
    @LarryTheFatCat

    Hey!

    Was looking at your code, well done!

    Background colour is off, but if you ever plan on using a bg that is not black, care to use https://convertingcolors.com/hsl-color-220_15_55.html?search=hsl(220,%2015%,%2055%)

    this website can help you double check what colour is being used, good for me so i dont have to keep tyring with multiple colours, fix up the accessibility issues and you're good!

    update:

    You don't have to use flexbox, if you're just centering a card, you can use what I usually do if im editing a page with just 1 single card:

    • { margin: 0; padding: 0; box-sizing: border-box; }

    body { display: grid; place-items: center; height: 100vh; }

    .card { display: grid; place-items: center; }

    Marked as helpful
  • LarryTheFatCat•50
    @LarryTheFatCat

    Thank you!

    Yeah, this is my first time trying to approach with mobile appearance, I'll for sure fix the accessibility issues, and sure, I can improve the text, I'll start working it right now, thank you for the tips! :>

  • LarryTheFatCat•50
    @LarryTheFatCat

    It looks so much better then the photo please don't mind that lol, https://twothreetwo.github.io/QR-code-component/ check here for the actual result

  • LarryTheFatCat•50
    @LarryTheFatCat

    Just gonna add another thing, https://twothreetwo.github.io/Product-preview-card-component/ check here lol it looks a lot better then it actually looks like