2021-08-20 12:27:02 +02:00

655 lines
10 KiB
SCSS

// .slick-list{
// }
.path-frontpage{
.block-region-content{
display: grid;
grid-template-columns: repeat(3, minmax(0,1fr));
align-items: center;
.views-element-container{
grid-column: 1 / span 3;
// overflow: hidden;
}
}
}
.last-news, .last-ressources{
.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-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;
}
}
}
.last-news .programme-1{
.views-field:not(.views-field-field-image){
background: $col-1 !important;
}
}
.last-news .programme-2{
.views-field:not(.views-field-field-image){
background: $col-2 !important;
}
}
.last-news .programme-3{
.views-field:not(.views-field-field-image){
background: $col-eur !important;
}
}
.last-news .programme-4{
.views-field:not(.views-field-field-image){
background: black;
}
}
.last-news .programme-5{
.views-field:not(.views-field-field-image){
background: $col-mond !important;
}
}
.last-news .programme-6{
.views-field:not(.views-field-field-image){
background: $col-ter !important;
}
}
.last-news .programme-7{
.views-field:not(.views-field-field-image){
background: $col-met !important;
}
}
.last-news{
margin-top: 2rem;
.views-field-field-image{
height: 20rem;
img{
width: 100%;
}
}
.views-field-field-image{
grid-column: 1;
grid-row: auto;
z-index: -1;
margin-top: -15%;
}
.views-field:not(.views-field-field-image){
padding-right: .5rem;
padding-left: .5rem;
background-color: black;
width: 90%;
margin-left: 1rem;
color: white;
align-self: flex-start;
grid-column: 1;
grid-auto-rows: min-content;
font-size: $font-normal;
text-transform: uppercase;
}
// .views-field-field-type-evenement{
// grid-row: 4;
// }
.views-field-title{
// grid-row: 5;
font-size: $font-big !important;
font-weight: 500;
line-height: 1.2;
padding-top: .3rem;
}
.views-field-field-sous-titre{
padding: .5rem 0 1rem 0;
}
.views-field-field-programme{
text-transform: uppercase;
grid-row: 1;
font-weight: 500;
padding: .5rem 0 .5rem 0;
}
}
.last-ressources{
.views-field{
color: black;
}
.views-field-field-image{
grid-column: 1;
grid-row: 1 / span 4;
z-index: -1;
// padding-top: 1rem;
}
.views-field:not(.views-field-field-image){
background: black;
width: 50%;
margin-left: 1rem;
padding-left: 1rem;
color: white;
}
.views-field-title-1, .views-field-title{
padding-bottom: 1rem;
grid-column: 2;
grid-row: 3;
font-weight: 600;
}
.views-field-view-node{
// padding-top: 1rem;
// grid-column: 1;
// grid-row: 1;
grid-row: 4 / span 1;
grid-column: 2 / span 1;
margin-bottom: 1rem;
}
.views-field-field-programme{
text-transform: uppercase;
grid-column: 1;
grid-row: 1;
font-weight: 500;
margin-bottom: 1rem;
}
.programme-1{
.views-field{
color: $col-1 !important;
}
.views-field-field-programme{
.field-content{
background: $col-1 ;
}
}
}
.programme-2{
.views-field{
color: $col-2 !important;
}
.views-field-field-programme{
.field-content{
background: $col-2 ;
}
}
}
.programme-3{
.views-field{
color: $col-eur !important;
}
.views-field-field-programme{
.field-content{
background: $col-eur ;
}
}
}
.programme-4{
.views-field{
color: black;
}
.views-field-field-programme{
.field-content{
background:black ;
}
}
}
.programme-5{
.views-field{
color: $col-mond !important;
}
.views-field-field-programme{
.field-content{
background: $col-mond ;
}
}
}
.programme-6{
.views-field{
color: $col-ter !important;
}
.views-field-field-programme{
.field-content{
background: $col-ter ;
}
}
}
.programme-7{
.views-field{
color: $col-met !important;
}
.views-field-field-programme{
.field-content{
background: $col-met ;
}
}
}
}
.main_logo{
z-index: 10;
height: 7rem;
position: relative;
// background: red;
background: center / contain no-repeat url(../images/popsu-home-logo.png);
margin: -9% 0 3rem 0 !important;
}
.about{
box-shadow: inset 0 17rem 18rem white;
background: $trame;
font-size: $font-medium;
text-align: center;
padding: 18rem 0 3rem 0;
margin-top: -20rem;
.views-row{
.views-field-title{
font-family: "duke" !important;
font-size: $font-large;
color:black;
font-weight: 400;
a{
text-decoration: none;
}
}
h3{
color: black;
}
div{
margin: 0 5%;
}
.views-field-view-node{
display: inline-block;
margin: 0 auto;
background: black;
color: white;
font-family: "trueno";
font-weight: 500;
padding: .5rem 1.5rem;
font-size: 0.8rem;
a{
text-decoration: none;
&:hover{
text-decoration: underline;
}
}
margin-top: 1rem;
}
}
}
#home_blocks-block_3{
background: $trame;
padding: 2rem;
h2{
text-align: center;
margin: 0 0 1rem 0;
}
.last-ressources{
.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: 3 / span 2;
// margin-top: -1.5rem;
z-index: 0;
padding: .5rem;
}
.views-field:not(.views-field-field-image){
background: transparent;
width: auto;
margin-left: 0;
padding-left: 0;
color: black;
}
.views-field-title-1,.views-field-title{
font-weight: 600;
grid-row: 3 / span 1;
grid-column: 2 / span 1;
}
.views-field-field-programme{
.field-content{
display: inline-block;
width: auto;
padding: .3rem .5rem;
}
.empty {
background-color: black;
height: 1rem;
// &::before{
// content: "POPSU";
// }
}
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;
}
}
}
}
#villes-block_1{
grid-column: 1;
}
#home_themes-block_1{
grid-column: 2;
}
#programmes-block_4{
grid-column: 3;
}
.home_info_container{
height: auto;
min-height: 5rem;
display: none;
grid-column: 1 / span 3;
}
#home_prog_container{
display: grid;
grid-template-columns: repeat( 3, 1fr);
align-items: center;
justify-items: center;
margin-top: 0;
.views-row{
background-clip: content-box;
min-height: 7rem;
width: 100%;
display: grid;
align-items: center;
padding: 1rem;
.views-field:not(.views-field-field-logo){
font-size: $font-medium;
font-weight: 600;
display: none;
}
.views-field-title{
margin-bottom: 1rem;
}
&:hover{
.views-field:not(.views-field-field-logo){
font-weight: 600;
display: block;
color: white;
text-align: center;
a{
text-decoration: none;
}
}
}
.views-field-field-logo{
text-align: center;
}
}
//temp
.views-field-field-diaporama{
display: none;
}
//
.programme-1{
// background: center / 60% no-repeat url(../images/POPSU_1.svg) white;
img{
width: 50%;
}
&:hover{
background: $col-1;
img{
display: none;
}
}
}
.programme-2{
// background: center / 60% no-repeat url(../images/POPSU_2.svg) white;
img{
width: 60%;
}
&:hover{
background: $col-2;
img{
display: none;
}
}
}
.programme-3{
// background: center / 50% no-repeat url(../images/POPSU_Europe.svg) white;
img{
width: 50%;
}
&:hover{
background: $col-eur;
img{
display: none;
}
}
}
.programme-5{
// background: center / 45% no-repeat url(../images/POPSU_monde.svg) white;
img{
width: 45%;
}
&:hover{
background: $col-mond;
img{
display: none;
}
}
}
.programme-6{
// background: center / 60% no-repeat url(../images/POPSU_territoires.svg) white;
img{
width: 60%;
}
&:hover{
background: $col-ter;
img{
display: none;
}
}
}
.programme-7{
// background: center / 60% no-repeat url(../images/POPSU_metropoles.svg) white;
img{
width: 60%;
}
&:hover{
background: $col-met;
img{
display: none;
}
}
}
}
#home_theme_container{
.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-next{
right: 0;
top: 0;
}
.views-row{
background-clip: content-box;
background-color: grey;
// height: 10rem;
width: 100% !important;
position: relative;
}
.views-row:after{
content: "";
display: block;
padding-bottom: 100%;
}
.views-field-title{
display: grid;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 10;
position: absolute;
text-align: center;
align-items: center;
padding: .8rem 1rem;
font-size: $font-medium;
font-weight: 600;
color: white;
a{
margin-top: -.5rem;
text-decoration: none;
}
}
.views-field-field-image:before{
content: "";
display: block;
position: absolute;
background: black;
opacity: .4;
width: 100%;
height: 100%;
}
.views-field-field-image{
top: 0;
left: 0;
width: 100%;
height: 100%;
position: absolute;
.field-content{
display: grid;
// justify-content: center;
// align-items: center;
padding: 0;
overflow: hidden;
width: 100%;
height: 100%;
// a{
// // margin-left: -50%;
img{
height: 100% !important;
width: inherit !important;
max-width: none;
}
// }
}
}
}
#villes-block_1, #home_themes-block_1, #programmes-block_4{
background: $bck-col;
height: 100%;
display: grid;
align-items: center;
header{
text-align: center;
font-family: 'duke';
font-size: 3.1rem;
line-height: 1;
opacity: .3;
cursor:pointer;
padding: .8rem;
.arrow{
font-size: $font-large;
display: block;
margin-top: -1rem;
}
&.active{
opacity: 1;
font-size: 4rem;
}
}
.views-row,.leaflet-container{
display: none;
}
}