AnswersBox styling

eea · Jun 14, 2022 · dfda196 · dfda196
1 parent 9b6be53
commit dfda196
Show file tree

Hide file tree

Showing 2 changed files with 90 additions and 25 deletions.
diff --git a/src/SearchBlock/less/answersbox.less b/src/SearchBlock/less/answersbox.less
@@ -1,7 +1,49 @@
 .answers-list {
-  max-width: @search-result-max-width;
+  // max-width: @search-result-max-width;
   margin-bottom: 3em;
-  clear: both;
+
+  .answer-header {
+    display: flex;
+    align-items: center;
+
+    .answer-header-title {
+      margin-right: 1.3em;
+      font-size: 16px;
+      font-weight: 700;
+    }
+
+    .ui.basic.button.header-btn {
+      padding: 0.75em;
+      margin: 0;
+      color: @deepBlue !important;
+      font-size: 14px;
+      font-weight: 300;
+
+      &:hover,
+      &:focus,
+      &:active {
+        border: none;
+        background: none !important;
+        box-shadow: none;
+      }
+    }
+  }
+
+  .ui.basic.button.feedback-btn {
+    padding: 0.75em;
+    margin: 0;
+    color: @mediumPersianBlue !important;
+    font-size: 16px;
+    font-weight: 700;
+
+    &:hover,
+    &:focus,
+    &:active {
+      border: none;
+      background: none !important;
+      box-shadow: none;
+    }
+  }
 
   .ui.label {
     float: right;
@@ -76,20 +118,53 @@
   .answer__primary {
     overflow: hidden;
 
+    h3,
+    h3 > a {
+      color: @deepBlue;
+      font-size: 20px;
+      font-weight: 700;
+    }
+
+    span {
+      color: @deepBlue;
+      font-size: 20px !important;
+      line-height: 24px;
+    }
+
     a {
       font-weight: bold;
+
+      > span {
+        color: @linkColor;
+      }
     }
 
-    .answer__primarylink {
-      margin: 1em 0;
-      font-size: 1em;
+    .result__source {
+      margin-top: 0.5em;
+
+      span {
+        font-size: 16px !important;
+      }
+
+      a {
+        color: @mediumPersianBlue;
+        font-weight: normal;
 
-      .result__source {
-        a {
-          font-weight: normal;
+        span {
+          color: @linkColor;
+          font-size: 16px !important;
         }
       }
 
+      .label {
+        margin-right: 0.5em !important;
+      }
+    }
+
+    .answer__primarylink {
+      margin-bottom: 1em;
+      font-size: 1em;
+
       a {
         i.icon {
           color: @sf-dark-gray;
@@ -163,13 +238,13 @@
         text-align: right;
       }
 
-      .answers__bottom__spacer {
-        height: 0.5em;
-        flex-grow: 2;
-        border-bottom: 1px solid @sf-light-gray2;
-        margin-right: 1em;
-        margin-left: 1em;
-      }
+      // .answers__bottom__spacer {
+      //   height: 0.5em;
+      //   flex-grow: 2;
+      //   border-bottom: 1px solid @sf-light-gray2;
+      //   margin-right: 1em;
+      //   margin-left: 1em;
+      // }
 
       .right {
         display: flex;

diff --git a/src/SearchBlock/less/searchresult.less b/src/SearchBlock/less/searchresult.less
@@ -1,13 +1,3 @@
-.result__source {
-  display: flex;
-  column-gap: 0.3em;
-  font-size: x-small;
-
-  a {
-    font-weight: normal;
-  }
-}
-
 .simple-item-extra {
   font-size: 90%;
 }