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

gabarit page themes

Browse Source
This commit is contained in:
armansansd 2021-08-20 12:27:02 +02:00
parent 8416eaf95c
commit 759ec43a17
13 changed files with 465 additions and 101 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

253
web/themes/custom/popsu/css/styles.css
View File

@ -1,3 +1,4 @@
@charset "UTF-8";
/*popsu*/ /*popsu*/
/*foundation*/ /*foundation*/
/** /**
@ -1152,8 +1153,7 @@ body {
font-family: "trueno"; font-family: "trueno";
font-size: 0.6rem; font-size: 0.6rem;
font-weight: 300; font-weight: 300;
line-height: 1.5; line-height: 1.5; }
background: #eff2f9; }
body.path-node.programme-1 #node\:title, body.path-node.programme-1 .field_sous_titre, body.path-node.programme-1 .field_intro { body.path-node.programme-1 #node\:title, body.path-node.programme-1 .field_sous_titre, body.path-node.programme-1 .field_intro {
color: #4dabc1; } color: #4dabc1; }
body.path-node.programme-1 article h2, body.path-node.programme-1 article h3, body.path-node.programme-1 article h4, body.path-node.programme-1 article h5, body.path-node.programme-1 article h6, body.path-node.programme-1 article .field_titre { body.path-node.programme-1 article h2, body.path-node.programme-1 article h3, body.path-node.programme-1 article h4, body.path-node.programme-1 article h5, body.path-node.programme-1 article h6, body.path-node.programme-1 article .field_titre {
@ -1315,7 +1315,12 @@ iframe {
.header_top_left_container { .header_top_left_container {
height: 100%; height: 100%;
display: grid; display: grid;
grid-template-columns: 1fr 1fr; } grid-template-columns: 1fr 1fr 1fr;
align-items: center;
text-align: center;
column-gap: 10px; }
.header_top_left_container > div[id=''] {
height: 100%; }
.header_top_left_container a[rel~='home'] { .header_top_left_container a[rel~='home'] {
height: 100%; height: 100%;
display: block; display: block;
@ -1387,7 +1392,7 @@ iframe {
display: none; display: none;
grid-template-columns: 10% 25% 25% 30% 10%; grid-template-columns: 10% 25% 25% 30% 10%;
padding: 1rem 0; padding: 1rem 0;
z-index: 100; z-index: 140;
line-height: 2; } line-height: 2; }
#header-top-right .header_top_right_container nav { #header-top-right .header_top_right_container nav {
grid-column-start: 2; } grid-column-start: 2; }
@ -1409,7 +1414,8 @@ iframe {
width: 100%; } width: 100%; }
footer { footer {
background: white; } background: white;
margin-top: 3rem; }
#footer-bottom { #footer-bottom {
padding: 2rem 0; padding: 2rem 0;
@ -1426,13 +1432,13 @@ footer {
height: 100%; height: 100%;
display: grid; } display: grid; }
#footer-bottom .logo-gouv { #footer-bottom .logo-gouv {
height: 70%; height: 50%;
display: block; display: block;
color: transparent; color: transparent;
font-size: 0; font-size: 0;
background: left/contain no-repeat url(../images/gouv.svg); } background: left/contain no-repeat url(../images/gouv.svg); }
#footer-bottom .logo-puca { #footer-bottom .logo-puca {
height: 70%; height: 50%;
display: block; display: block;
color: transparent; color: transparent;
font-size: 0; font-size: 0;
@ -1503,25 +1509,25 @@ footer {
.last-news .views-row a, .last-ressources .views-row a { .last-news .views-row a, .last-ressources .views-row a {
text-decoration: none; } text-decoration: none; }
.last-news .programme-1 .views-field { .last-news .programme-1 .views-field:not(.views-field-field-image) {
background: #4dabc1 !important; } background: #4dabc1 !important; }
.last-news .programme-2 .views-field { .last-news .programme-2 .views-field:not(.views-field-field-image) {
background: #61ab32 !important; } background: #61ab32 !important; }
.last-news .programme-3 .views-field { .last-news .programme-3 .views-field:not(.views-field-field-image) {
background: #646578 !important; } background: #646578 !important; }
.last-news .programme-4 .views-field { .last-news .programme-4 .views-field:not(.views-field-field-image) {
background: black; } background: black; }
.last-news .programme-5 .views-field { .last-news .programme-5 .views-field:not(.views-field-field-image) {
background: #ab9569 !important; } background: #ab9569 !important; }
.last-news .programme-6 .views-field { .last-news .programme-6 .views-field:not(.views-field-field-image) {
background: #e01a35 !important; } background: #e01a35 !important; }
.last-news .programme-7 .views-field { .last-news .programme-7 .views-field:not(.views-field-field-image) {
background: #28429f !important; } background: #28429f !important; }
.last-news { .last-news {
@ -1640,10 +1646,10 @@ footer {
height: 7rem; height: 7rem;
position: relative; position: relative;
background: center/contain no-repeat url(../images/popsu-home-logo.png); background: center/contain no-repeat url(../images/popsu-home-logo.png);
margin: -5rem 0 3rem 0; } margin: -9% 0 3rem 0 !important; }
.about { .about {
box-shadow: inset 0 17rem 18rem #eff2f9; box-shadow: inset 0 17rem 18rem white;
background: url(../images/motif_croix.svg); background: url(../images/motif_croix.svg);
font-size: 0.8rem; font-size: 0.8rem;
text-align: center; text-align: center;
@ -1746,51 +1752,67 @@ footer {
grid-template-columns: repeat(3, 1fr); grid-template-columns: repeat(3, 1fr);
align-items: center; align-items: center;
justify-items: center; justify-items: center;
margin-top: 1rem; } margin-top: 0; }
#home_prog_container .views-row { #home_prog_container .views-row {
background-clip: content-box; background-clip: content-box;
height: 13rem; min-height: 7rem;
width: 100%; width: 100%;
display: grid; display: grid;
align-items: center; align-items: center;
padding: 1rem; } padding: 1rem; }
#home_prog_container .views-row .views-field-title { #home_prog_container .views-row .views-field:not(.views-field-field-logo) {
font-size: 0.8rem; font-size: 0.8rem;
font-weight: 600; font-weight: 600;
display: none; } display: none; }
#home_prog_container .views-row:hover .views-field-title { #home_prog_container .views-row .views-field-title {
margin-bottom: 1rem; }
#home_prog_container .views-row:hover .views-field:not(.views-field-field-logo) {
font-weight: 600; font-weight: 600;
display: block; display: block;
color: white; color: white;
text-align: center; } text-align: center; }
#home_prog_container .views-row:hover .views-field-title a { #home_prog_container .views-row:hover .views-field:not(.views-field-field-logo) a {
text-decoration: none; } text-decoration: none; }
#home_prog_container .views-row .views-field-field-logo {
text-align: center; }
#home_prog_container .views-field-field-diaporama { #home_prog_container .views-field-field-diaporama {
display: none; } display: none; }
#home_prog_container .programme-1 { #home_prog_container .programme-1 img {
background: center/60% no-repeat url(../images/POPSU_1.svg) white; } width: 50%; }
#home_prog_container .programme-1:hover { #home_prog_container .programme-1:hover {
background: #4dabc1; } background: #4dabc1; }
#home_prog_container .programme-2 { #home_prog_container .programme-1:hover img {
background: center/60% no-repeat url(../images/POPSU_2.svg) white; } display: none; }
#home_prog_container .programme-2:hover { #home_prog_container .programme-2 img {
background: #61ab32; } width: 60%; }
#home_prog_container .programme-3 { #home_prog_container .programme-2:hover {
background: center/50% no-repeat url(../images/POPSU_Europe.svg) white; } background: #61ab32; }
#home_prog_container .programme-3:hover { #home_prog_container .programme-2:hover img {
background: #646578; } display: none; }
#home_prog_container .programme-5 { #home_prog_container .programme-3 img {
background: center/45% no-repeat url(../images/POPSU_monde.svg) white; } width: 50%; }
#home_prog_container .programme-5:hover { #home_prog_container .programme-3:hover {
background: #ab9569; } background: #646578; }
#home_prog_container .programme-6 { #home_prog_container .programme-3:hover img {
background: center/60% no-repeat url(../images/POPSU_territoires.svg) white; } display: none; }
#home_prog_container .programme-6:hover { #home_prog_container .programme-5 img {
background: #e01a35; } width: 45%; }
#home_prog_container .programme-7 { #home_prog_container .programme-5:hover {
background: center/60% no-repeat url(../images/POPSU_metropoles.svg) white; } background: #ab9569; }
#home_prog_container .programme-7:hover { #home_prog_container .programme-5:hover img {
background: #28429f; } display: none; }
#home_prog_container .programme-6 img {
width: 60%; }
#home_prog_container .programme-6:hover {
background: #e01a35; }
#home_prog_container .programme-6:hover img {
display: none; }
#home_prog_container .programme-7 img {
width: 60%; }
#home_prog_container .programme-7:hover {
background: #28429f; }
#home_prog_container .programme-7:hover img {
display: none; }
#home_theme_container .slick-slide { #home_theme_container .slick-slide {
margin: 0 1rem; } margin: 0 1rem; }
@ -1813,10 +1835,14 @@ footer {
#home_theme_container .views-row { #home_theme_container .views-row {
background-clip: content-box; background-clip: content-box;
background-color: grey; background-color: grey;
height: 10rem; width: 100% !important;
width: 10rem !important;
position: relative; } position: relative; }
#home_theme_container .views-row:after {
content: "";
display: block;
padding-bottom: 100%; }
#home_theme_container .views-field-title { #home_theme_container .views-field-title {
display: grid; display: grid;
top: 0; top: 0;
@ -1835,6 +1861,15 @@ footer {
margin-top: -.5rem; margin-top: -.5rem;
text-decoration: none; } text-decoration: none; }
#home_theme_container .views-field-field-image:before {
content: "";
display: block;
position: absolute;
background: black;
opacity: .4;
width: 100%;
height: 100%; }
#home_theme_container .views-field-field-image { #home_theme_container .views-field-field-image {
top: 0; top: 0;
left: 0; left: 0;
@ -2174,23 +2209,23 @@ article h2, article h3, article h4, article h5, article h6, .paragraph h2, .para
article p, .paragraph p { article p, .paragraph p {
margin-bottom: .5rem; } margin-bottom: .5rem; }
.block-region-third h2 { .block-region-first h2, .block-region-third h2 {
font-size: 1rem; font-size: 1rem;
background-color: black; background-color: black;
color: white; color: white;
padding: .3rem 1rem; } padding: .3rem 1rem; }
.block-region-third .views-field-field-intro { .block-region-first .views-field-field-intro, .block-region-third .views-field-field-intro {
display: none; } display: none; }
.block-region-first { .block-region-first {
background-color: black; background-color: black;
color: white; } color: white;
z-index: 120; }
.block-region-first #node\:title { .block-region-first #node\:title {
text-transform: uppercase; text-transform: uppercase;
font-family: 'duke'; font-family: 'duke';
font-size: 1rem; font-size: 1rem;
padding: .3rem .5rem;
text-decoration: none; } text-decoration: none; }
.block-region-first #node\:title:hover { .block-region-first #node\:title:hover {
text-decoration: underline; } text-decoration: underline; }
@ -2202,7 +2237,7 @@ article p, .paragraph p {
width: 100vw; width: 100vw;
height: 40vh; height: 40vh;
background: url(../images/motif_croix.svg); background: url(../images/motif_croix.svg);
box-shadow: inset 0 -5rem 8rem #eff2f9; box-shadow: inset 0 -5rem 8rem white;
z-index: -1; } z-index: -1; }
.page-node-type-actualite .block-region-first, .page-node-type-evenement .block-region-first { .page-node-type-actualite .block-region-first, .page-node-type-evenement .block-region-first {
@ -2602,7 +2637,6 @@ article p, .paragraph p {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
z-index: 10;
width: 25%; width: 25%;
padding: 1rem 1.5rem; } padding: 1rem 1.5rem; }
.page-node-type-programme .block-region-first .prog-ressources-link { .page-node-type-programme .block-region-first .prog-ressources-link {
@ -2699,7 +2733,7 @@ article p, .paragraph p {
bottom: 0; bottom: 0;
left: -15px; left: -15px;
right: -15px; right: -15px;
box-shadow: inset #eff2f9 0 -4rem 2rem; } box-shadow: inset white 0 -4rem 2rem; }
.page-node-type-programme article .field_textes .paragraph .crop { .page-node-type-programme article .field_textes .paragraph .crop {
max-height: 7rem; max-height: 7rem;
@ -2813,4 +2847,115 @@ article p, .paragraph p {
text-decoration: none; text-decoration: none;
color: white; } color: white; }
.page-node-type-evenement.programme-1 .field_programme, .page-node-type-actualite.programme-1 .field_programme {
background-color: #4dabc1; }
.page-node-type-evenement.programme-2 .field_programme, .page-node-type-actualite.programme-2 .field_programme {
background-color: #61ab32; }
.page-node-type-evenement.programme-3 .field_programme, .page-node-type-actualite.programme-3 .field_programme {
background-color: #646578; }
.page-node-type-evenement.programme-4 .field_programme, .page-node-type-actualite.programme-4 .field_programme {
background-color: #28429f; }
.page-node-type-evenement.programme-5 .field_programme, .page-node-type-actualite.programme-5 .field_programme {
background-color: #ab9569; }
.page-node-type-evenement.programme-6 .field_programme, .page-node-type-actualite.programme-6 .field_programme {
background-color: #e01a35; }
.page-node-type-evenement.programme-7 .field_programme, .page-node-type-actualite.programme-7 .field_programme {
background-color: #28429f; }
.page-node-type-evenement .block-region-second, .page-node-type-actualite .block-region-second {
display: grid; }
.page-node-type-evenement .block-region-second #node\:title, .page-node-type-actualite .block-region-second #node\:title {
margin: 0;
font-size: 1.6rem;
line-height: 1.3; }
.page-node-type-evenement .block-region-second #node\:field_programme, .page-node-type-actualite .block-region-second #node\:field_programme {
grid-row: 1;
margin-bottom: 1rem; }
.page-node-type-evenement .block-region-second #node\:field_programme .field_programme, .page-node-type-actualite .block-region-second #node\:field_programme .field_programme {
display: inline-block;
width: auto;
padding: .3rem .5rem;
color: white;
font-weight: 600; }
.page-node-type-evenement .block-region-second #node\:field_date, .page-node-type-actualite .block-region-second #node\:field_date {
font-size: 0.8rem;
grid-row: 2; }
.page-node-type-evenement .block-region-second #node\:field_date .field_date div, .page-node-type-actualite .block-region-second #node\:field_date .field_date div {
float: left;
margin-right: 1rem; }
.page-node-type-evenement .block-region-second #node\:field_sous_titre, .page-node-type-actualite .block-region-second #node\:field_sous_titre {
text-transform: uppercase; }
.page-node-type-evenement .block-region-second #node\:field_intro, .page-node-type-actualite .block-region-second #node\:field_intro {
font-size: 0.8rem; }
.page-node-type-evenement .block-region-second #node\:field_image, .page-node-type-actualite .block-region-second #node\:field_image {
grid-row: 5;
width: 100%;
margin: 1rem 0; }
.page-node-type-evenement .block-region-second #node\:field_image img, .page-node-type-actualite .block-region-second #node\:field_image img {
width: 100%; }
.page-node-type-evenement .block-region-first, .page-node-type-actualite .block-region-first {
padding: 1rem 0 .5rem 0; }
.page-node-type-evenement .block-region-first > div, .page-node-type-actualite .block-region-first > div {
padding: 0 0 .5rem 0; }
.page-node-type-evenement .block-region-first a, .page-node-type-actualite .block-region-first a {
padding: 0 0 0 1rem; }
.page-node-type-evenement .block-region-third, .page-node-type-actualite .block-region-third {
position: sticky;
top: 4rem; }
.page-node-type-evenement .block-region-third .field_fichier, .page-node-type-evenement .block-region-third .field_ressources_liees, .page-node-type-actualite .block-region-third .field_fichier, .page-node-type-actualite .block-region-third .field_ressources_liees {
margin: .5rem 0;
padding-right: 1.3rem; }
.page-node-type-evenement .block-region-third .field_fichier a, .page-node-type-evenement .block-region-third .field_ressources_liees a, .page-node-type-actualite .block-region-third .field_fichier a, .page-node-type-actualite .block-region-third .field_ressources_liees a {
font-weight: 600;
text-decoration: none; }
.page-node-type-evenement .block-region-third .field_fichier a:hover, .page-node-type-evenement .block-region-third .field_ressources_liees a:hover, .page-node-type-actualite .block-region-third .field_fichier a:hover, .page-node-type-actualite .block-region-third .field_ressources_liees a:hover {
text-decoration: underline; }
.page-node-type-theme .block-region-first {
visibility: hidden; }
.page-node-type-theme .block-region-third {
margin-top: 30rem; }
.page-node-type-theme #node\:title:before {
content: "théme";
clear: both;
display: block;
width: 100%;
font-size: 0.45rem;
text-transform: uppercase;
margin-bottom: .8rem; }
.page-node-type-theme #node\:title {
margin: 0;
font-size: 1.6rem;
line-height: 1.3;
font-weight: 600;
margin-bottom: 1rem; }
.page-node-type-theme #node\:field_image {
width: 150%; }
.page-node-type-theme #node\:field_image img {
width: 100%; }
.page-node-type-theme .block-region-bottom #node\:field_projets_lies h2 {
text-align: center; }
.page-node-type-theme .block-region-bottom #node\:field_projets_lies .field_projets_lies {
display: grid;
grid-template-columns: repeat(5, 1fr);
column-gap: 1rem;
padding: 0 10%; }
.page-node-type-theme .block-region-bottom #node\:field_projets_lies article .body {
display: none; }
/*# sourceMappingURL=styles.css.map */ /*# sourceMappingURL=styles.css.map */

2
web/themes/custom/popsu/css/styles.css.map
View File

File diff suppressed because one or more lines are too long

2
web/themes/custom/popsu/js/main.js
View File

File diff suppressed because one or more lines are too long

2
web/themes/custom/popsu/lib/script.js
View File

@ -7,7 +7,7 @@ $(function(){
slidesToShow: 1, slidesToShow: 1,
slidesToScroll: 1, slidesToScroll: 1,
centerMode: true, centerMode: true,
centerPadding: '200px', centerPadding: '300px',
}); });
$('.last-ressources').slick({ $('.last-ressources').slick({
slidesToShow: 3, slidesToShow: 3,

4
web/themes/custom/popsu/partials/header.html.twig
View File

@ -1,9 +1,9 @@
<header role="banner" class="columns small-12"> <header role="banner" class="columns small-12">
<section id="header-top" class="row align-middle"> <section id="header-top" class="row align-middle">
<div id="header-top-left" class="columns small-2"> <div id="header-top-left" class="columns small-3">
{{ page.header_top_left }} {{ page.header_top_left }}
</div> </div>
<div id="header-top-middle" class="columns small-9"> <div id="header-top-middle" class="columns small-8">
{{ page.header_top_middle }} {{ page.header_top_middle }}
</div> </div>
<div id="header-top-right" class="columns small-1"> <div id="header-top-right" class="columns small-1">

6
web/themes/custom/popsu/sass/pages/_default.scss
View File

@ -12,7 +12,7 @@ article, .paragraph{
margin-bottom: .5rem; margin-bottom: .5rem;
} }
} }
.block-region-third{ .block-region-first,.block-region-third{
h2{ h2{
font-size: $font-big; font-size: $font-big;
background-color: black; background-color: black;
@ -27,11 +27,11 @@ article, .paragraph{
.block-region-first{ .block-region-first{
background-color: black; background-color: black;
color: white; color: white;
z-index: 120;
#node\:title{ #node\:title{
text-transform: uppercase; text-transform: uppercase;
font-family: 'duke'; font-family: 'duke';
font-size: $font-big; font-size: $font-big;
padding: .3rem .5rem;
text-decoration: none; text-decoration: none;
&:hover{ &:hover{
text-decoration: underline; text-decoration: underline;
@ -48,7 +48,7 @@ article, .paragraph{
width: 100vw; width: 100vw;
height: 40vh; height: 40vh;
background: $trame; background: $trame;
box-shadow: inset 0 -5rem 8rem $bck-col; box-shadow: inset 0 -5rem 8rem white;
z-index: -1; z-index: -1;
} }
} }

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

@ -46,38 +46,38 @@
} }
} }
.last-news .programme-1{ .last-news .programme-1{
.views-field{ .views-field:not(.views-field-field-image){
background: $col-1 !important; background: $col-1 !important;
} }
} }
.last-news .programme-2{ .last-news .programme-2{
.views-field{ .views-field:not(.views-field-field-image){
background: $col-2 !important; background: $col-2 !important;
} }
} }
.last-news .programme-3{ .last-news .programme-3{
.views-field{ .views-field:not(.views-field-field-image){
background: $col-eur !important; background: $col-eur !important;
} }
} }
.last-news .programme-4{ .last-news .programme-4{
.views-field{ .views-field:not(.views-field-field-image){
background: black; background: black;
} }
} }
.last-news .programme-5{ .last-news .programme-5{
.views-field{ .views-field:not(.views-field-field-image){
background: $col-mond !important; background: $col-mond !important;
} }
} }
.last-news .programme-6{ .last-news .programme-6{
.views-field{ .views-field:not(.views-field-field-image){
background: $col-ter !important; background: $col-ter !important;
} }
} }
.last-news .programme-7{ .last-news .programme-7{
.views-field{ .views-field:not(.views-field-field-image){
background: $col-met !important; background: $col-met !important;
} }
} }
@ -271,10 +271,10 @@
position: relative; position: relative;
// background: red; // background: red;
background: center / contain no-repeat url(../images/popsu-home-logo.png); background: center / contain no-repeat url(../images/popsu-home-logo.png);
margin: -5rem 0 3rem 0; margin: -9% 0 3rem 0 !important;
} }
.about{ .about{
box-shadow: inset 0 17rem 18rem $bck-col; box-shadow: inset 0 17rem 18rem white;
background: $trame; background: $trame;
font-size: $font-medium; font-size: $font-medium;
text-align: center; text-align: center;
@ -412,22 +412,25 @@
grid-template-columns: repeat( 3, 1fr); grid-template-columns: repeat( 3, 1fr);
align-items: center; align-items: center;
justify-items: center; justify-items: center;
margin-top: 1rem; margin-top: 0;
.views-row{ .views-row{
background-clip: content-box; background-clip: content-box;
height: 13rem; min-height: 7rem;
width: 100%; width: 100%;
display: grid; display: grid;
align-items: center; align-items: center;
padding: 1rem; padding: 1rem;
.views-field-title{ .views-field:not(.views-field-field-logo){
font-size: $font-medium; font-size: $font-medium;
font-weight: 600; font-weight: 600;
display: none; display: none;
} }
.views-field-title{
margin-bottom: 1rem;
}
&:hover{ &:hover{
.views-field-title{ .views-field:not(.views-field-field-logo){
font-weight: 600; font-weight: 600;
display: block; display: block;
color: white; color: white;
@ -437,7 +440,11 @@
text-decoration: none; text-decoration: none;
} }
}
} }
.views-field-field-logo{
text-align: center;
} }
} }
@ -449,43 +456,77 @@
.programme-1{ .programme-1{
background: center / 60% no-repeat url(../images/POPSU_1.svg) white; // background: center / 60% no-repeat url(../images/POPSU_1.svg) white;
img{
width: 50%;
}
&:hover{ &:hover{
background: $col-1; background: $col-1;
img{
display: none;
}
} }
} }
.programme-2{ .programme-2{
background: center / 60% no-repeat url(../images/POPSU_2.svg) white; // background: center / 60% no-repeat url(../images/POPSU_2.svg) white;
img{
width: 60%;
}
&:hover{ &:hover{
background: $col-2; background: $col-2;
img{
display: none;
}
} }
} }
.programme-3{ .programme-3{
background: center / 50% no-repeat url(../images/POPSU_Europe.svg) white; // background: center / 50% no-repeat url(../images/POPSU_Europe.svg) white;
img{
width: 50%;
}
&:hover{ &:hover{
background: $col-eur; background: $col-eur;
img{
display: none;
}
} }
} }
.programme-5{ .programme-5{
background: center / 45% no-repeat url(../images/POPSU_monde.svg) white; // background: center / 45% no-repeat url(../images/POPSU_monde.svg) white;
img{
width: 45%;
}
&:hover{ &:hover{
background: $col-mond; background: $col-mond;
img{
display: none;
}
} }
} }
.programme-6{ .programme-6{
background: center / 60% no-repeat url(../images/POPSU_territoires.svg) white; // background: center / 60% no-repeat url(../images/POPSU_territoires.svg) white;
img{
width: 60%;
}
&:hover{ &:hover{
background: $col-ter; background: $col-ter;
img{
display: none;
}
} }
} }
.programme-7{ .programme-7{
background: center / 60% no-repeat url(../images/POPSU_metropoles.svg) white; // background: center / 60% no-repeat url(../images/POPSU_metropoles.svg) white;
img{
width: 60%;
}
&:hover{ &:hover{
background: $col-met; background: $col-met;
img{
display: none;
}
} }
} }
@ -514,12 +555,17 @@
.views-row{ .views-row{
background-clip: content-box; background-clip: content-box;
background-color: grey; background-color: grey;
height: 10rem; // height: 10rem;
width: 10rem !important; width: 100% !important;
position: relative; position: relative;
} }
.views-row:after{
content: "";
display: block;
padding-bottom: 100%;
}
.views-field-title{ .views-field-title{
display: grid; display: grid;
top: 0; top: 0;
@ -540,6 +586,15 @@
} }
} }
.views-field-field-image:before{
content: "";
display: block;
position: absolute;
background: black;
opacity: .4;
width: 100%;
height: 100%;
}
.views-field-field-image{ .views-field-field-image{
top: 0; top: 0;
@ -563,9 +618,6 @@
max-width: none; max-width: none;
} }
// }
// &:hover{
// opacity: .6;
// } // }
} }

110
web/themes/custom/popsu/sass/pages/_node-evenement.scss Normal file
View File

@ -0,0 +1,110 @@
.page-node-type-evenement, .page-node-type-actualite{
&.programme-1{
.field_programme{
background-color: $col-1;
}
}
&.programme-2{
.field_programme{
background-color: $col-2;
}
}
&.programme-3{
.field_programme{
background-color: $col-eur;
}
}
&.programme-4{
.field_programme{
background-color: $col-met;
}
}
&.programme-5{
.field_programme{
background-color: $col-mond;
}
}
&.programme-6{
.field_programme{
background-color: $col-ter;
}
}
&.programme-7{
.field_programme{
background-color: $col-met;
}
}
.block-region-second{
display:grid;
#node\:title{
margin: 0;
font-size: $font-large;
line-height: 1.3;
}
#node\:field_programme{
grid-row: 1;
.field_programme{
display: inline-block;
width: auto;
padding: .3rem .5rem;
color: white;
font-weight: 600;
}
margin-bottom: 1rem;
}
#node\:field_date{
font-size: $font-medium;
grid-row: 2;
.field_date{
div{
float: left;
margin-right: 1rem;
}
}
}
#node\:field_sous_titre{
text-transform: uppercase;
}
#node\:field_intro{
font-size: $font-medium;
}
#node\:field_image{
grid-row: 5;
width: 100%;
margin: 1rem 0;
img{
width: 100%;
}
}
#node\:body{
}
}
.block-region-first{
padding: 1rem 0 .5rem 0;
&>div{
padding: 0 0 .5rem 0;
}
a{
padding: 0 0 0 1rem;
}
}
.block-region-third{
position: sticky;
top: 4rem;
.field_fichier, .field_ressources_liees{
margin: .5rem 0;
padding-right: 1.3rem;
a{
font-weight: 600;
text-decoration: none;
&:hover{
text-decoration: underline;
}
}
}
}
}

3
web/themes/custom/popsu/sass/pages/_programme.scss
View File

@ -235,7 +235,6 @@
top: 0; top: 0;
left: 0; left: 0;
z-index: 10;
width: 25%; width: 25%;
padding: 1rem 1.5rem ; padding: 1rem 1.5rem ;
.prog-ressources-link{ .prog-ressources-link{
@ -383,7 +382,7 @@
content: ""; content: "";
position: absolute; position: absolute;
top: 0; bottom: 0; left: -15px; right: -15px; top: 0; bottom: 0; left: -15px; right: -15px;
box-shadow: inset $bck-col 0 -4rem 2rem; box-shadow: inset white 0 -4rem 2rem;
} }
.crop{ .crop{

52
web/themes/custom/popsu/sass/pages/_themes.scss Normal file
View File

@ -0,0 +1,52 @@
.page-node-type-theme{
//tmp hidden
.block-region-first{
visibility: hidden;
}
.block-region-third{
margin-top: 30rem;
}
#node\:title:before{
content: "théme";
clear: both;
display: block;
width: 100%;
font-size: $font-small;
text-transform: uppercase;
margin-bottom: .8rem;
}
#node\:title{
margin: 0;
font-size: $font-large;
line-height: 1.3;
font-weight: 600;
margin-bottom: 1rem;
}
#node\:field_image{
width: 150%;
img{
width: 100%;
}
}
.block-region-bottom{
#node\:field_projets_lies{
h2{
text-align: center;
}
.field_projets_lies{
display: grid;
grid-template-columns: repeat(5, 1fr);
column-gap: 1rem;
padding: 0 10%;
}
article{
.body{
display: none;
}
}
}
}
}

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

@ -139,10 +139,13 @@
.header_top_left_container{ .header_top_left_container{
height: 100%; height: 100%;
display: grid; display: grid;
grid-template-columns: 1fr 1fr; grid-template-columns: 1fr 1fr 1fr;
// &>div:first-child{ align-items: center;
// // height: 100%; text-align: center;
// } column-gap: 10px;
&>div[id='']{
height: 100%;
}
a[rel~='home']{ a[rel~='home']{
height: 100%; height: 100%;
display: block; display: block;
@ -237,7 +240,7 @@
display: none; display: none;
grid-template-columns: 10% 25% 25% 30% 10%; grid-template-columns: 10% 25% 25% 30% 10%;
padding: 1rem 0; padding: 1rem 0;
z-index: 100; z-index: 140;
line-height: 2; line-height: 2;
nav{ nav{
grid-column-start: 2; grid-column-start: 2;
@ -276,6 +279,7 @@
footer{ footer{
background: white; background: white;
margin-top: 3rem;
} }
#footer-bottom{ #footer-bottom{
@ -298,14 +302,14 @@ footer{
} }
} }
.logo-gouv{ .logo-gouv{
height: 70%; height: 50%;
display: block; display: block;
color: transparent; color: transparent;
font-size: 0; font-size: 0;
background: left / contain no-repeat url(../images/gouv.svg); background: left / contain no-repeat url(../images/gouv.svg);
} }
.logo-puca{ .logo-puca{
height: 70%; height: 50%;
display: block; display: block;
color: transparent; color: transparent;
font-size: 0; font-size: 0;

2
web/themes/custom/popsu/sass/setup/_globals.scss
View File

@ -3,7 +3,7 @@ body{
font-size: $font-normal ; font-size: $font-normal ;
font-weight: 300; font-weight: 300;
line-height: 1.5; line-height: 1.5;
background: $bck-col; // background: $bck-col;
&.path-node{ &.path-node{
&.programme-1{ &.programme-1{
#node\:title,.field_sous_titre,.field_intro{ #node\:title,.field_sous_titre,.field_intro{

2
web/themes/custom/popsu/sass/styles.scss
View File

@ -32,4 +32,6 @@
@import "pages/actu"; @import "pages/actu";
@import "pages/programme"; @import "pages/programme";
@import "pages/archives"; @import "pages/archives";
@import "pages/node-evenement";
@import "pages/themes";