bachir/popsu-d9
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

home page slider css et module central

Browse Source
This commit is contained in:
armansansd
2021-07-02 21:11:23 +02:00
parent 67b02aac45
commit b4879eac39
13 changed files with 2970 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

136
web/themes/custom/popsu/sass/pages/_home.scss
View File

@@ -1,3 +1,16 @@
.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{
@@ -61,9 +74,15 @@
}
}
}
.main_logo{
height: 7rem;
// background: red;
background: center / contain no-repeat url(../images/popsu-home-logo.png);
margin: -5rem 0 3rem 0;
}
.about{
background: $lightblue;
box-shadow: inset 0 17rem 18rem white;
background: $trame;
text-align: center;
padding: 18rem 0 3rem 0;
margin-top: -15rem;
@@ -88,7 +107,7 @@
}
#home_blocks-block_3{
background: $lightblue;
background: $trame;
padding: 2rem;
h2{
text-align: center;
@@ -154,5 +173,116 @@
// 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);
}
#home_theme_container{
.slick-slide{
// margin: 0 1rem;
}
.slick-arrow{
position: absolute;
height: 100%;
cursor: pointer;
z-index: 100;
background-color: white;
opacity: 0;
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: 10rem !important;
position: relative;
}
.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{
top: 0;
left: 0;
width: 100%;
height: 100%;
position: absolute;
img{
width: 100%;
height: auto;
}
}
}
#villes-block_1, #home_themes-block_1, #programmes-block_4{
header{
text-align: center;
font-family: 'duke';
font-size: $font-extra;
line-height: 1;
opacity: .3;
cursor:pointer;
.arrow{
font-size: $font-large;
display: block;
margin-top: -1rem;
}
&.active{
opacity: 1;
font-size: 4rem;
}
}
.views-row,.leaflet-container{
display: none;
}
}

106
web/themes/custom/popsu/sass/pages/_page--node.scss
View File

@@ -79,4 +79,110 @@
}
}
}
.block-region-bottom{
background: $trame;
h2{
text-align: center;
}
.item-list{
.slick-slide{
margin: 0 1rem;
}
.slick-arrow{
position: absolute;
height: 100%;
cursor: pointer;
z-index: 100;
background-color: white;
opacity: 0;
transition: opacity 250ms;
width: 10%;
&:hover{
opacity: .5;
}
}
.slick-next{
right: 0;
top: 0;
}
.views-field:not(.views-field-field-image){
width: 80%;
}
li{
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;
}
.views-field-title{
font-weight: 600;
grid-row: 3 / span 1;
grid-column: 2 / span 1;
}
.views-field-view-node{
// padding-top: 1rem;
// grid-column: 1;
// grid-row: 1;
grid-row: 2 / span 1;
grid-column: 2 / span 1;
}
.views-field-field-programme{
.field-content{
display: inline-block;
width: auto;
background-color: blue !important;
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;
}
}
}
footer{
background-color: transparent;
text-align: center;
padding: 1rem;
a{
display: inline-block;
margin: 0 auto;
background: black;
color: white;
font-family: "duke";
font-weight: 400;
padding: .5rem 1.5rem;
font-size: $font-medium;
text-decoration: none;
}
}
}
}

8
web/themes/custom/popsu/sass/pages/_ressources.scss
View File

@@ -1,5 +1,9 @@
.path-centre-de-ressources{
background-color: #f8f8fb;
background-color: $bck-col;
header{
margin-bottom: 0;
}
.content_container{
&>div>h2:first-child{
text-align: center;
@@ -44,7 +48,7 @@
.form-actions{
grid-column: 4 / span 2;
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-columns: repeat(2, minmax(0,1fr) );
align-items: center;
column-gap: 1rem;
input{

7
web/themes/custom/popsu/sass/pages/partials/_header_footer.scss
View File

@@ -1,10 +1,9 @@
//header
header{
margin-bottom: 2rem;
}
#header-top{
height: 3rem;
background: white;
margin-bottom: 2rem;
}
.header_top_left_container{
height: 100%;
@@ -16,7 +15,7 @@ header{
display: block;
font-size: 0;
color: transparent;
background: left / contain no-repeat url(../images/popsu-home-logo.png);
background: left / contain no-repeat url(../images/POPSU_logo.svg);
}
}

6
web/themes/custom/popsu/sass/setup/_layouts.scss
View File

@@ -1,6 +1,10 @@
.layout--threecol-25-50-25{
display: grid;
grid-template-columns: 20% 1fr 20%;
grid-template-columns: 20% minmax(0,1fr) 20%;
column-gap: 3rem;
row-gap: 1rem;
}
.layout__region--bottom{
grid-column: 1 /span 3;
}

37
web/themes/custom/popsu/sass/setup/_variables.scss
View File

@@ -5,29 +5,32 @@ $font-medium: .8rem;
$font-normal: .6rem;
$font-small: .45rem;
$col-met: red;
$col-eur: blue;
$col-mond: wheat;
$col-met: #28429f;
$col-eur: #646578;
$col-mond: #ab9569;
$col-ter: #e01a35;
$col-1: #4dabc1;
$col-2: #61ab32;
$bck-col: #eff2f9;
$lightblue: #98d0d9;
$trame: url(../images/motif_croix.svg);
//programmes values
.programme-2{
.views-field-field-programme{
.field-content{
background: $col-eur;
background: $col-1;
}
}
.views-field{
color: $col-eur;
color: $col-1;
}
.views-field-title{
color: $col-met;
color: $col-1;
&:hover{
background: $col-met;
background: $col-1;
color:white;
}
}
@@ -54,16 +57,16 @@ $lightblue: #98d0d9;
.programme-4{
.views-field-field-programme{
.field-content{
background: $col-mond;
background: $col-2;
}
}
.views-field{
color: $col-mond;
color: $col-2;
}
.views-field-title{
color: $col-met;
color: $col-2;
&:hover{
background: $col-met;
background: $col-2;
color:white;
}
}
@@ -106,16 +109,16 @@ $lightblue: #98d0d9;
.programme-6{
.views-field-field-programme{
.field-content{
background: $col-met;
background: $col-ter;
}
}
.views-field{
color: $col-met;
color: $col-ter;
}
.views-field-title{
color: $col-met;
color: $col-ter;
&:hover{
background: $col-met;
background: $col-ter;
color:white;
}
}