Skip to content
OverviewSolutions
14
Comments
14

Satyam Jha

@satyammjhaIndia400 points

I am a 2nd-year computer science student with a passion for frontend web development and Data Structures and Algorithms (DSA). Proficient in Bootstrap, Tailwind, JavaScript, Adobe XD, HTML, and CSS, I craft visually stunning websites and hold a 4-star rating on HackerRank. My diverse portfolio showc

Latest solutions

View more solutions

Latest comments

  • Satyam Jha•400
    @satyammjha

    Great attempt Avinash. I have a solution for your query. On clicking the rating first remove the active class from all the ratings and add the active class to the targeted rating. You may use the code below:-

    e.addEventListener("click", (event) => {
rating.classList.remove("active")
event.target.classList.add("active")
selectedRating = event.target.innerHTML;
   }) }); `

This might help you. Happy Coding ✌🏻😊
  • Satyam Jha•400
    @satyammjha

    Great attempt @MikeOdhiambo. I have one piece of advice for you. You may add input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; } for the input type number. It will hide the arrows for input. I hope it helps. Happy Coding ✌🏻🤗.

    Marked as helpful
  • Satyam Jha•400
    @satyammjha

    Great attempt Abhishek. It's good that you used your own resource but sticking to the design given will help you in the future when you will work for clients. One more piece of advice I have for you is you may use transition: 0.3s ease for the button, it will delay the background color change on hovering over the button. Hope it helps. Happy Coding🤗✌🏻.

    Marked as helpful
  • Satyam Jha•400
    @satyammjha

    Great attempt @JoeMarv. I have a few suggestions for you:-

    1. Please decrease the height and width of the parent div.
    2. Adjust the height of the `:: before for the eye. So that on hover it will cover the whole NFT image.
    3. Increase the margin-top for the profile section.
    4. Add align-item: center for the author class.

    Hope it helps. Happy Coding🤗✌🏻.

    Marked as helpful
  • Satyam Jha•400
    @satyammjha

    Great attempt @ndrivas87. I have a few suggestions for you:-

    1. For the border radius of image use Border-Radius: 25px 0px 0px 25px , It will set border radius of the left side of the image to 25px.
    2. You may use transition: 0.3s ease for the button so that the change in color of the button on the hover will be smooth.
    3. Use <br> after Gabrielle and Eau it will break the line and the title would be the same as given in the design.
    4. You may use align-items: self-end; for the price class it will align the old price with the new price.
    5. Use .card-info .btn {margin-top: 45px;margin-left: 32px;} . It will bring the button to the correct position.

    And one last thing, change the font of the button as it was given in the style guide. Hope it helps. Happy Coding🤗✌🏻

    Marked as helpful
  • Satyam Jha•400
    @satyammjha

    Great work @korede2000. I have a tip for you to improve the button. You may add transition time for the button by using transition: 0.3s ease so that it will take some time to change the color of the button on hover. All other things are best according to me. Happy Coding🤗✌🏻

View more comments