import typo asset, transition boutons, css flickity, champs obligatoire form, media queries section asso, sup de uncat dans wordpress, fail : css form, sou cat burger

This commit is contained in:
Chloe Listrat 2020-06-22 17:51:41 +02:00
parent 0742536fae
commit 20ff0d38cc
4 changed files with 119 additions and 15 deletions

View File

@ -1,5 +1,3 @@
var Home = document.querySelector('.hero .slide');
var flkty = new Flickity( Home, {
// options
@ -25,6 +23,13 @@ for (var i = 0; i < slide_tpsF.length; i++) {
});
}
var Partenaires = document.querySelector('.container_slide .row');
var flkty = new Flickity( Partenaires, {
// options
groupCells: true,
pageDots: false
});
var msnry = new Masonry( '.tableau_engagements.row', {
columnWidth: '.engagement',
itemSelector: '.engagement',
@ -39,7 +44,6 @@ hamburgers.addEventListener("click", function() {
nav.classList.toggle("is-active");
});
var elem = document.querySelector('.grid');
var iso = new Isotope( elem, {
@ -49,8 +53,6 @@ var iso = new Isotope( elem, {
var filtersElem = document.querySelector('.filter-button-group');
filtersElem.addEventListener( 'click', function( event ) {
var filterValue = event.target.getAttribute('data-filter');
iso.arrange({ filter: filterValue });
});

View File

@ -45,9 +45,14 @@ section{
}
/* START KEVIN */
.burger{
position: fixed;
top: 0;
right: 0;
}
.nav-main{
display: none;
position: absolute;
position: fixed;
right: 0;
top: 70px;
background: white;
@ -58,6 +63,21 @@ section{
}
/* END KEVIN */
.menu-item {
font-family: Millimetre, sans-serif;
text-transform: uppercase;
padding: 15px;
}
/*.nav-main li:first-child {display: none;}
.nav-main li:first-child:hover .menu-item ul {display:block;}*/
.menu-item a:hover {
background-color: black;
color: white;
}
.titre_page, .titre {
position: absolute;
top: -100px;
@ -127,7 +147,7 @@ section{
content: "Picto";
position: absolute;
transform: translate(-50%, -50%);
background: grey;
background: black;
border-radius: 50px;
}
@ -152,7 +172,15 @@ section{
background-color: white;
border: 8px solid yellow;
}
@media screen and (min-width: 200px) and (max-width: 640px) {
.image_sectionasso {
display: none;
width: 100%;
}
.content_asso {
width: 100%;
}
}
/* responsive iframe */
#section_MineVideo .wrapper__content {
position: relative;
@ -247,6 +275,28 @@ section{
}
/*fin sections page accueil*/
/*page collecte avec formulaire*/
/*trouver comment styliser les champs du formulaire*/
/*.af-input acf-input{
background-color: pink;
}*/
.af-submit-button{
position: relative;
margin: 50px auto 10px auto;
display:flex;
border: 4px solid black;
border-radius: 0%;
text-align: center;
padding: 5px;
transform: scale(1) rotate(0deg);
transition: transform 0.3s ease;
}
.af-submit-button:hover{
transform: scale(1.1) rotate(-10deg);
transition: all 0.3s ease;
}
/*fin collecte et form*/
/*page évent*/
.titre_event {
@ -363,7 +413,7 @@ section{
border-radius: 0%;
text-align: center;
padding: 5px;
transform: scale(1);
transform: scale(1) rotate(0deg);
transition: transform 0.3s ease;
}
.__bouttons #bouton_asso {
@ -375,7 +425,7 @@ section{
top: -30px;
}
.__bouttons div:hover, .telechargement_plaquette:hover, .bouton_asso:hover, .redirection_page:hover, .tout_voir:hover {
transform: scale(1.1);
transform: scale(1.1) rotate(-10deg);
transition: all 0.3s ease;
}
.group_link {
@ -393,10 +443,44 @@ section{
border: none;
border-radius: 0%;
}
.hero .slide .flickity-button{
.flickity-button {
background: transparent;
}
.flickity-prev-next-button {
width: 100px;
height: 100px;
}
.flickity-button-icon {
fill: white;
}
.flickity-button-icon:hover {
fill: black;
}
.flickity-prev-next-button:hover {
background: transparent;
}
.flickity-button:disabled {
display: none;
}
/*FIN BOUTON*/
/*gestion des dots*/
.flickity-page-dots {
bottom: 0px;
}
.flickity-page-dots .dot {
width: 12px;
height: 12px;
opacity: 1;
background: transparent;
border: 2px solid white;
}
.flickity-page-dots .dot.is-selected {
background: white;
}
/*fin gestion des dots*/
footer{
background-color: rgba(240, 240, 240, 240);
width: 100%;
@ -413,6 +497,24 @@ footer img {
._rs{
margin-left: 5%;
}
.container_slide .row {
width: 100%;
height: 200px;
margin-right: 10px;
background: #333;
}
.container_slide .row .flickity-prev-next-button{
width: 50px;
height: 50px;
}
.container_slide .row li {
width: 100%;
height: 200px;
margin-right: 10px;
background: #8C8;
border-radius: 5px;
counter-increment: carousel-cell;
}
/* START KEVIN */
header{
@ -441,12 +543,12 @@ footer img {
height: 100%;
object-fit: cover;
}
.hero .slide .flickity-page-dots{
/*.hero .slide .flickity-page-dots{
bottom: 20px;
}
.hero .slide .flickity-page-dots li{
background: white;
}
}*/
.hero .__head{
width: 100%;
text-align: center;

View File

@ -14,7 +14,7 @@
{% endfor %}
<div class="btn tout_voir">
<a href="{{agenda.url}}">Tout voir</a>
<a href="/agenda">Tout voir</a>
</div>
</div>
</div>

View File

@ -36,7 +36,7 @@
<div class="partenaires row-">
<div class="_titre">{{options.titre}}</div>
<div class="logo_partenaires">
<div class="container d-flex">
<div class="container_slide d-flex">
<div class="row justify-content align-items">
{% for partner in options.partenaire %}
<ul><li><a href="{{partner.lien_site_partenaire}}"><img src="{{ Image(partner.logo).src }}" /></li></ul></a>