From fa6c02d3213dfd4e6da8e78bd3a2e7004555fd01 Mon Sep 17 00:00:00 2001
From: Jacky Zhao <j.zhao2k19@gmail.com>
Date: Wed, 24 Jan 2024 01:08:56 +0000
Subject: [PATCH] fix: make search result card block

---
 quartz/components/styles/search.scss |   43 +++++++++++++++++++++++++++++++++++++++++--
 1 files changed, 41 insertions(+), 2 deletions(-)

diff --git a/quartz/components/styles/search.scss b/quartz/components/styles/search.scss
index 6fada54..5fe0aad 100644
--- a/quartz/components/styles/search.scss
+++ b/quartz/components/styles/search.scss
@@ -48,7 +48,6 @@
     overflow-y: auto;
     display: none;
     backdrop-filter: blur(4px);
-    -webkit-backdrop-filter: blur(4px);
 
     &.active {
       display: inline-block;
@@ -95,8 +94,9 @@
           border: 1px solid var(--lightgray);
           border-bottom: none;
           width: 100%;
+          display: block;
 
-          // normalize button props
+          // normalize card props
           font-family: inherit;
           font-size: 100%;
           line-height: 1.15;
@@ -105,6 +105,7 @@
           text-align: left;
           background: var(--light);
           outline: none;
+          font-weight: inherit;
 
           & .highlight {
             color: var(--secondary);
@@ -131,6 +132,44 @@
             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;
+            margin-top: 0.45rem;
+            // Offset border radius
+            margin-left: -2px;
+            overflow: hidden;
+            background-clip: border-box;
+          }
+
+          & > 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);
+            font-weight: bold;
+            opacity: 1;
+          }
+
           & > p {
             margin-bottom: 0;
           }

--
Gitblit v1.10.0