This is a submission for DEV Challenge v24.03.20, Glam Up My Markup: Camp Activities
What I Built
I built a glass UI for the Glam Up my Markup frontend challenge.
I used a very futuristic theme to move away from the traditional camp theme that has already been used by so many other websites.
It's a resizable site, which makes it usable for both desktop and mobile users.
Demo
A better preview of the site is available here
All the source code is available on Github.
Journey
I started with just styling the form, but I realized that was pretty normal.
That's why I decided to add a database feature, what made me knock with my head on my desk.
I learned tons of new javascript skills by making my own pie charts, because animating on the canvas isn't simple.
After that, I made some cool confetti and popup scripts to make it look better and spendt 2 hours on animating (yes, 2 hours, don't laugh).
Credits
- Stackoverflow for lighten and darken hex colors
- ChartsJS for inspiring me with the pie chart.
- Deta for hosting the backend
- Everything else (confetti, charts, popups and database) is made by myself!
Top comments (3)
Looks really great✨👏. Awesome work you put into this💯😍. However, I don't think you would want a "not allowed" cursor for the submit button, it shows the user that the form is not submittable, which isn't right. The error message should be enough. Again splendid work👍
Thank you! It does submit, and as soon as you select an activity, the cursor changes back to normal.
Let me know what you think about this!