Skip to content
OverviewSolutions
15
Comments
15

dzerdzul

@dzerdzul230 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

View more solutions

Latest comments

  • Gustavo Gutiérrez•360
    @gustavo2023
    What are you most proud of, and what would you do differently next time?

    Next time I would like to try a different approach to structure a similar layout with different Flexbox and CSS Grid properties.

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

    Building the proper structure for the sidebar functionality using semantic HTML was the only difficulty, but I was able to come with a solution easily.

    • I created the sidebar <nav> element (#mobile-sidebar), an open button (.mobile-menu-open-button), a close button (.mobile-menu-close-button), and an overlay <div> (.overlay). ARIA attributes were used to manage accessibility states.
    • The sidebar is initially hidden off-screen using transform: translateX(100%) and visibility: hidden. The overlay is hidden using opacity: 0 and visibility: hidden. An .open class for the sidebar changes transform to translateX(0) and visibility to visible, creating a slide-in effect via transition. A .visible class for the overlay changes opacity and visibility. Media queries hide the desktop navigation and show the mobile open button on smaller screens.
    • Clicking the open button adds the .open and .visible classes to the sidebar and overlay, respectively, and updates ARIA attributes. Focus is moved to the close button.
    • Clicking the close button or the overlay removes these classes, updates ARIA attributes, and returns focus to the open button.
    What specific areas of your project would you like help with?

    I would like to receive feedback on better accessibility practices, styling suggestions, better use of semantic HTML or any mistakes I might have overlooked.

    News homepage

    #accessibility
    1
    dzerdzul•230
    @dzerdzul

    Good work!👍

  • P
    RF13•550
    @rf1303
    What are you most proud of, and what would you do differently next time?

    This project is an accessible web form with full keyboard navigation support. It allows you to select options using radios, enter messages, and navigate using keys like Tab, Shift + Tab, ArrowUp, ArrowDown, etc.

    Features - Custom navigation between fields using the keyboard.

    • Clear visual focus when switching between options.
    • Dynamic management of classes based on selection.
    • Organized JavaScript modules.
    • Accessible and responsive design.
    What challenges did you encounter, and how did you overcome them?

    *The major challenges are the keyboard layout and the details of the errors, with a lot of work, I do not know if it is 100%, the keyboard handling.

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

    In the accessibility part and other details that I didn't notice.

    HTML CSS SCSS Javascript(Modules) Mobile firts bem Accessibility

    #bem#sass/scss#accessibility
    1
    dzerdzul•230
    @dzerdzul

    Good job 👍

  • Alfi Zain•280
    @AlfiZain
    What are you most proud of, and what would you do differently next time?

    Toggling accordion

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

    Create accordion toggler logic

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

    Everything

    Faq Accordion with SCSS

    #sass/scss
    1
    dzerdzul•230
    @dzerdzul

    Good job👍

  • P
    Michał•290
    @miedzygalaktycznygit
    What are you most proud of, and what would you do differently next time?

    I made this website way more faster and I saw improvement in this topic .

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

    I am not 100% sure if i made this website to math "accessibility standards" so please correct me if I made sth wrong.

    rating page

    #sass/scss
    1
    dzerdzul•230
    @dzerdzul

    Good job👍

  • Sebastián Márquez•260
    @donSebamarquez
    What are you most proud of, and what would you do differently next time?

    I think the javascript, i learned more events listeners as input, i really liked this excercise, i really don't know at this time, maybe in the future when i learn more i could change some things, but at the moment i'm happy with the result

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

    the only thing i couldn't do it was the error when you put 0 in the input where they ask how many people are, i think it was a problem with my css, some classes crashing or something like that

    Tip calculator responsive

    #bem
    1
    dzerdzul•230
    @dzerdzul

    Good job!👍

  • dzerdzul•230
    @dzerdzul

    Good job!👍

View more comments