@canopy-iiif/app 1.4.0 → 1.4.2

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.
Files changed (9) hide show
  1. package/package.json +1 -1
  2. package/ui/dist/index.mjs +193 -92
  3. package/ui/dist/index.mjs.map +4 -4
  4. package/ui/dist/server.mjs +207 -146
  5. package/ui/dist/server.mjs.map +4 -4
  6. package/ui/styles/base/_markdown.scss +1 -1
  7. package/ui/styles/components/_map.scss +63 -0
  8. package/ui/styles/components/search/_results.scss +2 -2
  9. package/ui/styles/index.css +54 -3
package/ui/styles/base/_markdown.scss CHANGED
@@ -1,6 +1,6 @@
1
1
  code {
2
2
  font-family: var(--font-mono);
3
- font-size: 0.9222rem;
3
+ font-size: 0.9222em;
4
4
  }
5
5
 
6
6
  hr {
package/ui/styles/components/_map.scss CHANGED
@@ -15,6 +15,14 @@
15
15
  font-family: inherit;
16
16
  }
17
17
 
18
+ .leaflet-popup-content {
19
+ margin: 1rem;
20
+ }
21
+
22
+ .leaflet-popup-close-button {
23
+ display: none;
24
+ }
25
+
18
26
  &__canvas {
19
27
  width: 100%;
20
28
  height: 100%;
@@ -64,6 +72,7 @@
64
72
 
65
73
  &-summary {
66
74
  margin: 0 !important;
75
+ padding: 0;
67
76
  font-size: 0.9222rem;
68
77
  line-height: 1.4;
69
78
  color: var(--color-gray-700);
@@ -77,6 +86,56 @@
77
86
  font-weight: 600;
78
87
  text-decoration: none;
79
88
  }
89
+
90
+ &-manifests {
91
+ margin-top: 0.618rem;
92
+
93
+ &-title {
94
+ margin: 0 0 0.25rem;
95
+ font-size: 0.75rem;
96
+ font-weight: 600;
97
+ letter-spacing: 0.05em;
98
+ text-transform: uppercase;
99
+ color: var(--color-gray-600);
100
+ }
101
+
102
+ &-list {
103
+ list-style: none;
104
+ margin: 0;
105
+ padding: 0;
106
+ display: flex;
107
+ flex-direction: column;
108
+ gap: 0.382rem;
109
+ }
110
+
111
+ &-item {
112
+ margin: 0;
113
+ padding: 0;
114
+ }
115
+
116
+ &-link,
117
+ &-text {
118
+ font-weight: 600;
119
+ text-decoration: none;
120
+ display: inline-flex;
121
+ align-items: center;
122
+ gap: 0.25rem;
123
+ }
124
+
125
+ &-link {
126
+ color: var(--color-accent-600);
127
+ }
128
+
129
+ &-text {
130
+ color: var(--color-gray-800);
131
+ }
132
+
133
+ &-summary {
134
+ margin: 0.125rem 0 0;
135
+ font-size: 0.8125rem;
136
+ color: var(--color-gray-600);
137
+ }
138
+ }
80
139
  }
81
140
  .leaflet-marker-icon#{&}__marker {
82
141
  background: transparent;
@@ -85,6 +144,10 @@
85
144
  height: auto;
86
145
  }
87
146
 
147
+ .leaflet-popup {
148
+ padding: 1rem 1rem 0;
149
+ }
150
+
88
151
  &__marker-thumb,
89
152
  &__marker-solid {
90
153
  width: 56px;
package/ui/styles/components/search/_results.scss CHANGED
@@ -167,8 +167,8 @@
167
167
  .canopy-search-teaser__item {
168
168
  display: flex;
169
169
  align-items: center;
170
- gap: 0.75rem;
171
- padding: 0.5rem 0.85rem;
170
+ gap: 0.618rem;
171
+ padding: 0.382rem;
172
172
  border-radius: 0.6rem;
173
173
  text-decoration: none;
174
174
  color: var(--color-gray-900);
package/ui/styles/index.css CHANGED
@@ -77,7 +77,7 @@
77
77
  }
78
78
  code {
79
79
  font-family: var(--font-mono);
80
- font-size: 0.9222rem;
80
+ font-size: 0.9222em;
81
81
  }
82
82
 
83
83
  hr {
@@ -1634,8 +1634,8 @@ html.dark .canopy-iiif-image .clover-iiif-image-openseadragon .clover-iiif-image
1634
1634
  .canopy-search-teaser__item {
1635
1635
  display: flex;
1636
1636
  align-items: center;
1637
- gap: 0.75rem;
1638
- padding: 0.5rem 0.85rem;
1637
+ gap: 0.618rem;
1638
+ padding: 0.382rem;
1639
1639
  border-radius: 0.6rem;
1640
1640
  text-decoration: none;
1641
1641
  color: var(--color-gray-900);
@@ -2472,6 +2472,12 @@ html.dark .canopy-iiif-image .clover-iiif-image-openseadragon .clover-iiif-image
2472
2472
  .canopy-map .leaflet-container {
2473
2473
  font-family: inherit;
2474
2474
  }
2475
+ .canopy-map .leaflet-popup-content {
2476
+ margin: 1rem;
2477
+ }
2478
+ .canopy-map .leaflet-popup-close-button {
2479
+ display: none;
2480
+ }
2475
2481
  .canopy-map__canvas {
2476
2482
  width: 100%;
2477
2483
  height: 100%;
@@ -2516,6 +2522,7 @@ html.dark .canopy-iiif-image .clover-iiif-image-openseadragon .clover-iiif-image
2516
2522
  }
2517
2523
  .canopy-map__popup-summary {
2518
2524
  margin: 0 !important;
2525
+ padding: 0;
2519
2526
  font-size: 0.9222rem;
2520
2527
  line-height: 1.4;
2521
2528
  color: var(--color-gray-700);
@@ -2528,12 +2535,56 @@ html.dark .canopy-iiif-image .clover-iiif-image-openseadragon .clover-iiif-image
2528
2535
  font-weight: 600;
2529
2536
  text-decoration: none;
2530
2537
  }
2538
+ .canopy-map__popup-manifests {
2539
+ margin-top: 0.618rem;
2540
+ }
2541
+ .canopy-map__popup-manifests-title {
2542
+ margin: 0 0 0.25rem;
2543
+ font-size: 0.75rem;
2544
+ font-weight: 600;
2545
+ letter-spacing: 0.05em;
2546
+ text-transform: uppercase;
2547
+ color: var(--color-gray-600);
2548
+ }
2549
+ .canopy-map__popup-manifests-list {
2550
+ list-style: none;
2551
+ margin: 0;
2552
+ padding: 0;
2553
+ display: flex;
2554
+ flex-direction: column;
2555
+ gap: 0.382rem;
2556
+ }
2557
+ .canopy-map__popup-manifests-item {
2558
+ margin: 0;
2559
+ padding: 0;
2560
+ }
2561
+ .canopy-map__popup-manifests-link, .canopy-map__popup-manifests-text {
2562
+ font-weight: 600;
2563
+ text-decoration: none;
2564
+ display: inline-flex;
2565
+ align-items: center;
2566
+ gap: 0.25rem;
2567
+ }
2568
+ .canopy-map__popup-manifests-link {
2569
+ color: var(--color-accent-600);
2570
+ }
2571
+ .canopy-map__popup-manifests-text {
2572
+ color: var(--color-gray-800);
2573
+ }
2574
+ .canopy-map__popup-manifests-summary {
2575
+ margin: 0.125rem 0 0;
2576
+ font-size: 0.8125rem;
2577
+ color: var(--color-gray-600);
2578
+ }
2531
2579
  .canopy-map .leaflet-marker-icon.canopy-map__marker {
2532
2580
  background: transparent;
2533
2581
  border: none;
2534
2582
  width: auto;
2535
2583
  height: auto;
2536
2584
  }
2585
+ .canopy-map .leaflet-popup {
2586
+ padding: 1rem 1rem 0;
2587
+ }
2537
2588
  .canopy-map__marker-thumb, .canopy-map__marker-solid {
2538
2589
  width: 56px;
2539
2590
  height: 56px;