@Emmiecodes
Latest comments
- @vytkuklys
Hey Emmiecodes 👋,
It is a nice solution you have written!
I liked your code, too. I have noticed that you do not follow a css naming convention, though (like BEM). Which in your defense is understandable given the scope of the project. Yet making a habit out of it could pay dividents in the long run.
Other than that, keep up the good work! 🙂
Marked as helpful - @Vahe-Sevachyan@vytkuklys
Hey CypherCode13, Great job on this challenge. I've noticed that it took you just over 100 CSS lines to write this which is for sure a good example of an efficient code.
On mobile version it seemed like there could still be an extra line or two used to make your work more adaptable and look better at smaller screen sizes (under 400px).
It looks good at desktop version, though.
Hope this helps :) Best of luck!
- @Diarrah@vytkuklys
Hey Diarrah,
I am just here to write that this is one cool piece of work right here. Also here to thank you for inspiring a couple of intriguing ideas through your work. And to ask you for the names of the tools that you used on your project because your code seems to be encompassing some fanciness that I am clearly not yet aware of
Best of Luck!
- @mansi05041@vytkuklys
Hi, Mansi, Good job on yet another coding challenge! Here are a couple of small little tips and suggestions for further exploration.
-What really is a fundamental part of developing is media queries. Which is something that could make your websites responsive to different screen sizes. Be it phone or laptop. Media queries helps us to adjust to that
-Inline styling isn't typically advisable but if you choose to use it as you did on your challenge, the correct syntax would be: style="font-size: 18px;"
- Lastly, border-radius: 5%; and border-radius: 5px; produce subtly different results. You could try these out to see which way of setting values is more suitable for you
Hope this helps, best of luck!
- @zky63@vytkuklys
Hey Zach, good performance on this rather demanding challenge!
As for your question, toggling a properly styled class with an onclick event is indeed one of the ways to achieve the visual rotation of the arrows.
For this, have an onclick event that starts a function -> target the arrow element there (be it by class or by id) -> add and remove a class that has 'transform: rotate(180deg)' property to rotate the image.
Hope this helps! Best of luck!
- @ogAndrew@vytkuklys
Hi Andrew, Good job at desktop version. As for mobile version there is an important aspect to keep in mind that would be useful for you.
That aspect is media queries which is basically a css technique that allows you to style a page at different widths. The important trick to remember here is that it is always easier to start with a styling for mobile version first (narrower width) and build up from there (other way around could prove an interesting and educational challenge, too, yet it is typically not as time efficient).
Hope this helps, best of luck!
