nom connected

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

@@ -521,8 +521,8 @@ header .region-header #block-reha-config-pages .contacts .contacts-full {
   display: none;
   background-color: rgb(255, 255, 255);
   position: absolute;
-  right: 0px;
-  top: 100%;
+  right: 0%;
+  top: 110px;
   width: 550px;
   padding-left: 3.5rem;
   padding-top: 1rem;
@@ -549,6 +549,7 @@ header .region-header #block-reha-config-pages .contacts .contacts-full {
   }
 }
 header .region-header #block-reha-config-pages .contacts .contacts-full .titre {
+  padding-right: 2rem;
   padding-left: 3rem;
 }
 @media (max-width: 500px) {
@@ -588,6 +589,7 @@ header .region-header #block-reha-config-pages .contacts .field__item {
 }
 header #block-reha-views-block-current-user-block-block-1 {
   grid-column: 9;
+  width: 400px;
   display: flex;
   flex-direction: column;
   height: fit-content;
@@ -595,6 +597,13 @@ header #block-reha-views-block-current-user-block-block-1 {
 header #block-reha-views-block-current-user-block-block-1 .bouton-connected {
   padding-right: 3rem;
 }
+header #block-reha-views-block-current-user-block-block-1 .bouton-connected h2 {
+  font-size: 1rem;
+  color: black;
+  display: flex;
+  flex-direction: column;
+  flex-wrap: nowrap;
+}
 header #block-reha-views-block-current-user-block-block-1 .bouton-connected :before {
   content: url(../images/noun-contact-2495375.svg);
   padding-right: 1rem;
@@ -606,7 +615,7 @@ header #block-reha-views-block-current-user-block-block-1 .connected {
 }
 header #block-reha-views-block-current-user-block-block-1 .connected .connected-full {
   display: none;
-  right: -267px;
+  right: -100%;
   top: 36px;
   position: absolute;
   background-color: rgb(255, 255, 255);
@@ -614,7 +623,7 @@ header #block-reha-views-block-current-user-block-block-1 .connected .connected-
   height: 200vh;
   box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
   clip-path: inset(0px -10px -10px -10px);
-  padding: 5% 10% 5% 45%;
+  padding: 5% 10% 110px 45%;
 }
 @media (max-width: 500px) {
   header #block-reha-views-block-current-user-block-block-1 .connected .connected-full .titre {
@@ -683,16 +692,14 @@ header #block-reha-views-block-current-user-block-block-1 .connected .connected-
 }
 
 .titre {
-  display: inline-flex;
   font-weight: 800;
   font-size: 1.8rem;
-  position: relative;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
 }
-.titre ::after {
+.titre::after {
   content: url(../images/noun-cross-1151731.svg);
-  float: right;
-  position: relative;
-  left: 90px;
   cursor: pointer;
 }
 
@@ -931,7 +938,7 @@ aside.layout-sidebar-second {
   padding-left: 2rem;
 }
 aside.layout-sidebar-second h2 {
-  transform: translateX(-50%) translateY(45vh) rotate(-90deg);
+  transform: translateX(-50%) translateY(40vh) rotate(-90deg);
   text-transform: uppercase;
   font-weight: 400;
 }

web/themes/custom/reha/js/reha.js

@@ -87,6 +87,7 @@ jQuery(document).ready(function($){
       // Ouvrir .tiroir fichiers
       $(".layout-sidebar-second").animate({translate:'0%'},350);
     });
+    
 
 });
 

web/themes/custom/reha/scss/partials/_aside.scss

@@ -41,7 +41,7 @@ aside.layout-sidebar-second{
     z-index: 98;
     padding-left: 2rem;
     h2{
-        transform: translateX(-50%) translateY(45vh) rotate(-90deg);
+        transform: translateX(-50%) translateY(40vh) rotate(-90deg);
         text-transform: uppercase;
         font-weight: 400;
         &::before{

web/themes/custom/reha/scss/partials/_header.scss

@@ -269,8 +269,8 @@ header{
                     display: none;
                     background-color: $white-header;
                     position: absolute;
-                    right:0px;
-                    top: 100%;
+                    right:0%;
+                    top: $header-height;
                     width: $width-menu-slidedown;
                     padding-left: 3.5rem;
                     padding-top: 1rem;
@@ -298,6 +298,7 @@ header{
                     
 
                     .titre{
+                        padding-right: 2rem;
                         padding-left:3rem ;
                         @media (max-width:500px) {
                             padding-left: 1.5rem;
@@ -332,9 +333,18 @@ header{
         }
         #block-reha-views-block-current-user-block-block-1{
             grid-column: 9;
+            width: 400px;
             .bouton-connected{
                 padding-right: 3rem;
-               
+               h2{
+                    // width: fit-content;
+                    font-size: 1rem;
+                    color: black;
+                    display: flex;
+                    flex-direction: column;
+                    // display: inline-flex;
+                    flex-wrap: nowrap;
+               }
                 :before{
                     content: url(../images/noun-contact-2495375.svg);
                     padding-right: 1rem;
@@ -349,7 +359,7 @@ header{
                 position: relative;
                 .connected-full{
                     display: none;
-                    right:-267px;
+                    right:-100%;
                     top: 36px;  // Positionnez-les sous les boutons
                     position: absolute;
                     background-color: $white-header;
@@ -357,7 +367,7 @@ header{
                     height: 200vh;
                     box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
                     clip-path: inset(0px -10px -10px -10px);
-                    padding: 5% 10% 5% 45%;
+                    padding: 5% 10% $header-height 45%;
                     .titre{
                         @media (max-width:500px) {
                             font-size: 1.4rem;
@@ -434,15 +444,18 @@ header{
     }
 
     .titre{
-        display: inline-flex;
+        // display: inline-flex;
         font-weight: 800;
         font-size: 1.8rem;
-        position: relative;
-        ::after{
+        // position: relative;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        &::after{
             content: url(../images/noun-cross-1151731.svg);
-            float: right;
-            position: relative;
-            left: 90px;
+            // float: right;
+            // position: relative;
+            // left: 90px;
             cursor: pointer;
             
     }