Design comparison
Solution retrospective
I went for a mobile first approach, which was fun. But I found that I had a hard time converting to the desktop view after. Anyone have a suggestion on how to make it easier? Also find making it responsive for inbetween screen sizes a struggle using media queries.
I'm thinking on my next challenge to create a layout first just using coloured divs and then adding the content and final styles after so the layout works and is proven before hand may be a nice way to set things up.
Community feedback
- @emjogalePosted over 3 years ago
I'm glad you appreciated the feedback! I haven't had much feedback from the couple of challenges I've completed either - I think because so many people upload solutions they get buried pretty quickly. Just a further note to my suggestion re the transition - I have been trying to implement it on my updated js functionality which uses the display property (rather than height)- but I don't think you can do a transition on display. I keep on thinking it can't be too complicated as it is in the 'newbie' section !
0@Skinz-dotcomPosted over 3 years ago@emjogale Yeah totally agree, I didn't realise how many people are using this site and how busy it is. All a good thing though, means we are in the right place :D
Now you mention it, I think thats why I didn't add the transition in. I remember thinking I need to animate it rather than it just be there or not. But when I was doing it that way the functionality of my JS was really bad and I couldn't control what I wanted without breaking something or something unexpected happening. So I went to the display property and the JS worked great. Then I found I can't transition. I'm sure there is a way to get both But that is something to look at in the future after more experience.
0 - @emjogalePosted over 3 years ago
I was interested to look at your solution as I have been working on this project for a while myself. I'm not sure that I can help you with suggestions to make the layout easier - I did the same as you and went for the mobile first approach and also found the inbetween screen sizes difficult to size for. But your plan for your next challenge sounds like a good idea. I found your js helpful and used it as a reference to simplify what I had initially done with my project. So thank you for that! I have one suggestion which might be nice for yours and that is to add in a transition transform to make the accordian move smoothly rather than jumping straight into the active mode.
0@Skinz-dotcomPosted over 3 years ago@emjogale thank you for your comments and feedback. I’m glad you found the JavaScript part helpful. It took a lot of trial and error and research to get there but I was happy it worked. I must admit I agree with you that is needs a transition, to give it that small sliding animation, I may have to go in and figure that one out. Thank you for the suggestion.
Yeah I’ve found the layouts hard. I think I may be over complicating it but sure we will all get there in the end.
Again thank you for your comments and feedback has been a lovely experience as this is my first comment to a challenge 😊
0
Please log in to post a comment
Log in with GitHub
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord