@canopy-iiif/app 0.10.17 → 0.10.19

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.
@@ -1,3 +1,8 @@
1
+ code {
2
+ font-family: var(--font-mono);
3
+ font-size: 0.922em;
4
+ }
5
+
1
6
  .markdown-table__frame {
2
7
  width: 100%;
3
8
  margin: 1.618rem 0 2.618rem;
@@ -34,12 +39,6 @@
34
39
  }
35
40
  }
36
41
  }
37
-
38
- code {
39
- font-family: var(--font-mono);
40
- font-size: 0.875rem;
41
- color: var(--color-gray-900);
42
- }
43
42
  }
44
43
 
45
44
  section[data-footnotes],
@@ -0,0 +1,74 @@
1
+ .referenced-items {
2
+ margin: clamp(2rem, 6vw, 4rem) 0;
3
+ width: 100%;
4
+ }
5
+
6
+ .referenced-items__heading {
7
+ font-family: var(--font-serif);
8
+ font-size: clamp(1.5rem, 2vw, 1.9rem);
9
+ font-weight: 600;
10
+ letter-spacing: -0.02em;
11
+ margin-bottom: 1.5rem;
12
+ }
13
+
14
+ .referenced-items__grid {
15
+ display: grid;
16
+ grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
17
+ gap: clamp(1rem, 2vw, 1.75rem);
18
+ }
19
+
20
+ .referenced-items__item {
21
+ display: flex;
22
+ flex-direction: column;
23
+ }
24
+
25
+ .referenced-items__card {
26
+ height: 100%;
27
+ }
28
+
29
+ .referenced-items--empty {
30
+ border-top: 1px solid var(--color-gray-200);
31
+ padding: 1.5rem 0;
32
+ color: var(--color-gray-600);
33
+ font-style: italic;
34
+ }
35
+
36
+ .references {
37
+ margin: 0;
38
+ padding: 0;
39
+ }
40
+
41
+ .references__group {
42
+ display: grid;
43
+ gap: 0.2rem;
44
+ padding: 0.85rem 0;
45
+ }
46
+
47
+ .references dt {
48
+ font-size: 0.7222rem;
49
+ text-transform: uppercase;
50
+ margin: 0;
51
+ font-weight: 400;
52
+ color: var(--color-gray-700);
53
+ }
54
+
55
+ .references__item {
56
+ margin: 0;
57
+ color: var(--color-gray-900);
58
+ font-size: 1rem;
59
+ line-height: 1.45;
60
+ }
61
+
62
+ .references__item a {
63
+ color: var(--color-accent-default);
64
+ text-decoration: none;
65
+ }
66
+
67
+ .references__item a:hover {
68
+ text-decoration: underline;
69
+ }
70
+
71
+ .references__empty {
72
+ color: var(--color-gray-600);
73
+ font-style: italic;
74
+ }
@@ -1,6 +1,7 @@
1
1
  @use "./buttons";
2
2
  @use "./card";
3
3
  @use "./layout";
4
+ @use "./referenced-items";
4
5
  @use "./header";
5
6
  @use "./footer";
6
7
  @use "./modal";
@@ -143,6 +143,11 @@
143
143
  letter-spacing: -0.025em;
144
144
  font-variation-settings: "SOFT" 100, "WONK" 1;
145
145
  }
146
+ code {
147
+ font-family: var(--font-mono);
148
+ font-size: 0.922em;
149
+ }
150
+
146
151
  .markdown-table__frame {
147
152
  width: 100%;
148
153
  margin: 1.618rem 0 2.618rem;
@@ -174,11 +179,6 @@
174
179
  .markdown-table tbody tr:nth-child(even) {
175
180
  background-color: var(--color-gray-200);
176
181
  }
177
- .markdown-table code {
178
- font-family: var(--font-mono);
179
- font-size: 0.875rem;
180
- color: var(--color-gray-900);
181
- }
182
182
 
183
183
  section[data-footnotes],
184
184
  .footnotes {
@@ -430,6 +430,81 @@ section[data-footnotes] ul li,
430
430
  grid-template-columns: var(--canopy-layout-sidebar-width) minmax(0, 1fr) var(--canopy-layout-content-nav-width);
431
431
  }
432
432
  }
433
+ .referenced-items {
434
+ margin: clamp(2rem, 6vw, 4rem) 0;
435
+ width: 100%;
436
+ }
437
+
438
+ .referenced-items__heading {
439
+ font-family: var(--font-serif);
440
+ font-size: clamp(1.5rem, 2vw, 1.9rem);
441
+ font-weight: 600;
442
+ letter-spacing: -0.02em;
443
+ margin-bottom: 1.5rem;
444
+ }
445
+
446
+ .referenced-items__grid {
447
+ display: grid;
448
+ grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
449
+ gap: clamp(1rem, 2vw, 1.75rem);
450
+ }
451
+
452
+ .referenced-items__item {
453
+ display: flex;
454
+ flex-direction: column;
455
+ }
456
+
457
+ .referenced-items__card {
458
+ height: 100%;
459
+ }
460
+
461
+ .referenced-items--empty {
462
+ border-top: 1px solid var(--color-gray-200);
463
+ padding: 1.5rem 0;
464
+ color: var(--color-gray-600);
465
+ font-style: italic;
466
+ }
467
+
468
+ .references {
469
+ margin: 0;
470
+ padding: 0;
471
+ }
472
+
473
+ .references__group {
474
+ display: grid;
475
+ gap: 0.2rem;
476
+ padding: 0.85rem 0;
477
+ }
478
+
479
+ .references dt {
480
+ font-size: 0.7222rem;
481
+ text-transform: uppercase;
482
+ margin: 0;
483
+ font-weight: 400;
484
+ color: var(--color-gray-700);
485
+ }
486
+
487
+ .references__item {
488
+ margin: 0;
489
+ color: var(--color-gray-900);
490
+ font-size: 1rem;
491
+ line-height: 1.45;
492
+ }
493
+
494
+ .references__item a {
495
+ color: var(--color-accent-default);
496
+ text-decoration: none;
497
+ }
498
+
499
+ .references__item a:hover {
500
+ text-decoration: underline;
501
+ }
502
+
503
+ .references__empty {
504
+ color: var(--color-gray-600);
505
+ font-style: italic;
506
+ }
507
+
433
508
  @layer components {
434
509
  .canopy-header {
435
510
  position: relative;