animation glissement h1 nsb
This commit is contained in:
@@ -825,7 +825,10 @@ ul.pagination {
|
|||||||
padding: 0 .1em;
|
padding: 0 .1em;
|
||||||
vertical-align: top; }
|
vertical-align: top; }
|
||||||
|
|
||||||
#header #navbar ul.navigation li a:hover {
|
#header #navbar ul.navigation li:last-child:after {
|
||||||
|
content: "" !important; }
|
||||||
|
|
||||||
|
#header #navbar ul.navigation li:last-child #header #navbar ul.navigation li a:hover {
|
||||||
font-weight: 900; }
|
font-weight: 900; }
|
||||||
|
|
||||||
#header.scrolled #navbar ul.navigation li a {
|
#header.scrolled #navbar ul.navigation li a {
|
||||||
@@ -883,9 +886,20 @@ ul.pagination {
|
|||||||
100% {
|
100% {
|
||||||
width: 100%; } }
|
width: 100%; } }
|
||||||
|
|
||||||
|
@keyframes glissement {
|
||||||
|
from {
|
||||||
|
margin-left: 100%;
|
||||||
|
width: 300%; }
|
||||||
|
to {
|
||||||
|
margin-left: 0%;
|
||||||
|
width: 100%; } }
|
||||||
|
|
||||||
.after-h1 .test {
|
.after-h1 .test {
|
||||||
animation: anim 2.5s 1 normal ease-in-out forwards; }
|
animation: anim 2.5s 1 normal ease-in-out forwards; }
|
||||||
|
|
||||||
|
.after-h1 .souligne {
|
||||||
|
animation: glissement 2.5s 1 normal ease-in-out forwards; }
|
||||||
|
|
||||||
.programmes {
|
.programmes {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
@@ -1041,7 +1055,8 @@ ul.pagination {
|
|||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
align-self: flex-end;
|
align-self: flex-end;
|
||||||
margin: auto; }
|
margin: auto;
|
||||||
|
margin-bottom: 2rem; }
|
||||||
|
|
||||||
.modal {
|
.modal {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
|
|||||||
@@ -49,6 +49,13 @@
|
|||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#header #navbar ul.navigation li:last-child:after {
|
||||||
|
content: "" !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#header #navbar ul.navigation li:last-child
|
||||||
|
|
||||||
#header #navbar ul.navigation li a:hover {
|
#header #navbar ul.navigation li a:hover {
|
||||||
font-weight: 900;
|
font-weight: 900;
|
||||||
}
|
}
|
||||||
@@ -117,6 +124,7 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.titre_bsn {
|
.titre_bsn {
|
||||||
|
|
||||||
display: block;
|
display: block;
|
||||||
@@ -138,23 +146,30 @@
|
|||||||
0% {width: 0%;}
|
0% {width: 0%;}
|
||||||
|
|
||||||
100% {width: 100%;}
|
100% {width: 100%;}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.after-h1 {
|
@keyframes glissement {
|
||||||
|
from {
|
||||||
|
margin-left: 100%;
|
||||||
|
width: 300%;
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
margin-left: 0%;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.after-h1 {
|
||||||
.test {
|
.test {
|
||||||
// opacity: 0;
|
// opacity: 0;
|
||||||
// transition: opacity 1s ease-in-out;
|
// transition: opacity 1s ease-in-out;
|
||||||
animation: anim 2.5s 1 normal ease-in-out forwards;
|
animation: anim 2.5s 1 normal ease-in-out forwards;
|
||||||
}
|
}
|
||||||
|
.souligne {
|
||||||
|
animation: glissement 2.5s 1 normal ease-in-out forwards;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
// &:hover {
|
|
||||||
// .test {
|
|
||||||
// opacity: 1;
|
|
||||||
// }
|
|
||||||
// opacity: 1;
|
|
||||||
// transition: width 5s ease-in-out;
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@@ -449,6 +464,7 @@
|
|||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
align-self: flex-end;
|
align-self: flex-end;
|
||||||
margin:auto;
|
margin:auto;
|
||||||
|
margin-bottom: 2rem;
|
||||||
}
|
}
|
||||||
//
|
//
|
||||||
// .bouton :hover {
|
// .bouton :hover {
|
||||||
|
|||||||
@@ -26,7 +26,7 @@
|
|||||||
|
|
||||||
<h1>EPAU</h1>
|
<h1>EPAU</h1>
|
||||||
|
|
||||||
<div class="test" >
|
<div class="souligne" >
|
||||||
<svg width="100%" height="0.5rem">
|
<svg width="100%" height="0.5rem">
|
||||||
<rect class="" width="100%" height="100%" style="fill:rgb(255,255,255)" />
|
<rect class="" width="100%" height="100%" style="fill:rgb(255,255,255)" />
|
||||||
</svg>
|
</svg>
|
||||||
|
|||||||
@@ -5,7 +5,7 @@
|
|||||||
|
|
||||||
<h1>Gouvernance</h1>
|
<h1>Gouvernance</h1>
|
||||||
|
|
||||||
<div class="test" >
|
<div class="souligne" >
|
||||||
<svg width="100%" height="0.5rem">
|
<svg width="100%" height="0.5rem">
|
||||||
<rect class="" width="100%" height="100%" style="fill:rgb(255,255,255)" />
|
<rect class="" width="100%" height="100%" style="fill:rgb(255,255,255)" />
|
||||||
</svg>
|
</svg>
|
||||||
|
|||||||
Reference in New Issue
Block a user