css butons

web/themes/custom/reha/css/reha.css

@@ -2,12 +2,14 @@
 /*reha*/
 /*global*/
 /* Colors used for REHA */
-.field--type-link {
+.field--type-link, .field--type-file, .links, .create-account-link, .request-password-link {
   text-transform: uppercase;
   padding: 1rem;
   border: solid black 1px;
   margin-bottom: 1rem;
-  background-color: white;
+  background-color: white; }
+
+.field--type-link {
   width: fit-content; }
 
 .bouton {
@@ -15,20 +17,8 @@
   border: none !important;
   cursor: pointer; }
 
-.field--type-file {
-  text-transform: uppercase;
-  padding: 1rem;
-  border: solid black 1px;
-  margin-bottom: 1rem;
-  background-color: white; }
-
-.links {
-  text-transform: uppercase;
-  padding: 1rem;
-  border: solid black 1px;
-  margin-bottom: 1rem;
-  background-color: white;
-  width: fit-content; }
+.create-account-link {
+  width: 80%; }
 
 .mailto {
   text-decoration: underline; }
@@ -215,6 +205,23 @@ header {
           box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
           clip-path: inset(0px -10px -10px -10px);
           padding: 5% 10% 5% 5%; }
+          header .region-header #block-reha-connexionutilisateur .connexion .connexion-full .titre {
+            width: 100%;
+            position: relative; }
+            header .region-header #block-reha-connexionutilisateur .connexion .connexion-full .titre ::after {
+              position: relative;
+              left: 430px; }
+          header .region-header #block-reha-connexionutilisateur .connexion .connexion-full #user-login-form {
+            width: 70%;
+            display: flex;
+            flex-direction: column;
+            align-items: end; }
+          header .region-header #block-reha-connexionutilisateur .connexion .connexion-full ul {
+            width: 70%;
+            display: flex;
+            flex-direction: column; }
+            header .region-header #block-reha-connexionutilisateur .connexion .connexion-full ul li {
+              margin-bottom: 3rem; }
     header .region-header #block-reha-config-pages {
       grid-column: 10;
       display: flex;

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

@@ -1,12 +1,18 @@
 
 // home 
-.field--type-link{
+
+%buttonwithborder {
     text-transform: uppercase;
     padding: 1rem;
     border: solid black 1px;
     margin-bottom: 1rem;
     background-color: $white-button;
+}
+
+.field--type-link {
+    @extend %buttonwithborder;
     width: fit-content;
+
 }
 .bouton{
     background-color: $white-button !important;
@@ -17,18 +23,17 @@
 
 
 .field--type-file{
-    text-transform: uppercase;
-    padding: 1rem;
-    border: solid black 1px;
-    margin-bottom: 1rem;
-    background-color: $white-button;
+    @extend %buttonwithborder;
 }
 
-.links{
-    text-transform: uppercase;
-    padding: 1rem;
-    border: solid black 1px;
-    margin-bottom: 1rem;
-    background-color: $white-button;
-    width: fit-content;
+.links{    
+    @extend %buttonwithborder;
+}
+
+.create-account-link{
+    @extend %buttonwithborder;
+    width: 80%
+}
+.request-password-link{
+    @extend %buttonwithborder;
 }

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

@@ -69,6 +69,28 @@ header{
                     box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
                     clip-path: inset(0px -10px -10px -10px);
                     padding: 5% 10% 5% 5%;
+                    .titre{
+                        width: 100%;
+                        position: relative;
+                        ::after{
+                            position: relative;
+                            left: 430px;
+                        }
+                    }
+                    #user-login-form{
+                        width: 70%;
+                        display: flex;
+                        flex-direction: column;
+                        align-items: end;
+                    }
+                    ul{
+                        width: 70%;
+                        display: flex;
+                        flex-direction: column;
+                        li{
+                            margin-bottom: 3rem;
+                        }
+                    }
                 }
             }