About

This is a learning project from CodeCademy. It's a landing page for a new camera. This project was coded based on the provided starter code (HTML, CSS). Design was provided, but I decided to modernize it to hone my web design skill.

IT'S WORK IN PROGRESS

My process

First, design. it was dated, so I tweaked it a bit. Then, accessibility. Starter code was overusing divs, so I refactored it to use semantic markup. After that, features. I added more content and features for a more functional page. Majority of the descriptions were generated using ChatGPT (not GTP).

Tech

semantic HTML5,
custom CSS,
vanilla JavaScript.

Features

fully responsive design;
hover effects using CSS transitions and pseudoclasses;
CSS animations using keyframes;
glassmorphic effects;
accordion menu animated with JS;
simple sign-up form for a mailing list using POST method.

TO-DO

fix responsiveness

What I learned

How to make accordion with JavaScript. The code that closes all other accordion tags upon opening a new one is this: