The Trans Directory
fix(style): search preview consistency
+16
-6
+2
-2
quartz/components/scripts/search.inline.ts
+2
-2
quartz/components/scripts/search.inline.ts
···
20
20
let searchType: SearchType = "basic"
21
21
22
22
const contextWindowWords = 30
23
-
const numSearchResults = 5
24
-
const numTagResults = 3
23
+
const numSearchResults = 8
24
+
const numTagResults = 5
25
25
function highlight(searchTerm: string, text: string, trim?: boolean) {
26
26
// try to highlight longest tokens first
27
27
const tokenizedTerms = searchTerm
+14
-4
quartz/components/styles/search.scss
+14
-4
quartz/components/styles/search.scss
···
91
91
flex-direction: row;
92
92
justify-content: space-between;
93
93
opacity: 0;
94
+
border: 1px solid var(--lightgray);
94
95
95
-
& > * {
96
+
& > div {
96
97
height: calc(75vh - 20em);
97
98
background: none;
98
-
border-radius: 5px;
99
-
border: 1px solid var(--lightgray); // Border to define the box
99
+
100
+
&:first-child {
101
+
border-top-left-radius: 5px;
102
+
border-bottom-left-radius: 5px;
103
+
border-right: 1px solid var(--lightgray);
104
+
}
105
+
106
+
&:last-child {
107
+
border-top-right-radius: 5px;
108
+
border-bottom-right-radius: 5px;
109
+
}
100
110
}
101
111
102
112
@media all and (max-width: $mobileBreakpoint) {
···
122
132
box-sizing: border-box;
123
133
overflow-y: auto;
124
134
font-family: inherit;
125
-
font-size: 1.1em;
126
135
color: var(--dark);
127
136
line-height: 1.5em;
128
137
font-weight: 400;
···
141
150
padding: 1em;
142
151
cursor: pointer;
143
152
transition: background 0.2s ease;
153
+
border-bottom: 1px solid var(--lightgray);
144
154
width: 100%;
145
155
display: block;
146
156
box-sizing: border-box;