Skip to content
OverviewSolutions
8
Comments
7
P
Paradox
@Taresta

All comments

  • Paradox•160
    @TarestaPosted 4 days ago

    Well, you have done a great job. I truly learnt a lot from reading your code. It was almost the same as the end design. I see that after 768px you reset the grid structure and let the browser decide on the number of columns and rows. This is a great approach. We can achieve the same result using Flexbox too. There was this property grid-template-rows: repeat(auto, auto );. You can eliminate it if you want. The rows would be generated automatically anyway and I think repeat does not accept auto as a value, so this results in an error too. So, yes good job again and all the best for your future projects.

    0
  • Jose•170
    @josenegrete123Submitted 9 days ago
    What are you most proud of, and what would you do differently next time?

    Most proud of using both CSS and Flexbox.

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

    Some challenges where just figuring out spacing, padding and margin. Trial and error helped me overcome that.

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

    If there's a better way of writing the HTML or if this is fine.

    Four Card Feature using Flexbox and CSS Grid

    1
    Paradox•160
    @TarestaPosted 9 days ago

    You did a great job. Your final version is almost identical to the design. I learned quite a lot from your code. I am not an expert, so I can not say for sure, but your HTML structure looks good and well-organised. I loved how you used Flexbox for the smaller screen and switched it to a grid structure for larger screen sizes making good use of these layout algorithms. Keep up the good work.

    Marked as helpful
    0
  • Paradox•160
    @TarestaPosted 14 days ago

    Hi there, that was some good work. I really liked how you used flexbox for the alignment of most of the elements in your design. This makes your page a whole lot responsive. Everything was great. Just something to take notice is that on smaller screens, the product-card does not have any top margin, so that might be something you can take a look into. Good job and all the best for your future projects.

    Marked as helpful
    0
  • Paradox•160
    @TarestaPosted 17 days ago

    It looks very good. Good job with the responsive design. I have not learned React yet so I will not be able to provide any feedback on that, but your overall webpage looks great. There was just one issue that I encountered while I was trying to check the responsiveness, the image of the omelette disappeared between 576px and 768px. On inspection, I found that the following rule is coming into play. .d-none { display: none!important; } I am sorry as I said I do not know React or Bootstrap well, so I am not sure about the solution. Once you have managed to solve it, do let me know about the issue too. All the best and great work.

    0
  • Paradox•160
    @TarestaPosted 20 days ago

    Hello. You did a great job. Nice work with bootstrap. I had also previously used buttons for the various social links but switched them to anchor elements because I learnt that they are semantically more sound in this case. A button could be used in form submission or actions in a page, since these links could be used for external navigation, anchor elements might serve better in this case. Separating CSS from HTML could help in keeping code more manageable for bigger projects. Overall, you have done very well.

    0
  • Stryde2022•170
    @Stryde2022Submitted 22 days ago
    What are you most proud of, and what would you do differently next time?

    to be honest, i still waste a lot of time so i am not happy

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

    applying the coloring

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

    how to spend less time and do things the right and more effective way

    landing page using my basic knowledge of css

    1
    Paradox•160
    @TarestaPosted 21 days ago

    Great Job! I can relate that in the beginning, we can feel like we are spending a lot of time completing tasks that seem very simple. I do not have any great advice but let us just try to tackle one thing at a time. If you find a solution to something challenging, noting it down can be helpful in the future. Your colouring looks good. I am more comfortable using Hex rather than HSL. If you find it difficult to get the right colours maybe you can try the colours directly in the developers' panel to get a feel of how they would look when written in the actual code. If you are really concerned about the time. Maybe you can try focusing on one thing at a time, start with writing just the HTML first, and then move on to styling. Having the styles in a separate file also helps in keeping the code separate and easier to maintain. You can use the root element to reuse the common styles as variables (https://www.digitalocean.com/community/tutorials/css-root-pseudo-class).

    Now, I might have said too much and I do not know if any of it will help. Just remember as you will practice more projects in the future, your efficiency will build up on its own. All the best and good work again.

    Marked as helpful
    1
  • Paradox•160
    @TarestaPosted 24 days ago

    You have done a good job. I believe there are no issues with the overall project and everything looks well-structured. I just did not see any CSS for the mobile design in the style.css file. You might want to consider adding that for a better responsive layout. Just one more thing that you could perhaps work on is adding a bit more to the documentation in your README file so anyone visiting your site could understand quickly the summary of the overall project by quickly glancing through it. Good job overall.

    1