js & css header
This commit is contained in:
parent
acf5638ebd
commit
95d1071547
|
@ -179,8 +179,6 @@ header {
|
||||||
content: "/"; }
|
content: "/"; }
|
||||||
header .header_nav_container {
|
header .header_nav_container {
|
||||||
display: none;
|
display: none;
|
||||||
grid-template-columns: repeat(12, 1fr);
|
|
||||||
grid-gap: 10px;
|
|
||||||
grid-row: 3;
|
grid-row: 3;
|
||||||
grid-column: 1 /span 12;
|
grid-column: 1 /span 12;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
@ -196,11 +194,13 @@ header {
|
||||||
margin: auto; }
|
margin: auto; }
|
||||||
header .header_nav_container #block-quartiers-de-demain-entete h2 {
|
header .header_nav_container #block-quartiers-de-demain-entete h2 {
|
||||||
display: none; }
|
display: none; }
|
||||||
header .header_nav_container .close-block {
|
header .display-nav-opened {
|
||||||
order: 1; }
|
display: grid;
|
||||||
header .close-block, header .open-block, header .open-block.opened {
|
grid-template-columns: repeat(12, 1fr);
|
||||||
|
grid-gap: 10px; }
|
||||||
|
header .open-block, header .open-block.opened {
|
||||||
cursor: pointer; }
|
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;
|
display: block;
|
||||||
width: 33px;
|
width: 33px;
|
||||||
height: 2px;
|
height: 2px;
|
||||||
|
|
|
@ -21,18 +21,11 @@
|
||||||
jQuery(document).ready(function($){
|
jQuery(document).ready(function($){
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// $('.close-block').click(function(){
|
|
||||||
// $(this).parent().fadeOut();
|
|
||||||
// if(mobile == true){
|
|
||||||
// $("body").css("overflow","auto");
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
$('.open-block').click(function(){
|
$('.open-block').click(function(){
|
||||||
$(this).prev().css("display","grid");
|
|
||||||
$(this).toggleClass('opened');
|
$(this).toggleClass('opened');
|
||||||
|
|
||||||
|
$('.header_nav_container').toggleClass('display-nav-opened');
|
||||||
|
|
||||||
if(mobile == true){
|
if(mobile == true){
|
||||||
$("body").css("overflow","hidden");
|
$("body").css("overflow","hidden");
|
||||||
}
|
}
|
||||||
|
@ -43,6 +36,7 @@
|
||||||
$('.header_nav_container li').click(function() {
|
$('.header_nav_container li').click(function() {
|
||||||
$('.header_nav_container').fadeOut();
|
$('.header_nav_container').fadeOut();
|
||||||
});
|
});
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
@ -64,8 +64,8 @@ header{
|
||||||
.header_nav_container{
|
.header_nav_container{
|
||||||
display: none;
|
display: none;
|
||||||
// display: grid;
|
// display: grid;
|
||||||
grid-template-columns: repeat(12, 1fr);
|
// grid-template-columns: repeat(12, 1fr);
|
||||||
grid-gap: 10px;
|
// grid-gap: 10px;
|
||||||
grid-row: 3;
|
grid-row: 3;
|
||||||
grid-column: 1 /span 12;
|
grid-column: 1 /span 12;
|
||||||
|
|
||||||
|
@ -88,13 +88,16 @@ header{
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.close-block{
|
|
||||||
order: 1;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.display-nav-opened{
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(12, 1fr);
|
||||||
|
grid-gap: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.close-block, .open-block, .open-block.opened{
|
|
||||||
|
.open-block, .open-block.opened{
|
||||||
cursor:pointer;
|
cursor:pointer;
|
||||||
span{
|
span{
|
||||||
display: block;
|
display: block;
|
||||||
|
@ -106,28 +109,6 @@ header{
|
||||||
z-index: 1;
|
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{
|
.open-block{
|
||||||
height: 100%;
|
height: 100%;
|
||||||
display: grid;
|
display: grid;
|
||||||
|
|
Loading…
Reference in New Issue