- How do you suggest I build validation function more readability?
- Do you prefer moving out the function totally to another file and importing from there?
Developer Matusala A.
@matusalab-devAll comments
- @FarivSubmitted over 1 year ago@matusalab-devPosted over 1 year ago
Congrats, bro. for achieving this far. at the first, I don't think react class component is best practice in 2023, it deprecated feature of React. I recommend you to use React functional components. Take the validation logic, put it into a custom hook that would be reusable.
0 - @integeekSubmitted over 1 year ago
This is my first challenge, I haven't done the responsive yet and I don't know why, the images don't want to load so for the other three I put a placeholder
@matusalab-devPosted over 1 year agocongrats for achieving this far. the problem with the image is that you didn't specify the right path at the src attribute of the img tag. get the relative path of the images from the assets folder
0 - @chinaza-SommieSubmitted over 1 year ago
Working on thus project was fun.
- I made use of teniary operators to handle the arrow images
- Then I worked with picture tage and source tag to handle the image to be rendered on different screens size
- Did not go through my conventional way of creating a navbar.I believe change is the only way to grow.
- made some corrections for the learn more button....
Please check it out and let me know if there is anything I could have done differently. Looking forward to your feedback. Thank you
@matusalab-devPosted over 1 year agocongrats on achieving this far, I found a bug on the [learn more] cta button when you hover on the button the text will disappear. make sure the text and background are having good color contrast
1 - @momin-riyadhSubmitted over 1 year ago
Hey everyone, I recently completed a project called Streamlining Design with a 3-Column Preview Card Component Solution which focuses on accurately translating UI concepts into code using HTML5, CSS3, and Javascript. I'm curious to know your thoughts on the project and if you have any feedback for me.
What do you think of the overall design of the 3-column preview card component solution? Is there anything you would change or improve?"
@matusalab-devPosted over 1 year agocongrats for achieving this far... I've got a couple of suggestions, let's start with the animation when the cards return to their original position the overlapping of the card's transition isn't smooth. you can make the animation using a CSS property z-index. because the z-index property is animatable. the other one is responsiveness, your app is not responsive. you can make it responsive with a CSS grid or simply just use the flex-box flex-direction property from row to column at an appropriate breakpoint.
0 - @Taylan0125Submitted almost 2 years ago@matusalab-devPosted almost 2 years ago
congrats on getting this far, I've some suggestions because your layout isn't responsive. and on your CSS file, I notice that you use flexbox. keep learning Flexbox then try to make it responsive using flex properties like flex-direction and flex-wrap to make them stack one on the other at a specific breakpoint. if you can try to use CSS Grid. If You can't it's okay, just using flex-box is fine for this landing page. I highly recommend you to read Zell's blog post to build the mobile navigation bar [https://zellwk.com/blog/js-in-dom/] and others of his blog post.
0 - @antoruSubmitted almost 2 years ago
👋🏻 Hello everyone!
This is my solution for the "four card feature section". Feel free to leave your feedback.
Happy Coding!
Antonio
@matusalab-devPosted almost 2 years agocongrats on making it this far, it's hard to find bugs or improvements on your CSS file, but, there is an accessibility issue in HTML markup by not using semantic tags. like div for everything instead, you can use h2 for the title, p for the description, and write a description of the icon in the alt tag. thanks, I hope this will help improve your accessibility issue.
Marked as helpful0 - @ignaciofigueroadevSubmitted almost 2 years ago
Hey there! 🫡 this is Nacho
This is my solution of the "3 column preview card component"
How was my experiencie in this project?
It is my first time using SASS, this project was funny and challenging for me because I've never used SASS. I loved!
What I used in this project?
- Semantic HTML
- SASS
- BEM
- Mobile-first workflow
I have some questions:
- Is my code okay?
- It is my first time using SASS, any tip?
I want to know your feedback! any tip or advice are helpful and welcome!
Cheers!
@matusalab-devPosted almost 2 years agocongrats for making it this far, the only bug that I found is in the layout justify content center breaks the layout at some point( tablet mode). try to use media query then set the justify content to flex-start at that break point.
Marked as helpful1 - @yoqedoSubmitted almost 2 years ago
Hello Many solutions how you can get this. I descide to us dataset Property. For me it gives much more sense to do it this way. You put every button a dataset Property to target the answer. Like this way!
Keep coding
@matusalab-devPosted almost 2 years agoI think it's better to use details and summary semantic HTML tags for better accessibility.
0 - @Jey223Submitted almost 2 years ago
Hi guys, I would love to get reviews on the JS
@matusalab-devPosted almost 2 years agoI didn't solve the challenge but from my perspective, refactor the toggle section by storing the color,background, and box-shadow because they're the same. in case you want to change the value of these properties, you have to go through each individual manually. they're not reusable. the second one is the array of buttons, you don't have to set the index explicitly you can use a loop. that's it. I hope this'll help you to refactor your code.
Marked as helpful0 - @RenzorrSubmitted almost 2 years ago@matusalab-devPosted almost 2 years ago
the design and the solution aren't the same.
0 - @stkhalishaSubmitted almost 2 years ago
Hello!😊 I'm proud of myself for finishing this project and uploading it here on the first day of the 2023 new year. Please tell me how I can improve with this project, any feedback and suggestions would be greatly appreciated. Thank you!
Have a nice weekend and Happy New Year all!! 🎉🎊🎁
@matusalab-devPosted almost 2 years agoit's hard to find an issue in your code. your code is readable and semantic. the only thing that I try to avoid is the overflow property.
Marked as helpful0 - @akhribabderahmaneSubmitted almost 2 years ago
all feedback is welcomed!!
@matusalab-devPosted almost 2 years agolet's start from the semantic part: I recommend you to use a section other regioning / sectioning semantic HTML to your container, a heading tag for your "perfume name", "p" tag is perfect for description, I think using a "p" tag for the price numbers rather "span" that are non-descriptive. the other is a layout problem the container is not perfectly centered. the right section doesn't have enough space as the design, giving both the same width will help to fix. last one, stop using the position property for this layout it's overkill instead use the flexbox alignment property. and try to determine the height of container by the content of the items.hope, this will help you to improve.
Marked as helpful0