Exercice Layout et partials

Le but de cet exercice est double :

Vous entrainer à réfléchir devant une maquette et à anticiper le découpage des différents partials que vous allez pouvoir réutiliser.
Vous entraîner à manipuler les views et à dynamiser les contenus.

Étape 0

Récupérez le zip des fichiers du projet ici

Informations pour l'intégration

La maquette

Les infos CSS

$white: rgba(255, 255, 255, 1);
$black: rgba(0, 0, 0, 1);
$green: rgba(0, 100, 102, 1);
$dark-green: rgba(11, 82, 91, 1);
$darker-green: rgba(27, 58, 75, 1);
$dark-blue: rgba(39, 38, 64, 1);
$purple: rgba(77, 25, 77, 1);

$background-gradient : linear-gradient(to bottom, rgba(27, 58, 75, 0.9), rgba(39, 38, 64, 0.9), rgba(77, 25, 77, 0.9));
$background-gradient2 : linear-gradient(to bottom, rgba(77, 25, 77, 1), rgba(39, 38, 64, 1), rgba(27, 58, 75, 1));
$background-gradient3 : linear-gradient(to bottom, rgba(27, 58, 75, 1), rgba(39, 38, 64, 1), rgba(77, 25, 77, 1));

La police utilisée est Montserrat que vous pouvez retrouver sur Google Fonts ici.

Les consignes

Avant de commencer votre intégration, regardez bien les données fournies dans le dossier data et la maquette pour déterminer en avance comment vous allez découper de travail en différents partials.

Ensuite, mettez en place ces partials pour intégrer cette maquette et la dynamiser avec les informations fournies dans le dossier data. Les informations qui ne sont pas fournies dans data peuvent être mises en dur dans le template.

06 March 2026