page ressources slider

This commit is contained in:
armansansd
2021-08-11 12:36:27 +02:00
parent 9b9c9397f4
commit f221420e15
7 changed files with 470 additions and 113 deletions

View File

@@ -220,10 +220,13 @@
}
article{
font-size: $font-small;
// font-size: $font-small;
h2:first-child{
display: none;
}
.body{
font-size: $font-medium;
}
}
.block-region-bottom{
background: $trame;

View File

@@ -1,4 +1,73 @@
.path-centre-de-ressources{
//colo programme
.programme-1{
color: $col-1;
.views-field-field-programme{
.field-content{
background: $col-1;
color:white;
}
}
}
.programme-2{
color: $col-2;
.views-field-field-programme{
.field-content{
background: $col-2;
color:white;
}
}
}
.programme-3{
color: $col-eur;
.views-field-field-programme{
.field-content{
background: $col-eur;
color:white;
}
}
}
.programme-4{
color: $col-met;
.views-field-field-programme{
.field-content{
background: $col-met;
color:white;
}
}
}
.programme-5{
color: $col-mond;
.views-field-field-programme{
.field-content{
background: $col-mond;
color:white;
}
}
}
.programme-6{
color: $col-ter;
.views-field-field-programme{
.field-content{
background: $col-ter;
color:white;
}
}
}
.programme-7{
color: $col-met;
.views-field-field-programme{
.field-content{
background: $col-met;
color:white;
}
}
}
/// end colo
main{
flex: 0 0 100%;
max-width: 100%;
@@ -8,46 +77,148 @@
margin-bottom: 0;
.slick-slide{
margin: 0 1rem;
.views-row{
.views-row:not(.type-74){
display: grid !important;
grid-template-columns: 1fr;
background-color: rgb(255, 255, 255);
// flex-direction: column;
// flex-direction: column-reverse;
position: relative;
height: auto;
.views-field-field-image{
grid-column: 1;
grid-row: 1 / span 4;
z-index: -1;
padding-top: 1rem;
.views-field:not(:first-child){
padding: 0 0 0 .4rem;
}
.views-field:not(.views-field-field-image){
background: blue;
width: 50%;
margin-left: 1rem;
padding-left: 1rem;
.views-field-field-image{
grid-row: 3 / span 2;
margin-top: -1.5rem;
img{
width: 100%;
}
}
.views-field-field-programme{
grid-row: 1 / span 1;
grid-column: 1 / span 2;
.field-content{
font-weight: 600;
display: inline-block;
width: auto;
color: white;
padding: .15rem .3rem;
margin-bottom: 1rem;
}
}
.views-field-title{
padding-bottom: 1rem;
grid-column: 1;
grid-row: 3;
font-weight: 600;
.views-field-field-theme{
.field-content{
color:black;
}
}
.views-field-view-node{
padding-top: 1rem;
grid-column: 1;
grid-row: 1;
}
.views-field-field-programme{
.views-field-field-type-de-ressource{
text-transform: uppercase;
grid-column: 1;
grid-row: 2;
font-weight: 600;
margin-bottom: .5rem;
font-size: $font-small;
grid-row: 2 / span 1;
grid-column: 2 / span 1;
}
.views-field-title{
font-style: italic;
grid-row: 3 / span 1;
grid-column: 2 / span 1;
}
.views-field-field-sous-titre{
margin-bottom: 1rem;
grid-row: 4 / span 1;
grid-column: 2 / span 1;
align-self: baseline;
}
.views-field-field-theme{
grid-row: 5 / span 1;
grid-column: 1 / span 2;
font-size: $font-small;
}
a{
text-decoration: none;
}
}
.type-74{
display: grid !important;
grid-template-columns: 1fr;
grid-auto-rows: min-content;
a{
text-decoration: none;
&:hover{
text-decoration: underline;
}
}
background-color: rgb(255, 255, 255);
// background-clip: content-box;
width: 100% !important;
padding: .3rem;
.views-field:not(:first-child){
padding: 0 0 0 .4rem;
}
.views-field-field-image{
grid-row: 2;
img{
width: 80%;
}
// margin-top: -1.5rem;
}
.views-field-field-programme{
grid-row: 1 / span 1;
// grid-column: 1 / span 2;
.field-content{
font-weight: 600;
display: inline-block;
width: auto;
color: white;
padding: .15rem .3rem;
margin-bottom: 1rem;
}
}
.views-field-field-theme{
.field-content{
color:black;
}
}
.views-field-field-type-de-ressource{
text-transform: uppercase;
font-weight: 600;
margin-bottom: .5rem;
font-size: $font-small;
// grid-row: 2 / span 1;
// grid-column: 2 / span 1;
}
.views-field-title{
font-style: italic;
// grid-row: 3 / span 1;
// grid-column: 2 / span 1;
}
.views-field-field-sous-titre{
margin-bottom: 1rem;
// grid-row: 4 / span 1;
// grid-column: 2 / span 1;
align-self: baseline;
}
.views-field-field-theme{
// grid-row: 5 / span 1;
// grid-column: 1 / span 2;
font-size: $font-small;
text-align: right;
}
}
}
.slick-arrow{
position: absolute;
@@ -95,9 +266,12 @@
grid-column-start: 2;
}
.form-item-items-per-page{
.form-item-field-collections-target-id{
grid-column-start: 2;
}
.form-item-items-per-page{
grid-column-start: 3;
}
select, input{
display: inline-block;
width: auto;
@@ -142,7 +316,7 @@
grid-column-start: 2;
}
}
.views-col{
.views-col:not(.type-74){
display: grid;
grid-template-columns: 40% 60%;
grid-auto-rows: min-content;
@@ -209,6 +383,77 @@
grid-row: 5 / span 1;
grid-column: 1 / span 2;
font-size: $font-small;
}
}
.type-74{
display: grid;
grid-template-columns: 1fr;
grid-auto-rows: min-content;
a{
text-decoration: none;
&:hover{
text-decoration: underline;
}
}
background-color: rgb(255, 255, 255);
// background-clip: content-box;
width: 100% !important;
padding: .3rem;
.views-field:not(:first-child){
padding: 0 0 0 .4rem;
}
.views-field-field-image{
grid-row: 2;
// margin-top: -1.5rem;
}
.views-field-field-programme{
grid-row: 1 / span 1;
// grid-column: 1 / span 2;
.field-content{
font-weight: 600;
display: inline-block;
width: auto;
color: white;
padding: .15rem .3rem;
margin-bottom: 1rem;
}
}
.views-field-field-theme{
.field-content{
color:black;
}
}
.views-field-field-type-de-ressource{
text-transform: uppercase;
font-weight: 600;
margin-bottom: .5rem;
font-size: $font-small;
margin-top: .3rem;
// grid-row: 2 / span 1;
// grid-column: 2 / span 1;
}
.views-field-title{
font-style: italic;
// grid-row: 3 / span 1;
// grid-column: 2 / span 1;
}
.views-field-field-sous-titre{
margin-bottom: 1rem;
// grid-row: 4 / span 1;
// grid-column: 2 / span 1;
align-self: baseline;
}
.views-field-field-theme{
// grid-row: 5 / span 1;
// grid-column: 1 / span 2;
font-size: $font-small;
text-align: right;
}
}