Selaa lähdekoodia

css form connected

ouidade 1 vuosi sitten
vanhempi
commit
e78a3cda24

+ 28 - 12
web/themes/custom/reha/css/reha.css

@@ -25,6 +25,9 @@
   width: fit-content;
   margin-top: 1rem; }
 
+.views-field-edit-user:hover {
+  background-color: #fdc300; }
+
 #edit-unlock {
   display: none; }
 
@@ -321,17 +324,30 @@ header {
           box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
           clip-path: inset(0px -10px -10px -10px);
           padding: 5% 10% 5% 45%; }
-          header .region-header #block-reha-views-block-current-user-block-block-1 .connected .connected-full ul {
-            width: 70%;
-            display: flex;
-            flex-direction: column;
-            padding-left: 0; }
-            header .region-header #block-reha-views-block-current-user-block-block-1 .connected .connected-full ul li {
-              text-transform: uppercase;
-              padding: 1rem;
-              border: solid black 1px;
-              margin-bottom: 1rem;
-              background-color: white; }
+          header .region-header #block-reha-views-block-current-user-block-block-1 .connected .connected-full footer {
+            font-weight: 400;
+            font-size: 1rem;
+            margin-top: 2rem;
+            border-top: 1px solid black;
+            padding-top: 1.5rem; }
+            header .region-header #block-reha-views-block-current-user-block-block-1 .connected .connected-full footer ul {
+              width: 45%;
+              display: flex;
+              flex-direction: column-reverse;
+              padding-left: 0; }
+              header .region-header #block-reha-views-block-current-user-block-block-1 .connected .connected-full footer ul li:first-of-type {
+                margin-top: 4rem;
+                border-bottom: 1px solid black; }
+              header .region-header #block-reha-views-block-current-user-block-block-1 .connected .connected-full footer ul li {
+                text-transform: uppercase;
+                padding: 1rem;
+                border: solid black 1px;
+                margin-bottom: 1rem;
+                background-color: white; }
+              header .region-header #block-reha-views-block-current-user-block-block-1 .connected .connected-full footer ul li:hover {
+                background-color: #fdc300; }
+  header html.js body div.dialog-off-canvas-main-canvas div.layout-container header div.region.region-header div#block-reha-views-block-current-user-block-block-1.views-element-container.block.block-views.block-views-blockcurrent-user-block-block-1 div.connected div.connected-full div div.js-view-dom-id-426705c0f405ba1cfc7a9eac64ddbe6f543fe3a21a71f2a99ef49ced31b93bc1 footer ul li {
+    border-top: 1px solid black; }
   header .bouton {
     align-self: flex-end;
     width: fit-content; }
@@ -347,7 +363,7 @@ header {
       content: url(../images/noun-cross-1151731.svg);
       float: right;
       position: relative;
-      left: 200px;
+      left: 90px;
       cursor: pointer; }
 
 footer {

+ 14 - 1
web/themes/custom/reha/scss/global/variables/_buttons.scss

@@ -7,8 +7,16 @@
     border: solid black 1px;
     margin-bottom: 1rem;
     background-color: $white-button;
+    
 }
 
+// %hoveryellow{
+//     :hover{
+//         background-color: $yellow-puca;
+//     }
+// }
+
+
 .field--type-link {
     @extend %buttonwithborder;
     width: fit-content;
@@ -42,8 +50,13 @@
 .views-field-edit-user{
     @extend %buttonwithborder;
     width: fit-content;
-    margin-top: 1rem;
+    margin-top: 1rem;  
 }
+
+.views-field-edit-user:hover{
+    background-color: $yellow-puca;
+}
+
 footer{
 
 }

+ 41 - 13
web/themes/custom/reha/scss/partials/_header.scss

@@ -193,25 +193,53 @@ header{
                     box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
                     clip-path: inset(0px -10px -10px -10px);
                     padding: 5% 10% 5% 45%;
-                    ul{
-                        width: 70%;
-                        display: flex;
-                        flex-direction: column;
-                        padding-left: 0;
-                        li{
-                            // margin-bottom: 3rem;
-                            text-transform: uppercase;
-                            padding: 1rem;
-                            border: solid black 1px;
-                            margin-bottom: 1rem;
-                            background-color: $white-button;
+                
+                    footer{
+                        font-weight: 400;
+                        font-size: 1rem;
+                        margin-top: 2rem;
+                        border-top: 1px solid black;
+                        padding-top: 1.5rem;
+                        ul{
+                            width: 45%;
+                            display: flex;
+                            flex-direction: column-reverse;
+                            padding-left: 0;
+                            // border-bottom: 1px solid black ;
+                            li:first-of-type{
+                                margin-top: 4rem;
+                                border-bottom: 1px solid black ;
+                                // background-color: red;
+                                ::before{
+
+                                }
+                            }
+                            li{
+                                // margin-bottom: 3rem;
+                                text-transform: uppercase;
+                                padding: 1rem;
+                                border: solid black 1px;
+                                margin-bottom: 1rem;
+                                background-color: $white-button;
+                            }
+                            li:hover{
+                                background-color: $yellow-puca;
+                            }
+                            :first-child{
+                                // border-top: 1px solid black ;
+                                // margin-top: 2rem;
+                                // padding-top: 5px;
+                            }
                         }
                     }
                 }
             }
         }
     }
+    html.js body div.dialog-off-canvas-main-canvas div.layout-container header div.region.region-header div#block-reha-views-block-current-user-block-block-1.views-element-container.block.block-views.block-views-blockcurrent-user-block-block-1 div.connected div.connected-full div div.js-view-dom-id-426705c0f405ba1cfc7a9eac64ddbe6f543fe3a21a71f2a99ef49ced31b93bc1 footer ul li{
+        border-top: 1px solid black ;
 
+    }
     .bouton{
         align-self: flex-end;
         width: fit-content;
@@ -231,7 +259,7 @@ header{
             content: url(../images/noun-cross-1151731.svg);
             float: right;
             position: relative;
-            left: 200px;
+            left: 90px;
             // bottom: 100px;
             cursor: pointer;
         }