This is a submission for Frontend Challenge v24.07.24, Glam Up My Markup: Recreation
What I Built
I have built a glammed up landing page for NY Recreational Cricket League to my best ability. With this exercise, I learnt some advanced CSS concepts like grid layout, animations and variables.
Demo
Journey
This was an interesting exercise for me to glam up the NY Recreational Cricket Landing Page. Usually I would use bootstrap to whip up something quickly, however this helped me immerse myself into pure JS and CSS.
- I started with sports theme with a plain backdrop, while giving the front end part of it some light bluish theme, which I tried to align with the logo and page elements.
- I have tried to make use of colors blue, red, white, and orange, extracting this palette from NY as well as USA flags.
- I tried to surf and find the latest trends to make the webpage modern, which surprisingly was a bit of CSS, rendering my respect to bootstrap developers. 🙂
- I made the navbar as smooth as possible while transitioning and looking at, and tried to bring the attention of users to Register showing the fee was at just 150$, as a grow shrink marketing label on the navbar.
- It was fun to play around the animation parts for the register label, and the cards following header.
- Setting up the Location as a map, and including the social media handle icons was an idea from the get go, although schedule section was something I would have liked to work on more.
- I wish I had more time to glam up this page further, I would like to add more accessibility to the buttons, work on a hovering label for contact us, may be set up some better content into the cards, and brainstorm on the schedule section.
It has been a fun experience, time I spent learning and working on this project, after joining DEV community. Thank you DEV team.