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

taille header

This commit is contained in:
ouidade 2024-09-20 23:07:52 +02:00
parent 28656159e4
commit 99d05401b8
3 changed files with 39 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -282,7 +282,7 @@ header .header_left_container #block-quartiers-de-demain-logorepu-2 {
}
@media (max-width: 891px) {
header .header_left_container #block-quartiers-de-demain-logorepu-2 {
height: 110px;
height: 160px;
}
}
header .header_left_container #block-quartiers-de-demain-logoepau-2 {
@ -291,7 +291,7 @@ header .header_left_container #block-quartiers-de-demain-logoepau-2 {
}
@media (max-width: 891px) {
header .header_left_container #block-quartiers-de-demain-logoepau-2 {
height: 110px;
height: 160px;
}
}
header .header_left_container #block-quartiers-de-demain-logoquartiersdedemain {
@ -301,6 +301,11 @@ header .header_left_container #block-quartiers-de-demain-logoquartiersdedemain .
width: 90%;
margin: auto;
}
@media (max-width: 1650px) {
header .header_left_container #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo {
width: 80%;
}
}
header .header_left_container #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-header {
width: 100%;
}
@ -313,7 +318,7 @@ header .header_left_container img {
}
@media (max-width: 891px) {
header .header_left_container img {
height: 110px;
height: 160px;
}
}
@media (max-width: 660px) {
@ -376,6 +381,11 @@ header .header_nav_container {
transition: transform 0.3s ease-in-out;
z-index: -1;
}
@media (max-width: 1090px) {
header .header_nav_container {
text-align: left;
}
}
@media (max-width: 500px) {
header .header_nav_container {
flex: 0 0 40%;
@ -394,9 +404,14 @@ header .header_nav_container #block-quartiers-de-demain-entete ul {
padding-right: 1rem;
margin: 0;
}
@media (max-width: 1200px) {
header .header_nav_container #block-quartiers-de-demain-entete ul {
top: 0;
}
}
@media (max-width: 810px) {
header .header_nav_container #block-quartiers-de-demain-entete ul {
top: 27.5px;
top: 40px;
align-items: center;
margin: 1rem;
}
@ -413,7 +428,7 @@ header .header_nav_container #block-quartiers-de-demain-entete ul li a {
}
@media (max-width: 1090px) {
header .header_nav_container #block-quartiers-de-demain-entete ul li a {
font-size: 0.9rem;
font-size: 0.6rem;
}
}
@media (max-width: 500px) {
@ -457,6 +472,11 @@ header .header:hover + .header_nav_container {
transform-origin: bottom right;
transition: all 1s ease-in-out;
}
@media (max-width: 1600px) {
.header--collapsed {
height: 160px;
}
}
.header--collapsed .qdd-header {
opacity: 1 !important;
}

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

@ -1,6 +1,6 @@
$header-height : 270px;
$header-height-pad : 110px;
$header-height-pad : 160px;
$header-height-small : 70px;
$header-height-ultrasmall : 50px;
$width-menu-slidedown : 550px;

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

@ -49,6 +49,9 @@ header{
.field_field_logo{
width: 90%;
margin: auto;
@media(max-width: 1650px){
width: 80%;
}
.qdd-header{
width: 100%;
}
@ -116,6 +119,9 @@ header{
transform: translateX(0);
transition: transform 0.3s ease-in-out;
z-index: -1 ;
@media(max-width: 1090px){
text-align:left;
}
@media(max-width: 500px){
flex: 0 0 40%;
}
@ -133,6 +139,9 @@ header{
padding-left: 1rem;
padding-right: 1rem;
margin: 0;
@media(max-width: 1200px){
top:0;
}
@media(max-width: 810px){
top: calc($header-height-pad / 4 );
align-items: center;
@ -143,12 +152,11 @@ header{
padding-top: 0.3rem;
}
a{
text-transform: uppercase;
color: white;
font-size: 0.5rem;
@media(max-width:1090px){
font-size: 0.9rem;
font-size: 0.6rem;
}
@media(max-width: 500px){
display: flex;
@ -200,6 +208,9 @@ header{
width: 45%;
transform-origin: bottom right;
transition: all 1s ease-in-out;
@media(max-width: 1600px) {
height: $header-height-pad;
}
.qdd-header{
opacity: 1 !important;
}