Skip to content
OverviewSolutions
3
Comments
3
Eugene Clark
@clarkjr2016

All comments

  • Eugene Clark•50
    @clarkjr2016Posted 4 months ago

    Hello @ramiroWeb.

    Congratulations on completing the challenge.

    Below I have a list of some notes that could make your project more accessible and responsive.

    • The divs with the classes .about-content and .links could be replaced as <section> elements to make your HTML more semantic.
    • The value for your alt attribute on your <img> element with the class of .photo-profile could be more specific about what the image is, something as simple as "avatar photo profile".
    • Your <main> container element isn't responding to different viewport widths. To be very transparent, I struggled with this myself but after reviewing previous comments on my past work I developed a workable solution:
    1. You can add padding around the interior of the <body> element so that your .container has space between it's border and the border of the body element.
    2. Then you can set display: flex, flex-direction: column, justify-content: center, and align-items: center on the <body> element so that the .container element is positioned in the middle of the <body> element.
    3. Finally I would apply max-width: 100dvh to the <body> element so that as the viewport width decreases so would the <body> element's.
    Marked as helpful
    1
  • Gilbert•360
    @juliengDevSubmitted 4 months ago
    What are you most proud of, and what would you do differently next time?

    I'm proud of effectively implementing responsive design using SASS mixins, which streamlined the development process and resulted in a highly adaptable layout. Next time, I'd like to explore more advanced SASS features to further enhance the project's efficiency and maintainability.

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

    During this project, I discovered that it's possible to customize the cursor with a PNG file, which was an intriguing learning experience. This revelation opened up new possibilities for enhancing user interaction and visual feedback in web design.

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

    No help needed thanks

    Preview Card: HTML-CSS-SASS Responsive Design Project

    1
    Eugene Clark•50
    @clarkjr2016Posted 4 months ago

    This is a really great solution. It includes semantic HTML, looks good on all layouts, code is structured well, and the solution is pixel perfect when compared to the design. I learned a lot from looking at your solution. I appreciate you for also shouting out the "PerfectPixel" extension, this is going to help me with future solutions. Great job!!

    1
  • Eugene Clark•50
    @clarkjr2016Posted 4 months ago

    I honestly have no notes! I like how you wrapped the text in an article element, very semantic.

    1