Skip to content
OverviewSolutions
6
Comments
7
Adedayo
@pleasantvik

All comments

  • Hassan Yahya•250
    @hassanyahya400Submitted over 2 years ago

    my async function is fetching the advice from the api only on the first button click, how can i solve this, i've commented the code below in my app.js

    Advice generator app

    2
    Adedayo•200
    @pleasantvikPosted over 2 years ago

    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); });

    0
  • Adedayo•200
    @pleasantvikPosted almost 3 years ago

    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.

    1
  • Adedayo•200
    @pleasantvikPosted almost 3 years ago

    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
    0
  • Adedayo•200
    @pleasantvikPosted almost 3 years ago

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

    0
  • Adedayo•200
    @pleasantvikPosted almost 3 years ago

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

    Marked as helpful
    0
  • Adedayo•200
    @pleasantvikPosted almost 3 years ago

    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
    1
  • Adedayo•200
    @pleasantvikSubmitted almost 3 years ago

    This is my first challenge, please help review the code and point out neccesary correction to be made. thanks

    CSS Grid, CSS Flexbox

    2
    Adedayo•200
    @pleasantvikPosted almost 3 years ago

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

    1