Skip to content
OverviewSolutions
26
Comments
6
BigDaddyFlo
@FloRiouffreyt

All comments

  • BigDaddyFlo•570
    @FloRiouffreyt

    Take a look at Kevin Powell's channel on Youtube, this guy is a super good tutorial maker, has plenty of super interesting videos, and A LOT of things to learn! https://www.youtube.com/@KevinPowell/videos CSS Custom Properties are really powerful and useful, for example on multi-theme pages. Check out KP's videos on the subject, and the rest too, it goes from super simple to mind blowingly clever. Hope this helps! And good job on the challenge, by the way :)

    Marked as helpful
  • BigDaddyFlo•570
    @FloRiouffreyt

    Hi @matiasluduena23, just remove the first "/" in front of the URL. This one gets you back to the root of your github folder, and that is not what you want. You want to stay in the folder containing the index.html file, so simply write "url("images/image-product-desktop.jpg")", I believe that should do it. https://www.w3schools.com/html/html_filepaths.asp Also try to pay attention in HTML to the order of your headings (h1, h2 ...). It is not good practice to have any other "hX" before the "h1" (in your case, "Perfume" is h4, and "Gabrielle eau de parfum" is h1). Hope this helps! EDIT: @Titodelux is right, you actually need to go back one folder, so "../images/[...]", my bad

    Marked as helpful
  • BigDaddyFlo•570
    @FloRiouffreyt

    Hi! It's tough to work on dates and time with vanilla JS, good work! Take a look at the Day JS library, great for manipulating time! https://day.js.org/docs/en/installation/installation. FrontEndMentor wants me to write a longer feedback to validate the post, so here are a few useless words... but still, Days JS is awesome

    Marked as helpful
  • BigDaddyFlo•570
    @FloRiouffreyt

    It's definitely possible to do the color change with CSS, by using directly the <svg> and not an <img> tag. Feel free to check to way I did it, it works perfectly fine.

    Import the <svg>, add the "fill" attribute with the default green color on it, and then in CSS, locate your svg and create the hover rule.

    It's even better to put the <svg> inside an element which will be the one pointed by the hover. If you hover an SVG, every part that is not filled will not be considered "hovered" (like the hollow part of the F of Facebook for example".

    If you put it inside an <ul> then each <svg> in <li>, give a common class to all your <li>, and in CSS, simply add " .your-li-class:hover > svg { fill:#yourcolor }. Hope this helps!

    Marked as helpful
  • BigDaddyFlo•570
    @FloRiouffreyt

    Great job! A bit of feedback, regarding date verification: 31st July for example returns an error, but not 31st August which is correct. Also, you can have a 29th February on non-leap years, and actually a 30th February every year... If you manage to get around that, it will be pretty much flawless! Hope this helps

    Marked as helpful
  • BigDaddyFlo•570
    @FloRiouffreyt

    Hi there! Noob answer, I'm not an expert but here are my 2 cents: use a CSS "width: max-content;" on your <h1>Equilibrium #3429</h1>, this way the hover will not happen when you're not directly on the text. I also used an ::after pseudo-element for the hover on the image, don't know if it's a better practice... The rest looks really good to me, good job (but again, I'm no expert) Hope this helps!

    Marked as helpful