site pilote

web/themes/custom/reha/dist/css/bundle.css

@@ -17,6 +17,7 @@
 
 .field--type-link {
   width: fit-content;
+  padding: 0.4rem;
 }
 
 .bouton {
@@ -43,15 +44,12 @@
   display: none;
 }
 
-#edit-submit:hover {
+.views-field-edit-node:hover,
-  background-color: #fdc300;
+.field--name-field-lien:hover,
-}
+#edit-submit:hover,
-
+.form-submit:hover,
-.views-field-edit-node:hover {
+.field--type-link:hover,
-  background-color: #fdc300;
+.field--type-file:hover {
-}
-
-.form-submit:hover {
   background-color: #fdc300;
 }
 
@@ -176,6 +174,15 @@
     padding-top: 0;
   }
 }
+.layout-content .layout__region--first {
+  flex: 0 1 25%;
+}
+.layout-content .layout__region--second {
+  flex: 0 1 75%;
+}
+.layout-content .layout__region--second.view-id-home {
+  margin: 0;
+}
 
 aside {
   width: 20%;
@@ -217,6 +224,10 @@ main {
   display: none;
 }
 
+p {
+  background-color: transparent;
+}
+
 ul {
   list-style-type: none;
 }
@@ -911,7 +922,7 @@ input {
 .slick-next {
   position: absolute;
   display: block;
-  z-index: 999;
+  z-index: 9;
   height: 20px;
   width: 20px;
   line-height: 0px;
@@ -919,7 +930,7 @@ input {
   cursor: pointer;
   background: transparent;
   color: transparent;
-  top: 50%;
+  top: 25%;
   -webkit-transform: translate(0, -50%);
   -ms-transform: translate(0, -50%);
   transform: translate(0, -50%);
@@ -956,6 +967,7 @@ input {
 
 .slick-prev {
   left: -25px;
+  padding-left: 4rem;
 }
 [dir=rtl] .slick-prev {
   left: auto;
@@ -963,9 +975,11 @@ input {
 }
 .slick-prev:before {
   content: "<";
+  font-weight: lighter;
 }
 [dir=rtl] .slick-prev:before {
   content: ">";
+  font-weight: lighter;
 }
 
 .slick-next {
@@ -977,9 +991,11 @@ input {
 }
 .slick-next:before {
   content: ">";
+  font-weight: lighter;
 }
 [dir=rtl] .slick-next:before {
   content: "<";
+  font-weight: lighter;
 }
 
 /* Dots */
@@ -1191,13 +1207,21 @@ input {
   padding-top: 2rem;
   padding-bottom: 2rem;
 }
+.home-page-layout-content .layout-content .layout--onecol .block-region-content {
+  display: grid;
+  grid-template-rows: repeat(8, 1fr);
+}
 @media (max-width: 891px) {
   .home-page-layout-content .layout-content .layout--onecol .block-region-content {
     display: flex;
     flex-direction: column;
   }
 }
+.home-page-layout-content .layout-content .layout--onecol .block-region-content .block-block-content3d4d153c-9da8-49e2-be7a-d2245f5716ee {
+  grid-row: 1/span 3;
+}
 .home-page-layout-content .layout-content .layout--onecol .block-region-content .block-views-blockhome-block-1 {
+  grid-row: 2/span 6;
   margin-bottom: 2rem;
 }
 @media (max-width: 500px) {
@@ -1580,6 +1604,33 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
   width: 70%;
 }
 
+.home-page-layout-content .block-block-content3d4d153c-9da8-49e2-be7a-d2245f5716ee {
+  border: solid #fdc300 1px;
+  background-color: rgb(255, 255, 255);
+  font-weight: 800;
+  padding: 2rem;
+  margin-right: 1rem;
+  width: 20%;
+  margin-left: 8%;
+  padding-top: 0.5rem;
+  padding-left: 0.5rem;
+  padding-bottom: 5rem;
+}
+@media (max-width: 891px) {
+  .home-page-layout-content .block-block-content3d4d153c-9da8-49e2-be7a-d2245f5716ee {
+    margin-bottom: 1rem;
+  }
+}
+.home-page-layout-content .block-block-content3d4d153c-9da8-49e2-be7a-d2245f5716ee p {
+  margin: 0;
+}
+.home-page-layout-content .block-block-content3d4d153c-9da8-49e2-be7a-d2245f5716ee strong {
+  font-size: 1.3rem;
+}
+.home-page-layout-content .block-views-blocksites-block-1 {
+  top: -60px;
+  position: relative;
+}
 .home-page-layout-content .block-views-blocksites-block-1 .views-row .node-type-site {
   width: 70%;
   margin: auto;
@@ -1637,20 +1688,6 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
 .home-page-layout-content .block-views-blocksites-block-1 .views-row .node-type-site .filtered-content .field--name-field-architecte {
   order: 4;
 }
-.home-page-layout-content .block-block-content3d4d153c-9da8-49e2-be7a-d2245f5716ee {
-  border: solid #fdc300 1px;
-  background-color: rgb(255, 255, 255);
-  font-weight: 800;
-  padding: 2rem;
-  margin-right: 1rem;
-  width: 20%;
-  margin-left: 8%;
-}
-@media (max-width: 891px) {
-  .home-page-layout-content .block-block-content3d4d153c-9da8-49e2-be7a-d2245f5716ee {
-    margin-bottom: 1rem;
-  }
-}
 .home-page-layout-content .block-block-contentbbaa5e2a-7f7c-498f-b08e-d1a3b36c03a8 {
   width: fit-content;
   margin: auto;
@@ -1741,6 +1778,7 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
 }
 
 .block-views-blockactus-block-1 {
+  display: none;
   background-color: white;
 }
 .block-views-blockactus-block-1 h2 {
@@ -1802,3 +1840,117 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
   margin: auto;
   padding-top: 5rem;
 }
+
+.page-programme .block-region-first {
+  padding-left: 18%;
+}
+.page-programme .block-region-second h2 {
+  font-weight: 1000;
+}
+.page-programme .block-region-second .view-display-id-block_1 {
+  margin: 0;
+  width: 80%;
+  padding-top: 1rem;
+}
+.page-programme .block-region-second .block-config-pages-block {
+  margin: 0;
+  width: 80%;
+  padding-top: 1rem;
+}
+.page-programme .block-region-second .block-config-pages-block .config_pages--partenaires--full .paragraph--type--partenaire {
+  width: 100%;
+  padding-bottom: 3rem;
+  display: grid;
+  grid-template-columns: repeat(7, 1fr);
+  grid-template-rows: repeat(auto-fill);
+}
+@media (max-width: 810px) {
+  .page-programme .block-region-second .block-config-pages-block .config_pages--partenaires--full .paragraph--type--partenaire {
+    display: flex;
+    flex-direction: column;
+  }
+}
+.page-programme .block-region-second .block-config-pages-block .config_pages--partenaires--full .paragraph--type--partenaire .field--name-field-logo {
+  grid-column: 1/2;
+  grid-row: 2;
+  margin-top: 2rem;
+  padding-right: 1rem;
+}
+.page-programme .block-region-second .block-config-pages-block .config_pages--partenaires--full .paragraph--type--partenaire .field--name-field-nom {
+  grid-column: 2/8;
+  grid-row: 1;
+  font-weight: 900;
+  font-size: 1.2rem;
+}
+.page-programme .block-region-second .block-config-pages-block .config_pages--partenaires--full .paragraph--type--partenaire .field--name-field-texte {
+  grid-column: 2/8;
+  grid-row: 2;
+}
+.page-programme .block-region-second .block-config-pages-block .config_pages--partenaires--full .paragraph--type--partenaire .field--name-field-texte span {
+  background-color: none;
+}
+.page-programme .block-region-second .block-config-pages-block .config_pages--partenaires--full .paragraph--type--partenaire .field--name-field-lien {
+  grid-column: 2/8;
+  grid-row: 3;
+}
+
+.page-node-site .block-region-first .block-entity-fieldnodefield-fichiers {
+  width: 80%;
+  margin: auto;
+}
+.page-node-site .block-region-second {
+  width: 50%;
+}
+.page-node-site .block-region-second img {
+  width: 100%;
+  height: auto;
+}
+.page-node-site .block-region-second .block-entity-fieldnodetitle {
+  order: 2;
+  margin: 0;
+  font-size: 1.3rem;
+  font-weight: 900;
+}
+.page-node-site .block-region-second .field--name-field-numero-site {
+  order: 1;
+  text-transform: uppercase;
+  font-size: 1.5rem;
+}
+.page-node-site .block-region-second .field--name-field-adresse-site {
+  order: 3;
+  font-size: 1.3rem;
+  line-height: 0.3rem;
+}
+.page-node-site .block-region-second .field--name-field-adresse-site .address {
+  margin: 0;
+  display: inline-flex;
+}
+.page-node-site .block-region-second .field--name-field-adresse-site .address .postal-code {
+  order: 2;
+}
+.page-node-site .block-region-second .field--name-field-adresse-site .address .locality {
+  order: 1;
+  text-transform: capitalize;
+  margin-right: 0.5rem;
+}
+.page-node-site .block-region-second .field--name-field-adresse-site .address .country {
+  display: none;
+}
+.page-node-site .block-region-second .field--name-field-architecte {
+  order: 4;
+  padding-top: 1rem;
+}
+.page-node-site .block-region-second ul.links {
+  order: 5;
+  text-transform: uppercase;
+  padding: 0;
+  margin: 0;
+  border: none;
+  padding-bottom: 2rem;
+  padding-top: 0.9rem;
+  display: inline-flex;
+}
+.page-node-site .block-region-second ul.links::after {
+  content: url("../../dist/images/noun-arrow-1569918-black.svg");
+  padding-left: 0.5rem;
+}

web/themes/custom/reha/reha.theme

@@ -22,12 +22,7 @@ function reha_preprocess_html(&$variables) {
     }
 }
 
-/**
- * Implements hook_preprocess_HOOK() for page.html.twig.
- */
-function reha_preprocess_page(&$variables) {
 
-}
 
 /**
  * Implements hook_preprocess_HOOK() for node.html.twig.
@@ -57,6 +52,27 @@ function reha_preprocess_node(&$variables) {
 
 }
 
+/**
+ * Implements hook_preprocess_HOOK() for page templates.
+ */
+function reha_preprocess_page(&$variables) {
+  // Vérifiez si c'est une page de nœud.
+  if ($node = \Drupal::routeMatch()->getParameter('node')) {
+    if ($node instanceof \Drupal\node\NodeInterface) {
+      // Ajoutez une classe unique basée sur le nid (Node ID).
+      $variables['attributes']['class'][] = 'page-node-' . $node->id();
+
+      // Ajoutez un ID unique basé sur le nid.
+      $variables['attributes']['id'] = 'page-node-' . $node->id();
+    }
+  }
+  else {
+    // Si ce n'est pas une page de nœud, vous pouvez ajouter un ID basé sur le nom de la route.
+    $route_name = \Drupal::routeMatch()->getRouteName();
+    $variables['attributes']['id'] = 'page-' . str_replace('.', '-', $route_name);
+  }
+}
+
 
 // /**
 //  * Implements hook_preprocess_HOOK() for node templates.

web/themes/custom/reha/scss/global/_layout.scss

@@ -40,7 +40,15 @@ $width-menu-slidedown : 550px;
     @media (max-width:500px) {
        padding-top: 0;
     }
-
+    .layout__region--first{
+        flex: 0 1 25%;
+    }
+    .layout__region--second{
+        flex: 0 1 75%;
+        &.view-id-home{
+            margin: 0;
+        }
+    }
         
 }
 
@@ -78,3 +86,7 @@ main{
 #block-reha-titredepage{
     display: none;
 }
+
+p{
+    background-color: transparent;
+}

web/themes/custom/reha/scss/global/variables/_buttons.scss

@@ -13,16 +13,17 @@
     
 }
 
-// %hoveryellow{
+%hoveryellow{
-//     :hover{
+    :hover{
-//         background-color: $yellow-puca;
+        background-color: $yellow-puca;
-//     }
+    }
-// }
+}
 
 
 .field--type-link {
     @extend %buttonwithborder;
     width: fit-content;
+    padding: 0.4rem;
 
 }
 .bouton{
@@ -62,14 +63,16 @@
     display: none;
 }
 
-#edit-submit:hover{
-    background-color: $yellow-puca;
-}
-.views-field-edit-node:hover{
-    background-color: $yellow-puca;
-}
-.form-submit:hover{
-    background-color: $yellow-puca;
 
+.views-field-edit-node:hover,
+.field--name-field-lien:hover,
+#edit-submit:hover,
+.form-submit:hover,
+.field--type-link:hover,
+.field--type-file:hover{
+    background-color: $yellow-puca;
 }
  
+
+
+

web/themes/custom/reha/scss/global/variables/mixin.scss

@@ -8,3 +8,36 @@
     }
   }
   
+@mixin node-site {
+  h2{
+    order: 2;
+    margin: 0;
+  }
+  .field--name-field-numero-site {
+      order: 1;
+      text-transform: uppercase;
+      font-size: 2rem;
+  }
+  .field--name-field-adresse-site{
+      order: 3;
+      font-size: 1.5rem;
+      .address{
+          margin: 0;
+          display: inline-flex;
+          .postal-code{
+              order: 2;
+          }
+          .locality{
+              order: 1;
+              text-transform: capitalize;
+              margin-right: 0.5rem;
+          }
+          .country{
+              display: none;
+          }
+      }
+  }
+  .field--name-field-architecte{
+      order: 4;
+  }
+}

web/themes/custom/reha/scss/pages/_home.scss

@@ -43,16 +43,20 @@
             }
 
             .block-region-content{
-                // display: grid;
+                display: grid;
                 // grid-column: repeat(2, 1fr);
+                grid-template-rows: repeat(8, 1fr);
                 @media(max-width: 891px){
                     display: flex;
                     flex-direction: column;
                 
                 }
+                .block-block-content3d4d153c-9da8-49e2-be7a-d2245f5716ee{
+                    grid-row: 1 /span 3;
+                }
                 .block-views-blockhome-block-1{
                     // grid-column: 1 /span 2;
-                    // grid-row: 1;
+                    grid-row: 2 /span 6;
                     margin-bottom: 2rem;
                     @media(max-width: 500px){
                         img{

web/themes/custom/reha/scss/pages/home/home-view-actualites.scss

@@ -1,4 +1,5 @@
 .block-views-blockactus-block-1{
+    display:none;
     background-color: white;
     h2{
         width: 80%;

web/themes/custom/reha/scss/pages/home/home-view-sites.scss

@@ -1,6 +1,29 @@
 .home-page-layout-content {
     
+    .block-block-content3d4d153c-9da8-49e2-be7a-d2245f5716ee{
+    border: solid $yellow-puca 1px;
+    background-color: $white-button;
+    font-weight: 800;
+    padding: 2rem;
+    margin-right: 1rem;
+    width: 20%;
+    margin-left: 8%;
+    padding-top: 0.5rem;
+    padding-left: 0.5rem;
+    padding-bottom: 5rem;
+    @media(max-width: 891px){
+        margin-bottom: 1rem;
+        // margin: auto;
+    }
+    p{margin: 0;}
+    strong{
+        font-size: 1.3rem;
+    }
+    }
     .block-views-blocksites-block-1 {
+        top: -60px;
+        position: relative;
+    
         .views-row{
 
             .node-type-site{
@@ -64,19 +87,7 @@
         }
        
     }
-    .block-block-content3d4d153c-9da8-49e2-be7a-d2245f5716ee{
+    
-            border: solid $yellow-puca 1px;
-            background-color: $white-button;
-            font-weight: 800;
-            padding: 2rem;
-            margin-right: 1rem;
-            width: 20%;
-            margin-left: 8%;
-            @media(max-width: 891px){
-                margin-bottom: 1rem;
-                // margin: auto;
-            }
-    }
     .block-block-contentbbaa5e2a-7f7c-498f-b08e-d1a3b36c03a8{
 
         width: fit-content;

web/themes/custom/reha/scss/pages/le-programme.scss

@@ -0,0 +1,70 @@
+
+.page-programme{
+    .block-region-first{
+        padding-left: 18%;
+    }
+    .block-region-second{
+        h2{
+            font-weight: 1000;
+        }
+        .view-display-id-block_1{
+            margin: 0;
+            width: 80%;
+            padding-top: 1rem;
+       }
+    
+      
+    
+      .block-config-pages-block{
+        margin: 0;
+        width: 80%;
+        padding-top: 1rem;
+        .config_pages--partenaires--full{
+           
+            .paragraph--type--partenaire{
+                // background-color: $white;
+                width: 100%;
+                padding-bottom: 3rem;
+                display: grid;
+                grid-template-columns: repeat(7, 1fr);
+                grid-template-rows: repeat(auto-fill);
+                @media (max-width: 810px){
+                    display: flex;
+                    flex-direction: column;
+                }
+                .field--name-field-logo{
+                
+                    grid-column: 1 / 2;
+                    grid-row:  2;
+                    margin-top: 2rem;
+                    padding-right: 1rem;
+                }
+                .field--name-field-nom{
+                    grid-column: 2 / 8;
+                    grid-row:  1;
+                    font-weight: 900;
+                    font-size: 1.2rem
+                    
+                }
+                .field--name-field-texte{
+                    grid-column: 2 / 8;
+                    grid-row:  2;
+                    span{
+                        background-color: none;
+                    }
+                }
+                .field--name-field-lien{
+                    grid-column: 2 / 8;
+                    grid-row:  3;
+                }
+               
+            
+            }
+        }
+    
+      }
+
+
+    }
+}
+

web/themes/custom/reha/scss/pages/node-site.scss

@@ -0,0 +1,73 @@
+
+
+.page-node-site{
+    .block-region-first{
+        .block-entity-fieldnodefield-fichiers{
+            width: 80%;
+            margin: auto;
+        }
+    }
+    .block-region-second{
+        width: 50%;
+        img{
+            width: 100%;
+            // object-fit: contain;
+            height: auto;
+        }
+        .block-entity-fieldnodetitle{
+            order: 2;
+            margin: 0;
+            font-size: 1.3rem;
+            font-weight: 900;
+    
+        }
+        .field--name-field-numero-site {
+            order: 1;
+            text-transform: uppercase;
+            font-size: 1.5rem;
+        }
+        .field--name-field-adresse-site{
+            order: 3;
+            font-size: 1.3rem;
+            line-height: 0.3rem;
+        
+            .address{
+                margin: 0;
+                display: inline-flex;
+                .postal-code{
+                    order: 2;
+                }
+                .locality{
+                    order: 1;
+                    text-transform: capitalize;
+                    margin-right: 0.5rem;
+                }
+                .country{
+                    display: none;
+                }
+            }
+        }
+        .field--name-field-architecte{
+            order: 4;
+            padding-top: 1rem;
+        }
+        ul.links{
+            order: 5;
+            text-transform: uppercase;
+            padding: 0;
+            margin: 0;
+            border: none;
+            padding-bottom: 2rem;
+            padding-top: 0.9rem;
+            display: inline-flex;
+            &::after{
+                content:url("../../dist/images/noun-arrow-1569918-black.svg");
+                padding-left: 0.5rem;
+            }
+    
+        }
+    }
+
+
+
+}

web/themes/custom/reha/scss/partials/_slick-theme.scss

@@ -64,7 +64,7 @@ $slick-opacity-not-active: 0.25 !default;
 .slick-next {
     position: absolute;
     display: block;
-    z-index: 999;
+    z-index: 9;
     height: 20px;
     width: 20px;
     line-height: 0px;
@@ -72,7 +72,7 @@ $slick-opacity-not-active: 0.25 !default;
     cursor: pointer;
     background: transparent;
     color: transparent;
-    top: 50%;
+    top: 25%;
     -webkit-transform: translate(0, -50%);
     -ms-transform: translate(0, -50%);
     transform: translate(0, -50%);
@@ -103,14 +103,19 @@ $slick-opacity-not-active: 0.25 !default;
 
 .slick-prev {
     left: -25px;
+    padding-left: 4rem;
     [dir="rtl"] & {
         left: auto;
         right: 200px;
     }
     &:before {
         content: $slick-prev-character;
+        font-weight: lighter;
+
         [dir="rtl"] & {
             content: $slick-next-character;
+            font-weight: lighter;
+
         }
     }
 }
@@ -123,8 +128,12 @@ $slick-opacity-not-active: 0.25 !default;
     }
     &:before {
         content: $slick-next-character;
+        font-weight: lighter;
+
         [dir="rtl"] & {
             content: $slick-prev-character;
+            font-weight: lighter;
+
         }
     }
 }

web/themes/custom/reha/scss/reha.scss

@@ -24,7 +24,6 @@
 @import "partials/slick";
 @import "partials/slick_custom";
 
-
 /*pages*/
 @import "pages/home";
 @import "pages/creer-un-compte";
@@ -37,3 +36,5 @@
 @import "pages/les-sites-pilotes";
 @import "pages/home/home-view-actualites";
 @import "pages/home/home-view-presentation";
+@import "pages/le-programme";
+@import "pages/node-site";

web/themes/custom/reha/templates/page--node.html.twig

@@ -0,0 +1,97 @@
+{#
+/**
+ * @file
+ * Default theme implementation to display a single page.
+ *
+ * The doctype, html, head and body tags are not in this template. Instead they
+ * can be found in the html.html.twig template in this directory.
+ *
+ * Available variables:
+ *
+ * General utility variables:
+ * - base_path: The base URL path of the Drupal installation. Will usually be
+ *   "/" unless you have installed Drupal in a sub-directory.
+ * - is_front: A flag indicating if the current page is the front page.
+ * - logged_in: A flag indicating if the user is registered and signed in.
+ * - is_admin: A flag indicating if the user has permission to access
+ *   administration pages.
+ *
+ * Site identity:
+ * - front_page: The URL of the front page. Use this instead of base_path when
+ *   linking to the front page. This includes the language domain or prefix.
+ *
+ * Page content (in order of occurrence in the default page.html.twig):
+ * - messages: Status and error messages. Should be displayed prominently.
+ * - node: Fully loaded node, if there is an automatically-loaded node
+ *   associated with the page and the node ID is the second argument in the
+ *   page's path (e.g. node/12345 and node/12345/revisions, but not
+ *   comment/reply/12345).
+ *
+ * Regions:
+ * - page.header: Items for the header region.
+ * - page.primary_menu: Items for the primary menu region.
+ * - page.secondary_menu: Items for the secondary menu region.
+ * - page.highlighted: Items for the highlighted content region.
+ * - page.help: Dynamic help text, mostly for admin pages.
+ * - page.content: The main content of the current page.
+ * - page.sidebar_first: Items for the first sidebar.
+ * - page.sidebar_second: Items for the second sidebar.
+ * - page.footer: Items for the footer region.
+ * - page.breadcrumb: Items for the breadcrumb region.
+ *
+ * @see template_preprocess_page()
+ * @see html.html.twig
+ *
+ * @ingroup themeable
+ */
+#}
+<div class="layout-container page-node-site">
+
+  <header role="banner">
+    {{ page.header }}
+  </header>
+
+  {{ page.primary_menu }}
+  {{ page.secondary_menu }}
+
+  {{ page.breadcrumb }}
+
+  {{ page.highlighted }}
+
+  {{ page.help }}
+
+  <main role="main">
+    <a id="main-content" tabindex="-1"></a>{# link is in html.html.twig #}
+
+    <div class="layout-content home-page-layout-content">
+      {{ page.content }}
+    </div>{# /.layout-content #}
+
+    {% if page.sidebar_first %}
+      <aside class="layout-sidebar-first" role="complementary">
+        {{ page.sidebar_first }}
+      </aside>
+    {% endif %}
+
+    {% if page.sidebar_second %}
+      <aside class="layout-sidebar-second" role="complementary">
+        {{ page.sidebar_second }}
+      </aside>
+    {% endif %}
+
+  </main>
+
+  {% if page.footer_top or page.footer_left or page.footer_middle or page.footer_right or page.footer_bottom %}
+    <footer role="contentinfo">
+      <section id="footer-top">{{ page.footer_top }}</section> 
+      <div>
+        <section id="footer-left">{{ page.footer_left }}</section> 
+        <section id="footer-middle">{{ page.footer_middle }}</section> 
+        <section id="footer-right">{{ page.footer_right }}</section> 
+      </div> 
+      <section id="footer-bottom">{{ page.footer_bottom }}</section> 
+    </footer>
+  {% endif %}
+
+
+</div>{# /.layout-container #}

web/themes/custom/reha/templates/page--programme.html.twig

@@ -0,0 +1,97 @@
+{#
+/**
+ * @file
+ * Default theme implementation to display a single page.
+ *
+ * The doctype, html, head and body tags are not in this template. Instead they
+ * can be found in the html.html.twig template in this directory.
+ *
+ * Available variables:
+ *
+ * General utility variables:
+ * - base_path: The base URL path of the Drupal installation. Will usually be
+ *   "/" unless you have installed Drupal in a sub-directory.
+ * - is_front: A flag indicating if the current page is the front page.
+ * - logged_in: A flag indicating if the user is registered and signed in.
+ * - is_admin: A flag indicating if the user has permission to access
+ *   administration pages.
+ *
+ * Site identity:
+ * - front_page: The URL of the front page. Use this instead of base_path when
+ *   linking to the front page. This includes the language domain or prefix.
+ *
+ * Page content (in order of occurrence in the default page.html.twig):
+ * - messages: Status and error messages. Should be displayed prominently.
+ * - node: Fully loaded node, if there is an automatically-loaded node
+ *   associated with the page and the node ID is the second argument in the
+ *   page's path (e.g. node/12345 and node/12345/revisions, but not
+ *   comment/reply/12345).
+ *
+ * Regions:
+ * - page.header: Items for the header region.
+ * - page.primary_menu: Items for the primary menu region.
+ * - page.secondary_menu: Items for the secondary menu region.
+ * - page.highlighted: Items for the highlighted content region.
+ * - page.help: Dynamic help text, mostly for admin pages.
+ * - page.content: The main content of the current page.
+ * - page.sidebar_first: Items for the first sidebar.
+ * - page.sidebar_second: Items for the second sidebar.
+ * - page.footer: Items for the footer region.
+ * - page.breadcrumb: Items for the breadcrumb region.
+ *
+ * @see template_preprocess_page()
+ * @see html.html.twig
+ *
+ * @ingroup themeable
+ */
+#}
+<div class="layout-container page-programme">
+
+  <header role="banner">
+    {{ page.header }}
+  </header>
+
+  {{ page.primary_menu }}
+  {{ page.secondary_menu }}
+
+  {{ page.breadcrumb }}
+
+  {{ page.highlighted }}
+
+  {{ page.help }}
+
+  <main role="main">
+    <a id="main-content" tabindex="-1"></a>{# link is in html.html.twig #}
+
+    <div class="layout-content home-page-layout-content">
+      {{ page.content }}
+    </div>{# /.layout-content #}
+
+    {% if page.sidebar_first %}
+      <aside class="layout-sidebar-first" role="complementary">
+        {{ page.sidebar_first }}
+      </aside>
+    {% endif %}
+
+    {% if page.sidebar_second %}
+      <aside class="layout-sidebar-second" role="complementary">
+        {{ page.sidebar_second }}
+      </aside>
+    {% endif %}
+
+  </main>
+
+  {% if page.footer_top or page.footer_left or page.footer_middle or page.footer_right or page.footer_bottom %}
+    <footer role="contentinfo">
+      <section id="footer-top">{{ page.footer_top }}</section> 
+      <div>
+        <section id="footer-left">{{ page.footer_left }}</section> 
+        <section id="footer-middle">{{ page.footer_middle }}</section> 
+        <section id="footer-right">{{ page.footer_right }}</section> 
+      </div> 
+      <section id="footer-bottom">{{ page.footer_bottom }}</section> 
+    </footer>
+  {% endif %}
+
+
+</div>{# /.layout-container #}