Earth Day Markup Challenge

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

What I Built

I took the markup and added a gradient background. The light to dark blue is meant to copy the color changes of the sea depth.

I added the links to the Earth Day site. The starter code had anchor links. The links change color and expand a bit on user hover. The link text for Earth Day.org was all capital letters. A screen reader reads that one letter at a time so I changed the text.

The paragraphs have been indented for easier reading. The list has globe icons and the text is centered on the globes.

Blockquote was used to make the quote stand out more.

Demo

Here it is on Codepen.

Journey

I spent a lot of time playing with background colors. I didn’t quite get what I wanted but may revisit it someday. As with many frontend projects, there’s always something that can be changed.

Cover is from our trip to Sedona, AZ years ago.

Thanks for reading!


Discover more from Coursity

Subscribe to get the latest posts sent to your email.

Leave a Comment

Your email address will not be published. Required fields are marked *

Discover more from Coursity

Subscribe now to keep reading and get access to the full archive.

Continue reading

Scroll to Top
How to use firebase deploy only hosting to host websites on firebase. Overlaxed's sub brand, cloudy storage, specializes in cloud storage.