1076 lines
29 KiB
SCSS

.page-node-type-programme:not(.programme-2){
#programme_toc-block_4{
.view-grouping-header{
display: none;
}
.views-field-view-node{
padding-left: 1rem;
}
}
}
//spec
.programme-883{
.block-region-third{
margin-top: 0% !important;
}
}
.page-node-type-programme.programme-2{
#programme_toc-block_9{
.view-grouping-header{
cursor: pointer;
font-weight: 600;
margin-bottom: .3rem;
}
h3{
font-weight: 600;
text-transform: uppercase;
margin-top: .5rem;
}
.views-field-title{
padding-left: .2rem;
}
.view-grouping{
width: 130%;
}
.view-grouping-content{
background: $col-2;
padding: .5rem 1rem;
display:none;
}
}
}
.page-node-type-programme{
&.programme-2,&.programme-3,&.programme-4{
#programme_toc-block_5{
display: none;
}
}
&.programme-3{
#leaflet-map-view-projets-block-2{
display: none;
}
.main_logo{
margin: 1.5rem 0 1.5rem 0 !important;
}
}
//hide logo in header
#programme_toc-block_7{
display: none;
}
// events
#programme_toc-block_2{
.views-row{
// display: grid;
}
.views-field-field-projet{
.field-content{
font-weight: 600;
}
}
.views-field-title{
margin-left: .3rem;
}
.views-field-field-date{
//grid-row: 1;
margin-left: .3rem;
font-style: italic;
}
}
#programme_toc-block_16{
.views-row{
display: block;
a{
font-family: "duke";
font-size: $font-large;
text-transform: uppercase;
cursor: pointer;
transition: all 250ms;
line-height: 1.1;
margin-bottom: .5rem;
&:hover{
padding: 0 0 0 .3rem;
text-decoration: none;
}
}
}
}
//galerie de la page popsu - top (copy de home)
#programme_toc-block_5{
background-color: white;
.slick-slide{
margin: 0 1rem;
}
.slick-arrow{
position: absolute;
height: 100%;
cursor: pointer;
z-index: 100;
// background-color: white;
opacity: 0.2;
transition: opacity 250ms;
width: 10%;
&:hover{
opacity: .5;
}
}
.slick-track{
height: 40vw;
@include breakpoint(small down) {
height: 100%;
}
}
.slick-slide > div{
height: 100%;
}
.views-row{
height: 100%;
}
.slick-next{
right: 0;
top: 0;
}
.views-row{
display: grid !important;
grid-template-columns: 1fr;
// flex-direction: column;
// flex-direction: column-reverse;
position: relative;
height: auto;
a{
text-decoration: none;
}
}
.programme-1{
.views-field{
background: $col-2 !important;
}
}
.programme-2{
.views-field{
background: $col-2 !important;
}
}
.programme-3{
.views-field{
background: $col-eur !important;
}
}
.programme-4{
.views-field{
background: $col-1;
}
}
.programme-5{
.views-field{
background: $col-mond !important;
}
}
.programme-6{
.views-field{
background: $col-ter !important;
}
}
.programme-7{
.views-field{
background: $col-met !important;
}
}
.programme-878{
.views-field{
background: $col-exode !important;
}
}
.programme-883{
.views-field{
background: $col-transition !important;
}
}
.views-row{
// margin-top: 2rem;
.views-field-field-image{
background: transparent !important;
height: 20rem;
img{
width: 100%;
}
}
.views-field-field-image{
grid-column: 1;
grid-row: auto;
z-index: auto;
grid-column: 1;
grid-row: 1 / span 7;
margin-top: 1rem;
height: 100%;
.field-content{
height: 100%;
width: 100%;
}
}
.views-field-view-node{
visibility: hidden;
}
.views-field:not(.views-field-field-image){
padding-right: .5rem;
padding-left: .5rem;
// padding-bottom: 1rem;
background-color: black;
width: 60%;
margin-left: 30%;
color: white;
align-self: flex-start;
grid-column: 1;
grid-auto-rows: min-content;
font-size: $font-normal;
text-transform: uppercase;
z-index: 0;
}
// .views-field-field-type-evenement{
// grid-row: 4;
// }
.views-field-title{
grid-row: 2;
font-size: $font-big !important;
font-weight: 500;
line-height: 1.2;
padding-top: .3rem;
}
.views-field-field-sous-titre{
grid-row: 5;
padding: .5rem 0 .5rem 0;
}
.views-field-field-type-evenement{
grid-row: 6;
padding-bottom: 1rem;
}
.views-field-field-dates-actu{
grid-row: 4;
}
.views-field-field-date{
grid-row: 3;
}
.views-field-field-programme{
text-transform: uppercase;
grid-row: 1;
font-weight: 500;
padding: .5rem 0 .5rem 0;
}
}
}
#projets-block_2{
position: relative;
.main_logo{
z-index: 10;
height: 7.2rem;
width: 100%;
position: absolute;
// background: red;
// margin: -5rem 0 3rem 0;
top:0;
left: 0;
}
}
&.programme-1{
#node\:field_document .field_document{
background:$col-2;
}
article{
h2,h3,h4,h5,h6,.field_titre{
color: $col-2;
}
}
.main_logo{
//background: center / contain no-repeat url(../../images/POPSU_1.svg);
}
}
&.programme-2{
#node\:field_document .field_document{
background:$col-2;
}
article{
h2,h3,h4,h5,h6,.field_titre{
color: $col-2;
}
}
.main_logo{
//background: center / contain no-repeat url(../../images/POPSU_1.svg);
}
}
&.programme-3{
#node\:field_document .field_document{
background:$col-eur;
}
article{
h2,h3,h4,h5,h6,.field_titre{
color: $col-eur;
}
}
.main_logo{
//background: center / contain no-repeat url(../../images/POPSU_Europe.svg);
}
}
// àmodifer ??
&.programme-4{
#node\:field_document .field_document{
background:$col-1;
}
article{
h2,h3,h4,h5,h6,.field_titre{
color: $col-1;
}
}
.main_logo{
//background: center / contain no-repeat url(../../images/POPSU_2.svg);
}
}
&.programme-5{
#node\:field_document .field_document{
background:$col-mond;
}
article{
h2,h3,h4,h5,h6,.field_titre{
color: $col-mond;
}
}
.main_logo{
//background: center / contain no-repeat url(../../images/POPSU_monde.svg);
}
}
&.programme-6{
#node\:field_document .field_document{
background:$col-ter;
}
article{
h2,h3,h4,h5,h6,.field_titre{
color: $col-ter;
}
}
.main_logo{
//background: center / contain no-repeat url(../../images/POPSU_territoires.svg);
}
}
&.programme-7{
#node\:field_document .field_document{
background:$col-met;
}
article{
h2,h3,h4,h5,h6,.field_titre{
color: $col-met;
}
}
.main_logo{
//background: center / contain no-repeat url(../../images/POPSU_metropoles.svg);
}
}
&.programme-883{
#node\:field_document .field_document{
background:$col-transition;
}
article{
h2,h3,h4,h5,h6,.field_titre{
color: $col-transition;
}
}
}
&.programme-878{
#node\:field_document .field_document{
background:$col-exode;
}
article{
h2,h3,h4,h5,h6,.field_titre{
color: $col-exode;
}
}
}
.layout-content{
position: relative;
}
.layout__region--top{
max-height: 30%;
grid-column: 1 / span 3;
}
.block-region-first{
#programme_toc-block_4{
h3{
display: none;
padding-left: .4rem;
margin-bottom: .4rem;
font-weight: 600;
cursor: pointer;
}
}
@include breakpoint(small down) {
text-align: center;
}
position: absolute;
top: 0;
left: 0;
width: 22%;
padding: 1rem 1.5rem ;
a.prog-palpite-link,
a.prog-ressources-link,
a.prog-exodeurbain-link{
text-transform: uppercase;
font-family: "duke";
font-size: $font-large;
cursor: pointer;
transition: all 250ms;
text-decoration: none;
&:hover{
padding: 0 0 0 .3rem;
}
line-height: 1.1;
display: inline-block;
margin-bottom: 0.5rem;
}
div[id=""] {
@include breakpoint(small down) {
//display: none;
}
}
.views-element-container{
@include breakpoint(small down) {
display: block;
// &:not(:first-child){
// margin-left: 1rem;
// }
}
header{
font-family: "duke";
font-size: $font-large;
text-transform: uppercase;
cursor: pointer;
transition: all 250ms;
line-height: 1.1;
margin-bottom: .5rem;
&:hover{
padding: 0 0 0 .3rem;
}
}
.views-row, .view-grouping{
display: none;
padding: 0 0 0 1.2rem;
margin-bottom: .1rem;
a{
text-decoration: none;
&:hover{
text-decoration: underline;
}
}
}
.views-row{
padding: 0;
}
}
}
.block-region-third{
margin-top: -150%;
z-index: 20;
position: sticky;
top: 1rem;
@include breakpoint(small down) {
margin-top: 1rem;
}
.field_document{
padding: 0.5rem 1rem;
.paragraph{
margin-bottom: 0;
color: white;
display: grid;
grid-template-columns: 25% auto;
}
.field_titre{
font-weight: 600;
}
.field_vignette{
padding: .3rem;
}
.field_document{
padding: 0;
grid-column: 1 / span 2;
padding: .3rem;
}
}
#evenements-block_1, #node\:field_document{
background-color: black;
margin-bottom: 5rem;
margin-top: -5rem;
h2{
color: white;
}
}
.programme-1{
background: $col-1;
}
.programme-2{
background: $col-2;
}
.programme-3{
background: $col-eur;
}
.programme-4{
background: $col-1;
}
.programme-5{
background: $col-mond;
}
.programme-6{
background: $col-ter;
}
.programme-7{
background: $col-met;
}
.programme-878{
background: $col-exode;
}
.views-row{
padding: 0.3rem 0;
&:last-of-type{
margin-bottom: 1rem;
}
}
.views-field{
color: white;
padding: 0 1rem;
font-weight: 500;
// &:last-of-type{
// margin-bottom: 1rem;
// }
.views-field-field-type-de-ressource{
text-transform: uppercase;
margin-bottom: .2rem;
}
.views-field-title{
font-style: italic;
}
.views-field-field-sous-titre{
font-weight: 400;
}
a{
text-decoration: none;
&:hover{
text-decoration: underline;
}
}
}
}
article{
// font-size: $font-small;
//temp hidden
.computed_projets_references, .computed_themes_references, .field_logo{
display: none;
}
// temp ??
h2:first-child{
display: none;
}
.body{
font-size: $font-medium;
height: 20rem;
overflow: hidden;
position: relative;
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease;
footer{
position:absolute;
bottom:0;
left:0;
z-index: 1;
width: 100%;
text-align: center;
a{
display: inline-block;
margin: 0 auto;
background: black;
color: white;
cursor:pointer;
font-family: "trueno";
font-weight: 500;
padding: .3rem .5rem;
font-size: $font-small;
text-decoration: none;
text-transform: uppercase;
&:hover{
color:black;
background: white;
}
}
}
}
.body:after{
pointer-events: none;
content: "";
opacity: 1;
position: absolute;
top: 0; bottom: 0; left: -15px; right: -15px;
box-shadow: inset $bck-col 0 -4rem 2rem;
}
.body_open{
height: auto;
padding: 0 0 3rem 0;
&:after{
opacity: 0;
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease;
}
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease;
}
.field_textes{
.paragraph{
// border-top: 1px solid black;
border-bottom: 3px dotted gray;
padding: 1rem 0;
.field_titre{
font-size: $font-big;
font-weight: 600;
text-transform: initial;
cursor: pointer;
display: grid;
grid-template-columns: 95% 5%;
align-content: center;
// margin-top: 1rem;
}
p{
margin-top: .5rem;
}
.field_titre:after{
content: '';
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease;
align-self: center;
justify-self: center;
}
.rotate:after{
transform: rotate(180deg);
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease;
}
.field_texte{
height: auto;
position: relative;
h2{
text-transform: inherit;
}
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease;
}
.crop{
height: 0;
overflow: hidden;
display: none;
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease;
}
}
}
}
.block-region-bottom{
background: $trame;
>div:last-of-type{
background-color: transparent;
text-align: center;
padding: 1rem;
}
h2{
text-align: center;
}
#centre_de_ressources-block_2{
.slick-slide{
margin: 0 0;
}
.slick-arrow{
position: absolute;
height: 100%;
cursor: pointer;
z-index: 100;
// background-color: white;
opacity: 0.2;
transition: opacity 250ms;
width: 10%;
&:hover{
opacity: .5;
}
}
.slick-next{
right: 0;
top: 0;
}
// .views-field:not(.views-field-field-image){
// width: 80%;
// }
.views-row{
display: grid !important;
grid-template-columns: 1fr 1fr;
align-items: center;
background: white;
position: relative;
height: auto;
padding: 1rem;
background-clip: content-box;
}
.views-field-field-image{
grid-row: 2 / span 6;
z-index: 0;
padding: .5rem;
grid-column: 1;
img{
width: 100%;
height: 100%;
object-fit: contain;
}
}
.views-field:not(.views-field-field-image){
background: transparent;
width: auto;
margin-left: 0;
padding-left: 0;
padding-right: 8%;
}
.views-field-field-sous-titre{
grid-column: 2 / span 1;
}
.views-field-field-auteurs {
grid-row: 3 / span 1;
grid-column: 2 / span 1;
font-weight: 600;
}
.views-field-field-type-de-ressource{
grid-column: 2 / span 1;
}
.views-field-field-edition{
grid-column: 2 / span 1;
}
.views-field-title{
font-weight: 400;
font-style: italic;
grid-row: 4 / span 1;
grid-column: 2 / span 1;
a{
text-decoration: none;
&:hover{
text-decoration: underline;
}
}
}
.views-field-view-node{
// padding-top: 1rem;
// grid-column: 1;
// grid-row: 1;
// grid-row: 2 / span 1;
// grid-column: 2 / span 1;
display: none;
}
.views-field-field-programme,.views-field-title-1{
.field-content{
display: inline-block;
width: auto;
background-color: black;
padding: .3rem .5rem;
}
padding-left: .5rem !important;
grid-row: 1 / span 1;
grid-column: 1 / span 2;
text-transform: uppercase;
margin-top: -.5rem;
.field-content{
font-weight: 600;
display: inline-block;
width: auto;
color: white;
padding: .02rem .3rem;
// margin-bottom: 1rem;
}
}
.programme-1{
.views-field{
color: $col-1 !important;
}
.views-field-field-programme, .views-field-title-1{
.field-content{
background: $col-1 ;
}
}
}
.programme-2{
.views-field{
color: $col-2 !important;
}
.views-field-field-programme, .views-field-title-1{
.field-content{
background: $col-2 ;
}
}
}
.programme-3{
.views-field{
color: $col-eur !important;
}
.views-field-field-programme, .views-field-title-1{
.field-content{
background: $col-eur ;
}
}
}
.programme-4{
.views-field{
color: $col-1;
}
.views-field-field-programme, .views-field-title-1{
.field-content{
background:$col-1 ;
}
}
}
.programme-5{
.views-field{
color: $col-mond !important;
}
.views-field-field-programme, .views-field-title-1{
.field-content{
background: $col-mond ;
}
}
}
.programme-6{
.views-field{
color: $col-ter !important;
}
.views-field-field-programme, .views-field-title-1{
.field-content{
background: $col-ter ;
}
}
}
.programme-7{
.views-field{
color: $col-met !important;
}
.views-field-field-programme, .views-field-title-1{
.field-content{
background: $col-met ;
}
}
}
.programme-878{
.views-field{
color: $col-exode !important;
}
.views-field-field-programme, .views-field-title-1{
.field-content{
background: $col-exode ;
}
}
}
}
}
}
/**********************/
/* EXODE URABAIN SPEC */
/**********************/
.page-node-type-programme.programme-878{
.body{
overflow: auto !important;
height: auto !important;
footer{
display:none;
}
&:after{
display:none;
}
//button
p:last-of-type{
text-align: center;
}
.ext{
display: inline-block;
margin: 0 auto;
background: #000;
color: #fff;
font-family: trueno;
font-weight: 500;
padding: .3rem .7rem;
font-size: .45rem;
text-decoration: none;
text-transform: uppercase;
svg{
display: none;
}
&:hover{
color: #000;
background: #fff;
}
}
}
.field_partenaires{
.field_titre{
font-size: $font-big;
font-weight: 600;
text-transform: initial;
cursor: pointer;
display: grid;
grid-template-columns: 95% 5%;
align-content: center;
border-bottom: 3px dotted gray;
padding: 1rem 0;
}
.field_titre:after{
content: '';
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease;
align-self: center;
justify-self: center;
}
.rotate:after{
transform: rotate(180deg);
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease;
}
.field_texte{
height: auto;
position: relative;
h2{
text-transform: inherit;
}
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease;
}
.field_texte{
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-column-gap: 20px;
margin-top: 1rem;
}
.field_logo_partenaire{
div:first-child{
display: none;
}
grid-column: 1;
grid-row: 1;
img{
max-width: 80%;
}
}
.field_nom_partenaire{
display: none;
div:first-child{
display: none;
}
grid-column: 2;
grid-row: 1;
}
.crop{
height: 0;
overflow: hidden;
display: none;
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease;
}
}
}