Skip to content
Snippets Groups Projects
Commit 625339b2 authored by Bryan BRANCOTTE's avatar Bryan BRANCOTTE
Browse files

Adding the second menu bar 

WIP #2
parent 22763ed9
No related branches found
No related tags found
No related merge requests found
Pipeline #14176 passed
Stage: test
Show whitespace changes
Inline Side-by-side
basetheme_bootstrap/static/css/basetheme_bootstrap4_pasteur.css
+ 105
− 4
View file @ 625339b2
......@@ -32,7 +32,7 @@ html {
}
body {
padding-top: 3.5rem;
padding-top: calc( 3.5rem + 93px );
}
@media (min-width: 1600px){
......@@ -77,18 +77,21 @@ header nav.navbar nav-item.active{
background: #FFFFFF30;
}
header .dropdown-menu a,
header a {
header .header__top .dropdown-menu a,
header .header__top a {
display: block;
color: #fff;
text-transform: uppercase;
padding: 8px 30px !important;
font-weight: 700;
font-size: 16px;
font-size: 0.8em;
text-decoration: none;
font-family: "BrandonGrotesqueReg";
}
header {
border-bottom: 1px solid #aeb7c0;
}
header .dropdown-menu a:hover,
/*header .dropdown-menu>a:hover,
header .dropdown.show>a ,*/
......@@ -107,6 +110,104 @@ header .dropdown.show>a {
background: #211b1d;
}
.header__nav{
flex:1 1 auto;
}
.header__logo-wrapper {
/*float: left;*/
margin-right: 20px;
}
header__face-wrapper {
/*float: left;*/
margin-right: 20px;
}
.header__middle{
/*padding-right: 1rem;
padding-left: 1rem;
padding-top: 15px;
padding-bottom: 15px;*/
background:white;
/*background: url("https://www.pasteur.fr//sites/all/themes/custom/pasteur/assets/img/art/pasteur.png") right top no-repeat, #FFF;*/
/*background-size: auto auto;*/
display:flex;
-moz-transition-property: background-image;
-moz-transition-duration: 500ms;
}
.main-nav li {
display:inline-block;
}
.main-nav li {
display: inline-block;
vertical-align: middle;
margin: 0 10px;
}
.main-nav ul {
list-style: none;
margin: 0;
padding: 0;
border: 0;
}
.main-nav a {
position: relative;
display: inline-block;
font-weight: 800;
text-transform: uppercase;
color: #636060;
font-size: 1em;
padding: 5px 0;
padding-top: 41px;
}
.main-nav a:hover,
.main-nav a.active {
color: #211b1d;
}
.main-nav a:hover:after,
.main-nav a.active:after {
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 2px;
background: #211b1d;
}
header *{
transition: all 0.2s ease-out;
}
header.scrolled .main-nav a {
padding-top: 5px;
}
header.scrolled .header__middle{
padding-top: 0px;
padding-bottom: 0px;
}
header.scrolled .header__logo-wrapper{
height: 2em;
/*overflow: hidden;/**/
}
header.scrolled .header__logo-wrapper img{
height: 39px;
margin-top: 5px;
margin-left: 63px;
}
header.scrolled .header__middle{
background-size: auto 39px;
}
header .header__logo-wrapper{
height: 75px;
overflow: hidden;/**/
}
header .header__logo-wrapper img{
height: 63px;
margin-top: 0px;
margin-left: 0px;
/*overflow: hidden;*/
}
footer .dropdown-menu ,
header .dropdown-menu {
background: #211b1d;
......
basetheme_bootstrap/static/js/basetheme_bootstrap.js
+ 8
− 0
View file @ 625339b2
......@@ -90,3 +90,11 @@ function delayed_action(action, instant_action, timeout){
delayAction(action, timeout);
}
}
$(window).on("scroll", function() {
if ($(document).scrollTop()>20){
$("header").addClass("scrolled");
}else{
$("header").removeClass("scrolled");
}
});
basetheme_bootstrap/templates/basetheme_bootstrap/basePasteur.html
+ 19
− 3
View file @ 625339b2
......@@ -26,9 +26,9 @@
</head>
<body class="d-flex flex-column h-100">
{% include_if_exists "fork_me.html"|localize_template "basetheme_bootstrap/fork_me.example.html" %}
<header>
<header class="main-header fixed-top">
<!-- Fixed navbar -->
<nav class="navbar navbar-expand-md fixed-top">
<nav class="header__top navbar navbar-expand-md">
<a class="navbar-brand" href="{% url 'home'%}">{% block project_name %}{% endblock %}</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse"
aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
......@@ -36,7 +36,6 @@
</button>
<div class="collapse navbar-collapse" id="navbarCollapse">
<ul class="navbar-nav mr-auto">
{% include_if_exists "nav_bar.html"|localize_template "basetheme_bootstrap/nav_bar.example.html" %}
</ul>
{% block form_in_nav_bar %}
<!--<form class="form-inline mt-2 mt-md-0">-->
......@@ -70,6 +69,23 @@
</ul>
</div>
</nav>
<div class="header__middle">
<div class="header__logo-wrapper">
<a href="/" title="Accueil" rel="home">
<img src="https://www.pasteur.fr/sites/default/files/logo_institut_pasteur_noir.png" alt="Accueil">
</a>
</div>
<div class="header__nav">
<nav class="main-nav" role="navigation">
<ul id="main-menu" class="links inline clearfix main-menu">
{% include_if_exists "nav_bar.html"|localize_template "basetheme_bootstrap/nav_bar.example.html" %}
</ul>
</nav>
</div>
<div class="header__face-wrapper">
<img src="https://www.pasteur.fr//sites/all/themes/custom/pasteur/assets/img/art/pasteur.png">
</div>
</div>
</header>
<!-- Begin page content -->
<main role="main" class="flex-shrink-0">
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment