Earth Day Celebration Landing Page

Earth Day Celebration Landing Page

·

1 min read

This is a submission for Frontend Challenge v24.04.17, Glam Up My Markup: Earth Day Celebration Landing Page

What I Built

I built the Earth Day Celebration Landing Page.

I didn't have a whole lot of time to do it, so I decided to not include any images (which would definitely save time searching for the perfect ones!) and only include one bit of animation.

I chose nature inspired colours, so mostly browns and greens with a bit of blue and yellow in there.

Demo

{% codepen https://codepen.io/nicm42/pen/oNOVObV %}

Journey

I had been thinking recently about an animation I did that drew a border around something on scroll. But I did it at my previous work, and no longer have access to what I did. So I wanted to reproduce it to remember how to do it, and to have a record of it in the future if I want to do it, or something like it, again.

That took a while, so beyond that I made the sections stand out a little bit, without doing too much or taking too much time. There's not a lot of classes in there, so targeting specific ones took a bit of thought.