bachir/drupal-quartiersdedemain
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

taille logo header

Browse Source
This commit is contained in:
Ouidade Soussi Chiadmi
2026-01-13 14:36:15 +01:00
parent 35478e9d20
commit 4cbb80d6fb
3 changed files with 17 additions and 393 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
web/themes/custom/quartiers_de_demain/dist/assets/css/bundle.css vendored
View File

@@ -192,7 +192,7 @@ h2, h3 {
width: 100%;
padding-top: 200px;
padding-bottom: 3rem;
min-height: calc(100vh - (200px + 3rem));
min-height: calc(100vh - (200px + 6rem));
}
@media (max-width: 810px) {
.layout-container main {
@@ -387,9 +387,9 @@ header[role=banner] .header_left_container img {
padding: 2rem;
transition: height 0.3s;
}
@media (max-width: 891px) {
@media (max-width: 1000px) {
header[role=banner] .header_left_container img {
height: 160px;
height: calc(160px - 4rem);
}
}
@media (max-width: 660px) {
@@ -397,11 +397,6 @@ header[role=banner] .header_left_container img {
height: 70px;
}
}
@media (max-width: 450px) {
header[role=banner] .header_left_container img {
height: 50px;
}
}
header[role=banner] .header_right_container {
display: none;
flex: 0 0 0%;
@@ -2518,18 +2513,6 @@ body {
font-size: 0.8rem;
font-weight: 800;
}
#home article.node-type-static #paragraph-id--6 .field_field_texte .colone-picto > p:nth-of-type(2) {
width: 60%;
font-size: 0.8rem;
align-self: center;
padding-top: 1.5rem;
}
@media (max-width: 810px) {
#home article.node-type-static #paragraph-id--6 .field_field_texte .colone-picto > p:nth-of-type(2) {
width: 80%;
padding-top: 0;
}
}
#home article.node-type-static #paragraph-id--6 .field_field_texte .colone-picto > p:nth-of-type(3) {
width: 90%;
align-self: center;

2
web/themes/custom/quartiers_de_demain/src/assets/scss/global/_layout.scss
View File

@@ -38,7 +38,7 @@ $width-menu-slidedown : 550px;
padding-top: $header-height;
padding-bottom: 3rem;
// box-sizing:border-box;
min-height: calc(100vh - ($header-height + 3rem));
min-height: calc(100vh - ($header-height + 6rem));
@media(max-width: 810px){
padding-top: 180px;
}

385
web/themes/custom/quartiers_de_demain/src/assets/scss/partials/header.scss
View File

@@ -1,358 +1,3 @@
// /* ===========================
// HEADER GLOBAL
// =========================== */
// header[role="banner"] {
// position: fixed;
// top: 0;
// left: 0;
// z-index: 99;
// max-width: 100vw;
// display: flex;
// flex-direction: row;
// transform-origin: bottom right;
// height: $header-height;
// width: 35%;
// transition: all 1.4s ease-in-out;
// @media (max-width: 1090px) {
// height: $header-height-pad;
// }
// @media (min-width: 1400px) {
// height: $header-height-big;
// }
// @media (max-width: 810px) {
// width: 100%;
// height: 170px;
// flex-direction: row;
// }
// .qdd-header {
// opacity: 1 !important;
// }
// /* ===========================
// LANGUAGE SWITCHER
// =========================== */
// .language-switcher-language-url {
// text-transform: uppercase;
// color: white;
// ul {
// display: flex;
// flex-direction: row;
// font-size: 0.6rem;
// padding: 0;
// width: fit-content;
// @media (max-width: 810px) {
// font-size: 0.9rem;
// }
// li a {
// color: white;
// font-family: "gilroy-light";
// }
// li:nth-child(1) {
// &::after {
// content: " / ";
// white-space: pre;
// }
// }
// .is-active {
// font-family: "gilroy-bold";
// }
// }
// }
// .contextual-region {
// width: max-content;
// }
// /* ===========================
// COLONNE GAUCHE (LOGO)
// =========================== */
// .header_left_container {
// flex: 0 0 45%;
// display: flex;
// flex-direction: row;
// background-color: $white-header;
// transition:
// flex-basis 0.9s ease-in-out,
// width 0.9s ease-in-out;
// img {
// display: none;
// }
// @media (max-width: 660px) {
// height: inherit;
// }
// #block-quartiers-de-demain-logorepu-2 {
// display: none;
// @media (max-width: 891px) {
// height: $header-height-pad;
// }
// }
// #block-quartiers-de-demain-logoepau-2 {
// display: none;
// height: $header-height;
// @media (max-width: 891px) {
// height: $header-height-pad;
// }
// }
// #block-quartiers-de-demain-logoquartiersdedemain {
// margin: auto;
// .field_field_logo {
// width: 90%;
// margin: auto;
// @media (max-width: 1650px) {
// width: 80%;
// }
// .qdd-header {
// width: 100%;
// }
// }
// }
// img {
// width: auto;
// margin: auto;
// height: calc($header-height - 1rem);
// padding: 2rem;
// transition: height 0.3s;
// @media (max-width: 891px) {
// height: $header-height-pad;
// }
// @media (max-width: 660px) {
// height: $header-height-small;
// }
// @media (max-width: 450px) {
// height: $header-height-ultrasmall;
// }
// }
// }
// /* ===========================
// BOUTON / BLOCS DROITE (SI BESOIN)
// =========================== */
// .header_right_container {
// display: none;
// flex: 0 0 0%;
// width: fit-content;
// min-width: fit-content;
// background: $blue_QDD;
// text-align: center;
// transform: translateX(0);
// transition: transform 0.3s ease-in-out;
// z-index: 10;
// position: fixed;
// right: 0;
// border-radius: 11px;
// padding: 0.5rem 0.5rem 0 0.5rem;
// margin: 1rem;
// @media (max-width: 660px) {
// padding-right: 0;
// }
// }
// /* ===========================
// NAVIGATION (COLONNE DROITE)
// =========================== */
// .header_nav_container {
// flex: 0 0 0%;
// width: 100%;
// min-width: fit-content;
// background: $blue_QDD;
// text-align: center;
// display: flex;
// flex-direction: column;
// z-index: -1;
// transform: translateX(0);
// transition:
// flex-basis 0.9s ease-in-out,
// width 0.9s ease-in-out,
// transform 0.3s ease-in-out;
// @media (max-width: 810px) {
// height: 200px;
// top: -30px;
// flex: 1 0 100%;
// position: relative;
// }
// @media (max-width: 500px) {
// flex: 0 0 40%;
// }
// /* ---- Bloc menu principal ---- */
// #block-quartiers-de-demain-entete {
// margin: auto;
// h2 {
// display: none;
// }
// ul {
// display: flex;
// flex-direction: column;
// align-items: flex-start;
// position: relative;
// padding-left: 1rem;
// padding-right: 1rem;
// margin: auto;
// @media (max-width: 1025px) {
// top: 0;
// align-items: center;
// padding-top: 0.3rem;
// }
// li {
// width: 100%;
// text-align: left;
// .is-active {
// font-family: "gilroy-bold";
// }
// :hover {
// font-family: "gilroy-bold";
// }
// @media (max-width: 1090px) {
// padding-top: 0.3rem;
// }
// @media (max-width: 810px) {
// line-height: 1.3rem;
// }
// a {
// text-transform: uppercase;
// color: white;
// font-size: 0.5rem;
// @media (max-width: 1090px) {
// font-size: 0.6rem;
// }
// @media (max-width: 810px) {
// display: flex;
// flex-direction: column;
// align-items: center;
// font-size: 0.8rem;
// }
// }
// }
// }
// }
// /* ---- Sélecteur de langue en bas du menu ---- */
// #block-quartiers-de-demain-selecteurdelangue {
// width: fit-content;
// margin: auto;
// @media (max-width: 810px) {
// padding-bottom: 0.5rem;
// margin-bottom: 0.5rem;
// .links {
// margin-top: 0.5rem;
// }
// }
// }
// }
// /* ===========================
// ÉTATS D’AFFICHAGE DU MENU
// (pilotés en JS avec .nav-hidden)
// =========================== */
// /* État par défaut : menu visible */
// .header_nav_container {
// transform: translateX(0);
// }
// /* Menu caché : desktop → slide vers la gauche */
// .header_nav_container.nav-hidden {
// transform: translateX(-100%);
// }
// /* Spécifique mobile : on slide verticalement */
// @media (max-width: 810px) {
// .header_nav_container {
// transform: translateY(0);
// }
// .header_nav_container.nav-hidden {
// transform: translateY(-100%);
// }
// }
// }
// /* ===========================
// HEADER "SHRINK" AU SCROLL
// =========================== */
// .shrink {
// height: 260px;
// @media (max-width: 810px) {
// height: 170px;
// }
// }
// /* ===========================
// RÉGLAGES DE LA RÉPARTITION GAUCHE / DROITE
// (quand le header est à son état "final")
// =========================== */
// header[role="banner"] {
// .header_left_container {
// flex-basis: 65%;
// transform-origin: bottom right;
// @media (max-width: 810px) {
// flex: 1 0 100%;
// }
// }
// .header_nav_container {
// flex-basis: 30%;
// transform-origin: bottom right;
// min-width: fit-content;
// @media (max-width: 810px) {
// flex: 1 0 100%;
// position: relative;
// }
// }
// }
/* ===========================
@@ -474,19 +119,7 @@
#block-quartiers-de-demain-logoquartiersdedemain {
margin: auto;
.field_field_logo {
// width: 100%;
// margin: auto;
// @media (max-width: 1650px) {
// width: 80%;
// }
// .qdd-header {
// width: 100%;
// }
}
}
img {
@@ -495,17 +128,25 @@
height: calc($header-height - 3rem);
padding: 2rem;
transition: height 0.3s;
@media (max-width: 891px) {
height: $header-height-pad;
@media (max-width: 1700px) {
// height: calc($header-height - 6rem);
}
@media (max-width: 1300px) {
// height: calc($header-height - 6rem);
}
@media (max-width: 1000px) {
height: calc($header-height-pad - 4rem);
// height: $header-height-pad;
}
@media (max-width: 660px) {
// height: calc($header-height-small - 6rem);
height: $header-height-small;
}
@media (max-width: 450px) {
height: $header-height-ultrasmall;
// height: calc($header-height-ultrasmall - 3rem);
// height: $header-height-ultrasmall;
}
}
}