Skip to content
OverviewSolutions
10
Comments
7
Mike de Sousa
@mikedsousa

All comments

  • P
    Gina Wang•170
    @gina-wang-1021
    What are you most proud of, and what would you do differently next time?

    Making it responsive!

    What challenges did you encounter, and how did you overcome them?

    NA

    What specific areas of your project would you like help with?

    Any feedback regarding clean code, accessibility, semantic HTML, or anything else are all welcomed!

    Four cards page with vanilla HTML and CSS

    1
    Mike de Sousa•120
    @mikedsousa

    The page looks good.. Keep the good work

  • Mike de Sousa•120
    @mikedsousa

    The page looks great .. Keep the good work

  • P
    juliusalberto•220
    @juliusalberto
    What are you most proud of, and what would you do differently next time?

    I was most proud of my media queries, as this is my first time I meddled with one. It was fun! I was also proud of manually setting my and elements, as it is so troublesome.

    What challenges did you encounter, and how did you overcome them?

    I had difficulties in setting the and as the padding is a little bit.. weird? I also had difficulties in setting the size for the card - turns out I haven't properly reset the elements (box-sizing: border-box) (I forgot about it).

    What specific areas of your project would you like help with?

    I'm not sure. How do you all configure your list? Do you use flex alongside w/ the bullet? Or do you use vanilla and ?

    Recipe app with vanilla CSS and HTML

    1
    Mike de Sousa•120
    @mikedsousa

    The page looks good.. Keep the good work

  • oaved•90
    @oaved
    What are you most proud of, and what would you do differently next time?

    Improved my accessability a little bit by using more semantic tags and a role attribute. Im feeling faster and more sure of what I'm doing in both HTML and CSS.

    What challenges did you encounter, and how did you overcome them?

    No real challenges

    What specific areas of your project would you like help with?

    Areas I would like help with is still my accessablility and structuring of my CSS. Maybe my use of git too. Like my commits and stuff.

    Simple card with semantic HTML and CSS

    1
    Mike de Sousa•120
    @mikedsousa

    The page looks good.. Keep the good work

  • Mike de Sousa•120
    @mikedsousa

    The page looks good.. Keep the good work

  • Mike de Sousa•120
    @mikedsousa

    very good

  • Mike de Sousa•120
    @mikedsousa

    Hey AmitKumar, how you doing? I read your code and I have some things to talk about. Just like you I started to code a few couple months ago, so if a say something wrong, I'm sorry (laughing in brazilian).

    1. First, your HTML

      • It's not a good practice to use the same ID in more the one element (line 34-38).
      • Instead of using ID, you should use classes which is the semantic form
      • You can read more about semantic html here

    2. CSS

      • You can use the pseudo class :hover to change the color of the button when the pointer is hovering and :active when the button is clicked instead using javascript for that

    3. Your script

      • About querySelectorAll(), I did the same has you, but I use classes and not ID

      • About addEventListener(), I used click event and a for loop to verify which button was clicked and setTimeOut to return to the first page

      for (let i = 0; i < BUTTONS.length; i++) {
 BUTTONS[i].addEventListener('click', ()=> {
    
     SUBMIT.addEventListener('click', () => {
         MAIN.classList.replace('show', 'hide')
         RATED.classList.replace('hide', 'show')

         SCORE.innerText = `You selected ${BUTTONS[i].value} out of 5` 

     })
     
     setTimeout(function() {
         
         RATED.classList.replace('show', 'hide')
         MAIN.classList.replace('hide', 'show')
       }, 5000)
 })  }```
    • There are some other things I would like to comment on, but my English is limited and I don't think I can be clear enough
    Marked as helpful