Demo: https://khanaaaaaa.github.io/Seal-Diaries/

A simple diary retelling of a seal's life from Birth with facts about them, along with cute pictures along their diary entry, i.e. a simple retelling.

Saw a bunch of Seals in my feed and watched a video about Seals and their life and wanted to code a simple website with simple retelling into existence.

Tech Stack:

• HTML
• CSS
• JavaScript

As this was a basic website, the only thing complex was figuring out the color scheme to go with it and making the styling flattering. Also used https://www.fisheries.noaa.gov/species/harbor-seal for information.

The animation for the flipping motion was not working, so a lot of time went on debugging that. Eventually replaced the 3D flip with a fade and scale animation. Also was a struggle getting the images to fill the left page correctly without stretching, and fixed using object-fit: cover and removing padding from the container.