#1691 mise en forme menu gauche

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

@@ -38,6 +38,9 @@ article, .paragraph{
 
 }
 .block-region-first,.block-region-third{
+    .is-active{
+        font-weight: 600;
+    }
     h2{
         font-size: $font-big;
         background-color: black;
@@ -52,7 +55,7 @@ article, .paragraph{
     .field_document{
         padding: 0.5rem 0.5rem;
     }
-    .field_organisateur,.field_fichier,.field_ressources_liees{
+    .field_organisateur,.field_fichier, .field_lien,.field_ressources_liees{
         padding: 0.5rem 1rem;
         div{
             text-decoration: none;
@@ -237,7 +240,7 @@ article, .paragraph{
     .block-region-first{
         background-color: black;
         color: white;
-        a{
+        a:not(.prog-ressources-link,.back-actus-link){
             text-transform: uppercase;
             font-family: 'duke';
             font-size: $font-big;

web/themes/custom/popsu/sass/pages/_node-evenement-actu.scss

@@ -1,4 +1,73 @@
 .page-node-type-evenement, .page-node-type-actualite{
+	.block-region-first{
+
+        .field_programme{
+            display: none;
+        }
+        @include breakpoint(small down) {
+            text-align: center;
+
+        }
+        position: absolute;
+        
+        top: 0;
+        left: 0;
+        width: 22%;
+        padding: 1rem 1.5rem ;
+        .prog-ressources-link, .back-actus-link{
+            font-family: "duke";
+            font-size: $font-large;
+            cursor: pointer;
+            transition: all 250ms;
+            text-decoration: none;
+            &:hover{
+                padding: 0 0 0 .3rem;
+                    
+            }
+        }
+        div[id=""] {
+            @include breakpoint(small down) {
+                display: none;
+            }
+        }
+        .views-element-container{
+            @include breakpoint(small down) {
+                display: block;
+                // &:not(:first-child){
+                //     margin-left: 1rem;
+                // }
+                
+            }
+            header{
+                font-family: "duke";
+                font-size: $font-large;
+                text-transform: uppercase;
+                cursor: pointer;
+                transition: all 250ms;
+                line-height: 1.1;
+                margin-bottom: .5rem;
+                &:hover{
+                    padding: 0 0 0 .3rem;
+                    
+                }
+            }
+            .views-row, .view-grouping{
+                display: none;
+                padding: 0 0 0 1.2rem;
+                margin-bottom: .5rem;
+                a{
+                    text-decoration: none;
+                    &:hover{
+                        text-decoration: underline;
+                    }
+                }
+            }
+            .views-row{
+                padding: 0;
+            }
+        }
+
+    }
 	&.programme-1{
 		.field_programme{
 			background-color: $col-1;
@@ -87,21 +156,21 @@
 
 		}
  	}
-	 .block-region-first{
-		 padding: 1rem 0 .5rem 0;
-		 &>div{
-			 padding: 0 0 .5rem 0;
-		 }
-		 a{
-			padding: 0 0 0 1rem;
-		 }
-	 }
+	//  .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: 1rem;
 
-		.field_fichier, .field_ressources_liees{
-			margin: .5rem 0;	
+		.field_fichier, .field_ressources_liees, .field_lien{
+			// margin: .5rem 0;	
 			padding-right: 1.3rem;
 			a{
 				font-weight: 600;

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

@@ -1,4 +1,77 @@
 .page-node-type-theme, .page-node-type-projet{
+    ///// copy  menu left
+    .block-region-first{
+        .field_programme{
+            display: none;
+        }
+        @include breakpoint(small down) {
+            text-align: center;
+
+        }
+        position: absolute;
+        
+        top: 0;
+        left: 0;
+        width: 22%;
+        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;
+                    
+            }
+        }
+        div[id=""] {
+            @include breakpoint(small down) {
+                display: none;
+            }
+        }
+        .views-element-container{
+            @include breakpoint(small down) {
+                display: block;
+                // &:not(:first-child){
+                //     margin-left: 1rem;
+                // }
+                
+            }
+            header{
+                font-family: "duke";
+                font-size: $font-large;
+                text-transform: uppercase;
+                cursor: pointer;
+                transition: all 250ms;
+                line-height: 1.1;
+                margin-bottom: .5rem;
+                &:hover{
+                    padding: 0 0 0 .3rem;
+                    
+                }
+            }
+            .views-row, .view-grouping{
+                display: none;
+                padding: 0 0 0 1.2rem;
+                margin-bottom: .5rem;
+                a{
+                    text-decoration: none;
+                    &:hover{
+                        text-decoration: underline;
+                    }
+                }
+            }
+            .views-row{
+                padding: 0;
+            }
+        }
+
+    }
+
+
+
+    /////fin copy  menu left
     .field_logo{
         display: block;
     }
@@ -25,20 +98,20 @@
             background: $col-met;
         }
     }
-    .block-region-first{
-        padding: 1rem;
-        .field_programme{
-            background: black !important;
-            font-weight: 600;
+    // .block-region-first{
+    //     padding: 1rem;
+    //     .field_programme{
+    //         background: black !important;
+    //         font-weight: 600;
             
-            a{
-                text-decoration: none;
-            &:hover{
-                text-decoration: underline;
-            }
-            }
-        }
-    }
+    //         a{
+    //             text-decoration: none;
+    //         &:hover{
+    //             text-decoration: underline;
+    //         }
+    //         }
+    //     }
+    // }
 
     .block-region-third{
         margin-top: 20rem;