iport typo à vérifier, config exportee, reglage forme event, apparition event en bas, css page accueil, thumbnails

This commit is contained in:
Chloe Listrat 2020-06-19 18:00:40 +02:00
parent c49d6fbe1a
commit 3aab5bcbca
14 changed files with 323 additions and 129 deletions

View File

@ -1,9 +1,20 @@
@font-face {
font-family: Universalis ADF Std, sans-serif;
src: url('../fonts/UniversalisADFStd.otf') format('otf'),
url('../fonts/UniversalisADFStd.woff') format('woff');
font-family: Millimetre, sans-serif;
src: url('../fonts/Millimetre.otf') format('OpenType'),
url('../fonts/Millimetre.otf') format('otf'),
url('../fonts/Millimetre.woff') format('woff');
}
body {
width: 300px;
margin: 0 auto;
font-size: 1.2rem;
font-size: 16px;
font-family: Universalis ADF Std, sans-serif;
}
h1, h2, h3, h5{
font-family: Millimetre, sans-serif;
}
@ -25,18 +36,21 @@ a, a:hover{
color: black;
text-decoration: none;
}
section{
position: relative;
}
.titre_page, .titre {
position: absolute;
top: -100px;
left: -70px;
text-transform: uppercase;
font-weight: bold;
text-align: center;
align-items: center;
border: 8px solid blue;
transform: rotate(-10deg);
padding: 1%;
width: 30%;
padding: 0.5rem;
background-color: white;
margin: 4% 0 8% -20%;
}
.titre_1{
@ -47,12 +61,12 @@ a, a:hover{
font-style: italic;
text-transform: uppercase;
}
.sidebar_left .title, .__organisation .title {
.title, .cat {
color: blue;
text-align: center;
text-transform: uppercase;
}
.sidebar_left .__content, .sider_left_form, .__organisation .__item {
.sidebar_left .__content, .sider_left_form, .__organisation .__item, .content_zone {
border: 8px solid blue;
padding: 1em;
}
@ -65,39 +79,155 @@ a, a:hover{
}
/*sections page accueil*/
.item {
margin-top: 50px;
}
.wrap__content_proch {
position: relative;
width: 80%;
padding: 10px;
margin: -50px auto -20px auto;
align-items: center;
text-align: center;
background-color: white;
border: 4px solid black;
}
.colonne_section{
margin-top: 4%;
}
.colonne_section .wrap_content {
border: 8px solid blue;
padding: 1em;
}
.colonne_section h3{
.colonne_section h3 {
color: blue;
text-transform: uppercase;
text-align: center;
}
.image_sectionasso {
position: absolute;
width: 500px;
}
.content_asso {
position: relative;
margin: 150px auto auto 200px;
padding: 10px;
background-color: white;
border: 8px solid yellow;
}
.projet .colonne_section .header{
height: 80px;
display: flex;
align-items: flex-end ;
}
.projet .colonne_section .header h3{
text-align: center;
width: 100%;
}
.item .__img{
width: 100%;
height: 300px;
}
.item img{
width: 100%;
height: 100%;
object-fit: cover;
}
._content_tpsF {
position: relative;
width: 80%;
padding: 10px;
margin: -50px auto -20px auto;
align-items: center;
text-align: center;
background-color: white;
border: 4px solid black;
}
.video iframe {
width: 100vh;
margin-left: auto;
margin-right: auto;
height: auto;
margin: 40px auto 0 auto;
width:100%;
}
/*fin sections page accueil*/
/*page évent*/
.titre_event {
position: absolute;
top: -450px;
left: 18vw;
text-transform: uppercase;
font-weight: bold;
text-align: center;
align-items: center;
border: 8px solid blue;
transform: rotate(-10deg);
padding: 0.5rem;
background-color: white;
}
.voir_aussi {
position: absolute;
top: 1300px;
left: -50px;
text-transform: uppercase;
font-weight: bold;
text-align: center;
align-items: center;
border: 8px solid blue;
transform: rotate(-10deg);
padding: 0.5rem;
background-color: white;
}
.__img_event {
position: relative;
width: 100%;
height: 500px;
top: 50px;
}
.__img_event img{
width: 100%;
height: 100%;
object-fit: cover;
}
.partager img {
width: 50px;
height: auto;
margin-right: 2%;
}
.post-type img {
object-fit: cover;
width: 100%;
.data {
border: 8px solid blue;
padding: 1em;
}
.tarif h3, .partager h3, .inscription h3{
color: blue;
}
.tarif, .partager, .inscription {
margin-top: 4%;
margin-top: 8%;
}
/*fin page event*/
/*page les projets*/
.projet img {
margin: 5% 0 5% 0;
}
._pjt{
margin-top: 8%
}
.cat-list{
align-items: baseline;
}
.cat_name{
margin: 0 4% 0 4%;
}
/*fin page les projets*/
/*privatiser l'espace*/
.legendes{
background-color: white;
@ -109,66 +239,84 @@ a, a:hover{
padding-top: 2%;
}
.__organisation {
margin-top: 8%;
margin-top: 4%;
text-align: center;
}
._orga {
margin-top: 4%;
}
/*fin privatiser l'espace*/
/*BOUTONS*/
.__bouttons{
text-align : center;
}
.telechargement_plaquette {
margin-top: 4%;
border: 4px solid black;
border-radius: 0%;
padding: 1%;
}
.__bouttons div {
margin-top: 4%;
position: relative;
text-align : center;
margin-top: 20px;
border: 4px solid blue;
border-radius: 0%;
padding: 1%;
background-color: white;
padding: 5px;
/*background-color: white;*/
}
.__bouttons div:hover, .telechargement_plaquette:hover, .bouton_asso:hover {
.tout_voir a {
/*penser à mettre le lien sur toute la surface du bouton*/
}
.telechargement_plaquette, .redirection_page, .tout_voir {
position: relative;
margin: 50px auto 10px auto;
display:flex;
border: 4px solid black;
border-radius: 0%;
text-align: center;
padding: 5px;
}
.__bouttons #bouton_asso {
position: relative;
top: 100px;
}
.__bouttons #bouton_contact {
position: relative;
top: -30px;
}
.__bouttons div:hover, .telechargement_plaquette:hover, .bouton_asso:hover, .redirection_page:hover, .tout_voir:hover {
text-decoration-color: white;
transform: rotate(-10deg);
}
.redirection_page {
.group_link {
margin-top: 2%;
width: 100%;
color: black;
text-decoration: underline;
border: none;
border-radius: 0%;
}
.redirection_page:hover {
.group_link:hover, .cat_name:hover {
color: black;
background-color: grey;
text-decoration: underline;
border: none;
border-radius: 0%;
}
/* .tout_voir, .tout_voir:hover {
margin-left: auto;
margin-right: auto;
width: 20%;
}*/
.hero .slide .flickity-button{
}
/*FIN BOUTON*/
footer{
background-color: rgba(255, 0, 0, 0.5);
background-color: rgba(240, 240, 240, 240);
width: 100%;
padding: 5%;
margin: 10% auto 0 auto;
margin-top: 10%;
}
footer div{
margin-right: 1%;
margin-right: 20px;
}
footer img {
width: 50px;
height: auto;
}
._rs{
margin-left: 5%;
}
/* START KEVIN */
header{
@ -213,8 +361,11 @@ footer img {
.wrapper section{
margin: 150px 0;
padding: 100px 0;
}
.wrapper section > div {
position: relative;
}
.tpsF .img{
width: 100%;
height: 400px;

View File

@ -2,16 +2,22 @@
{% block content %}
<section>
<h3 class="titre">Prochainement</h3>
<div class="coming_soon row align-items-start">
{% for item in posts %}
{% include 'components/thumbnails/thumbnails.twig' %}
{% endfor %}
<div class="btn redirection_page">
<a class="tout_voir" href="{{agenda.url}}">Tout voir</a>
<div class="">
<div class="header">
<h3 class="titre">Prochainement</h3>
</div>
<div class="__body">
<div class="coming_soon row align-items-start">
{% for item in posts %}
{% include 'components/thumbnails/thumbnails.twig' %}
{% endfor %}
<div class="btn tout_voir">
<a href="{{agenda.url}}">Tout voir</a>
</div>
</div>
</div>
</div>
</section>
@ -36,7 +42,7 @@
<section id="section_MineVideo">
<div class="video">
<div class="__header">
<h1 class="titre">La Mine en vidéo</h1>
<h3 class="titre">La Mine en vidéo</h3>
</div>
<div class="__body">
<div class="wrapper__content">

View File

@ -4,11 +4,11 @@
<section>
<ul class="cat-list d-flex flex-wrap">
{% for cat in terms %}
<a data-filter=".{{cat.slug}}" href="#">
<li>{{cat.name}}</li>
</a>
<p>|<a data-filter=".{{cat.slug}}" href="#">
<li class="cat_name">{{cat.name}}</li>
</a></p>
{% endfor %}
</ul>
|</ul>
<div class="row align-items-start">
{% for item in posts %}

View File

@ -32,7 +32,7 @@
<div class="tableau_engagements row align-items-start">
{% for item in post.meta('type_engagement') %}
<div class="engagement">
<div class="engagement col-sm"> <!--semble pas marcher (à cause de massonery ?)-->
<div class="__head">
<h4>{{item.titre_engagement}}</h4>
</div>

View File

@ -1,3 +1,4 @@
<div id="bouton_en_savoir">
<a href="{{post.meta('bouton_en_savoir').lien_bouton_en_savoir}}">{{post.meta('bouton_en_savoir').texte_bouton_en_savoir}}</a>
<a href="{{post.meta('bouton_en_savoir').lien_bouton_en_savoir}}">
{{post.meta('bouton_en_savoir').texte_bouton_en_savoir}}</a>
</div>

View File

@ -12,8 +12,8 @@
</div>
</div>
<div class="wrap__content">
<div class="__title"><h2>{{item.titre}}</h2></div>
<div class="wrap__content_proch">
<div class="__title"><h5>{{item.titre}}</h5></div>
<div class="__content">
<div class="__date">
<div class="__day">
@ -22,7 +22,7 @@
{% if start == end %}
<span class="start">
Le <time>{{item.debut_event|date("j l Y") }}</time>
Le <time>{{item.debut_event|date("j F Y") }}</time>
de <time>{{item.debut_event|date("G:i")}}</time>
</span>
<span class="end">
@ -32,12 +32,12 @@
{% else %}
<span class="start">
Du <time>{{item.debut_event|date("j l Y") }}</time>
Du <time>{{item.debut_event|date("j F Y") }}</time>
à <time>{{item.debut_event|date("G:i")}}</time>
</span>
<span class="end">
Au <time>{{item.fin_event|date("j l Y") }}</time>
à <time>{{item.fin_event|date("G:i")}}</time>
<br>Au <time>{{item.fin_event|date("j F Y") }}</time>
à <time>{{item.fin_event|date("G:i")}}</time></br>
</span>
{% endif %}

View File

@ -17,14 +17,18 @@
<div class="collecte">
{{options.texte_collecte }}
</div>
<div class="reseaux_sociaux">
<div class="reseaux_sociaux align-items">
<div class="facebook d-flex">
<a href="{{options.facebook.lien_facebook}}"><img src="{{ Image(options.facebook.logo_facebook).src }}" /></a>
<p>{{options.facebook.texte_facebook}}</p>
<a href="{{options.facebook.lien_facebook}}">
<img src="{{ Image(options.facebook.logo_facebook).src }}" />
</a>
<p class="_rs">{{options.facebook.texte_facebook}}</p>
</div>
<div class="insta d-flex">
<a href="{{options.instagram.lien_instagram}}"><img src="{{ Image(options.instagram.logo_instagram).src }}" /></a>
<p>{{options.instagram.texte_instagram}}</p>
<a href="{{options.instagram.lien_instagram}}">
<img src="{{ Image(options.instagram.logo_instagram).src }}" />
</a>
<p class="_rs">{{options.instagram.texte_instagram}}</p>
</div>
</div>
</div>

View File

@ -9,18 +9,18 @@
<div class="title">
<h3>{{item.title}}</h3>
</div>
<div class="content">
<div class="content_zone">
{{item.text}}
</div>
</div>
<div class="projet row">
{% for projet in item.meta("projets") %}
<div class="wrap_content col-4">
<div class="wrap_content col- col-md-6 col-lg-4">
<div class="img">
<img src="{{ Image(projet.image).src }}" alt="{{ Image(projet.image).title }}">
</div>
<div class="title">
<div class="title _pjt">
{{projet.titre}}
</div>

View File

@ -9,8 +9,8 @@
<div class="title">
<h3>{{item.title}}</h3>
<div class="next_edition">
<p>Prochaine Édition</p>
<time>{{item.next_edition}}</time>
<p>Prochaine Édition : <time>{{item.next_edition|date("F Y") }}</time>
</p>
</div>
</div>
<div class="content">
@ -20,12 +20,16 @@
<div class="wrap_content col-md-8">
<div class="slide">
{% for media in item.meta('slide') %}
<div class="img">
<img src="{{ Image(media.image).src }}" alt="{{ Image(media.image).title }}">
</div>
<div class="video">
<iframe width="560" height="315" src="//www.youtube.com/embed/{{ media.video }}" frameborder="0" allowfullscreen></iframe>
</div>
{% if Image(media.image).src %}
<div class="img">
<img src="{{ Image(media.image).src }}" alt="{{ Image(media.image).title }}">
</div>
{% endif %}
{% if media.video %}
<div class="video">
<iframe width="560" height="315" src="//www.youtube.com/embed/{{ media.video }}" frameborder="0" allowfullscreen></iframe>
</div>
{% endif %}
{% endfor %}
</div>
</div>

View File

@ -7,15 +7,15 @@
<div class="image_sectionasso">
<img src="{{ Image(post.meta('image')).src }}" />
</div>
<div class="content row">
<div class="col-6">
<div class="content_asso row">
<div class="col-md-6">
{{ post.meta('paragraphe_descriptif') }}
</div>
<div class="col-6">
<div class="col-md-6">
{{ post.meta('paragraphe_descriptif_2') }}
<div class="btn redirection_page">
</div>
<div class="btn redirection_page">
{% include 'components/buttons/bouton_ensavoir.html.twig' %}
</div>
</div>
</div>
</div>

View File

@ -10,25 +10,25 @@
<div class="header">
<h3>{{item.title}}</h3>
</div>
<div class="wrap_content">
<div class="wrap_content d-flex flex-wrap">
{{item.text}}
<div class="projet">
{% for projet in item.meta("projets") %}
<div class="wrap__content">
<div class="title">
<!--<div class="wrap__content">
<div class="title_pjt">
<h4>{{projet.titre}}</h4>
</div>
<div class="content">
<div class="content_pjt">
{{projet.text}}
</div>
</div>
</div>--> <!--les titres a utilisé pour faire les patch qui se drag-->
{% endfor %}
</div>
</div>
</div>
{% endfor %}
<div class="btn redirection_page">
<a class="tout_voir" href="{{les-projets.twig.url }}">Tout voir</a>
<div class="btn tout_voir">
<a href="/les-projets">Tout voir</a>
</div>
</div>
</div>

View File

@ -5,25 +5,30 @@
<div class="wrapper__content row">
{% for item in tpsF %}
<div class="colonne_section col-md-6 col-lg-4">
<div class="images">
<img src="{{item.thumbnail.src}}" alt="{{item.thumbnail.title}}">
</div>
<div class="wrap_content">
<div class="item">
<div class="__img">
<img src="{{item.thumbnail.src}}" alt="{{item.thumbnail.title}}">
</div>
<div class="_content_tpsF">
<div class="title">
<h3>{{item.title}}</h3>
<div class="next_edition">
<p>Prochaine Édition</p>
<time>{{item.next_edition}}</time>
<p>Prochaine Édition :
<br><time>{{item.next_edition|date("F Y") }}</time></br>
</p>
</div>
</div>
<div class="content">
{{item.text}}
</div>
</div>
</div>
</div>
{% endfor %}
<div class="btn redirection_page">
<a id="tout_voir" href="">Tout voir</a>
<div class="btn tout_voir">
<a href="/les-temps-forts">Tout voir</a>
</div>
</div>
</div>

View File

@ -4,7 +4,7 @@
{% include 'components/title_page.twig' %}
<section>
<div class="wrapper__content prive">
<div class="wrapper__content">
<div class="wrap__content">
@ -40,7 +40,7 @@
<div class="wrap__content __organisation">
<div class="__body row">
{% for item in post.meta('type_organisation') %}
<div class="__content col-lg-4">
<div class="__content _orga col-lg-4">
<div class="title">
<h5>{{ item.titre_bloc}}</h5>
</div>

View File

@ -2,32 +2,48 @@
{% block content %}
<div class="content-wrapper">
<article class="post-type">
<img src="{{ Image(post.image_event).src |resize(600, 600) }}" />
<section class="article-content">
<div class="titre">
<h2>{{post.titre}}</h2>
<div class="__img_event">
<img src="{{ Image(post.image_event).src }}" />
</div>
<div class="__content">
<div class="__date">
<div class="__day">
<span class="start">
<time><p>du</p>{{post.debut_event}}</time>
</span>
<span class="end">
<time><p>au</p>{{post.fin_event}}</time>
</span>
</div>
</div>
<div class="lieu">{{post.lieu}}</div>
<section class="article-content">
<div class="header">
<h3 class="titre_event">{{post.titre}}</h3>
</div>
<div class="row">
<div class="sidebar_left col-md-4 mr-2">
<div class="cat {{post.category.slug}}">
{{post.category.name}}
<h3>{{post.category.name}}</h3>
</div>
</div>
<div class="article-body">
<p>{{post.description}}</p>
<div class="data">
<div class="__date">
<div class="__day">
{% set start = item.debut_event|date("Ydj") %}
{% set end = item.fin_event|date("Ydj") %}
{% if start == end %}
<span class="start">
Le <time>{{item.debut_event|date("l j F Y") }}</time>
<br>de <time>{{item.debut_event|date("G:i")}}</time>
</span>
<span class="end">
à <time>{{item.fin_event|date("G:i")}}</time></br>
</span>
{% else %}
<span class="start">
Du <time>{{item.debut_event|date("l j F Y") }}</time>
à <time>{{item.debut_event|date("G:i")}}</time>
</span>
<span class="end">
<br>Au <time>{{item.fin_event|date("j l F Y") }}</time></br>
à <time>{{item.fin_event|date("G:i")}}</time>
</span>
{% endif %}
</div>
</div>
<div class="lieu">{{post.lieu}}</div>
</div>
<div class="inscription">
<h2>{{post.titre_inscription}}</h2>
<div class="inscription">
<h3>{{post.titre_inscription}}</h3>
{% for Items in post.meta('inscription') %}
{% for detail in Items.choose %}
{% if detail.acf_fc_layout == 'texte' %}
@ -40,14 +56,13 @@
{% endif %}
{% endfor %}
{% endfor %}
</div>
</div>
<div class="voir_event">
<a href="{{post.meta('voir_evenement_facebook').lien_facebook}}">{{post.meta('voir_evenement_facebook').texte}}</a>
</div>
<div class="partager">
<h2>{{post.titre_partage}}</h2>
<h3>{{post.titre_partage}}</h3>
<a href="{{post.meta('liens_reseaux_sociaux').lien_page_facebook}}">
<img src="{{ Image(post.meta('liens_reseaux_sociaux').logo_facebook).src }}" />
</a>
@ -60,14 +75,22 @@
</div>
<div class="tarif">
<h2>{{post.titre_tarif}}</h2>
<h3>{{post.titre_tarif}}</h3>
<p>{{post.type_tarif}}</p>
</div>
</div>
<div class="wrapper__content col-md-7">
{{ post.meta('description') }}
</div>
</div>
</section>
</article>
</div>
<div class="other-posts">
<div class="header_other">
<h3 class="voir_aussi">Voir aussi</h3>
</div>
<div class="other-posts row">
{% for item in other %}
{% include 'components/thumbnails/thumbnails.twig' %}
{% endfor %}