install relax ++ metaog

This commit is contained in:
Tessier
2020-09-21 18:41:23 +02:00
parent e20e0c5e9a
commit 1d46fd062c
28 changed files with 1083 additions and 86 deletions
@@ -63,9 +63,15 @@ function burger() {
}
function paralax() {
var rellax = new Rellax('.paralax', {
$paralax = $('.paralax');
var rellax = new Rellax(".paralax", {
center:true
});
$paralax.each( function(){
var random = Math.floor((Math.random() * 80) + 20);
$(this).css( "left", random +'vw' );
})
}
function isotope() {
@@ -120,14 +126,13 @@ function scrollto(){
});
}
$( document ).ready(function() {
burger();
click_nav();
slides();
isotope();
// masonry();
// paralax();
paralax();
// drag();
if (window.width >= 578) {
scrollto();
@@ -4,6 +4,7 @@
@import "forms.scss";
@import "title-page.scss";
@import "footer.scss";
@import "rellax.scss";
.grid img {
display: none;
}
@@ -0,0 +1,16 @@
.paralax{
display: none;
@media screen and (min-width: 576px) {
display: block;
}
z-index: -1;
position: absolute;
width: 30%;
&.agenda, &.archive{
width: 50%!important;
}
img{
width: 100%;
height: auto;
}
}
@@ -3,9 +3,38 @@
&:not(:last-child){
margin-bottom: 5rem;
}
@media screen and (min-width: 992px) {
margin-bottom: 0rem;
}
@media screen and (min-width: 992px) {
margin-bottom: 0rem;
}
.icone_cat{
display: block;
position: absolute;
transform: translate(-50%,-50%);
width: 30px;
height: 30px;
z-index: 999;
background-repeat: no-repeat;
background-size: cover;
&.non_programmation{
background-image: url("../../assets/images/svg/picto_nonprog.svg");
}
&.la_mine_numerique{
background-image: url("../../assets/images/svg/picto_num.svg");
}
&.zero_dechets{
background-image: url("../../assets/images/svg/picto_zero.svg");
}
&.atelier{
background-image: url("../../assets/images/svg/picto_ateliers.svg");
}
&.musiques{
background-image: url("../../assets/images/svg/picto_musique.svg");
}
&.autres{
background-image: url("../../assets/images/svg/picto_autres.svg");
}
}
a{
text-decoration: none;
}
@@ -26,11 +26,11 @@
body,html{
font-size: 14px;
line-height: 1;
overflow-x: hidden;
@media screen and (min-width: 576px) {
font-size: 16px;
line-height: 1.5;
}
}
// reboot perso
figure{
@@ -53,7 +53,7 @@
& > .row{
justify-content: center;
&:first-of-type{
margin-bottom: 100px;
margin-bottom: 50px;
}
}
}
@@ -178,7 +178,10 @@
& > .row{
justify-content: center;
&:first-of-type{
margin-bottom: 50px;
margin-bottom: 50px;
@media screen and (min-width: 992px) {
margin-bottom: 0;
}
}
}
}
@@ -10,22 +10,23 @@
font-family: 'universalis-bold';
}
}
header{
article{
header{
h3{
border: 5px solid $colorYellow;
padding: 0.5rem;
font-size: 1.5rem;
width: auto;
line-height: 1;
font-family: 'millimetre-bold';
@media screen and (min-width: 576px) {
width: max-content;
font-size: 2rem;
border: 5px solid $colorYellow;
padding: 0.5rem;
font-size: 1.5rem;
width: auto;
line-height: 1;
font-family: 'millimetre-bold';
@media screen and (min-width: 576px) {
// width: max-content;
font-size: 2rem;
}
}
}
}
.data{
}
.data{
margin: 1rem 0rem;
background-color: white;
border: 5px solid $colorYellow;
@@ -33,27 +34,29 @@
text-transform: uppercase;
color: black;
& > * {
font-family: 'universalis-bold';
font-size: 1rem;
line-height: 1.2;
font-family: 'universalis-bold';
font-size: 1rem;
line-height: 1.2;
}
}
footer{
}
footer{
margin-top: 2rem;
h3{
font-family: 'universalis-bold';
font-size: 1.5rem;
line-height: 1.2;
margin-bottom: 0;
font-family: 'universalis-bold';
font-size: 1.5rem;
line-height: 1.2;
margin-bottom: 0;
}
.partager{
figure{
a{
margin-right: 0.5rem;
width: 35px;
height: 35px;
}
figure{
a{
margin-right: 0.5rem;
width: 35px;
height: 35px;
}
}
}
}
}
.other{
margin: 5rem 0;