Skip to content
OverviewSolutions
7
Comments
3
Dheerendra Kumar
@acekant

All comments

  • Md. Fardin Khan•20
    @KPorus
    What are you most proud of, and what would you do differently next time? What I'm most proud of:
    • Implementing a responsive design using Flexbox.
    • Keeping the code clean and optimized.
    • Successfully deploying the project via GitHub Pages.
    What I would do differently next time:
    • Optimize CSS further for maintainability.
    • Improve accessibility (e.g., contrast and alt text).
    • Test on more devices for better responsiveness.
    What challenges did you encounter, and how did you overcome them? Challenges Encountered:
    • No significant challenges were encountered during the project.
    How I Overcame Them:
    • Since no major issues arose, the project proceeded smoothly without needing specific solutions.
    What specific areas of your project would you like help with? Areas Where I Would Like Help:
    • CSS Optimization: Would appreciate feedback on how to make the CSS more efficient, especially for responsiveness and maintainability.
    • Accessibility Improvements: Seeking advice on best practices for improving accessibility, such as enhancing color contrast and adding proper alt text for images.
    • Deployment Process: Any tips on improving the deployment workflow or additional optimizations for GitHub Pages.

    Responsive QR Code Card with HTML & CSS

    #bem
    1
    Dheerendra Kumar•90
    @acekant

    nice solution almost pixel perfect keep going

    Marked as helpful
  • AllanKyleV•80
    @AllanKyleV
    What are you most proud of, and what would you do differently next time?

    I'm proud that I finished this second challenge faster and more easily compared to my previous one. I can see some progress at least. Next time? I think I should experiment more to better understand how different elements should behave in a layout.

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

    The first challenge I encountered was figuring out the right width for the div container to match the challenge preview. Not to mention, I was also experimenting with the proper margin and padding to use. Thanks to the style guide, of course, for providing a helpful reference for fonts, colors, and other design details.

    To overcome this, I experimented with different width values, used DevTools to inspect element sizes, and adjusted the padding and margin until the layout closely matched the preview.

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

    Experimenting with the proper values to closely match the challenge preview is time-consuming and requires a lot of trial and error. Is this just the way it is, or is there a way to improve the process?

    Blog Preview Card with HTML and CSS

    #accessibility
    1
    Dheerendra Kumar•90
    @acekant

    Hello AllanKyleV, I am Dheerendra Kumar, frontend mentor as you. You mentioned that you need help in pixel perfect design making or getting design as close as to solution. Well you can use some tools like microsoft powertoys. it a basic tools software which contains a tools name ruler which can be turn on by run 🪟+ctrl+shift+M, a tool bar will be affear no go to desgin file of challege, for example mobile design and zoom out or zoom it so that its with get close to 375px when you mesure using the tool and after this now you can calculate the width of other element easily with reference of desgin and now open brower open dev tools set width to 375px on this. or you can use simple same width like if you zoom the image of design and the width of image is increase measure it using tool and make your browser window to the same width of the design now all set.

    If you need futher help on this topic don't hesitate to ask

  • Olusanya Abdulwariz•330
    @Wariz007
    What are you most proud of, and what would you do differently next time?

    Details in the README file

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

    Details in the README file

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

    Details in the README file

    Dynamically generated content from JSON file and SASS

    1
    Dheerendra Kumar•90
    @acekant

    Hello Olusanya Abdulwariz, I am Dheerendra Kumar, I saw your design and your retrospective on this. You mentioned that you need help in details of readme.md. well i can help you. for example you can view my github profie and repository like nft-card and recipe page etc.

    first of all you need to know that readme.md file is created using the markdown language it's very easy even easier than html just take 30 minutes of vedio on youtube and then you will be able to understand it. now readme file contains the information about the project so what information the readme file contain you can see it on my repo name readme-template it content three file one readme.md just discard it and focus on other two file readme-template.md and readme-example.md. I hope that they will be very beneficial to you.

    If you need futher any help don't hesitate to ask.