I would be happy with any feedback guys, especially the one related to BEM methodology.
I would appreciate any feedback guys!
I need some help on how to make the mobile menu do the transition from the right of the screen instead of just pop-in out.
I would like help on how to style that query box with background-color: $green-200 whenever the radio input is checked.
I would appreciate any other help! 👍
I want some help with the accessibility. I couldn't make the screen reader (NVDA) read the answer when I press "Enter" of the corresponding question.
I would appreciate any feedback. 👍
Kept it simple, tried to stick to bem methodology is CSS class names.
What challenges did you encounter, and how did you overcome them?CSS got a little verbose.
What specific areas of your project would you like help with?Had a small issue with the overlay on the image slightly expanding beyond the image size.
Good job! Some points where you can improve:
<a> with an href linking to the image URL.min-height of the <body> tag to 100svh instead of 100% because it is best on mobile and doesn't need html { height: 100%; } because 100% sets the minimum height to 100% of the height of the parent element.Good luck!
Although the solution isn't pixel perfect, but everything is functional. I've noticed an error Error: <svg> attribute height: Expected length, "auto" occurring when interacting with the carousel.
Add aria-expanded to buttons that control the menu to indicate the menu’s open/closed state.
Being able to improve the readability of my code. Next time I would try a CSS framework, maybe.
What challenges did you encounter, and how did you overcome them?Small challenges regarding how to style and how to extract the value of the radio buttons
What specific areas of your project would you like help with?I need feedback on how accessible is my site and how readable is my project.
Here are some feedbacks on accessibility as you asked:
cursor: pointer so to make it more intuitive.display: flex; justify-content: center; align-items: center; styles from the <body>.Being able to think more of accessibility
What challenges did you encounter, and how did you overcome them?I didn't know how to split the background between the background color and the background image. I thought about creating two divs that represented both but I thought I would've overcomplicated the solution.
In the end, I used the background-image property along with background-size: contain
Feedback on the accessibility standards I applied here. Thank you!
Here is some feedback:
Styles:
justify-content: space-between; to the <div class="question"> to create that space between the question and the plus button.cursor: pointer to the <button class="btn"> to change the appearance of the cursor whenever you hover the question.I focused a lot on using semantic HTML and the accessibility features of the built-in form controls to make sure that this component was fully keyboard accessible. I definitely wanted to make sure none of my styling of the radio buttons would interfere with any of those built-in features, and I think it turned out pretty well.
I have nothing to say, I've actually learned from your solution a lot. Good Luck! 👍
