cd6a66893a
- Implémentation des composants React (8 trajectoires, Human Employment Model, méthodologie 6 étapes, Learning by Doing, exemples de projets, compétences) - Rendu dynamique des cartes via .map() - Configuration du routage SPA dans Symfony (route catch-all) et React Router (Header Link) - Ajustements graphiques et CSS conformes au Figma (#F4F1EA, vert olive)
92 lines
1.8 KiB
CSS
92 lines
1.8 KiB
CSS
/* ==========================================================================
|
|
SECTION LEARNING BY DOING (FIGMA)
|
|
========================================================================== */
|
|
|
|
.lbd-section {
|
|
width: 100%;
|
|
background-color: #ffffff;
|
|
padding: 5rem 2rem 6rem 2rem;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.lbd-container {
|
|
max-width: 1140px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
/* Ligne verte d'accentuation en haut */
|
|
.lbd-green-line {
|
|
width: 48px;
|
|
height: 4px;
|
|
background-color: #556B2F;
|
|
border-radius: 2px;
|
|
margin-bottom: 0.75rem;
|
|
}
|
|
|
|
/* Surtitre */
|
|
.lbd-tag-top {
|
|
display: block;
|
|
font-size: 0.95rem;
|
|
font-weight: 600;
|
|
color: #7b8337;
|
|
margin-bottom: 0.6rem;
|
|
}
|
|
|
|
/* Titre principal */
|
|
.lbd-main-title {
|
|
font-size: 2.25rem;
|
|
font-weight: 800;
|
|
color: #0f172a;
|
|
letter-spacing: -0.02em;
|
|
margin: 0 0 1.25rem 0;
|
|
line-height: 1.25;
|
|
}
|
|
|
|
/* Paragraphe */
|
|
.lbd-description {
|
|
font-size: 0.86rem;
|
|
line-height: 1.6;
|
|
color: #4b5563;
|
|
max-width: 820px;
|
|
margin: 0 0 3rem 0;
|
|
}
|
|
|
|
/* Conteneur de la bannière avec coins arrondis */
|
|
.lbd-image-wrapper {
|
|
width: 100%;
|
|
border-radius: 20px;
|
|
overflow: hidden;
|
|
box-shadow: 0 6px 24px rgba(0, 0, 0, 0.08);
|
|
}
|
|
|
|
.lbd-banner-img {
|
|
width: 100%;
|
|
height: 440px;
|
|
object-fit: cover;
|
|
display: block;
|
|
}
|
|
|
|
/* Responsive */
|
|
@media (max-width: 900px) {
|
|
.lbd-main-title {
|
|
font-size: 1.85rem;
|
|
}
|
|
|
|
.lbd-banner-img {
|
|
height: 320px;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 640px) {
|
|
.lbd-section {
|
|
padding: 3.5rem 1.25rem 4rem 1.25rem;
|
|
}
|
|
|
|
.lbd-main-title {
|
|
font-size: 1.55rem;
|
|
}
|
|
|
|
.lbd-banner-img {
|
|
height: 220px;
|
|
}
|
|
} |