194 lines
3.1 KiB
SCSS
194 lines
3.1 KiB
SCSS
// ------------------------------------------
|
|
// Sous-navigation et autres menus
|
|
// ------------------------------------------
|
|
|
|
// Habillage general des menus de nav
|
|
.menu {
|
|
clear: both;
|
|
margin-bottom: 1.5em;
|
|
text-align: left;
|
|
p {}
|
|
ul {
|
|
margin-bottom: 1.5em;
|
|
}
|
|
ul li {}
|
|
ul li ul {
|
|
margin-left: 1.5em;
|
|
list-style: circle;
|
|
}
|
|
}
|
|
|
|
.nav {
|
|
ul {
|
|
margin:0;
|
|
padding:0;
|
|
}
|
|
li {
|
|
display:inline;
|
|
line-height:1.2;
|
|
}
|
|
a, a:visited {
|
|
display: inline-block;
|
|
padding:0.3em 0 0.2em;
|
|
margin:0 0.5em 0.4em;
|
|
text-decoration: none;
|
|
line-height:1.4;
|
|
border-bottom:3px solid white;
|
|
.header_boussole & {
|
|
font-weight:400;
|
|
padding:1em;
|
|
margin:0;
|
|
color:white;
|
|
border:0;
|
|
}
|
|
.on &,
|
|
&.on,
|
|
&:focus,
|
|
&:hover,
|
|
&:active {
|
|
border-color:$couleurSecondaire;
|
|
.header_boussole & {
|
|
background:$couleurSecondaire;
|
|
}
|
|
}
|
|
}
|
|
|
|
.pagination { margin:0 0 1rem; }
|
|
}
|
|
// menu smart cf js/script.js
|
|
// ----------------------------------------
|
|
.btn-nav {
|
|
position:absolute;
|
|
z-index:2;
|
|
right:$spacer;
|
|
top:0;
|
|
padding:($spacer/1.2) $spacer;
|
|
border:none;
|
|
background:$couleurPrincipale;
|
|
color:white;
|
|
font-size:0.9em;
|
|
outline:none !important;
|
|
display:none;
|
|
@media ($bp-medium) {
|
|
display:block;
|
|
}
|
|
&.actif {
|
|
color:$couleurPrincipaleDowner;
|
|
}
|
|
}
|
|
|
|
/* header = nav-principale */
|
|
.page_header > .page_container {
|
|
.nav {
|
|
padding-top:$spacer;
|
|
font-size:0.9rem;
|
|
> ul {
|
|
text-align:right;
|
|
@media ($bp-medium) {
|
|
position:absolute;
|
|
background:$couleurPrincipale;
|
|
width:100%;
|
|
top:44px;
|
|
left:-100%;
|
|
padding:$spacer/2 $spacer;
|
|
&.ouvert{
|
|
left:0;
|
|
}
|
|
a {
|
|
color:white;
|
|
border-color:$couleurPrincipale;
|
|
}
|
|
li {
|
|
display:block;
|
|
}
|
|
}
|
|
}
|
|
a {
|
|
font-weight:700;
|
|
}
|
|
}
|
|
}
|
|
|
|
// aside
|
|
// ------------------------------------
|
|
.page_aside {
|
|
.nav {
|
|
padding:0;
|
|
li {
|
|
display:block;
|
|
}
|
|
a {
|
|
width:100%;
|
|
}
|
|
& .blog {
|
|
a {
|
|
line-height:1;
|
|
padding:1em;
|
|
font-weight:700;
|
|
p {
|
|
font-weight:400;
|
|
margin:0;
|
|
&.date {
|
|
font-size:90%;
|
|
margin:0 0 0.3em;
|
|
}
|
|
&.introduction {
|
|
font-size:0.8em;
|
|
margin-top:0.5em;
|
|
}
|
|
}
|
|
/* &:hover, &:focus, &:active, &.on { background:darken($grayLighter,10); color:$couleurPrincipaleDowner; } */
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
// boussole
|
|
.page_header .header_boussole {
|
|
position:absolute;
|
|
top:0;
|
|
left:0;
|
|
right:0;
|
|
background-color:$couleurPrincipale;
|
|
color:white;
|
|
|
|
.btn-boussole {
|
|
font-size:0.8rem;
|
|
display:none;
|
|
padding:($spacer/1.6) 0 0 $spacer;
|
|
margin-left:-$spacer;
|
|
background:$couleurPrincipale;
|
|
color:white;
|
|
@media ($bp-medium) {
|
|
display:block;
|
|
}
|
|
}
|
|
.nav {
|
|
font-size:0.8rem;
|
|
background:$couleurPrincipale;
|
|
@media ($bp-medium) {
|
|
position:absolute;
|
|
width:100%;
|
|
top:43px;
|
|
left:-100%;
|
|
&.ouvert {
|
|
left:0;
|
|
}
|
|
}
|
|
}
|
|
.initiatives {
|
|
font-size:0.8rem;
|
|
float:right;
|
|
margin-top:$spacer;
|
|
@media ($bp-medium) {
|
|
color:$couleurPrincipaleDowner;
|
|
font-size:0.6em;
|
|
margin:0;
|
|
position:absolute;
|
|
bottom:-$spacer;
|
|
left:$spacer*1.6;
|
|
}
|
|
}
|
|
}
|