js & css header

This commit is contained in:
ouidade 2024-02-28 11:08:13 +01:00
parent acf5638ebd
commit 95d1071547
3 changed files with 20 additions and 45 deletions

View File

@ -179,8 +179,6 @@ header {
content: "/"; }
header .header_nav_container {
display: none;
grid-template-columns: repeat(12, 1fr);
grid-gap: 10px;
grid-row: 3;
grid-column: 1 /span 12;
position: absolute;
@ -196,11 +194,13 @@ header {
margin: auto; }
header .header_nav_container #block-quartiers-de-demain-entete h2 {
display: none; }
header .header_nav_container .close-block {
order: 1; }
header .close-block, header .open-block, header .open-block.opened {
header .display-nav-opened {
display: grid;
grid-template-columns: repeat(12, 1fr);
grid-gap: 10px; }
header .open-block, header .open-block.opened {
cursor: pointer; }
header .close-block span, header .open-block span, header .open-block.opened span {
header .open-block span, header .open-block.opened span {
display: block;
width: 33px;
height: 2px;

View File

@ -21,18 +21,11 @@
jQuery(document).ready(function($){
// $('.close-block').click(function(){
// $(this).parent().fadeOut();
// if(mobile == true){
// $("body").css("overflow","auto");
// }
// });
$('.open-block').click(function(){
$(this).prev().css("display","grid");
$(this).toggleClass('opened');
$('.header_nav_container').toggleClass('display-nav-opened');
if(mobile == true){
$("body").css("overflow","hidden");
}
@ -43,6 +36,7 @@
$('.header_nav_container li').click(function() {
$('.header_nav_container').fadeOut();
});
});

View File

@ -64,8 +64,8 @@ header{
.header_nav_container{
display: none;
// display: grid;
grid-template-columns: repeat(12, 1fr);
grid-gap: 10px;
// grid-template-columns: repeat(12, 1fr);
// grid-gap: 10px;
grid-row: 3;
grid-column: 1 /span 12;
@ -88,13 +88,16 @@ header{
display: none;
}
}
.close-block{
order: 1;
}
}
.close-block, .open-block, .open-block.opened{
.display-nav-opened{
display: grid;
grid-template-columns: repeat(12, 1fr);
grid-gap: 10px;
}
.open-block, .open-block.opened{
cursor:pointer;
span{
display: block;
@ -106,28 +109,6 @@ header{
z-index: 1;
}
}
// .close-block{
// order: 1;
// grid-column: 12;
// display: none;
// margin: auto;
// span{
// transform-origin: center;
// }
// &>div>span:first-child{
// transform: translateY(57%)rotate(45deg);
// }
// &>div>span:nth-child(2){
// transform: rotate(-45deg);
// }
// // @include breakpoint(small down) {
// // position: absolute;
// // top: 1rem;
// // right: 1rem;
// // }
// }
.open-block{
height: 100%;
display: grid;