Skip to content
OverviewSolutions
14
Comments
14
Darshan Pandya
@Darshan-Pandya10

All comments

  • SakshiSawant•50
    @SakshiSawantSubmitted about 3 years ago

    Please give feedback on the web design and any suggestions on improving the web design

    Order Summary Card

    2
    Darshan Pandya•420
    @Darshan-Pandya10Posted about 3 years ago

    Great Design Sakshi , but it can be improved by correcting these mistakes.

    1. Reduce the border radius on the card and you can get that exact same font from "googlefonts" to improve your design.

    2. Cancel order doesn't have the border line and box shadow so kindly remove those.

    Marked as helpful
    0
  • Darshan Pandya•420
    @Darshan-Pandya10Posted about 3 years ago

    Great Design! And answer of your question is, to Add background color property inside the body tag.

    Marked as helpful
    1
  • Alejandro•100
    @thealexgonzoSubmitted about 3 years ago

    Hi everyone,

    Here is my first challenge. I really enjoyed working on it and would greatly appreciate as much feedback as possible.

    The one component I struggled with the most was the background wave image, I wasn't sure how to introduce it and eventually settled on including it as a background-image in the CSS file. I did find it difficult to adjust it properly to the layout and I'm not entirely happy with how it turned out, I think it could have been done a lot better, I'm curious to know what your thoughts are on my solution for this particular element, and what you would have done differently -->

    .bg-image { position: absolute; background-image: url(images/pattern-background-mobile.svg); background-repeat: no-repeat; background-size: 100%; z-index: -1; width: 100%; height: 100%; }

    There's two problems I have with it so far:

    1. How it looks on the desktop view: I don't think it matches the design perfectly nor does it on the mobile view to be fair.

    2. How it looks on mobile devices: when I viewed the completed design on my iPhone 8, annoyingly I could move the screen up and down and this ruined the design as the card was static on the centre of the screen with blank space above or below as I moved it.

    Please do let me know if anyone had the same problems or what your solution would be for this.

    ** I also viewed the finished design on a larger iPhone 11 and again it looked way off because the viewport was vertically a lot larger which left blank space on the top and bottom.

    Order summary card using HTML5, CSS and BEM

    4
    Darshan Pandya•420
    @Darshan-Pandya10Posted about 3 years ago

    Hey alejandro , Great Design. Looks great on both pc and mobile view. Happy Coding :)

    1
  • Kishor•110
    @SDKishorSubmitted about 3 years ago

    please feel free to give me some advice. thank you

    html css

    1
    Darshan Pandya•420
    @Darshan-Pandya10Posted about 3 years ago

    Hey Kishor , Great Design. looks exactly same in laptop and mobile Happy Coding :)

    0
  • Darshan Pandya•420
    @Darshan-Pandya10Posted about 3 years ago

    Hey Dominik , Great Design ! Looking excellent in desktop or laptop but when i tried to access the page using mobile view , the size of the cards get bigger for a mobile view , just reduce the width of the cards in mobile viewport and it will be fine. Happy Coding :)

    Marked as helpful
    2
  • Darshan Pandya•420
    @Darshan-Pandya10Posted about 3 years ago

    Hey viyan! Great design , just add proper font-weight to your review box letters and it will looks exactly same to the original design , add your GitHub account link with challengers name (frontend mentor) Happy Coding :)

    Marked as helpful
    0
  • Darshan Pandya•420
    @Darshan-Pandya10Posted about 3 years ago

    Hey buddy ! Great Design, coming to your question about background images to the GitHub, You can choose them separately from the folder. And try to change the line-height between the review comment and star-rating tab is much bigger so just change the font and rating tab width and height accordingly. Happy Coding :)

    Marked as helpful
    0
  • Darshan Pandya•420
    @Darshan-Pandya10Posted about 3 years ago

    Hey Manoj! I have to highlight one issue with the last element "cancel order" it's taking background color when I tried to hover over it, please check that out, btw great design.

    Edited: please add sufficient paragraph color too. Happy coding :)

    Marked as helpful
    1
  • Darshan Pandya•420
    @Darshan-Pandya10Posted about 3 years ago

    Hey GUILHERME, Please add media queries to your CSS file it will make the page more accessible for small devices like mobile phones and tablets .. Happy Coding :)

    0
  • Darshan Pandya•420
    @Darshan-Pandya10Posted about 3 years ago

    hey! it looks really good desktop screen but you have to add for small devices like mobiles and tablets, you can simply add this feature by adding Media Queries To your CSS file and you will get those outputs, as many users over the world use smartphones ofter to browse the internet. Hope you will find this Helpful ... Happy Coding :)

    Marked as helpful
    0
  • Darshan Pandya•420
    @Darshan-Pandya10Posted about 3 years ago

    Great Designing YASSER, just one thing is missing add the challenge platform and developer's GitHub Account at the bottom and you are all set, happy Coding :)

    1
  • Tj•10
    @CecmanSubmitted about 3 years ago

    I'd like to hear feedback for the CSS part, whether something is(probably is) unnecessary or could be done better.

    Semantic HTML with Scss and Flexbox

    2
    Darshan Pandya•420
    @Darshan-Pandya10Posted about 3 years ago

    Nothing to change in the look just add your GitHub Account link in footer it will be really helpful :)

    Marked as helpful
    0