page programme

This commit is contained in:
2020-07-20 14:46:38 +02:00
parent 72d68fb74e
commit edd9e6e68a
7 changed files with 401 additions and 381 deletions
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -6,17 +6,13 @@ header{
background: white; background: white;
} }
main:not(.home){
margin-top: 0rem;
@media screen and (min-width: 768px) { @media screen and (min-width: 768px) {
main:not(.home){
margin-top: 5rem!important; margin-top: 5rem!important;
} }
} }
main:not(.home){
margin-top: 0rem;
}
img{ img{
width:100%; width:100%;
height: 100%; height: 100%;
@@ -94,28 +90,25 @@ blockquote{
} }
} }
// page programme
.container{ .container{
&.programme{ &.programme{
margin-top: 3rem; padding-top: 3rem;
h3{ h3{
margin: 0; margin: 0.5rem 0;
} }
.views{ .views{
section{ section{
& > div{ margin: 1rem 0;
margin-bottom: 3rem; .row{
padding: 2rem 0;
} }
&:not(:last-child){ &:not(:last-child){
@include croix_or; @include croix_or;
margin: 0 0 2rem 0;
& > .d-flex{ & > .d-flex{
padding: 0 0 2rem 0; padding: 0 0 2rem 0;
} }
} }
&:last-child{
margin-bottom: 5rem ;
}
} }
} }
} }
@@ -1,278 +1,377 @@
.thumbnails{ header{
margin: 1rem 0rem; display: none;
// max-width: 300px; }
min-width: 250px; // thumbnails global
height: auto; .thumbnails{
width: calc(100% / 4 ); width: 100%;
background: white; height: auto;
transform: scale(1); background: white;
@include shadow; margin: 0.5rem 0;
a{ @include shadow;
display: block; figure{
height: 100%; height: 150px;
}
.__content{
margin-top: 1rem;
}
.d-flex{
// padding: 1rem;
}
&.programme{
.__wrap{
padding: 1rem;
}
}
&.publications{
width: 100%;
.__media{
padding: 1rem;
figure{
height: 100%;
img{
width: 100%;
height: 100%;
object-fit: cover;
}
}
}
.__content{
margin: 1rem 1rem 1rem 0;
}
}
}
.thumbnails{
figure{
height: 120px;
margin: 0;
img{
width: 100%;
height: 100%;
object-fit: cover;
}
}
}
.programme{
.row{
margin: 0; margin: 0;
} }
.thumbnails{ .__wrap{
width: 100%; padding: 1rem;
margin: 0; & > .d-flex{
figure{ margin-bottom: 0.5rem;
height: 250px;
} }
} }
} // thumbnails publications
&.publications{
.__media{
@media screen and (min-width: 768px) { padding: 1rem 0 1rem 1rem;
.thumbnails{ }
&.publications{ @media screen and (min-width: 768px) {
width: calc(100% / 2 - #{$gutter1} * 2); width: calc(100% / 2 - #{$gutter1} * 2);
} }
@media screen and (min-width: 992px) {
width: calc(100% / 3 - #{$gutter1} * 2);
}
@media screen and (min-width: 1200px) {
width: calc(100% / 4 - #{$gutter1} * 2);
}
} }
} }
@media screen and (min-width: 992px) {
.programme{ // thumbnails slides
.row{ .__slide{
margin: $gutter1 calc(-#{$gutter1});
}
.thumbnails{
width: calc( 50% - #{$gutter1} * 2);
margin: 0 $gutter1;
figure{
height: 250px;
}
}
}
.thumbnails{ .thumbnails{
&.publications{ max-width: 380px;
width: calc(100% / 4 - #{$gutter1} * 4);
}
} }
} }
.thumbnails_participants{ // Page programme
figure{ .container{
& > div{ &.programme{
width: 100px; .thumbnails{
height: 100px; @media screen and (min-width: 768px) {
margin-left: 0.5rem; width: calc(100% / 2 - #{$gutter1} * 2);
margin: 0.5rem;
img{
border-radius: 50%;
width: 100%;
height: 100%;
object-fit: cover;
} }
} @media screen and (min-width: 992px) {
figcaption{ width: calc(100% / 3 - #{$gutter1} * 2);
&.__info{
padding: 4rem 0.5rem 0.5rem 0.5rem;
margin-top: -3rem;
background: white;
.__name{
text-transform: uppercase;
}
.__qualite{
}
} }
// @media screen and (min-width: 1200px) {
// width: calc(100% / 4 - #{$gutter1} * 2);
// }
} }
} }
} }
// @media screen and (min-width: 992px) {
// .programme{
// .row{
// margin: $gutter1 calc(-#{$gutter1});
// }
// .thumbnails{
// width: calc( 50% - #{$gutter1} * 2);
// margin: 0 $gutter1;
// }
// }
// .thumbnails{
// &.publications{
// width: calc(100% / 4 - #{$gutter1} * 4);
// }
// }
// }
article{ // .thumbnails{
.__publications{ // margin: 1rem 0rem;
& > div{ // // max-width: 300px;
article{ // min-width: 250px;
width: 100%; // height: auto;
@include shadow; // width: calc(100% / 4 );
figure{ // background: white;
padding: 1rem; // transform: scale(1);
.__media{ // @include shadow;
margin-right: 1rem; // a{
} // display: block;
figcaption { // height: 100%;
width: 80%; // }
} // .__content{
} // margin-top: 1rem;
} // }
} // &.programme{
} // .__wrap{
.__bibliographie{ // padding: 1rem;
& > div{ // }
article{ // }
width: 100%; // &.publications{
a{ // width: 100%;
& > div { // .__media{
p, span, div{ // padding: 1rem;
display: inline; // figure{
background: white; // height: 100%;
} // img{
} // width: 100%;
} // height: 100%;
} // object-fit: cover;
} // }
} // }
} // }
// .__content{
// margin: 1rem 1rem 1rem 0;
// }
// }
// }
//
// .thumbnails{
// figure{
// height: 120px;
// margin: 0;
// img{
// width: 100%;
// height: 100%;
// object-fit: cover;
// }
// }
// }
//
// .programme{
// .row{
// margin: 0;
// }
// .thumbnails{
// width: 100%;
// margin: 0;
// figure{
// height: 150px;
// }
// }
// }
//
//
.container { //
&.publications{ //
section{ // .container {
article{ // &.programme{
width: 100%; // .views{
@include shadow; // section{
figure{ // .row{
padding: 1rem; // margin: 1rem 0;
.__media{ // }
margin-right: 1rem; // }
} // }
figcaption { // .thumbnails{
width: 80%; // width: 100%;
} // margin: 1rem 0;
} // }
} // }
} // @media screen and (min-width: 768px) {
} // &.programme{
&.bilbiographie{ // .row{
article{ // .thumbnails{
width: 100%; // width: calc( 50% - #{$gutter1} * 2);
a{ // // min-width: calc( 50% - #{$gutter1} * 2);
& > div { // margin: 0 $gutter1;
p, span, div{ // }
display: inline; // }
background: white; // }
} // }
} // @media screen and (min-width: 992px) {
} // &.programme{
} // .row{
} // .thumbnails{
} // width: calc( (100% / 3) - #{$gutter1} * 3);
// // min-width: calc( 50% - #{$gutter1} * 2);
@media screen and (min-width: 992px) { // margin: 0 $gutter1;
article{ // }
.__publications{ // }
& > div{ // }
margin: 0 calc(-#{$gutter1}); // }
article{ // @media screen and (min-width: 1200px) {
width: calc( 50% - #{$gutter1} * 2); // &.programme{
margin: 0 $gutter1; // .row{
@include shadow; // .thumbnails{
figure{ // width: calc( (100% / 4) - #{$gutter1} * 4);
padding: 1rem; // // min-width: calc( 50% - #{$gutter1} * 2);
.__media{ // margin: 0 $gutter1;
margin-right: 1rem; // }
} // }
figcaption { // }
width: 80%; // }
} //
} // .thumbnails_participants{
} // figure{
} // & > div{
} // width: 100px;
.__bibliographie{ // height: 100px;
& > div{ // margin-left: 0.5rem;
margin: 0 calc(-#{$gutter1}); //
article{ // img{
width: calc( 100% / 3 - #{$gutter1} * 3); // border-radius: 50%;
margin: 0 $gutter1; // width: 100%;
figure{ // height: 100%;
padding: 1rem; // object-fit: cover;
.__media{ // }
margin-right: 1rem; // }
} // figcaption{
figcaption { // &.__info{
width: 80%; // padding: 4rem 0.5rem 0.5rem 0.5rem;
} // margin-top: -3rem;
} // background: white;
} // .__name{
} // text-transform: uppercase;
} // }
} // .__qualite{
//
.container { // }
&.publications{ // }
section{ // }
article{ // }
width: calc( 50% - #{$gutter1} * 2); // }
margin: 0 $gutter1; //
@include shadow; // article{
figure{ // .__publications{
padding: 1rem; // & > div{
.__media{ // article{
margin-right: 1rem; // width: 100%;
} // @include shadow;
figcaption { // figure{
width: 80%; // padding: 1rem;
} // .__media{
} // margin-right: 1rem;
} // }
} // figcaption {
.views{ // width: 80%;
&.__publications{ // }
article{ // }
width: calc( 25% - #{$gutter1} * 4); // }
} // }
} // }
} // .__bibliographie{
} // & > div{
&.bibliographie{ // article{
article{ // width: 100%;
width: calc( 100% / 3 - #{$gutter1} * 3); // a{
margin: 0 $gutter1; // & > div {
figure{ // p, span, div{
padding: 1rem; // display: inline;
.__media{ // background: white;
margin-right: 1rem; // }
} // }
figcaption { // }
width: 80%; // }
} // }
} // }
} // }
} //
} //
} // &.publications{
// section{
// article{
// width: 100%;
// @include shadow;
// figure{
// padding: 1rem;
// .__media{
// margin-right: 1rem;
// }
// figcaption {
// width: 80%;
// }
// }
// }
// }
// }
// &.bilbiographie{
// article{
// width: 100%;
// a{
// & > div {
// p, span, div{
// display: inline;
// background: white;
// }
// }
// }
// }
// }
// }
//
// @media screen and (min-width: 992px) {
// article{
// .__publications{
// & > div{
// margin: 0 calc(-#{$gutter1});
// article{
// width: calc( 50% - #{$gutter1} * 2);
// margin: 0 $gutter1;
// @include shadow;
// figure{
// padding: 1rem;
// .__media{
// margin-right: 1rem;
// }
// figcaption {
// width: 80%;
// }
// }
// }
// }
// }
// .__bibliographie{
// & > div{
// margin: 0 calc(-#{$gutter1});
// article{
// width: calc( 100% / 3 - #{$gutter1} * 3);
// margin: 0 $gutter1;
// figure{
// padding: 1rem;
// .__media{
// margin-right: 1rem;
// }
// figcaption {
// width: 80%;
// }
// }
// }
// }
// }
// }
//
// .container {
// &.publications{
// section{
// article{
// width: calc( 50% - #{$gutter1} * 2);
// margin: 0 $gutter1;
// @include shadow;
// figure{
// padding: 1rem;
// .__media{
// margin-right: 1rem;
// }
// figcaption {
// width: 80%;
// }
// }
// }
// }
// .views{
// &.__publications{
// article{
// width: calc( 25% - #{$gutter1} * 4);
// }
// }
// }
// }
// &.bibliographie{
// article{
// width: calc( 100% / 3 - #{$gutter1} * 3);
// margin: 0 $gutter1;
// figure{
// padding: 1rem;
// .__media{
// margin-right: 1rem;
// }
// figcaption {
// width: 80%;
// }
// }
// }
// }
// }
// }
@@ -127,11 +127,7 @@ blockquote{
font-size: 2.5rem; font-size: 2.5rem;
line-height: 3rem; line-height: 3rem;
font-weight: lighter; font-weight: lighter;
} @media screen and (min-width: 768px) {
}
@media screen and (min-width: 768px) {
blockquote{
p{
font-size: 3rem; font-size: 3rem;
line-height: 3.5rem; line-height: 3.5rem;
} }
@@ -174,12 +170,15 @@ a{
} }
} }
// Page programme
.container{
.programme{ &.programme{
h3{ h3{
font-size: 1.5rem; font-size: 1.5rem;
font-family: 'truenoregular'; font-family: 'truenoregular';
color: $col_black;
}
} }
} }
@@ -2,7 +2,7 @@
{{fields.field_image.content}} {{fields.field_image.content}}
</figure> </figure>
<div class="__wrap"> <div class="__wrap">
<div class="d-flex m-0"> <div class="d-flex">
<time datetime="{{fields.field_heure_du_moment.content}}" class="__date mr-1"> <time datetime="{{fields.field_heure_du_moment.content}}" class="__date mr-1">
{{fields.field_heure_du_moment.content}} {{fields.field_heure_du_moment.content}}
</time> </time>
@@ -25,12 +25,12 @@
{% endif %} {% endif %}
<div class="row justify-content-end"> <div class="row justify-content-end">
{% if rows[0] %} {% if rows[0] %}
<div class="__wrap_side col-sm-12 col-md-1 p-0 mt-0 mb-3"> <div class="__wrap_side col-sm-12 col-md-1 my-3 my-sm-2">
{% include 'themes/custom/popsu_colloque/template/components/share_rs.html.twig' %} {% include 'themes/custom/popsu_colloque/template/components/share_rs.html.twig' %}
</div> </div>
{% endif %} {% endif %}
<div class="col-sm-12 col-md-11 d-flex "> <div class="col-sm-12 col-md-11 d-flex flex-wrap ">
{% for row in rows %} {% for row in rows %}
{% {%
set row_classes = [ set row_classes = [