After many years of investing in myself as an event organizer and DJ/Producer I always had a special connection to the digital world, I started to do some simple front-end work to better understand how everything works, when I discovered my passion for web development.
HTML, CSS, Javascript, VueJs;
This is an interactive pricing component that changes the values with range input + monthly or yearly.
Was made with HTML5 + TAILWIND POSTCSS + JAVASCRIPT
Tips or advice on how to improve are very welcome, thank you all!
Regards, Miguel Silva
Tips or advice on how to improve are very welcome, thank you all!
What I learned:
Tips or advice on how to improve are very welcome, thank you all!
Hi Frontend community, the hardest part was to save the value from the buttons on the input. Was a very fun project to do, and I have learned a lot about JS with it.
Please take a look at the functionality, tips to improve are very welcome.
regards, Miguel Silva
Responsive Landing page with HTML, CSS, Javascript.
Any tip on how to change the color from the SVG img on hover?
What I learned:
Tips and feedback to my code are very appreciated.
Preview: https://front-end-mentor-sunnyside-agency-git-master-migsilva89.vercel.app/
Thank you all.
Miguel Silva
Hey Umair, good job with the challenge.
I see that you have some HTML ISSUES, in order to fix them you should: consider the h1 element as a top-level heading only (all h1 elements are treated as top-level headings by many screen readers and other tools).
Keep going! Regards, Miguel Silva
Bom trabalho com este challenge.
Contudo a font parece nao e a mesma e o container fica muito esticado em ecras grandes.
Aconselho a usar um max-width to main cointainer, e como disse o Rodrigo poderia ser um pouco maior.
De resto muito bom, parabens.
Se o comentario ajudou de alguma forma, marque como useful pf :)
Bom codigo! Miguel
Nice job on this challenge. You have some HTML issues,
All page content should be contained by landmarks: https://dequeuniversity.com/rules/axe/4.3/region?application=axeAPI.
About your question, I believe the best solution is to use an input radio instead of a button. With the input radio, every time you select one the other is unselected.
Also, see that orange is the color on HOVER and dark gray is the color when you select it. This is a rating component so we should be able to select only one number.
Hope it helps, if so please mark it as helpful.
Happy code! regards,
Miguel Silva
Very good job with this challenge. In order to be pixel perfect, you can try to use Figma, and upload the design to it.
This way you are able to check the px and make it px perfect :)
Hope it helps.
Regards, Miguel Silva
Hi Joao, I see an HTML accessibility error "Images must have the alternate text".
More info :https://dequeuniversity.com/rules/axe/4.3/image-alt?application=axeAPI.
regards Miguel Silva
