From dc62aeb213aa68051aaaf3ddc2f25be4e4d6d466 Mon Sep 17 00:00:00 2001
From: Jacky Zhao <j.zhao2k19@gmail.com>
Date: Fri, 02 Feb 2024 07:55:40 +0000
Subject: [PATCH] pkg: bump to 4.2.0

---
 quartz/components/styles/search.scss |  100 +++++++++++++++++++++++++------------------------
 1 files changed, 51 insertions(+), 49 deletions(-)

diff --git a/quartz/components/styles/search.scss b/quartz/components/styles/search.scss
index 5304618..df4f5ba 100644
--- a/quartz/components/styles/search.scss
+++ b/quartz/components/styles/search.scss
@@ -54,15 +54,11 @@
     }
 
     & > #search-space {
-      width: 50%;
+      width: 65%;
       margin-top: 12vh;
       margin-left: auto;
       margin-right: auto;
 
-      @media all and (max-width: $fullPageWidth) {
-        width: 90%;
-      }
-
       & > * {
         width: 100%;
         border-radius: 5px;
@@ -89,17 +85,35 @@
       & > #search-layout {
         display: flex;
         flex-direction: row;
-        justify-content: space-between;
-        opacity: 0;
+        visibility: hidden;
+        border: 1px solid var(--lightgray);
 
-        & > * {
-          height: calc(75vh - 20em);
-          background: none;
-          border-radius: 5px;
-          border: 1px solid var(--lightgray); // Border to define the box
+        @media all and (min-width: $tabletBreakpoint) {
+          &[data-preview] {
+            & .result-card > p.preview {
+              display: none;
+            }
+          }
         }
 
-        @media all and (max-width: $mobileBreakpoint) {
+        & > div {
+          // vh - #search-space.margin-top
+          height: calc(75vh - 12vh);
+          background: none;
+
+          &:first-child {
+            border-top-left-radius: 5px;
+            border-bottom-left-radius: 5px;
+            border-right: 1px solid var(--lightgray);
+          }
+
+          &:last-child {
+            border-top-right-radius: 5px;
+            border-bottom-right-radius: 5px;
+          }
+        }
+
+        @media all and (max-width: $tabletBreakpoint) {
           display: block;
           & > *:not(#results-container) {
             display: none !important;
@@ -111,27 +125,38 @@
           }
         }
 
+        & .highlight {
+          background: color-mix(in srgb, var(--tertiary) 60%, transparent);
+          border-radius: 5px;
+        }
+
         & > #preview-container {
           display: block;
           box-sizing: border-box;
           overflow: hidden;
 
           & .preview-inner {
+            margin: 0 auto;
             padding: 1em;
             height: 100%;
+            width: 100%;
             box-sizing: border-box;
             overflow-y: auto;
             font-family: inherit;
-            font-size: 1.1em;
             color: var(--dark);
             line-height: 1.5em;
             font-weight: 400;
             background: var(--light);
-            border-radius: 5px;
+            border-top-right-radius: 5px;
+            border-bottom-right-radius: 5px;
             box-shadow:
               0 14px 50px rgba(27, 33, 48, 0.12),
               0 10px 30px rgba(27, 33, 48, 0.16);
           }
+
+          a.internal {
+            background-color: none;
+          }
         }
 
         & > #results-container {
@@ -141,6 +166,7 @@
             padding: 1em;
             cursor: pointer;
             transition: background 0.2s ease;
+            border-bottom: 1px solid var(--lightgray);
             width: 100%;
             display: block;
             box-sizing: border-box;
@@ -156,12 +182,6 @@
             outline: none;
             font-weight: inherit;
 
-            & .highlight {
-              color: var(--secondary);
-              font-weight: 700;
-            }
-
-            &:hover,
             &:focus,
             &.focus {
               background: var(--lightgray);
@@ -171,41 +191,23 @@
               margin: 0;
             }
 
-            & > ul > li {
-              margin: 0;
-              display: inline-block;
-              white-space: nowrap;
-              margin: 0;
-              overflow-wrap: normal;
-            }
-
-            & > ul {
-              list-style: none;
-              display: flex;
-              padding-left: 0;
-              gap: 0.4rem;
-              margin: 0;
+            & > ul.tags {
               margin-top: 0.45rem;
-              box-sizing: border-box;
-              overflow: hidden;
-              background-clip: border-box;
+              margin-bottom: 0;
             }
 
             & > ul > li > p {
               border-radius: 8px;
               background-color: var(--highlight);
-              overflow: hidden;
-              background-clip: border-box;
-              padding: 0.03rem 0.4rem;
-              margin: 0;
-              color: var(--secondary);
-              opacity: 0.85;
-            }
-
-            & > ul > li > .match-tag {
-              color: var(--tertiary);
+              padding: 0.2rem 0.4rem;
+              margin: 0 0.1rem;
+              line-height: 1.4rem;
               font-weight: bold;
-              opacity: 1;
+              color: var(--secondary);
+              
+              &.match-tag {
+                color: var(--tertiary);
+              }
             }
 
             & > p {

--
Gitblit v1.10.0