@canopy-iiif/app 1.8.10 → 1.8.12
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/package.json +1 -1
- package/ui/dist/index.mjs +111 -16
- package/ui/dist/index.mjs.map +3 -3
- package/ui/dist/server.mjs +38 -3
- package/ui/dist/server.mjs.map +2 -2
- package/ui/styles/components/_map.scss +64 -9
- package/ui/styles/index.css +54 -9
|
@@ -58,9 +58,10 @@
|
|
|
58
58
|
}
|
|
59
59
|
|
|
60
60
|
&__key {
|
|
61
|
-
margin
|
|
61
|
+
margin: 1rem;
|
|
62
62
|
z-index: 1;
|
|
63
63
|
color: var(--color-gray-900);
|
|
64
|
+
align-self: flex-end;
|
|
64
65
|
|
|
65
66
|
&-list {
|
|
66
67
|
list-style: none;
|
|
@@ -68,21 +69,22 @@
|
|
|
68
69
|
padding: 0;
|
|
69
70
|
display: flex;
|
|
70
71
|
flex-wrap: wrap;
|
|
71
|
-
gap: 0.
|
|
72
|
+
gap: 0.382rem 1rem;
|
|
73
|
+
justify-content: flex-end;
|
|
72
74
|
}
|
|
73
75
|
|
|
74
76
|
&-item {
|
|
75
77
|
display: flex;
|
|
76
78
|
align-items: center;
|
|
77
|
-
gap: 0.
|
|
78
|
-
font-size: 0.
|
|
79
|
+
gap: 0.382rem;
|
|
80
|
+
font-size: 0.8333rem;
|
|
79
81
|
line-height: 1.4;
|
|
80
|
-
font-weight:
|
|
82
|
+
font-weight: 400;
|
|
81
83
|
}
|
|
82
84
|
|
|
83
85
|
&-dot {
|
|
84
|
-
width:
|
|
85
|
-
height:
|
|
86
|
+
width: 12px;
|
|
87
|
+
height: 12px;
|
|
86
88
|
border-radius: 999px;
|
|
87
89
|
background-color: var(--color-accent-default);
|
|
88
90
|
flex-shrink: 0;
|
|
@@ -90,7 +92,6 @@
|
|
|
90
92
|
|
|
91
93
|
&-label {
|
|
92
94
|
flex: 1;
|
|
93
|
-
font-weight: 600;
|
|
94
95
|
}
|
|
95
96
|
}
|
|
96
97
|
|
|
@@ -193,6 +194,11 @@
|
|
|
193
194
|
border: none;
|
|
194
195
|
width: auto;
|
|
195
196
|
height: auto;
|
|
197
|
+
|
|
198
|
+
&.is-hovered {
|
|
199
|
+
z-index: 2000 !important;
|
|
200
|
+
filter: drop-shadow(0 6px 18px rgba(15, 23, 42, 0.45));
|
|
201
|
+
}
|
|
196
202
|
}
|
|
197
203
|
|
|
198
204
|
.leaflet-popup {
|
|
@@ -230,6 +236,55 @@
|
|
|
230
236
|
background: var(--color-accent-600);
|
|
231
237
|
}
|
|
232
238
|
|
|
239
|
+
&__marker--label {
|
|
240
|
+
background: transparent;
|
|
241
|
+
border: none;
|
|
242
|
+
|
|
243
|
+
&.is-hovered {
|
|
244
|
+
.canopy-map__marker-label {
|
|
245
|
+
background: var(--color-gray-50);
|
|
246
|
+
}
|
|
247
|
+
|
|
248
|
+
.canopy-map__marker-label-text {
|
|
249
|
+
opacity: 1;
|
|
250
|
+
}
|
|
251
|
+
|
|
252
|
+
.canopy-map__marker-label-text {
|
|
253
|
+
box-shadow: 0 2px 8px rgba(15, 23, 42, 0.2);
|
|
254
|
+
}
|
|
255
|
+
}
|
|
256
|
+
}
|
|
257
|
+
|
|
258
|
+
&__marker-label {
|
|
259
|
+
display: inline-flex;
|
|
260
|
+
align-items: center;
|
|
261
|
+
font-size: 0.8333rem;
|
|
262
|
+
font-weight: 400;
|
|
263
|
+
color: #000;
|
|
264
|
+
background: #fffd;
|
|
265
|
+
white-space: nowrap;
|
|
266
|
+
position: relative;
|
|
267
|
+
border-radius: 999px;
|
|
268
|
+
padding-left: 4px;
|
|
269
|
+
}
|
|
270
|
+
|
|
271
|
+
&__marker-label-dot {
|
|
272
|
+
width: 12px;
|
|
273
|
+
height: 12px;
|
|
274
|
+
border-radius: 999px;
|
|
275
|
+
background-color: var(--color-accent-default);
|
|
276
|
+
flex-shrink: 0;
|
|
277
|
+
cursor: default;
|
|
278
|
+
z-index: 1;
|
|
279
|
+
}
|
|
280
|
+
|
|
281
|
+
&__marker-label-text {
|
|
282
|
+
padding: 0 0.25rem;
|
|
283
|
+
line-height: 1.2;
|
|
284
|
+
color: inherit;
|
|
285
|
+
cursor: default;
|
|
286
|
+
}
|
|
287
|
+
|
|
233
288
|
&__cluster-wrapper {
|
|
234
289
|
background: none;
|
|
235
290
|
border: none;
|
|
@@ -242,7 +297,7 @@
|
|
|
242
297
|
width: 40px;
|
|
243
298
|
height: 40px;
|
|
244
299
|
border-radius: 999px;
|
|
245
|
-
background: var(--color-
|
|
300
|
+
background: var(--color-gray-default);
|
|
246
301
|
color: var(--color-gray-50);
|
|
247
302
|
display: flex;
|
|
248
303
|
align-items: center;
|
package/ui/styles/index.css
CHANGED
|
@@ -2885,9 +2885,10 @@ html.dark .clover-iiif-image-openseadragon .clover-iiif-image-openseadragon-anno
|
|
|
2885
2885
|
pointer-events: auto;
|
|
2886
2886
|
}
|
|
2887
2887
|
.canopy-map__key {
|
|
2888
|
-
margin
|
|
2888
|
+
margin: 1rem;
|
|
2889
2889
|
z-index: 1;
|
|
2890
2890
|
color: var(--color-gray-900);
|
|
2891
|
+
align-self: flex-end;
|
|
2891
2892
|
}
|
|
2892
2893
|
.canopy-map__key-list {
|
|
2893
2894
|
list-style: none;
|
|
@@ -2895,26 +2896,26 @@ html.dark .clover-iiif-image-openseadragon .clover-iiif-image-openseadragon-anno
|
|
|
2895
2896
|
padding: 0;
|
|
2896
2897
|
display: flex;
|
|
2897
2898
|
flex-wrap: wrap;
|
|
2898
|
-
gap: 0.
|
|
2899
|
+
gap: 0.382rem 1rem;
|
|
2900
|
+
justify-content: flex-end;
|
|
2899
2901
|
}
|
|
2900
2902
|
.canopy-map__key-item {
|
|
2901
2903
|
display: flex;
|
|
2902
2904
|
align-items: center;
|
|
2903
|
-
gap: 0.
|
|
2904
|
-
font-size: 0.
|
|
2905
|
+
gap: 0.382rem;
|
|
2906
|
+
font-size: 0.8333rem;
|
|
2905
2907
|
line-height: 1.4;
|
|
2906
|
-
font-weight:
|
|
2908
|
+
font-weight: 400;
|
|
2907
2909
|
}
|
|
2908
2910
|
.canopy-map__key-dot {
|
|
2909
|
-
width:
|
|
2910
|
-
height:
|
|
2911
|
+
width: 12px;
|
|
2912
|
+
height: 12px;
|
|
2911
2913
|
border-radius: 999px;
|
|
2912
2914
|
background-color: var(--color-accent-default);
|
|
2913
2915
|
flex-shrink: 0;
|
|
2914
2916
|
}
|
|
2915
2917
|
.canopy-map__key-label {
|
|
2916
2918
|
flex: 1;
|
|
2917
|
-
font-weight: 600;
|
|
2918
2919
|
}
|
|
2919
2920
|
.canopy-map__popup {
|
|
2920
2921
|
display: flex;
|
|
@@ -3002,6 +3003,10 @@ html.dark .clover-iiif-image-openseadragon .clover-iiif-image-openseadragon-anno
|
|
|
3002
3003
|
width: auto;
|
|
3003
3004
|
height: auto;
|
|
3004
3005
|
}
|
|
3006
|
+
.canopy-map .leaflet-marker-icon.canopy-map__marker.is-hovered {
|
|
3007
|
+
z-index: 2000 !important;
|
|
3008
|
+
filter: drop-shadow(0 6px 18px rgba(15, 23, 42, 0.45));
|
|
3009
|
+
}
|
|
3005
3010
|
.canopy-map .leaflet-popup {
|
|
3006
3011
|
padding: 1rem 1rem 0;
|
|
3007
3012
|
}
|
|
@@ -3032,6 +3037,46 @@ html.dark .clover-iiif-image-openseadragon .clover-iiif-image-openseadragon-anno
|
|
|
3032
3037
|
justify-content: center;
|
|
3033
3038
|
background: var(--color-accent-600);
|
|
3034
3039
|
}
|
|
3040
|
+
.canopy-map__marker--label {
|
|
3041
|
+
background: transparent;
|
|
3042
|
+
border: none;
|
|
3043
|
+
}
|
|
3044
|
+
.canopy-map__marker--label.is-hovered .canopy-map__marker-label {
|
|
3045
|
+
background: var(--color-gray-50);
|
|
3046
|
+
}
|
|
3047
|
+
.canopy-map__marker--label.is-hovered .canopy-map__marker-label-text {
|
|
3048
|
+
opacity: 1;
|
|
3049
|
+
}
|
|
3050
|
+
.canopy-map__marker--label.is-hovered .canopy-map__marker-label-text {
|
|
3051
|
+
box-shadow: 0 2px 8px rgba(15, 23, 42, 0.2);
|
|
3052
|
+
}
|
|
3053
|
+
.canopy-map__marker-label {
|
|
3054
|
+
display: inline-flex;
|
|
3055
|
+
align-items: center;
|
|
3056
|
+
font-size: 0.8333rem;
|
|
3057
|
+
font-weight: 400;
|
|
3058
|
+
color: #000;
|
|
3059
|
+
background: rgba(255, 255, 255, 0.8666666667);
|
|
3060
|
+
white-space: nowrap;
|
|
3061
|
+
position: relative;
|
|
3062
|
+
border-radius: 999px;
|
|
3063
|
+
padding-left: 4px;
|
|
3064
|
+
}
|
|
3065
|
+
.canopy-map__marker-label-dot {
|
|
3066
|
+
width: 12px;
|
|
3067
|
+
height: 12px;
|
|
3068
|
+
border-radius: 999px;
|
|
3069
|
+
background-color: var(--color-accent-default);
|
|
3070
|
+
flex-shrink: 0;
|
|
3071
|
+
cursor: default;
|
|
3072
|
+
z-index: 1;
|
|
3073
|
+
}
|
|
3074
|
+
.canopy-map__marker-label-text {
|
|
3075
|
+
padding: 0 0.25rem;
|
|
3076
|
+
line-height: 1.2;
|
|
3077
|
+
color: inherit;
|
|
3078
|
+
cursor: default;
|
|
3079
|
+
}
|
|
3035
3080
|
.canopy-map__cluster-wrapper {
|
|
3036
3081
|
background: none;
|
|
3037
3082
|
border: none;
|
|
@@ -3043,7 +3088,7 @@ html.dark .clover-iiif-image-openseadragon .clover-iiif-image-openseadragon-anno
|
|
|
3043
3088
|
width: 40px;
|
|
3044
3089
|
height: 40px;
|
|
3045
3090
|
border-radius: 999px;
|
|
3046
|
-
background: var(--color-
|
|
3091
|
+
background: var(--color-gray-default);
|
|
3047
3092
|
color: var(--color-gray-50);
|
|
3048
3093
|
display: flex;
|
|
3049
3094
|
align-items: center;
|