Skip to content
OverviewSolutions
6
Comments
7
Adedayo
@pleasantvik

All comments

  • Adedayo•200
    @pleasantvik

    I look through your async function.

    You will have to attach the event to the dice again and call it on the click

    async function getAdvice(url) { const response = await fetch(url); let data = await response.json();

    id.innerHTML = # ${data.slip.id}; adviceContent.innerHTML = data.slip.advice; }

    dice.addEventListener("click", function () { getAdvice(advice_url); });

  • Adedayo•200
    @pleasantvik

    Hello Biswas, your desktop version looks okay, though it can still be improved upon. However your mobile version is not that responsive and the text are not properly center.

  • Adedayo•200
    @pleasantvik

    Hello Luiza, congratulations on submitting your solution to this challenge

    Your design looks great on desktop, however it is not responsive on mobile.

    Looking through your code, you place the 3 column card in a div of class "content-ctr" which was displayed as flex in the desktop version.

    You however changed the display back to block in the mobile version

    .content-ctr {
    display: block;
    height: 1400px;
    width: 280px;   
}

    Try changing the display back to flex in the mobile media query and add flex direction: set to column

    .content-ctr {
    display: flex;
    flex-direction: column 
}

    It will stack the card on one another.

    You can also try placing each of the card in an article tag in the html for semantic purpose, instead of using div with no semantic meaning

    Marked as helpful
  • Adedayo•200
    @pleasantvik

    Congratulations Dan on submitting your solution, your design looks great and responsive

  • Adedayo•200
    @pleasantvik

    Hi, I'm unable to view your solution, try checking the file path again to ensure it well published

    Marked as helpful
  • Adedayo•200
    @pleasantvik

    Great work @migham, there are still some improvement you can do in the CSS. You didnt do the hover state of your payement and cancel order. in the link also you didnt style the link and visited pseudo class for link. But generally, its a good design

    Marked as helpful
  • Adedayo•200
    @pleasantvik

    Thanks for the feedback, really appreciate… I will work towards improving it