Skip to content
OverviewSolutions
6
Comments
6

cepoumian

@cepoumianChihuahua, México90 points

I’m a mysterious individual who has yet to fill out my bio. One thing’s for certain: I love writing front-end code!

Latest solutions

  • Submitted 6 days ago

    Body Mass Index calculator

    #web-components#sass/scss
    • HTML
    • CSS
    • JS
    0

    • Improving input validation: Would love feedback on better ways to validate height and weight inputs (e.g., handling extreme values gracefully).

    • Optimizing the component structure: Open to suggestions on making the BMI calculator more reusable in other projects.

    • Adding unit tests: Since there's only one standalone web component, is there an efficient way to test it without a full JS framework?

  • Submitted 25 days ago

    Newsletter Signup Form

    #web-components
    • HTML
    • CSS
    • JS
    0

    While the project is well-structured, I’d like feedback on:

    Accessibility: Are there improvements I can make to ensure the form and interactive elements are more accessible? Error handling: Right now, form validation only checks for a valid email format. Should I implement additional validation, such as checking for disposable email addresses? Performance optimizations: The event-driven approach is working well, but is there a more efficient way to handle component updates?

  • Submitted 28 days ago

    Article Preview Component

    #web-components
    • HTML
    • CSS
    • JS
    0
  • Submitted about 1 month ago

    Recipe Page

    • HTML
    • CSS
    1
  • Submitted about 1 month ago

    Social Links Profile

    #web-components
    • HTML
    • CSS
    0
  • Submitted about 1 month ago

    Blog Preview Card

    #web-components
    • HTML
    • CSS
    1

Latest comments

  • P
    cepoumian•90
    @cepoumianPosted 25 days ago

    Hi Daniel. Good job. I few suggestions:

    • Set an event listener for "DOMContentLoaded" in your script. Check docs (https://developer.mozilla.org/en-US/docs/Web/API/Document/DOMContentLoaded_event)
    • Try modularizing your JS code and possibly leveraging web components instead of relying on a monolithic script.
    • Pay more attention to formatting and consistency, specially in CSS stylesheets.
    • Try to match text colors and sizes closer to the design, specially for the body copy, it looks lighter.
    • Make your image responsive. You can use the picture and source tags like this: <picture> <source srcset="/assets/images/illustration-sign-up-mobile.svg" media="(max-width: 697px)" /> <img src="/assets/images/illustration-sign-up-desktop.svg" alt="Illustration" class="bg-image" /> </picture>

    Kind regards and good luck!

    0
  • P
    cepoumian•90
    @cepoumianPosted 27 days ago

    Hi Faojul. Great job. The solution is faithful to the design and looks good at all resolutions. A few suggestions:

    • Consider paying more attention to code organization and formatting.
    • Try to make your code more modular.
    • Consider using web components.
    • Consider separating your css in layers.
    0
  • P
    cepoumian•90
    @cepoumianPosted about 1 month ago

    Hi. Good job. A few suggestions:

    1. Be careful to match all headings' font families and sizes.
    2. You can add space between a list item's marker (bullet or number) and its text by adding padding-left to the list item.
    1
  • P
    cepoumian•90
    @cepoumianPosted about 1 month ago

    Faithful to the design. Animations on buttons. Good CSS organization. Not many suggestions. Possibly, accessibility and html semantics could improve a bit. Very good job overall.

    0
  • P
    cepoumian•90
    @cepoumianPosted about 1 month ago

    Hi Abelardo. Great job. Here are some recommendations:

    • Move your styles to a CSS file
    • Be more mindful of formatting
    • Take advantage of custom properties Congrats!
    0
  • julen•10
    @EuskindarSubmitted about 1 month ago
    What are you most proud of, and what would you do differently next time?

    I am proud to have been able to complete this challenge in a short time, using some new tools and implementing new aesthetic elements that improve the design, understanding their use. I need to improve the organization of elements and better understand how to distribute them.

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

    The main challenge to overcome has been to revisit the basics and understand again how the elements are arranged on the page. I have been able to research and recall the knowledge that I had almost forgotten in my memory.

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

    I would like to perfect the basics. To understand, when looking at a page, the elements I will need and how to distribute them on the screen depending on the needs.

    Flex for displaying content. Gradient backgorunds.

    #accessibility#animation
    1
    P
    cepoumian•90
    @cepoumianPosted about 1 month ago

    Great job. You did considerable extra work that adds to the presentation of the component. Some suggestions:

    • leverage CSS layers to organize your stylesheet
    • consider using more custom properties
    • use logical properties (inline, block, etc.) instead of properties that would only work in horizontal-tb writing modes (e.g., margin-block-start instead of margin-top).
    0