Gabriele Ferro Home

Adding the footer to my project

Day 62: 14 October 2020

**Today’s Progress:**

Today I continued the design work I had started and then left unfinished.

I coded the footer so that I could integrate it in all the pages and also to give a little more character and customization to the website.

I watched again (and again!) the videos about UI and wireframing and I used his design as the basis to create the footer.

A footer with a container containing a row and inside it 3 columns.

Using the emmet notation I wrote this:>>.row>.col*3

to get the corresponding structure in HTML with Bootstrap classes.

I used coolors to find a palette of pastel colors not too aggressive and that it would also reinforce the visual concept of vintage.

So I modified the background of the website by adding a slight gradient ranging from pale pink to sky blue.

Main Page

I had to rearrange the margins and padding of many elements, but luckily Bootstrap with its classes makes the process really simple and immediate.

Although a magician doesn't usually reveal his tricks, I used the Chrome GoFullPage extension to take a screenshot of the entire page.


I realize that using Bootstrap I practically didn't write CSS "by hand" except to choose specific colors and to frame the videos with the respective overlays.

I think the mobile version still needs some retouching at the margins and padding level.

**Link to tweet:**

**Link to work:**

Clone the server :

Run my project :

** You can also visit the site without having to download the server. But, if you do not clone and install the server, the pages will lack the information recovered from the server, so some sections will be empty. **

[twitter-follow screen_name='20Gabriele20']

June 2024


Gabriele Ferro Home
Copyright © Ferro Gabriele. All rights reserved.