WIP new design

eea · May 31, 2022 · 7ad6e9d · 7ad6e9d
1 parent 3a9880c
commit 7ad6e9d
Show file tree

Hide file tree

Showing 10 changed files with 244 additions and 221 deletions.
diff --git a/src/SearchBlock/less/answersbox.less b/src/SearchBlock/less/answersbox.less
@@ -9,7 +9,7 @@
 
   .buttons {
     .button {
-      background-color: @sf-azure !important;
+      background-color: @s-pine-green !important;
     }
 
     .button:first-child {
@@ -63,7 +63,7 @@
     //     width: 0px;
     //     height: 10px;
     //     animation: progres 4s infinite ease-out;
-    //     background-color: @sf-azure;
+    //     background-color: @s-pine-green;
     //     border-radius: 1px;
     //   }
     // }

diff --git a/src/SearchBlock/less/facets.less b/src/SearchBlock/less/facets.less
@@ -32,8 +32,8 @@ div#page-document .searchlib-block {
       &.checked {
         label {
           &:before {
-            background-color: @sf-azure !important;
-            box-shadow: 0px 0px 0px 2px @sf-azure !important;
+            background-color: @s-pine-green !important;
+            box-shadow: 0px 0px 0px 2px @s-pine-green !important;
           }
         }
       }
@@ -56,21 +56,21 @@ div#page-document .searchlib-block {
     }
   }
 
-  div.content-section-tabs.menu {
+  .content-section-tabs.menu {
     overflow: auto;
     width: 100%;
     max-width: 100%;
     border: none;
     border-top: none;
     border-right: none;
-    border-bottom: 1px solid @sf-light-gray2;
+    border-bottom: 1px solid @s-light-gray;
     border-left: none;
     margin: 0;
     margin-bottom: 3px;
     border-radius: 0px;
     box-shadow: none;
 
-    div.item.dropdown {
+    .item.dropdown {
       padding: 0px 10px 0px 10px;
       border: none;
       border-bottom: 4px solid white;
@@ -105,11 +105,11 @@ div#page-document .searchlib-block {
 
     a.item {
       padding: 0px;
-      border-bottom: 4px solid white;
-      margin-right: 3em;
+      border-bottom: 3px solid white;
+      margin-right: 1.5em;
       border-radius: 0px;
-      color: @sf-dark-gray;
-      font-size: 14px;
+      color: @s-dark-gray;
+      font-size: 18px;
 
       &:hover {
         background: white;
@@ -120,21 +120,22 @@ div#page-document .searchlib-block {
       }
 
       &.active {
-        border-bottom: 4px solid @sf-azure;
+        border-bottom: 3px solid @s-pine-green;
+        color: @s-pine-green;
 
-        .icon {
-          color: @sf-azure !important;
-        }
+        // .icon {
+        //   color: @s-pine-green !important;
+        // }
       }
 
       span.title {
         margin-right: 5px;
       }
 
-      span.count {
-        color: @sf-medium-gray2;
-        font-weight: 400;
-      }
+      // span.count {
+      //   color: @sf-medium-gray2;
+      //   font-weight: 400;
+      // }
     }
   }
 
@@ -331,7 +332,7 @@ div#page-document .searchlib-block {
     margin-right: 0px;
     background: @sf-light-gray !important;
     border-radius: 2px;
-    color: @sf-azure !important;
+    color: @s-pine-green !important;
     float: right;
     font-size: 12px;
   }
@@ -369,7 +370,7 @@ div#page-document .searchlib-block {
       position: absolute;
       top: 10px;
       right: 10px;
-      color: @sf-azure;
+      color: @s-pine-green;
     }
 
     div.meta {
@@ -459,7 +460,7 @@ div#page-document .searchlib-block {
           button {
             padding: 3px;
             background: @sf-light-gray !important;
-            color: @sf-azure;
+            color: @s-pine-green;
             float: right;
             font-size: 10px;
           }
@@ -489,7 +490,7 @@ div#page-document .searchlib-block {
       div.label {
         max-width: 100%;
         background: @sf-light-gray !important;
-        color: @sf-azure;
+        color: @s-pine-green;
         font-weight: 600;
 
         span.text {
@@ -669,7 +670,7 @@ div.ui.modal.facet {
             }
 
             &.active {
-              color: @sf-azure;
+              color: @s-pine-green;
             }
           }
         }
@@ -705,8 +706,8 @@ div.ui.modal.facet {
         &.checked {
           label {
             &:before {
-              background-color: @sf-azure !important;
-              box-shadow: 0px 0px 0px 2px @sf-azure !important;
+              background-color: @s-pine-green !important;
+              box-shadow: 0px 0px 0px 2px @s-pine-green !important;
             }
 
             &:after {
@@ -772,7 +773,7 @@ div.ui.modal.facet {
 
     a.clear-filters {
       margin-left: auto;
-      color: @sf-azure;
+      color: @s-pine-green;
       font-size: 12px;
     }
   }

diff --git a/src/SearchBlock/less/filterlist.less b/src/SearchBlock/less/filterlist.less
@@ -1,4 +1,11 @@
 div#page-document .searchlib-block {
+  .top-facetslist-wrapper {
+    padding: 0em;
+    border: 0px;
+    margin: 0em;
+    box-shadow: none;
+  }
+
   .ui.inverted.segment.filter-list {
     padding: 0.4rem;
     background-color: #004b87;
@@ -48,7 +55,7 @@ div#page-document .searchlib-block {
       div.filter-list-header {
         padding-right: 0.5rem;
         padding-left: 0.5rem;
-        color: @sf-azure !important;
+        color: @s-pine-green !important;
         font-size: 14px;
 
         i.dropdown.icon {
@@ -94,7 +101,7 @@ div#page-document .searchlib-block {
       }
 
       button.reset-filters {
-        color: @sf-azure !important;
+        color: @s-pine-green !important;
         font-size: 14px;
 
         i.icon {
@@ -114,7 +121,7 @@ div#page-document .searchlib-block {
     margin-right: 0px;
     background: @sf-light-gray !important;
     border-radius: 2px;
-    color: @sf-azure !important;
+    color: @s-pine-green !important;
     float: right;
     font-size: 12px;
   }
@@ -147,7 +154,7 @@ div#page-document .searchlib-block {
       position: absolute;
       top: 10px;
       right: 10px;
-      color: @sf-azure;
+      color: @s-pine-green;
     }
 
     div.meta {
@@ -234,7 +241,7 @@ div#page-document .searchlib-block {
             button {
               padding: 3px;
               background: @sf-light-gray !important;
-              color: @sf-azure;
+              color: @s-pine-green;
               float: right;
               font-size: 10px;
             }
@@ -262,7 +269,7 @@ div#page-document .searchlib-block {
       &.active {
         .label {
           max-width: 100%;
-          color: @sf-azure;
+          color: @s-pine-green;
           font-weight: 600;
 
           .text {

diff --git a/src/SearchBlock/less/paging.less b/src/SearchBlock/less/paging.less
@@ -10,6 +10,6 @@ div.prev-next-paging button.next,
 div.prev-next-paging button.prev,
 button.download-btn {
   background: @sf-light-gray !important;
-  color: @sf-azure !important;
+  color: @s-pine-green !important;
   font-size: 10px !important;
 }