detail css

This commit is contained in:
2020-07-20 20:21:08 +02:00
parent edd9e6e68a
commit e60eb9787e
26 changed files with 533 additions and 127 deletions
@@ -1,8 +1,8 @@
#block-popsu-colloque-submenu{
margin: 3rem auto;
ul{
display: flex;
padding: 0;
margin: 0;
li{
margin-right: 1rem;
a{
@@ -7,9 +7,9 @@ header{
}
main:not(.home){
margin-top: 0rem;
padding-top: 0rem;
@media screen and (min-width: 768px) {
margin-top: 5rem!important;
padding-top: 5rem!important;
}
}
@@ -59,12 +59,8 @@ article{
.__head{
div{
& > div{
margin-right: 0.5rem;
// padding: 0 0.5rem;
}
& > div:not(:first-child){
margin-left: 0.5rem;
}
}
}
}
@@ -113,3 +109,14 @@ blockquote{
}
}
}
// page moment
.container{
.__ressources{
section{
.row{
padding: 0rem 0rem 2rem 0rem;
}
}
}
}
@@ -8,9 +8,22 @@
@media screen and (min-width: 768px) {
.__rs{
&:not(.moment){
margin: auto;
& > div{
margin: 0 auto 0.5rem auto;
}
}
}
}
@media screen and (min-width: 992px) {
.__rs{
&.moment{
margin: auto;
& > div{
margin: 0 auto 0.5rem auto;
}
}
}
}
@@ -32,9 +32,6 @@
.head{
display: block;
}
.thumbnails{
margin: 1rem;
}
.flickity-slider{
margin-left: 1rem;
}
@@ -1,13 +1,16 @@
header{
display: none;
}
// thumbnails global
.thumbnails{
width: 100%;
height: auto;
background: white;
margin: 0.5rem 0;
@include shadow;
margin: $gutter1;
&:not(.bibliographie){
@include shadow;
}
figure{
height: 150px;
margin: 0;
@@ -21,7 +24,18 @@ header{
// thumbnails publications
&.publications{
.__media{
padding: 1rem 0 1rem 1rem;
padding: 0.5rem 0 0.5rem 0.5rem;
// .__img{
// height: 150px;
// width: 100%;
// img{
// width: auto;
// height: 100%;
// }
// }
}
.__wrap{
padding: 0.5rem;
}
@media screen and (min-width: 768px) {
width: calc(100% / 2 - #{$gutter1} * 2);
@@ -39,6 +53,15 @@ header{
.__slide{
.thumbnails{
max-width: 380px;
@media screen and (min-width: 768px) {
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);
}
}
}
@@ -59,6 +82,69 @@ header{
}
}
}
// page moment
.__ressources{
.__publications{
.publications{
.__media{
padding: 0.5rem 0 0.5rem 0.5rem;
}
.__wrap{
padding: 0.5rem;
}
@media screen and (min-width: 768px) {
width: calc(100% / 2 - #{$gutter1});
}
@media screen and (min-width: 992px) {
width: calc(100% / 2 - #{$gutter1});
}
@media screen and (min-width: 1200px) {
width: calc(100% / 2 - #{$gutter1});
}
}
}
.__bibliographie{
.thumbnails{
background: transparent;
a{
& > div{
div, span, p{
display: inline;
background: white;
}
}
}
}
}
}
// thumbnails participant
.thumbnails_participants{
figure{
& > div{
width: 100px;
height: 100px;
margin-left: 0.5rem;
img{
border-radius: 50%;
width: 100%;
height: 100%;
object-fit: cover;
}
}
figcaption{
&.__info{
padding: 4rem 0.5rem 0.5rem 0.5rem;
margin-top: -3rem;
background: white;
.__name{
text-transform: uppercase;
}
}
}
}
}
// @media screen and (min-width: 992px) {
// .programme{
// .row{
@@ -193,36 +279,7 @@ header{
// }
// }
//
// .thumbnails_participants{
// figure{
// & > div{
// width: 100px;
// height: 100px;
// margin-left: 0.5rem;
//
// img{
// border-radius: 50%;
// width: 100%;
// height: 100%;
// object-fit: cover;
// }
// }
// figcaption{
// &.__info{
// padding: 4rem 0.5rem 0.5rem 0.5rem;
// margin-top: -3rem;
// background: white;
// .__name{
// text-transform: uppercase;
// }
// .__qualite{
//
// }
// }
// }
// }
// }
//
// article{
// .__publications{
// & > div{
@@ -33,3 +33,20 @@
box-shadow: 0px 0px 13px 0px $color2;
}
}
@mixin shadow_participants{
figure img{
box-shadow: none;
transition: 0.3s transform ease, 0.3s box-shadow ease;
}
figure{
&:hover{
& > div img{
transform: scale(1.05);
transition: 0.3s all ease;
box-shadow: 0px 0px 13px 0px $color2;
}
}
}
}
@@ -155,23 +155,9 @@ a{
}
}
.thumbnails_participants{
*{
color: $color2;
}
.__name{
font-family: 'truenoregular';
font-size: 1rem;
}
.__qualite{
font-family: 'truenoregular';
font-size: 1rem;
font-style: italic;
}
}
// Page programme
.container{
&.programme{
h3{
@@ -182,6 +168,37 @@ a{
}
}
// page publication
article{
&.publications{
.__wrap_content{
.__head{
& *{
color: $color2;
}
.__auteur{
div{
font-family: 'cormorantBold';
font-size: 1.5rem;
}
}
.__titre{
span{
font-family: 'cormorantBoldItalic';
font-size: 1.5rem;
}
}
.__info{
margin: 1rem 0;
div{
font-family: 'cormorantBold';
font-size: 1rem;
}
}
}
}
}
}
.thumbnails{
time, .type_moment{
font-family: 'truenoregular';
@@ -208,6 +225,59 @@ a{
}
}
}
&.bibliographie{
background: transparent;
div,p{
font-family: 'cormorantBold';
font-size: 1.2rem;
}
span{
font-family: 'cormorantBoldItalic';
font-size: 1.2rem;
}
}
}
// page shadow_participants
article{
&.participant_full{
.__auteur{
h2{
font-family: 'truenoregular';
font-size: 2rem;
letter-spacing: normal;
}
}
.status{
div{
font-family: 'truenoregular';
font-style: italic;
font-size: 0.8rem;
text-align: center;
@media screen and (min-width: 768px) {
text-align: left;
}
}
}
}
}
// thumbnails_participants
.thumbnails_participants{
@include shadow_participants;
*{
color: $color2;
}
.__name{
font-family: 'truenoregular';
font-size: 1rem;
}
.__qualite{
font-family: 'truenoregular';
font-size: 0.8rem;
font-style: italic;
}
}
.paragraph--type--role-de-l-intervenant{
@@ -226,7 +296,7 @@ a{
div{
font-family: 'truenoregular';
font-size: 1rem;
text-transform: uppercase;
// text-transform: uppercase;
}
}
}
@@ -5,7 +5,7 @@ $lightgrey: #6f6d7dff;
$fond: #1d378e0d;
$underline:#d2d2ebff;
$gutter1 : 1rem;
$gutter1 : 0.5rem;
$croix_or: '../images/croix_filetsable.svg';