Skip to content
OverviewSolutions
4
Comments
13

Pranshu Dobhal

@pranshudobhalIndia295 points

UI Developer | Fascinated by creative designs

Latest solutions

Latest comments

  • Pranshu Dobhal•295
    @pranshudobhal

    Hi Maya,

    To make the box-shadow look right. Check out these videos from Kevin Powell on box-shadow.

    https://www.youtube.com/watch?v=TZRSXNc0T1k

    https://www.youtube.com/watch?v=Yon4l3MUBGY

    It explains how to get that depth effect.

  • Pranshu Dobhal•295
    @pranshudobhal

    Hey Afiq,

    To get the discount applied to the prices, you can write your code as below:

    function tog(){
    console.log(this.checked);
}

document.querySelector('.toggle').addEventListener('click', tog);

    The above code adds an event listener on click on the toggle. So when the toggle is on, this.checked would return true and when it's off, it would return false. So, if this.checked value is true, you can invoke the discount function and when it's false you can display the original price.

    Hope this helps! :D

  • Pranshu Dobhal•295
    @pranshudobhal

    Hi Marta,

    First of all, great work!

    Second, I would suggest that you decrease the height of the elements so that it matches with the design provided. And also in the report generated, shows that there are accessibility and HTML issues that need to be looked into.

    You have used <div class=box__icon> as a child element of <ul>, it would be better if you use <li> list item for displaying the content.

  • Pranshu Dobhal•295
    @pranshudobhal

    Hello,

    The website is really well made. Great work!

    On checking the website on the mobile device, I found out that your background image is not showing up as per the design.

  • Pranshu Dobhal•295
    @pranshudobhal

    Hi Keshav,

    Making a website responsive means that the appearance of the website dynamically changes depending on the screen size. You can implement the responsive design using media queries in CSS or using frameworks like Boostrap.

    Check out the link below to learn about media queries. https://www.w3schools.com/css/css_rwd_mediaqueries.asp https://www.w3schools.com/cssref/css3_pr_mediaquery.asp

  • Pranshu Dobhal•295
    @pranshudobhal

    Hey!

    It looks really good for your first try. Keep coding and building new things! :D

    Few points that I feel could help you get better.

    1. The "Why us" section looks a bit clustered, maybe you could add some more space in it so it looks even better.

    2. I checked that you haven't implemented mobile responsiveness. So I would suggest once you are comfortable with designing for desktop, you could proceed with learning how to make responsive websites as well. I would suggest learning bootstrap for the same.

    Hope this helps! Let me know if you need any other help.

View more comments