Merge branch 'master' of gogs-figureslibres.io:bachir/popsu-d9

web/themes/custom/popsu/css/styles.css

@@ -1224,7 +1224,8 @@ body {
   font-family: "trueno";
   font-size: 0.6rem;
   font-weight: 300;
-  line-height: 1.5; }
+  line-height: 1.5;
+  background: #eff2f9; }
 
 main h2 {
   text-transform: uppercase;
@@ -1234,12 +1235,26 @@ main h2 {
 a {
   color: inherit; }
 
+.ext {
+  display: none; }
+
 strong {
   font-weight: 600; }
 
 iframe {
   display: none; }
 
+.slick-arrow {
+  font-size: 0;
+  background: center/40% no-repeat url(../images/fleche.svg); }
+
+.slick-prev {
+  -moz-transform: rotate(180deg);
+  -webkit-transform: rotate(180deg);
+  -o-transform: rotate(180deg);
+  -ms-transform: rotate(180deg);
+  transform: rotate(180deg); }
+
 .layout--threecol-25-50-25 {
   display: grid;
   grid-template-columns: 20% minmax(0, 1fr) 20%;
@@ -1356,7 +1371,8 @@ footer {
   background: white; }
 
 #footer-bottom {
-  padding: 2rem 0; }
+  padding: 2rem 0;
+  height: 15rem; }
   #footer-bottom * {
     word-wrap: break-word; }
   #footer-bottom h2 {
@@ -1379,7 +1395,8 @@ footer {
     display: block;
     color: transparent;
     font-size: 0;
-    background: left/contain no-repeat url(../images/puca.svg); }
+    background: left/contain no-repeat url(../images/puca.svg);
+    margin-top: -1.5rem; }
   #footer-bottom #block-pieddepage ul {
     line-height: 2; }
     #footer-bottom #block-pieddepage ul li a {
@@ -1391,8 +1408,8 @@ footer {
   #footer-bottom .footer_bottom_right_container > div > div p {
     display: inline-block; }
     #footer-bottom .footer_bottom_right_container > div > div p a {
-      min-width: 2rem;
-      min-height: 2rem; }
+      min-width: 3rem;
+      min-height: 3rem; }
     #footer-bottom .footer_bottom_right_container > div > div p a[href*='twitter'] {
       height: 100%;
       display: block;
@@ -1419,6 +1436,11 @@ footer {
   .path-frontpage .block-region-content .views-element-container {
     grid-column: 1 / span 3; }
 
+.last-news .views-field-field-image {
+  height: 25rem; }
+  .last-news .views-field-field-image img {
+    width: 100%; }
+
 .last-news .slick-slide, .last-ressources .slick-slide {
   margin: 0 1rem; }
 
@@ -1427,7 +1449,6 @@ footer {
   height: 100%;
   cursor: pointer;
   z-index: 100;
-  background-color: white;
   opacity: 0.2;
   transition: opacity 250ms;
   width: 10%; }
@@ -1449,10 +1470,11 @@ footer {
     z-index: -1;
     padding-top: 1rem; }
   .last-news .views-row .views-field:not(.views-field-field-image), .last-ressources .views-row .views-field:not(.views-field-field-image) {
-    background: blue;
+    background: black;
     width: 50%;
     margin-left: 1rem;
-    padding-left: 1rem; }
+    padding-left: 1rem;
+    color: white; }
   .last-news .views-row .views-field-title, .last-ressources .views-row .views-field-title {
     padding-bottom: 1rem;
     grid-column: 1;
@@ -1472,11 +1494,12 @@ footer {
 .main_logo {
   z-index: 10;
   height: 7rem;
+  position: relative;
   background: center/contain no-repeat url(../images/popsu-home-logo.png);
   margin: -5rem 0 3rem 0; }
 
 .about {
-  box-shadow: inset 0 17rem 18rem white;
+  box-shadow: inset 0 17rem 18rem #eff2f9;
   background: url(../images/motif_croix.svg);
   text-align: center;
   padding: 18rem 0 3rem 0;
@@ -1492,6 +1515,20 @@ footer {
     color: black; }
   .about article div {
     margin: 0 5%; }
+  .about article .links {
+    display: inline-block;
+    margin: 0 auto;
+    background: black;
+    color: white;
+    font-family: "trueno";
+    font-weight: 500;
+    padding: .5rem 1.5rem;
+    font-size: 0.8rem;
+    margin-top: 1rem; }
+    .about article .links a {
+      text-decoration: none; }
+      .about article .links a:hover {
+        text-decoration: underline; }
 
 #home_blocks-block_3 {
   background: url(../images/motif_croix.svg);
@@ -1536,8 +1573,11 @@ footer {
     #home_blocks-block_3 .last-ressources .views-field-field-programme .field-content {
       display: inline-block;
       width: auto;
-      background-color: blue !important;
+      background-color: #28429f;
       padding: .3rem .5rem; }
+    #home_blocks-block_3 .last-ressources .views-field-field-programme .empty {
+      background-color: black;
+      height: 1rem; }
     #home_blocks-block_3 .last-ressources .views-field-field-programme .field-content {
       font-weight: 600;
       display: inline-block;
@@ -1569,7 +1609,6 @@ footer {
   #home_prog_container .views-row {
     background-clip: content-box;
     height: 13rem;
-    background-size: 70% !important;
     width: 100%;
     display: grid;
     align-items: center;
@@ -1588,27 +1627,27 @@ footer {
   #home_prog_container .views-field-field-diaporama {
     display: none; }
   #home_prog_container .programme-2 {
-    background: center/contain no-repeat url(../images/POPSU_1.svg); }
+    background: center/60% no-repeat url(../images/POPSU_1.svg) white; }
     #home_prog_container .programme-2:hover {
       background: #4dabc1; }
   #home_prog_container .programme-2 {
-    background: center/contain no-repeat url(../images/POPSU_2.svg); }
+    background: center/60% no-repeat url(../images/POPSU_2.svg) white; }
     #home_prog_container .programme-2:hover {
       background: #61ab32; }
   #home_prog_container .programme-3 {
-    background: center/contain no-repeat url(../images/POPSU_Europe.svg); }
+    background: center/50% no-repeat url(../images/POPSU_Europe.svg) white; }
     #home_prog_container .programme-3:hover {
       background: #646578; }
   #home_prog_container .programme-5 {
-    background: center/contain no-repeat url(../images/POPSU_monde.svg); }
+    background: center/45% no-repeat url(../images/POPSU_monde.svg) white; }
     #home_prog_container .programme-5:hover {
       background: #ab9569; }
   #home_prog_container .programme-6 {
-    background: center/contain no-repeat url(../images/POPSU_territoires.svg); }
+    background: center/60% no-repeat url(../images/POPSU_territoires.svg) white; }
     #home_prog_container .programme-6:hover {
       background: #e01a35; }
   #home_prog_container .programme-7 {
-    background: center/contain no-repeat url(../images/POPSU_metropoles.svg); }
+    background: center/60% no-repeat url(../images/POPSU_metropoles.svg) white; }
     #home_prog_container .programme-7:hover {
       background: #28429f; }
 
@@ -1620,7 +1659,6 @@ footer {
   height: 100%;
   cursor: pointer;
   z-index: 100;
-  background-color: white;
   opacity: 0.2;
   transition: opacity 250ms;
   width: 10%; }
@@ -1668,24 +1706,28 @@ footer {
     width: 100%;
     height: auto; }
 
-#villes-block_1 header, #home_themes-block_1 header, #programmes-block_4 header {
-  text-align: center;
-  font-family: 'duke';
-  font-size: 3.5rem;
-  line-height: 1;
-  opacity: .3;
-  cursor: pointer;
-  padding: .8rem; }
-  #villes-block_1 header .arrow, #home_themes-block_1 header .arrow, #programmes-block_4 header .arrow {
-    font-size: 1.6rem;
-    display: block;
-    margin-top: -1rem; }
-  #villes-block_1 header.active, #home_themes-block_1 header.active, #programmes-block_4 header.active {
-    opacity: 1;
-    font-size: 4rem; }
-
-#villes-block_1 .views-row, #villes-block_1 .leaflet-container, #home_themes-block_1 .views-row, #home_themes-block_1 .leaflet-container, #programmes-block_4 .views-row, #programmes-block_4 .leaflet-container {
-  display: none; }
+#villes-block_1, #home_themes-block_1, #programmes-block_4 {
+  background: #eff2f9;
+  height: 100%;
+  display: grid;
+  align-items: center; }
+  #villes-block_1 header, #home_themes-block_1 header, #programmes-block_4 header {
+    text-align: center;
+    font-family: 'duke';
+    font-size: 3.1rem;
+    line-height: 1;
+    opacity: .3;
+    cursor: pointer;
+    padding: .8rem; }
+    #villes-block_1 header .arrow, #home_themes-block_1 header .arrow, #programmes-block_4 header .arrow {
+      font-size: 1.6rem;
+      display: block;
+      margin-top: -1rem; }
+    #villes-block_1 header.active, #home_themes-block_1 header.active, #programmes-block_4 header.active {
+      opacity: 1;
+      font-size: 4rem; }
+  #villes-block_1 .views-row, #villes-block_1 .leaflet-container, #home_themes-block_1 .views-row, #home_themes-block_1 .leaflet-container, #programmes-block_4 .views-row, #programmes-block_4 .leaflet-container {
+    display: none; }
 
 .path-centre-de-ressources {
   background-color: #eff2f9; }
@@ -1731,7 +1773,6 @@ footer {
       height: 100%;
       cursor: pointer;
       z-index: 100;
-      background-color: white;
       opacity: 0.2;
       transition: opacity 250ms;
       width: 10%; }
@@ -1845,7 +1886,7 @@ article h2, article h3, article h4, article h5, article h6, .paragraph h2, .para
   font-family: "trueno";
   font-weight: 600;
   font-size: 0.8rem;
-  color: brown;
+  color: black;
   margin-top: 1rem;
   margin-bottom: .3rem; }
 
@@ -1877,7 +1918,7 @@ article p, .paragraph p {
   width: 100vw;
   height: 40vh;
   background: url(../images/motif_croix.svg);
-  box-shadow: inset 0 -5rem 8rem white;
+  box-shadow: inset 0 -5rem 8rem #eff2f9;
   z-index: -1; }
 
 .page-node-type-actualite .block-region-first, .page-node-type-evenement .block-region-first {
@@ -1923,14 +1964,15 @@ article p, .paragraph p {
   .path-actus .content_container .layout__region--content .views-element-container footer {
     text-align: center;
     margin: 1.8rem 0;
-    grid-column: 1 / span 2; }
+    grid-column: 1 / span 2;
+    background: transparent; }
     .path-actus .content_container .layout__region--content .views-element-container footer a {
       display: inline-block;
       margin: 0 auto;
       background: black;
       color: white;
-      font-family: "duke";
-      font-weight: 400;
+      font-family: "trueno";
+      font-weight: 500;
       padding: .5rem 1.5rem;
       font-size: 0.8rem;
       text-decoration: none; }
@@ -1966,7 +2008,6 @@ article p, .paragraph p {
   height: 100%;
   cursor: pointer;
   z-index: 100;
-  background-color: white;
   opacity: 0.2;
   transition: opacity 250ms;
   width: 10%; }
@@ -1991,8 +2032,16 @@ article p, .paragraph p {
   z-index: 10;
   width: 25%;
   padding: 1rem 1.5rem; }
+  .page-node-type-programme .block-region-first .prog-ressources-link {
+    font-family: "duke";
+    font-size: 1.6rem;
+    cursor: pointer;
+    transition: all 250ms;
+    text-decoration: none; }
+    .page-node-type-programme .block-region-first .prog-ressources-link:hover {
+      padding: 0 0 0 .3rem; }
   .page-node-type-programme .block-region-first .views-element-container header {
-    font-family: duke;
+    font-family: "duke";
     font-size: 1.6rem;
     cursor: pointer;
     transition: all 250ms; }
@@ -2012,11 +2061,11 @@ article p, .paragraph p {
   z-index: 20;
   position: relative; }
   .page-node-type-programme .block-region-third #evenements-block_1 {
-    background-color: brown;
+    background-color: black;
     margin-bottom: 3rem; }
   .page-node-type-programme .block-region-third .item-list {
     background-color: white;
-    color: brown;
+    color: black;
     padding: 1rem 0; }
     .page-node-type-programme .block-region-third .item-list li {
       margin-bottom: 1rem;
@@ -2044,7 +2093,6 @@ article p, .paragraph p {
     height: 100%;
     cursor: pointer;
     z-index: 100;
-    background-color: white;
     opacity: 0.2;
     transition: opacity 250ms;
     width: 10%; }
@@ -2065,8 +2113,7 @@ article p, .paragraph p {
     padding: 1rem;
     background-clip: content-box; }
   .page-node-type-programme .block-region-bottom .item-list .views-field-field-image {
-    grid-row: 3 / span 2;
-    margin-top: -1.5rem;
+    grid-row: 1 / span 4;
     z-index: 0;
     padding: .5rem; }
   .page-node-type-programme .block-region-bottom .item-list .views-field:not(.views-field-field-image) {
@@ -2074,6 +2121,10 @@ article p, .paragraph p {
     width: auto;
     margin-left: 0;
     padding-left: 0; }
+  .page-node-type-programme .block-region-bottom .item-list .views-field-field-sous-titre {
+    grid-column: 2 / span 1; }
+  .page-node-type-programme .block-region-bottom .item-list .views-field-field-type-de-ressource {
+    grid-column: 2 / span 1; }
   .page-node-type-programme .block-region-bottom .item-list .views-field-title {
     font-weight: 600;
     grid-row: 3 / span 1;
@@ -2090,7 +2141,7 @@ article p, .paragraph p {
     .page-node-type-programme .block-region-bottom .item-list .views-field-field-programme .field-content {
       display: inline-block;
       width: auto;
-      background-color: blue !important;
+      background-color: black !important;
       padding: .3rem .5rem; }
     .page-node-type-programme .block-region-bottom .item-list .views-field-field-programme .field-content {
       font-weight: 600;
@@ -2107,10 +2158,10 @@ article p, .paragraph p {
       margin: 0 auto;
       background: black;
       color: white;
-      font-family: "duke";
-      font-weight: 400;
+      font-family: "trueno";
+      font-weight: 500;
       padding: .5rem 1.5rem;
-      font-size: 0.8rem;
+      font-size: 0.6rem;
       text-decoration: none; }
 
 .path-archives .content_container > div > h2 {
@@ -2132,6 +2183,10 @@ article p, .paragraph p {
   .path-archives .content_container .views-element-container > div .views-row:nth-of-type(3n+1) {
     grid-column: 2; }
   .path-archives .content_container .views-element-container > div .views-row {
-    background: red; }
+    padding: .5rem 1rem;
+    background: #28429f; }
+    .path-archives .content_container .views-element-container > div .views-row a {
+      text-decoration: none;
+      color: white; }
 
 /*# sourceMappingURL=styles.css.map */

web/themes/custom/popsu/images/fleche.svg

@@ -0,0 +1,134 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="22.401388mm"
+   height="22.401388mm"
+   viewBox="0 0 22.401388 22.401388"
+   version="1.1"
+   id="svg13242"
+   inkscape:version="1.0.2 (e86c870879, 2021-01-15)"
+   sodipodi:docname="fleche.svg">
+  <defs
+     id="defs13236">
+    <clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath4732">
+      <path
+         d="M 0,0 H 63.5 V -63.5 H 0 Z"
+         clip-rule="evenodd"
+         id="path4730" />
+    </clipPath>
+    <clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath4742">
+      <path
+         d="m 0,-63.5 h 1260 v 127 H 0 Z"
+         id="path4740" />
+    </clipPath>
+  </defs>
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="2.8"
+     inkscape:cx="24.545518"
+     inkscape:cy="46.544052"
+     inkscape:document-units="mm"
+     inkscape:current-layer="layer1"
+     inkscape:document-rotation="0"
+     showgrid="false"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:window-width="1920"
+     inkscape:window-height="1015"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata13239">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Calque 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(-133.94216,-127.89454)">
+    <g
+       id="g4724"
+       transform="matrix(0.35277777,0,0,-0.35277777,133.94216,127.89454)">
+      <g
+         id="g4726">
+        <g
+           id="g4728"
+           clip-path="url(#clipPath4732)">
+          <g
+             id="g4734"
+             transform="translate(0,-63.5)">
+            <g
+               id="g4736">
+              <g
+                 id="g4738" />
+              <g
+                 id="g4764">
+                <g
+                   clip-path="url(#clipPath4742)"
+                   id="g4762">
+                  <g
+                     transform="translate(63.5,63.5)"
+                     id="g4752">
+                    <g
+                       id="g4750">
+                      <g
+                         transform="rotate(-90)"
+                         id="g4748">
+                        <g
+                           id="g4746">
+                          <path
+                             d="M 63.5,-31.75 C 63.5,-49.2857 49.2857,-63.5 31.75,-63.5 14.215,-63.5 0,-49.2857 0,-31.75 0,-14.215 14.215,0 31.75,0 49.2857,0 63.5,-14.215 63.5,-31.75 Z"
+                             style="fill:#6f6d7d;fill-opacity:0.7;fill-rule:evenodd;stroke:none"
+                             id="path4744" />
+                        </g>
+                      </g>
+                    </g>
+                  </g>
+                  <g
+                     transform="translate(25.44254,45.9478)"
+                     id="g4760">
+                    <g
+                       id="g4758">
+                      <g
+                         id="g4754" />
+                      <path
+                         d="M 0,0 C 8.89474,-5.57841 20.4325,-14.6978 20.4325,-14.6978 L 0.25,-29.9478"
+                         style="fill:none;stroke:#ffffff;stroke-width:3;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
+                         id="path4756" />
+                    </g>
+                  </g>
+                </g>
+              </g>
+            </g>
+          </g>
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>

web/themes/custom/popsu/lib/script.js

@@ -119,6 +119,8 @@ $(function(){
 	// HOME PAGE 
 	if($(".path-frontpage").length > 0){
 
+
+
 		let elem = "<div class='main_logo'></div>"
 		console.log(elem);
 		$(".about .views-row").prepend(elem);
@@ -152,6 +154,8 @@ $(function(){
 		 let map = $('#villes-block_1').find("#leaflet-map-view-villes-block-1").clone();
 		 $("#home_map_container").empty().append(map);
 
+
+		 
 		 
 	}
 	
@@ -160,10 +164,21 @@ $(function(){
 		let elem = "<div class='layout__region layout__region--top'></div>"
 		$(".layout--threecol-25-50-25").prepend(elem);
 	}
+	//last-ressources empty item
+	$(".last-ressources .views-field-field-programme .field-content").each(function(){
+
+		if ($(this).children().length == 0) {
+			$(this).append("POPSU")
+			$(this).addClass("empty");
+		}
+		  
+	});
 	
 	
 });
 
+
+
 // $(document).on('DOMNodeInserted', function(e) {
 // 	// console.log(e.target);
 //     if ( $(e.target).attr("id") == "home_theme_container" ) {

web/themes/custom/popsu/sass/pages/_actu.scss

@@ -35,13 +35,14 @@
 					text-align: center;
 					margin: 1.8rem 0;
 					grid-column: 1 / span 2 ;
+					background: transparent;
 					a{
 						display: inline-block;
 						margin: 0 auto;
 						background: black;
 						color: white;
-						font-family: "duke";
-						font-weight: 400;
+						font-family: "trueno";
+						font-weight: 500;
 						padding: .5rem 1.5rem;
 						font-size: 0.8rem;
 						text-decoration: none;
@@ -94,7 +95,7 @@
 			height: 100%;
 			cursor: pointer;
 			z-index: 100;
-			background-color: white;
+			// background-color: white;
 			opacity: 0.2;
 			transition: opacity 250ms;
 			width: 10%;

web/themes/custom/popsu/sass/pages/_archives.scss

@@ -27,7 +27,12 @@
 					grid-column: 2;
 				}
 				.views-row{
-					background: red;
+					padding: .5rem 1rem;
+					background: $col-met;
+					a{
+						text-decoration: none;
+						color: white;
+					}
 				}
 				// mise en page temporaire
 				// article{

web/themes/custom/popsu/sass/pages/_default.scss

@@ -4,7 +4,7 @@ article, .paragraph{
         font-family: "trueno";
         font-weight: 600;
         font-size: $font-medium;
-        color:brown;
+        color:black;
         margin-top: 1rem;
         margin-bottom: .3rem;
     }
@@ -45,7 +45,7 @@ article, .paragraph{
         width: 100vw;
         height: 40vh;
         background: $trame;
-        box-shadow: inset 0 -5rem 8rem white;
+        box-shadow: inset 0 -5rem 8rem $bck-col;
         z-index: -1;
     }
 }

web/themes/custom/popsu/sass/pages/_home.scss

@@ -11,7 +11,14 @@
 		}
 	}
 }
-
+.last-news{
+	.views-field-field-image{
+		height: 25rem;
+		img{
+			width: 100%;
+		}
+	}
+}
 .last-news, .last-ressources{
 	.slick-slide{
 		margin: 0 1rem;
@@ -21,7 +28,7 @@
 		height: 100%;
 		cursor: pointer;
 		z-index: 100;
-		background-color: white;
+		// background-color: white;
 		opacity: 0.2;
 		transition: opacity 250ms;
 		width: 10%;
@@ -47,10 +54,11 @@
 			padding-top: 1rem;
 		}
 		.views-field:not(.views-field-field-image){
-			background: blue;
+			background: black;
 			width: 50%;
 			margin-left: 1rem;
 			padding-left: 1rem;
+			color: white;
 			
 		}
 		.views-field-title{
@@ -68,6 +76,8 @@
 			text-transform: uppercase;
 			grid-column: 1;
 			grid-row: 2;
+			
+
 		}
 		a{
 			text-decoration: none;
@@ -77,12 +87,13 @@
 .main_logo{
 	z-index: 10;
 	height: 7rem;
+	position: relative;
 	// background: red;
 	background: center / contain no-repeat url(../images/popsu-home-logo.png);
 	margin: -5rem 0 3rem 0;
 }
 .about{
-	box-shadow: inset 0 17rem 18rem white;
+	box-shadow: inset 0 17rem 18rem $bck-col;
 	background: $trame;
 	text-align: center;	
 	padding: 18rem 0 3rem 0;
@@ -103,6 +114,24 @@
 		div{
 			margin: 0 5%;
 		}
+		.links{
+			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;
+		}
 	}
 	
 }
@@ -145,6 +174,7 @@
 			font-weight: 600;
 			grid-row: 3 / span 1;
 			grid-column: 2 / span 1;
+			
 		}
 		.views-field-view-node{
 			// padding-top: 1rem;
@@ -157,8 +187,17 @@
 			.field-content{
 				display: inline-block;
 				width: auto;
-				background-color: blue !important;
+				background-color: $col-met;
 				padding: .3rem .5rem;
+				
+			}
+			.empty {
+				background-color: black;
+				height: 1rem;
+				// &::before{
+				// 	content: "POPSU";
+				// }
+				
 			}
 			padding-left: .5rem !important;
 			grid-row: 1 / span 1;
@@ -201,7 +240,6 @@
 	.views-row{
 		background-clip: content-box;
 		height: 13rem;
-		background-size: 70% !important;
 		width: 100%;
 		display: grid;
 		align-items: center;
@@ -237,7 +275,7 @@
 	// 	margin: 3rem;
 	// }
 	.programme-2{
-		background: center / contain no-repeat url(../images/POPSU_1.svg);
+		background: center / 60% no-repeat url(../images/POPSU_1.svg) white;
 		
 		&:hover{
 			background: $col-1;
@@ -245,32 +283,32 @@
 		
 	}
 	.programme-2{
-		background: center / contain no-repeat url(../images/POPSU_2.svg);
+		background: center / 60% no-repeat url(../images/POPSU_2.svg) white;
 		&:hover{
 			background: $col-2;
 		}
 	}
 	.programme-3{
-		background: center / contain no-repeat url(../images/POPSU_Europe.svg);
+		background: center / 50% no-repeat url(../images/POPSU_Europe.svg) white;
 		&:hover{
 			background: $col-eur;
 		}
 	}
 	.programme-5{
-		background: center / contain no-repeat url(../images/POPSU_monde.svg);
+		background: center / 45% no-repeat url(../images/POPSU_monde.svg) white;
 		&:hover{
 			background: $col-mond;
 		}
 	}
 	.programme-6{
-		background: center / contain no-repeat url(../images/POPSU_territoires.svg);
+		background: center / 60% no-repeat url(../images/POPSU_territoires.svg) white;
 
 		&:hover{
 			background: $col-ter;
 		}
 	}
 	.programme-7{
-		background: center / contain no-repeat url(../images/POPSU_metropoles.svg);
+		background: center / 60% no-repeat url(../images/POPSU_metropoles.svg) white;
 
 		&:hover{
 			background: $col-met;
@@ -286,7 +324,7 @@
 		height: 100%;
 		cursor: pointer;
 		z-index: 100;
-		background-color: white;
+		// background-color: white;
 		opacity: 0.2;
 		transition: opacity 250ms;
 		width: 10%;
@@ -344,13 +382,17 @@
 }
 
 #villes-block_1, #home_themes-block_1, #programmes-block_4{
-	// background-color: $bck-col;
+	background: $bck-col;
+	height: 100%;
+	display: grid;
+	align-items: center;
 	header{
 		text-align: center;
 		font-family: 'duke';
-		font-size: 3.5rem;
+		font-size: 3.1rem;
 		line-height: 1;
 		opacity: .3; 
+
 		cursor:pointer;
 		padding: .8rem;
 		.arrow{

web/themes/custom/popsu/sass/pages/_programme.scss

@@ -14,11 +14,21 @@
         z-index: 10;
         width: 25%;
         padding: 1rem 1.5rem ;
-
+        .prog-ressources-link{
+            font-family: "duke";
+            font-size: $font-large;
+            cursor: pointer;
+            transition: all 250ms;
+            text-decoration: none;
+            &:hover{
+                padding: 0 0 0 .3rem;
+                    
+            }
+        }
         .views-element-container{
-            
+  
             header{
-                font-family: duke;
+                font-family: "duke";
                 font-size: $font-large;
                 cursor: pointer;
                 transition: all 250ms;
@@ -47,13 +57,13 @@
         position: relative;
        
         #evenements-block_1{
-            background-color: brown;
+            background-color: black;
             margin-bottom: 3rem;
         }
        
         .item-list{
             background-color:white;
-            color: brown;
+            color: black;
             padding: 1rem 0;
             li{
                 margin-bottom: 1rem;
@@ -93,7 +103,7 @@
                 height: 100%;
                 cursor: pointer;
                 z-index: 100;
-                background-color: white;
+                // background-color: white;
                 opacity: 0.2;
                 transition: opacity 250ms;
                 width: 10%;
@@ -119,8 +129,8 @@
                 background-clip: content-box;
             }
             .views-field-field-image{
-                grid-row: 3 / span 2;
-                margin-top: -1.5rem;
+                grid-row: 1 / span 4;
+                // margin-top: -3.5rem;
                 z-index: 0;	
                 padding: .5rem;
             }
@@ -131,6 +141,12 @@
                 padding-left: 0;
                 
             }
+            .views-field-field-sous-titre{
+                grid-column: 2 / span 1;
+            }
+            .views-field-field-type-de-ressource{
+                grid-column: 2 / span 1;
+            }
             .views-field-title{
                 font-weight: 600;
                 grid-row: 3 / span 1;
@@ -147,7 +163,7 @@
                 .field-content{
                     display: inline-block;
                     width: auto;
-                    background-color: blue !important;
+                    background-color: black !important;
                     padding: .3rem .5rem;
                 }
                 padding-left: .5rem !important;
@@ -175,11 +191,11 @@
                 background: black;
                 color: white;
 
-                font-family: "duke";
-                font-weight: 400;
+                font-family: "trueno";
+                font-weight: 500;
 
                 padding: .5rem 1.5rem;
-                font-size: $font-medium;
+                font-size: $font-normal;
                 text-decoration: none;
             
             }

web/themes/custom/popsu/sass/pages/_ressources.scss

@@ -54,7 +54,7 @@
 			height: 100%;
 			cursor: pointer;
 			z-index: 100;
-			background-color: white;
+			// background-color: white;
 			opacity: 0.2;
 			transition: opacity 250ms;
 			width: 10%;

web/themes/custom/popsu/sass/pages/partials/_header_footer.scss

@@ -169,9 +169,11 @@
 
 footer{
     background: white;
+   
 }
 #footer-bottom{
     padding: 2rem 0;
+    height: 15rem;
 	*{
 		word-wrap: break-word;
 	}
@@ -201,6 +203,7 @@ footer{
 		color: transparent;
         font-size: 0;
 		background: left / contain no-repeat url(../images/puca.svg);
+        margin-top: -1.5rem;
     }
 
     #block-pieddepage{
@@ -225,8 +228,8 @@ footer{
             p{
                 display: inline-block;
                 a{
-                    min-width: 2rem;
-                    min-height: 2rem;
+                    min-width: 3rem;
+                    min-height: 3rem;
 
                 }
                 a[href*='twitter']{

web/themes/custom/popsu/sass/setup/_globals.scss

@@ -3,6 +3,7 @@ body{
 	font-size: $font-normal ;
 	font-weight: 300;
 	line-height: 1.5;
+	background: $bck-col;
 }
 main{
 	h2{
@@ -14,7 +15,9 @@ main{
 a{
 	color:inherit;
 }
-
+.ext{
+	display: none;
+}
 strong{
 	font-weight: 600;
 }
@@ -22,4 +25,16 @@ strong{
 //TEMP
 iframe{
 	display: none;
+}
+
+.slick-arrow{
+	font-size: 0;
+	background: center / 40% no-repeat url(../images/fleche.svg);;
+}
+.slick-prev{
+	-moz-transform: rotate(180deg);
+    -webkit-transform: rotate(180deg);
+    -o-transform: rotate(180deg);
+    -ms-transform: rotate(180deg);
+    transform: rotate(180deg);
 }

web/themes/custom/popsu/templates/layout/page--node.html.twig

@@ -30,17 +30,17 @@
  * @see html.html.twig
  */
 #}
-<div class="layout-container">
+<div class="layout-container row">
 
   {% include directory ~ '\/partials/header.html.twig' %}
   {{ page.help }}
 
-  <main role="main"  class="columns ">
+  <main role="main"  class="columns small-12">
     <a id="main-content" tabindex="-1"></a>
     {# link is in html.html.twig #}
     
 
-    <div class="layout-content">
+    <div class="layout-content row">
       {{ page.content }}
     </div>
     {# /.layout-content #}