fix title other single

This commit is contained in:
Kevin Tessier 2020-09-15 17:11:58 +02:00
parent dedd9459e3
commit 8201a3170c
38 changed files with 527 additions and 87 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1,6 +1,6 @@
function slides() {
var Home = $('.accueil .hero .main-carousel');
$('.main-carousel').flickity({
$('body:not(.les-temps-forts) .main-carousel').flickity({
cellAlign: 'left',
autoPlay: true,
prevNextButtons: false,
@ -25,17 +25,16 @@ function slides() {
// })
// }
// var slide_tpsF = document.querySelectorAll('.tpsF .slide');
// if (slide_tpsF != null) {
// for (var i = 0; i < slide_tpsF.length; i++) {
// var flkty = new Flickity( slide_tpsF[i], {
// // options
// cellAlign: 'left',
// autoPlay: true,
// pageDots: false
// });
// }
// }
var slide_tpsF = document.querySelectorAll('.tpsF .main-carousel');
if (slide_tpsF != null) {
for (var i = 0; i < slide_tpsF.length; i++) {
var flkty = new Flickity( slide_tpsF[i], {
cellAlign: 'left',
autoPlay: true,
pageDots: false
});
}
}
// var Partenaires = document.querySelector('.container_slide ul');
// if (Partenaires != null) {

View File

@ -1,17 +1,17 @@
.la-collecte{
aside{
form{
border: 5px solid black;
border: 5px solid $colorPink;
padding: 1rem;
.acf-form-submit{
text-align: center;
button {
padding: 0.5rem 1rem;
border: 1px solid black;
border: 5px solid $colorPink;
background: white;
&:hover{
color: white;
background: black;
background: $colorPink;
transition: all 0.3s ease;
}
}
@ -20,8 +20,8 @@
display: none!important;
}
input{
border: 0px solid black!important;
border-bottom: 1px solid black!important;
border: 0px solid $colorPink!important;
border-bottom: 1px solid $colorPink!important;
}
}
}

View File

@ -87,6 +87,12 @@ header{
overflow: auto;
& > ul{
padding-top: calc( #{$widthburger} + #{$padTopNav} + 1rem );
& > li{
font-size: 1rem;
line-height: 1;
font-family: 'millimetre-regular';
text-transform: uppercase;
}
li{
text-align: center;
a{

View File

@ -26,8 +26,9 @@
color: $colorWhite;
h1{
text-transform: uppercase;
font-size: 2rem;
font-size: 3rem;
line-height: 1.2;
font-family: 'millimetre-regular';
}
h2{
font-size: 1.5rem;

View File

@ -2,3 +2,4 @@
@import "thumbnails.scss";
@import "hero.scss";
@import "forms.scss";
@import "_title-page.scss";

View File

@ -0,0 +1,38 @@
.thumbnails{
a{
display: block;
text-decoration: none;
}
margin-bottom: 2rem;
.wrap_content{
display: flex;
flex-direction: column;
justify-content: center;
margin-top: -6rem;
h5{
font-family: 'universalis-bold';
font-size: 1.25rem;
line-height: 1;
text-transform: uppercase;
}
.date{
& > * {
font-family: 'universalis-regular';
font-size: 1rem;
line-height: 1;
}
}
.places{
padding-top: 0.5rem;
font-family: 'universalis-regular';
font-size: 1rem;
line-height: 1;
text-transform: uppercase;
}
}
&:hover {
.wrap_content{
margin-top: -7rem;
}
}
}

View File

@ -0,0 +1,26 @@
.title_page{
margin-bottom: 1rem;
h2{
width: max-content;
padding: 0.5rem;
text-transform: uppercase;
width: max-content;
display: inline-block;
padding: 0.5rem 1.5rem;
z-index: 999;
left: -0rem;
background: white;
position: relative;
margin-bottom: 2rem;
transform: translateX(0%) rotate(-15deg);
font-family: 'millimetre-bold';
font-size: 1.875rem;
line-height: 1;
@media screen and (min-width: 576px) {
transform: translateX(0%) rotate(-15deg);
}
@media screen and (min-width: 1200px) {
transform: translateX(-50%) rotate(-15deg);
}
}
}

View File

@ -0,0 +1,38 @@
$millimetre-font-path: "../fonts/millimetre";
@font-face {
font-family: 'millimetre-bold';
src: url('#{$millimetre-font-path}/millimetre-bold-webfont.woff2') format('woff2'),
url('#{$millimetre-font-path}/millimetre-bold-webfont.woff') format('woff');
font-weight: bold;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'millimetre-regular';
src: url('#{$millimetre-font-path}/millimetre-regular-webfont.woff2') format('woff2'),
url('#{$millimetre-font-path}/millimetre-regular-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
font-display: swap;
}
$universalis-font-path: "../fonts/universalis";
@font-face {
font-family: 'universalis-bold';
src: url('#{$universalis-font-path}/universalisadfstd-bold-webfont.woff2') format('woff2'),
url('#{$universalis-font-path}/universalisadfstd-bold-webfont.woff') format('woff');
font-weight: bold;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'universalis-regular';
src: url('#{$universalis-font-path}/UniversalisADFStd-Regular.woff') format('woff');
font-weight: normal;
font-style: normal;
font-display: swap;
}

View File

@ -4,8 +4,10 @@ $colorYellow:#ffcc00;
$colorBlack:black;
$colorBlue:#009ee0ff;
$colorRed:#f51212;
$colorGreen: #26e800ff;
$colorBlack:black;
$colorPurple: #5353e1ff;
$colorPink : #ff56ffff;
$heightLogo: 115px;
$heightLogoHover: 100px;

View File

@ -2,17 +2,31 @@
@import "configs/variables.scss";
@import "configs/mixinsLamine.scss";
@import "configs/mixins.scss";
@import "configs/fonts.scss";
// bootstrap
@import "bootstraps/bootstrap.scss";
@import "bootstraps/bootstrap-reboot.scss";
// flickity
@import "flickity/flickity.min.scss";
.flickity-prev-next-button.previous{
left: 20px;
}
.flickity-prev-next-button.next{
right: 20px;
}
@import "hamburgers/hamburgers.scss";
@import "components/index.scss";
body,html{
font-size: 16px;
line-height: 1.5;
}
// reboot perso
figure{
max-width: 100%;
@ -32,6 +46,16 @@ li,ul,ol{
@include reset-list;
}
p{
font-family: 'universalis-regular';
font-size: 1rem;
line-height: 1.3;
strong{
font-family: 'universalis-bold';
font-size: initial;
line-height: initial;
}
}
#section_MineVideo{
figure{

View File

@ -31,9 +31,11 @@
margin-bottom: 1rem;
margin-left: 1rem;
cursor:pointer;
text-transform: uppercase;
transition: background 0.3s ease, color 0.3s ease;
a{
color: black;
text-transform: inherit;
}
&:hover{
background:black;
@ -65,6 +67,7 @@
.thumbnails{
a{
display: block;
text-decoration: none;
}
margin-bottom: 2rem;
.wrap_content{
@ -73,6 +76,26 @@
justify-content: center;
margin-top: -6rem;
height: 150px;
h5{
font-family: 'universalis-bold';
font-size: 1.25rem;
line-height: 1;
text-transform: uppercase;
}
.date{
& > * {
font-family: 'universalis-regular';
font-size: 1rem;
line-height: 1;
}
}
.places{
padding-top: 0.5rem;
font-family: 'universalis-regular';
font-size: 1rem;
line-height: 1;
text-transform: uppercase;
}
}
&:hover {
.wrap_content{

View File

@ -1,16 +1,53 @@
&.association{
.title_page{
margin-bottom: 1rem;
h2{
border: 5px solid $colorYellow;
width: max-content;
padding: 0.5rem;
text-transform: uppercase;
width: max-content;
display: inline-block;
padding: 0.5rem 1.5rem;
z-index: 999;
left: -0rem;
background: white;
position: relative;
margin-bottom: 2rem;
transform: translateX(0%) rotate(-15deg);
@media screen and (min-width: 576px) {
transform: translateX(0%) rotate(-15deg);
}
@media screen and (min-width: 1200px) {
transform: translateX(-50%) rotate(-15deg);
}
}
}
aside{
height: 100%;
header{
h3{
font-size: 1rem;
}
}
& > .wrapper{
border:5px solid $colorYellow;
padding: 1rem 2rem;
}
.__content{
a{
color: $colorBlack;
text-decoration: none;
}
}
#bouton_asso{
margin: 2rem 0;
text-align: center;
a{
padding: 0.5rem 1rem;
border:5px solid $colorYellow;
color: $colorBlack;
text-decoration: none;
}
}
}

View File

@ -1,9 +1,19 @@
&.la-benevole-zone{
.title_page{
h2{
border: 5px solid $colorPurple;
}
}
main{
aside{
margin-bottom: 2rem;
.__content{
padding: 1rem;
border: 5px solid black;
border: 5px solid $colorPurple;
text-align: center;
@media screen and (min-width: 768px) {
text-align: left;
}
}
.__bouttons{
& > div{
@ -14,18 +24,22 @@
width: max-content;
margin: auto;
padding: 0.5rem 1em;
border: 2px solid black;
border: 5px solid $colorPurple;
color: black;
background: white;
&:hover{
color: white;
background: black;
background: $colorPurple;
transition: all 0.3s ease;
}
}
}
}
}
.__header{
h3{
text-align: center;
}
}
}
}

View File

@ -23,6 +23,9 @@
position: relative;
margin-bottom: 2rem;
transform: translateX(0%) rotate(-15deg);
font-family: 'millimetre-bold';
font-size: 2rem;
line-height: 1;
@media screen and (min-width: 576px) {
transform: translateX(0%) rotate(-15deg);
}
@ -144,6 +147,8 @@
display: flex;
align-items: flex-end;
justify-content: center;
font-family: 'millimetre-regular';
font-size: 1.875rem;
}
& > div{
border:10px solid $colorRed;
@ -152,7 +157,9 @@
h4{
font-size: 1rem;
line-height: 1.2;
color: $colorRed;
color: $colorBlack;
font-family: 'universalis-bold';
margin-bottom: 0;
}
& > div{
p{
@ -162,9 +169,6 @@
}
}
}
&:not(:last-of-type){
// margin-bottom: 2rem;
}
}
}
&#section_tpsF{
@ -182,18 +186,26 @@
}
}
}
h3{
color: $colorBlue;
font-size: 1.5rem;
line-height: 1.2;
}
article{
height: auto;
h3{
color: $colorBlue;
font-size: 1.875rem;
line-height: 1;
font-family: 'millimetre-regular';
text-transform: uppercase;
}
}
.content{
font-family: 'universalis-regular';
color: $colorBlue;
font-size: 1rem;
line-height: 1.2;
}
.date{
margin: 1rem;
span{
font-family: 'universalis-regular';
display: block;
color: $colorBlue;
font-size: 1rem;
@ -213,7 +225,6 @@
}
}
}
}
&#section_MineVideo{
.container-fluid{

View File

@ -4,6 +4,7 @@
@import "privatiser-lespace";
@import "les-projets";
@import "les-temps-forts";
@import "la-collecte";
@import "single";
@import "association";

View File

@ -0,0 +1,15 @@
&.la-collecte{
.title_page{
h2{
border: 5px solid $colorPink;
}
}
aside{
margin-bottom: 3rem;
header{
h3{
text-align: center;
}
}
}
}

View File

@ -1,4 +1,26 @@
&.les-projets{
h2{
border: 5px solid $colorRed;
width: max-content;
padding: 0.5rem;
text-transform: uppercase;
width: max-content;
display: inline-block;
padding: 0.5rem 1.5rem;
z-index: 999;
left: -0rem;
background: white;
position: relative;
margin-bottom: 2rem;
transform: translateX(0%) rotate(-15deg);
@media screen and (min-width: 576px) {
transform: translateX(0%) rotate(-15deg);
}
@media screen and (min-width: 1200px) {
transform: translateX(-50%) rotate(-15deg);
}
}
article{
margin: 5rem 0;
header{
@ -6,10 +28,11 @@
h3{
text-align: center;
text-transform: uppercase;
color: $colorRed;
}
& > div{
padding: 2.5rem 3rem;
border:5px solid black;
border:5px solid $colorRed;
p{
margin: 0;
}

View File

@ -1,4 +1,28 @@
&.les-temps-forts{
.title_page{
margin-bottom: 1rem;
h2{
border: 5px solid $colorBlue;
width: max-content;
padding: 0.5rem;
text-transform: uppercase;
width: max-content;
display: inline-block;
padding: 0.5rem 1.5rem;
z-index: 999;
left: -0rem;
background: white;
position: relative;
margin-bottom: 2rem;
transform: translateX(0%) rotate(-15deg);
@media screen and (min-width: 576px) {
transform: translateX(0%) rotate(-15deg);
}
@media screen and (min-width: 1200px) {
transform: translateX(-50%) rotate(-15deg);
}
}
}
.img{
width: 100%;
height: 400px;

View File

@ -1,20 +1,32 @@
&.privatiser-lespace{
.title_page{
h2{
border: 5px solid $colorGreen;
}
}
main{
.main-carousel{
@include full-width;
}
.__organisation{
margin-top:5rem;
}
article{
margin-bottom: 2rem;
h5{
text-align: center;
text-transform: uppercase;
color: $colorGreen;
}
.__item{
border: 5px solid green;
border: 5px solid $colorGreen;
padding: 0.8rem;
}
}
.btn{
margin-top: 2rem;
border: 1px solid black;
// margin-top: 2rem;
border: 5px solid black;
padding: 0.5rem 1rem;
border-radius: 0px;
color: black;
@ -40,10 +52,20 @@
height: 100%;
object-fit: cover;
}
&.is-selected .legendes{
opacity: 1;
-webkit-transform: translateX(0px);
-ms-transform: translateX(0px);
transform: translateX(0px);
-webkit-transition: all 1.3s;
-o-transition: all 1.3s;
transition: all 1.3s;
}
figcaption{
left: 50%;
transform: translateX(-50%);
border: 5px solid green;
border: 5px solid $colorGreen;
position: absolute;
bottom: 2rem;
background: white;
@ -55,6 +77,16 @@
p:last-of-type{
margin-bottom: 0;
}
&.legendes{
opacity: 0;
-webkit-transform: translateX(50px);
-ms-transform: translateX(50px);
transform: translateX(50px);
-webkit-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}
}
}
}

View File

@ -3,8 +3,11 @@
margin-bottom: 2rem;
a{
display: inline-block;
font-size: 1rem;
line-height: 1;
transform: translateX(-50%);
color: black;
font-family: 'universalis-bold';
}
}
header{
@ -12,12 +15,31 @@
border: 5px solid $colorYellow;
padding: 0.5rem;
width: max-content;
font-size: 2rem;
line-height: 1;
font-family: 'millimetre-bold';
}
}
.data{
margin: 1rem 0rem;
background-color: white;
border: 5px solid $colorYellow;
padding: 1em;
text-transform: uppercase;
color: black;
& > * {
font-family: 'universalis-bold';
font-size: 1rem;
line-height: 1.2;
}
}
footer{
h3{
font-family: 'universalis-bold';
font-size: 1.5rem;
line-height: 1.2;
margin-bottom: 0;
}
.partager{
figure{
a{
@ -56,6 +78,7 @@
min-height: 450px;
a{
display: block;
text-decoration: none;
}
margin-bottom: 2rem;
.wrap_content{

View File

@ -5,15 +5,14 @@
<section class="row">
<aside class="sidebar_left col-md-4 mr-2">
<aside class="sidebar_left col-12 col-md-12 col-lg-4">
<div class="wrapper">
{% include '/components/sider_left.twig' with { name__template : 'association' } %}
</div>
{% include '/components/buttons/bouton_asso.html.twig' %}
</aside>
<section class="wrapper__content col-md-7">
<section class="wrapper__content col-12 col-md-12 col-lg-8">
<article class="wrap__content __asso">
<header>

View File

@ -1,7 +1,9 @@
{% if name == 'other' %}
{% set cat = post.categories|first.slug %}
{% set title = item.post_title %}
{% else %}
{% set cat = item.categories|first.slug %}
{% set title = item.title %}
{% endif %}
<article class="thumbnails col-12 col-md-6 col-lg-4 {{cat}}">
@ -13,7 +15,7 @@
</figure>
<div class="wrap_content">
<h5>{{item.title}}</h5>
<h5>{{title}}</h5>
<div class="content">
<div class="date">
{% set start = item.informations_debut_event|date("Ydj") %}

View File

@ -1,5 +1,3 @@
<section class="title_page">
<div class="{{class}}">
<h2 class="titre_page">{{post.title}}</h2>
</div>
</section>

View File

@ -5,11 +5,11 @@
<section class="row">
<aside class="sidebar_left col-12 col-md-12 col-lg-6 col-xl-4">
<aside class="sidebar_left col-12 col-md-6 col-lg-6 col-xl-4">
{% include 'components/sider_left.twig' with { name__template : 'benevole' } %}
</aside>
<article class="wrapper__content col-12 col-md-12 col-lg-6 col-xl-8">
<article class="wrapper__content col-12 col-md-6 col-lg-6 col-xl-8">
<div class="wrap__content">
<header>

View File

@ -13,7 +13,7 @@
{% include 'components/forms/form_lacollecte.twig' %}
</aside>
<article class="wrapper__content col-12 col-md-12 col-lg-6 col-xl-8">
<article class="wrapper__content col-12 col-md-6 col-lg-6 col-xl-8">
<div class="wrap__content">
<header class="__header">
<h2 class="__chapeau">{{ post.meta('texte_chapeau') }}</h2>

View File

@ -37,7 +37,7 @@
<div class="wrap__content __organisation">
<div class="__body row">
{% for item in post.meta('type_organisation') %}
<article class="__content _orga col-lg-4">
<article class="__content _orga col-12 col-lg-6 col-xl-4">
<div class="title">
<h5>{{ item.titre_bloc}}</h5>
</div>

View File

@ -104,7 +104,6 @@
</figure>
</div>
</footer>
</div>
</article>
</section>