@canopy-iiif/app 0.10.20 → 0.10.22
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/build/mdx.js +16 -0
- package/lib/build/search-index.js +5 -0
- package/lib/build/search.js +2 -0
- package/lib/search/search-form-runtime.js +47 -30
- package/lib/search/search.js +9 -0
- package/package.json +1 -1
- package/ui/dist/index.mjs +145 -25
- package/ui/dist/index.mjs.map +2 -2
- package/ui/dist/server.mjs +6 -5
- package/ui/dist/server.mjs.map +2 -2
- package/ui/styles/components/_article-card.scss +11 -10
- package/ui/styles/components/index.scss +1 -0
- package/ui/styles/components/search/_panel.scss +7 -0
- package/ui/styles/components/search/_results.scss +74 -1
- package/ui/styles/index.css +90 -11
|
@@ -13,37 +13,38 @@
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
h3 {
|
|
16
|
-
margin: 0
|
|
16
|
+
margin: 0;
|
|
17
17
|
font-size: 1.125rem;
|
|
18
|
-
line-height: 1.
|
|
18
|
+
line-height: 1.382;
|
|
19
19
|
}
|
|
20
20
|
|
|
21
21
|
.canopy-article-card__url {
|
|
22
22
|
font-size: 0.8333rem;
|
|
23
|
-
color: var(--color-
|
|
23
|
+
color: var(--color-accent-800);
|
|
24
24
|
margin: 0;
|
|
25
25
|
text-transform: none;
|
|
26
26
|
}
|
|
27
27
|
|
|
28
28
|
.canopy-article-card__snippet {
|
|
29
|
-
margin: 0.
|
|
29
|
+
margin: 0.382rem 0 0;
|
|
30
30
|
color: var(--color-gray-default);
|
|
31
31
|
font-size: 0.9222rem;
|
|
32
32
|
}
|
|
33
33
|
|
|
34
34
|
.canopy-article-card__meta {
|
|
35
|
-
margin: 0.
|
|
36
|
-
padding: 0;
|
|
35
|
+
margin: 0.382rem 0;
|
|
36
|
+
padding: 0 1rem;
|
|
37
37
|
list-style: none;
|
|
38
38
|
display: flex;
|
|
39
39
|
flex-wrap: wrap;
|
|
40
|
-
gap:
|
|
41
|
-
font-size: 0.
|
|
42
|
-
color:
|
|
40
|
+
gap: 1.618rem;
|
|
41
|
+
font-size: 0.8333rem;
|
|
42
|
+
color: var(--color-gray-700);
|
|
43
43
|
}
|
|
44
44
|
|
|
45
45
|
mark {
|
|
46
|
-
|
|
46
|
+
// use a srgb color to avoid issues with dark mode and allow for alpha blending
|
|
47
|
+
background: color-mix(in srgb, var(--color-accent-500) 38.2%, transparent);
|
|
47
48
|
color: inherit;
|
|
48
49
|
padding: 0.05rem 0.25rem;
|
|
49
50
|
border-radius: 0.2rem;
|
|
@@ -139,7 +139,7 @@
|
|
|
139
139
|
left: 0;
|
|
140
140
|
right: 0;
|
|
141
141
|
top: calc(100% + 4px);
|
|
142
|
-
background: var(--color-gray-
|
|
142
|
+
background: var(--color-gray-50);
|
|
143
143
|
border: 1px solid var(--color-gray-200);
|
|
144
144
|
border-radius: 8px;
|
|
145
145
|
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.12);
|
|
@@ -150,6 +150,79 @@
|
|
|
150
150
|
display: none;
|
|
151
151
|
}
|
|
152
152
|
|
|
153
|
+
.canopy-search-teaser__list {
|
|
154
|
+
display: flex;
|
|
155
|
+
flex-direction: column;
|
|
156
|
+
gap: 0.382rem;
|
|
157
|
+
padding: 0.618rem;
|
|
158
|
+
}
|
|
159
|
+
|
|
160
|
+
.canopy-search-teaser__label {
|
|
161
|
+
padding: 0.382rem 0.618rem;
|
|
162
|
+
font-weight: 600;
|
|
163
|
+
font-size: 0.8333rem;
|
|
164
|
+
color: var(--color-gray-700);
|
|
165
|
+
}
|
|
166
|
+
|
|
167
|
+
.canopy-search-teaser__item {
|
|
168
|
+
display: flex;
|
|
169
|
+
align-items: center;
|
|
170
|
+
gap: 0.75rem;
|
|
171
|
+
padding: 0.5rem 0.85rem;
|
|
172
|
+
border-radius: 0.6rem;
|
|
173
|
+
text-decoration: none;
|
|
174
|
+
color: var(--color-gray-900);
|
|
175
|
+
transition: background 120ms ease;
|
|
176
|
+
|
|
177
|
+
&:hover,
|
|
178
|
+
&:focus-visible {
|
|
179
|
+
background: var(--color-gray-100);
|
|
180
|
+
outline: none;
|
|
181
|
+
}
|
|
182
|
+
}
|
|
183
|
+
|
|
184
|
+
.canopy-search-teaser__thumb {
|
|
185
|
+
flex: 0 0 48px;
|
|
186
|
+
height: 48px;
|
|
187
|
+
border-radius: 0.5rem;
|
|
188
|
+
overflow: hidden;
|
|
189
|
+
background: var(--color-gray-100);
|
|
190
|
+
display: flex;
|
|
191
|
+
align-items: center;
|
|
192
|
+
justify-content: center;
|
|
193
|
+
}
|
|
194
|
+
|
|
195
|
+
.canopy-search-teaser__thumb-img {
|
|
196
|
+
width: 100%;
|
|
197
|
+
height: 100%;
|
|
198
|
+
object-fit: cover;
|
|
199
|
+
}
|
|
200
|
+
|
|
201
|
+
.canopy-search-teaser__text {
|
|
202
|
+
display: flex;
|
|
203
|
+
flex-direction: column;
|
|
204
|
+
gap: 0.15rem;
|
|
205
|
+
min-width: 0;
|
|
206
|
+
}
|
|
207
|
+
|
|
208
|
+
.canopy-search-teaser__title {
|
|
209
|
+
font-weight: 600;
|
|
210
|
+
font-size: 0.95rem;
|
|
211
|
+
line-height: 1.3;
|
|
212
|
+
color: var(--color-gray-900);
|
|
213
|
+
white-space: nowrap;
|
|
214
|
+
overflow: hidden;
|
|
215
|
+
text-overflow: ellipsis;
|
|
216
|
+
}
|
|
217
|
+
|
|
218
|
+
.canopy-search-teaser__meta {
|
|
219
|
+
font-size: 0.78rem;
|
|
220
|
+
color: var(--color-gray-600);
|
|
221
|
+
white-space: nowrap;
|
|
222
|
+
overflow: hidden;
|
|
223
|
+
text-overflow: ellipsis;
|
|
224
|
+
}
|
|
225
|
+
|
|
153
226
|
.relative[data-canopy-search-form-auto="1"]:focus-within
|
|
154
227
|
[data-canopy-search-form-panel] {
|
|
155
228
|
display: block;
|
package/ui/styles/index.css
CHANGED
|
@@ -351,33 +351,33 @@ section[data-footnotes] ul li,
|
|
|
351
351
|
text-decoration: underline;
|
|
352
352
|
}
|
|
353
353
|
.canopy-article-card h3 {
|
|
354
|
-
margin: 0
|
|
354
|
+
margin: 0;
|
|
355
355
|
font-size: 1.125rem;
|
|
356
|
-
line-height: 1.
|
|
356
|
+
line-height: 1.382;
|
|
357
357
|
}
|
|
358
358
|
.canopy-article-card .canopy-article-card__url {
|
|
359
359
|
font-size: 0.8333rem;
|
|
360
|
-
color: var(--color-
|
|
360
|
+
color: var(--color-accent-800);
|
|
361
361
|
margin: 0;
|
|
362
362
|
text-transform: none;
|
|
363
363
|
}
|
|
364
364
|
.canopy-article-card .canopy-article-card__snippet {
|
|
365
|
-
margin: 0.
|
|
365
|
+
margin: 0.382rem 0 0;
|
|
366
366
|
color: var(--color-gray-default);
|
|
367
367
|
font-size: 0.9222rem;
|
|
368
368
|
}
|
|
369
369
|
.canopy-article-card .canopy-article-card__meta {
|
|
370
|
-
margin: 0.
|
|
371
|
-
padding: 0;
|
|
370
|
+
margin: 0.382rem 0;
|
|
371
|
+
padding: 0 1rem;
|
|
372
372
|
list-style: none;
|
|
373
373
|
display: flex;
|
|
374
374
|
flex-wrap: wrap;
|
|
375
|
-
gap:
|
|
376
|
-
font-size: 0.
|
|
377
|
-
color:
|
|
375
|
+
gap: 1.618rem;
|
|
376
|
+
font-size: 0.8333rem;
|
|
377
|
+
color: var(--color-gray-700);
|
|
378
378
|
}
|
|
379
379
|
.canopy-article-card mark {
|
|
380
|
-
background:
|
|
380
|
+
background: color-mix(in srgb, var(--color-accent-500) 38.2%, transparent);
|
|
381
381
|
color: inherit;
|
|
382
382
|
padding: 0.05rem 0.25rem;
|
|
383
383
|
border-radius: 0.2rem;
|
|
@@ -1504,7 +1504,7 @@ section[data-footnotes] ul li,
|
|
|
1504
1504
|
left: 0;
|
|
1505
1505
|
right: 0;
|
|
1506
1506
|
top: calc(100% + 4px);
|
|
1507
|
-
background: var(--color-gray-
|
|
1507
|
+
background: var(--color-gray-50);
|
|
1508
1508
|
border: 1px solid var(--color-gray-200);
|
|
1509
1509
|
border-radius: 8px;
|
|
1510
1510
|
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.12);
|
|
@@ -1515,6 +1515,77 @@ section[data-footnotes] ul li,
|
|
|
1515
1515
|
display: none;
|
|
1516
1516
|
}
|
|
1517
1517
|
|
|
1518
|
+
.canopy-search-teaser__list {
|
|
1519
|
+
display: flex;
|
|
1520
|
+
flex-direction: column;
|
|
1521
|
+
gap: 0.382rem;
|
|
1522
|
+
padding: 0.618rem;
|
|
1523
|
+
}
|
|
1524
|
+
|
|
1525
|
+
.canopy-search-teaser__label {
|
|
1526
|
+
padding: 0.382rem 0.618rem;
|
|
1527
|
+
font-weight: 600;
|
|
1528
|
+
font-size: 0.8333rem;
|
|
1529
|
+
color: var(--color-gray-700);
|
|
1530
|
+
}
|
|
1531
|
+
|
|
1532
|
+
.canopy-search-teaser__item {
|
|
1533
|
+
display: flex;
|
|
1534
|
+
align-items: center;
|
|
1535
|
+
gap: 0.75rem;
|
|
1536
|
+
padding: 0.5rem 0.85rem;
|
|
1537
|
+
border-radius: 0.6rem;
|
|
1538
|
+
text-decoration: none;
|
|
1539
|
+
color: var(--color-gray-900);
|
|
1540
|
+
transition: background 120ms ease;
|
|
1541
|
+
}
|
|
1542
|
+
.canopy-search-teaser__item:hover, .canopy-search-teaser__item:focus-visible {
|
|
1543
|
+
background: var(--color-gray-100);
|
|
1544
|
+
outline: none;
|
|
1545
|
+
}
|
|
1546
|
+
|
|
1547
|
+
.canopy-search-teaser__thumb {
|
|
1548
|
+
flex: 0 0 48px;
|
|
1549
|
+
height: 48px;
|
|
1550
|
+
border-radius: 0.5rem;
|
|
1551
|
+
overflow: hidden;
|
|
1552
|
+
background: var(--color-gray-100);
|
|
1553
|
+
display: flex;
|
|
1554
|
+
align-items: center;
|
|
1555
|
+
justify-content: center;
|
|
1556
|
+
}
|
|
1557
|
+
|
|
1558
|
+
.canopy-search-teaser__thumb-img {
|
|
1559
|
+
width: 100%;
|
|
1560
|
+
height: 100%;
|
|
1561
|
+
object-fit: cover;
|
|
1562
|
+
}
|
|
1563
|
+
|
|
1564
|
+
.canopy-search-teaser__text {
|
|
1565
|
+
display: flex;
|
|
1566
|
+
flex-direction: column;
|
|
1567
|
+
gap: 0.15rem;
|
|
1568
|
+
min-width: 0;
|
|
1569
|
+
}
|
|
1570
|
+
|
|
1571
|
+
.canopy-search-teaser__title {
|
|
1572
|
+
font-weight: 600;
|
|
1573
|
+
font-size: 0.95rem;
|
|
1574
|
+
line-height: 1.3;
|
|
1575
|
+
color: var(--color-gray-900);
|
|
1576
|
+
white-space: nowrap;
|
|
1577
|
+
overflow: hidden;
|
|
1578
|
+
text-overflow: ellipsis;
|
|
1579
|
+
}
|
|
1580
|
+
|
|
1581
|
+
.canopy-search-teaser__meta {
|
|
1582
|
+
font-size: 0.78rem;
|
|
1583
|
+
color: var(--color-gray-600);
|
|
1584
|
+
white-space: nowrap;
|
|
1585
|
+
overflow: hidden;
|
|
1586
|
+
text-overflow: ellipsis;
|
|
1587
|
+
}
|
|
1588
|
+
|
|
1518
1589
|
.relative[data-canopy-search-form-auto="1"]:focus-within [data-canopy-search-form-panel] {
|
|
1519
1590
|
display: block;
|
|
1520
1591
|
}
|
|
@@ -1718,6 +1789,14 @@ section[data-footnotes] ul li,
|
|
|
1718
1789
|
}
|
|
1719
1790
|
}
|
|
1720
1791
|
}
|
|
1792
|
+
.canopy-search-teaser.is-empty {
|
|
1793
|
+
display: none;
|
|
1794
|
+
}
|
|
1795
|
+
|
|
1796
|
+
[data-canopy-search-form-panel][hidden] {
|
|
1797
|
+
display: none;
|
|
1798
|
+
}
|
|
1799
|
+
|
|
1721
1800
|
.canopy-sub-navigation {
|
|
1722
1801
|
color: inherit;
|
|
1723
1802
|
}
|