fix header

This commit is contained in:
Kevin Tessier 2020-06-28 11:51:13 +02:00
parent 6e390a00dc
commit af6780d3db
2 changed files with 111 additions and 74 deletions

View File

@ -12,8 +12,6 @@
}
body {
width: 300px;
margin: 0 auto;
font-size: 16px;
font-family: Universalis ADF Std, sans-serif;
padding: 0!important;
@ -22,41 +20,86 @@ body {
h1, h2, h3, h5{
font-family: Millimetre, sans-serif;
}
h1, h5, h6{
text-transform: uppercase;
}
img{
width: 100%;
height: auto;
height: 100%;
}
ul{
padding:0;
}
li {
}
li ,ul ,ol {
list-style-type:none;
}
a, a:hover{
color: black;
text-decoration: none;
}
.section_accueil {
position: relative;
}
/* START KEVIN */
.burger{
/* START HEADER */
header{
width: 100%;
position: fixed;
top: 20px;
right: 0;
z-index: 999;
top: 0;
left: 0;
}
header > .nav-wrapper{
height: fit-content;
}
/* START LOGO */
.logoLamine {
width : 120px;
height: 120px;
}
.logoLamine a{
display: block;
width: 100%;
height: 100%;
}
.logoLamine img{
object-fit: cover;
}
/* END LOGO */
.fond_burger{
/* START RS */
.rs{
padding-top: 10px;
height: fit-content;
}
.rs > div {
width: 30px;
height: 30px;
object-fit: cover;
margin-right: 15px;
}
/* END RS */
/* START NAV */
/* END NAV */
/* START BURGER */
.burger{
padding-top: 10px;
height: fit-content;
}
.fond_burger{
background-image: url('../images/form_burger.svg');
background-position: center; /* Center the image */
background-repeat: no-repeat; /* Do not repeat the image */
background-size: contain;
}
}
.nav-main{
display: none;
position: fixed;
@ -68,31 +111,26 @@ a, a:hover{
.nav-main.is-active{
display: block
}
/* END BURGER */
/* END HEADER */
/* START PAGE HOME */
.section_accueil {
position: relative;
}
/* END PAGE HOME */
/* START KEVIN */
/* END KEVIN */
.logoLamine {
position: fixed;
margin:0 10px 10px 10px;
width : 200px;
height: 200px;
}
.rs {
position: fixed;
top: 20px;
right: 20px;
margin-right: 80px;
}
.rs img {
width : 40px;
height: 40px;
margin-top: 10px;
opacity: 1;
}
.facebook {
margin-right: 40px;
}
.rs img:hover {
opacity: 0.6;
}
.menu-item {
font-family: Millimetre, sans-serif;
text-transform: uppercase;
@ -569,8 +607,12 @@ a, a:hover{
.flickity-page-dots .dot.is-selected {
background: white;
}
/*fin gestion des dots*/
/* dot home */
.hero .flickity-page-dots{
bottom: 30px;
}
/*fin gestion des dots*/
footer{
background-color: rgba(240, 240, 240, 240);
width: 100%;
@ -620,13 +662,6 @@ footer .insta {
/* END SLIDE PARTENAIRE */
/* START KEVIN */
header{
z-index: 9999;
position: absolute;
width: 100%;
top: 0;
left: 0;
}
.hero{
width: 100%;
height: 100vh;

View File

@ -6,12 +6,13 @@
</head>
{% endblock %}
<body class="container-fluid {{post.slug}}" data-template="base.twig">
<header class="header d-flex justify-content-between">
<header class="header d-flex ">
{% block header %}
<div class="logoLamine">
<div class="logoLamine mr-auto">
<a class="hdr-logo-link" href="{{site.url}}"><img src="{{theme.link}}/asset/images/logo_lamine_vect.svg"/></a>
</div>
<div class="rs row align-items">
<div class="nav-wrapper d-flex align-items-center">
<div class="rs d-flex">
<div class="facebook">
<a target="_blank" href="{{options.facebook.lien_facebook}}">
<img src="{{ Image(options.facebook.logo_facebook).src }}" />
@ -23,7 +24,6 @@
</a>
</div>
</div>
<div class="burger">
<div class="fond_burger">
<button class="hamburger hamburger--slider" type="button">
@ -33,6 +33,8 @@
</button>
</div>
</div>
</div>
<nav id="nav-main" class="nav-main" role="navigation">
{% include "menu.twig" with {'items': menu.get_items} %}