Sameh
@SamehCodeAll comments
- @SamehCodeSubmitted 11 months ago@SamehCodePosted 10 months ago
Cheosphere should i save in local storage ? what's ur suggestions , bro ?
0 - @SamehCodeSubmitted 11 months ago@SamehCodePosted 10 months ago
Melvin Aguilar š§š»āš» have u tried user experience ? what's your suggestions bro , did i miss somthing ?
0 - @LySabrinaSubmitted 11 months ago
I had difficulties with:
- Positioning the images using position
- Some window size does not correct align the image
- units for responsive design
These were the main things I struggled with. Making sure the image is aligned even when you resize the window was difficult. Additionally, I was unsure of the units for the containers as when a user opens the questions, the image may be pushed out of view.
I wonder if % are best for containers width and height for responsive design?
Overall, fun project on responsive design and touching a bit of JavaScript.
@SamehCodePosted 11 months agohere is my advice to you , i made this challenge before. you can do it use positioning between parent container(position: relative) and image element with (position: absolute) then use left with negative values to get out of the box ;) example(left: -30px, left: -2rem, etc...) hope it help you at all good luck .
0 - @NazimFilzerSubmitted 11 months ago@SamehCodePosted 11 months ago
nice work , but here is my idea to you , dismiss button must have function to return you back to form. good luck my friend
0 - @MelvinAguilarSubmitted 11 months ago
Hi there š, Iām Melvin, and this is my solution for this challenge. š
š Features:
- Achieved 100% in Lighthouse score for performance, accessibility, best practices, and SEO. š
- Progressive Web App (PWA) support. š±š
- Utilized TailwindCSS for responsive styling. šØ
- Codebase is well-maintained and formatted using Prettier. š»
- Resemblance with the original design. šØ
- No media queries were used. š±
- Integrated very small animation. āØ
š» Two Solutions in Two Branches:
- Native HTML Solution: Utilizing
<details>
and<summary>
tags without the need for JavaScript. š - Accessible Disclosure Solution: Implementing Accessible Disclosure with a11y in mind for enhanced accessibility. š
š ļø Built With:
- TailwindCSS. šØ
- npm - prettier - prettier-plugin-tailwindcss. š»
-
š Further Resources:
If you're interested in creating an Accessible Disclosure, I recommend checking out this informative article by Grace Snow: Tutorial: Let's Build an Accessible Disclosure
Any suggestions on how I can enhance this solution or achieve even better performance are welcome!
Thank you. šāļø
@SamehCodePosted 11 months agowhat about the main idea of accordion ? when select a topic the rest of topics must be not visible
https://getbootstrap.com/docs/5.3/components/accordion/
search for accordion to get the main idea
i've added link for you from bootstrap accordion check it out
0 - @garyeungSubmitted 12 months ago@SamehCodePosted 12 months ago
#wow , you look so professional, ##how did you do that ! ###how long u learn programming my friend ?
0 - @subodh16728Submitted about 1 year ago
Hi community, This is the first project that I've build using JavaScript. Please share feedback if you have any. I would love to hear that and make the improvements. I want to enhance my Javascript knowledge and that's why can you please suggest which other project should I go with now? Thank you!
@SamehCodePosted about 1 year agonice my friend but why use alert or prompt it seems ugly um , dunno . but nice work anyway. how long u learn programming ? and what is your resources my friend i want to upgrade my js skills more and more
Marked as helpful1 - @MelvinAguilarSubmitted about 1 year ago
Hi there š, Iām Melvin, and this is my solution for this challenge. š
š Features:
- Progressive Web App (PWA) support. š±š
- Achieved 100% in Lighthouse score for performance, accessibility, best practices, and SEO. š
- Utilized TailwindCSS for responsive styling. šØ
- Codebase is well-maintained and formatted using Prettier. š»
- Resemblance with the original design. šØ
š ļø Built With:
- TailwindCSS. šØ
- npm - Prettier. š»
Any suggestions on how I can enhance this solution or achieve even better performance are welcome!
Thank you. šāļø
@SamehCodePosted about 1 year ago#wow looks gr8 , ##seems pixel perfect too , ###<3 nice work.
1 - @Joshua-FarrSubmitted almost 3 years ago
CSS Grid Experts, I need your help!
The only thing that tricked me was justifying the time remaining to the right. For some reason when I moved it over, there was extra space in the container and it would leave an unsightly gap between the text and the clock icon. Any insights would be greatly appreciated!
@SamehCodePosted almost 3 years agonice work, josh. i really appreciate your hard work iam just a newbie. wish me good luck , bro
0 - @sachdevavaibhavSubmitted almost 3 years ago
This is my first challenge on Front-End Mentor. Is my css code readable and maintainable. If no, then what are the things that I can improve. Your feedback is appreciated.
@SamehCodePosted almost 3 years ago@sachdevavaibhav: oh man ur great. i hope i be like you once. if could anyone tell me some tips and tricks and some great content i could learn more and more from.
1 - @pikapikamartSubmitted about 3 years ago
Hello. This is my 23rd challenge here and trying to be good at framer-motion^^
It's been really fun doing this even if I finished for days since got loads of school activs :>>.I am still new to using framer-motion so I don't really know if I used it correct but it works for now and i'm glad with that. I also reuse some animations that I used before :>
I tried to add more animation like page load but I really lack what to add so I kind of erase that one but I added some animations on the different tabs interactive elements and happy with the result. I forgot to right now a navlinks trap-focus but could done in other day:>
But overall, i'm happy with this one. Would be really great if you have find any other bugs on this one. Thank you^^