Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

All comments

  • @InaJaweed

    Submitted

    What are you most proud of, and what would you do differently next time?

    I am proud of how it looks I think it looks similar as the design given. I probably over complicated css for this project so next time after I have more experience I will do this project more simple and easier.

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

    CSS was the main issue. I am terrible when it comes to styling. It was confusing trying to understand how to style, using flex, position and everything. I used youtube, docs and more to understand how to use flex and other styling methods.

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

    CSS - Have I used css in places where it's not needed, have i over complicated this project. HTML - Is it semantic and meets its needs

    @Ramon-Alvez

    Posted

    I found the flex display a bit useless in the content div, you could have already centered everything with text-align, or since you used the flex display you could have given some space between the items with a gap or justify-content: space-evenly.

    Remember this, Flex display makes the children float (this sounds a little funny but thinking about it helps me a little hahaha)

    0
  • @InaJaweed

    Submitted

    What are you most proud of, and what would you do differently next time?

    I am proud of the end outcome, It was bit confusing as CSS is completely new to me and I suck at it. It has been a good practice with css flexbox and media queries. Next time I want to make sure my code is maintainble and can be read easily by others as I feel like i have used css elements in areas that I didnt have to or there was a better solution to this approach.

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

    Media Queries was confusing and trying to guess the sizes of each area for this project. For media queries a simple google search and little bit reading helped me understand the basics.

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

    Media Queries and CSS. I think i have overcomplicated this simple project and used a lot of redundant css in different areas making it hard to maintain and read.

    @Ramon-Alvez

    Posted

    You could try using max-width instead of width, this saves me a lot of headaches in terms of responsiveness, the site basically becomes responsive on its own.

    Another thing I do is to maintain the spacing givin the card a side margin, so it stays "floating" on the page, it ends up combining well with max-width ;)

    0
  • @Kaua-Almeida

    Submitted

    What are you most proud of, and what would you do differently next time?

    Gostei do resultado e de ter incluído tags semânticas dessa vez, não sei o que poderia fazer de diferente.

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

    não sabia como fazer a tabela do jeito do design apresentado então fiz um por conta própria.

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

    nenhuma em específico, mas gostaria de uma avaliação geral e saber no que posso melhorar.

    @Ramon-Alvez

    Posted

    Olá @Kaua-Almeida!

    Dei uma olhada no seu código e realmente esta bem semântico, mas você disse que não soube fazer a tabela igual ao design, observando a sua estrutura de tabela, você a criou com duas linhas ao invés de duas colunas, para arrumar é só seguir essa estrutura:

    <table>
      <tr> <!--TR significa TableRow, é a linha da coluna -->
        <td>E aqui entra os dados da tabela</td>
        <td>Para ter duas colunas é só usar 2 tds por linha</td>
      </tr>
    
      <tr>
        <td>Exemplo</td>
        <td>Exemplo</td>
      </tr>
    </table>
    

    Para estilizar a divisória dos itens da tabela nutricional você pode usar o border-bottom ou um <hr>.

    Outra coisa que observei foi seu mediaquerry, na versão mobile o container ocupa toda a largura da tela, e a imagem não possui mais o border-radius.

    Te desejo sorte nos estudos ;)

    0
  • Vozmo 60

    @V0zmo

    Submitted

    What are you most proud of, and what would you do differently next time?

    I added some simple JavaScript for a custom cursor, I'm quite improved say myself for the CSS and HTML, it's much tidier and cleaner. Still need to learn how Flex works and the hierarchy of HTML.

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

    The JavaScript code, the element implementation of CSS to do animation, and probably how CSS and JavaScript syntax work. But with quick Google search can solve the problem!

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

    Personally nothing, quite impressed by myself. However, if there is some room for improvement in my code please give me feedback and criticism!

    @Ramon-Alvez

    Posted

    I just looked at your code, and I really like the card hover effects!

    I liked the way you structured and styled the page, keep it up!

    1