Skip to content
OverviewSolutions
15
Comments
4
Eduardo De La Cruz
@eduardolluis

All comments

  • Yokene•50
    @YokeneSubmitted 4 months ago
    What are you most proud of, and what would you do differently next time?

    I'm proud that I even finished this project, it was the hardest project I've ever done, next time I'd learn how to create tables and properly transfer the design to other screen widths.

    What challenges did you encounter, and how did you overcome them?
    1. Lists -- I knew little about them and had to go to YouTube to remember about them
    2. Tables -- this is probably the hardest thing I've done, since I knew nothing about them, and I had to look at the code of other works to understand how they did it.
    3. Mobile screen width -- this was very difficult to implement, because I don't have any experience with this, I solved it in a shameful way, namely ChatGPT :( Plus I spent about 6 hours on the project in total, yesterday 5, and today an hour.
    What specific areas of your project would you like help with?

    In this project I needed help with the bottom table, it was very complicated and I spent about 2 or 3 hours fiddling with it.

    Recipe page

    1
    Eduardo De La Cruz•230
    @eduardolluisPosted 4 months ago

    The current layout is well-structured and incorporates responsive design effectively :), with thoughtful use of colors and fonts. Ensure consistent spacing and alignment throughout the design. For instance, adjusting the padding and gap values can improve overall visual balance.

    Additionally, verify the color consistency of the titles, as the current title colors do not match the intended design. Adjusting these colors to ensure they align with the design specifications will enhance visual harmony.

    Lastly, check the contrast and readability of text colors, especially within .description, to ensure they provide sufficient readability across different devices and screen sizes. These refinements will contribute to a more polished and user-friendly layout.

    Marked as helpful
    1
  • Eduardo De La Cruz•230
    @eduardolluisPosted 4 months ago

    The current layout is visually striking and effectively uses Tailwind CSS for styling :). To further enhance maintainability and separation of concerns, consider organizing the CSS styles into a separate style.css file and using @import for external fonts like 'Inter'. This practice helps streamline code management and makes it easier to scale the project. Additionally, ensure consistent spacing and alignment throughout the design. For instance, adjusting the padding and gap values within .flex and .mt classes can improve overall visual balance. Lastly, verify accessibility by ensuring sufficient color contrast, especially in text elements like .font-semibold and .text-[#c5f82a], to enhance readability across different devices and screen sizes. These refinements will contribute to a more polished and user-friendly profile layout.

    0
  • Eduardo De La Cruz•230
    @eduardolluisPosted 4 months ago

    The current layout is well structured and visually appealing :), with thoughtful use of colors and fonts. To improve maintainability and organization, consider moving the CSS styles into an external stylesheet rather than embedding them within the

    1
  • Eduardo De La Cruz•230
    @eduardolluisPosted 4 months ago

    Hey there! The current design is almost stop on :), the overall structure is well organized and there are hardly any noticeable differences. However, it could enhance it by adjusting the border-radius of the image to match the main container .qr-code.

    Additionally, it would be beneficial to ensure consistency in font sizes and colors throughout the design for better readability and visual harmony. Consider refining the <h1> color to ensure it stands out effectively, and reviewing the <p> text size to optimize readability, especially on different devices. These adjustments will not only improve legibility but also enhance the overall visual appeal and user experience.

    0