@canopy-iiif/app 1.6.7 → 1.6.9

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 (6) hide show
  1. package/package.json +1 -1
  2. package/ui/styles/components/_map.scss +1 -0
  3. package/ui/styles/components/iiif/_image.scss +3 -2
  4. package/ui/styles/components/iiif/_viewer.scss +4 -0
  5. package/ui/styles/index.css +11 -5
  6. package/ui/theme.js +4 -5
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@canopy-iiif/app",
3
- "version": "1.6.7",
3
+ "version": "1.6.9",
4
4
  "private": false,
5
5
  "license": "MIT",
6
6
  "author": "Mat Jordan <mat@northwestern.edu>",
package/ui/styles/components/_map.scss CHANGED
@@ -6,6 +6,7 @@
6
6
  border-radius: 0.5rem;
7
7
  overflow: hidden;
8
8
  background-color: var(--color-gray-100);
9
+ z-index: 0;
9
10
 
10
11
  .leaflet-control-attribution {
11
12
  display: none;
package/ui/styles/components/iiif/_image.scss CHANGED
@@ -27,11 +27,11 @@
27
27
  }
28
28
  }
29
29
 
30
- html.dark .canopy-iiif-image {
30
+ html.dark {
31
31
  .clover-iiif-image-openseadragon {
32
32
  div[data-testid="clover-iiif-image-openseadragon-controls"] {
33
33
  button {
34
- background-color: var(--color-gray-100);
34
+ background-color: var(--color-gray-50);
35
35
  color: var(--color-gray-900);
36
36
  fill: var(--color-gray-900);
37
37
  stroke: var(--color-gray-900);
@@ -40,6 +40,7 @@ html.dark .canopy-iiif-image {
40
40
  color: inherit;
41
41
  fill: inherit;
42
42
  stroke: inherit;
43
+ filter: unset !important;
43
44
  }
44
45
 
45
46
  &:hover,
package/ui/styles/components/iiif/_viewer.scss CHANGED
@@ -26,3 +26,7 @@
26
26
  font-size: 1.1111rem;
27
27
  font-weight: 600;
28
28
  }
29
+
30
+ .clover-viewer-media-navigation button svg {
31
+ filter: unset !important;
32
+ }
package/ui/styles/index.css CHANGED
@@ -1416,21 +1416,22 @@ section[data-footnotes] ul li,
1416
1416
  line-height: 1.4;
1417
1417
  }
1418
1418
 
1419
- html.dark .canopy-iiif-image .clover-iiif-image-openseadragon div[data-testid=clover-iiif-image-openseadragon-controls] button {
1420
- background-color: var(--color-gray-100);
1419
+ html.dark .clover-iiif-image-openseadragon div[data-testid=clover-iiif-image-openseadragon-controls] button {
1420
+ background-color: var(--color-gray-50);
1421
1421
  color: var(--color-gray-900);
1422
1422
  fill: var(--color-gray-900);
1423
1423
  stroke: var(--color-gray-900);
1424
1424
  }
1425
- html.dark .canopy-iiif-image .clover-iiif-image-openseadragon div[data-testid=clover-iiif-image-openseadragon-controls] button svg {
1425
+ html.dark .clover-iiif-image-openseadragon div[data-testid=clover-iiif-image-openseadragon-controls] button svg {
1426
1426
  color: inherit;
1427
1427
  fill: inherit;
1428
1428
  stroke: inherit;
1429
+ filter: unset !important;
1429
1430
  }
1430
- html.dark .canopy-iiif-image .clover-iiif-image-openseadragon div[data-testid=clover-iiif-image-openseadragon-controls] button:hover, html.dark .canopy-iiif-image .clover-iiif-image-openseadragon div[data-testid=clover-iiif-image-openseadragon-controls] button:focus {
1431
+ html.dark .clover-iiif-image-openseadragon div[data-testid=clover-iiif-image-openseadragon-controls] button:hover, html.dark .clover-iiif-image-openseadragon div[data-testid=clover-iiif-image-openseadragon-controls] button:focus {
1431
1432
  background-color: var(--color-accent-default);
1432
1433
  }
1433
- html.dark .canopy-iiif-image .clover-iiif-image-openseadragon .clover-iiif-image-openseadragon-annotation label {
1434
+ html.dark .clover-iiif-image-openseadragon .clover-iiif-image-openseadragon-annotation label {
1434
1435
  background-color: var(--color-gray-100);
1435
1436
  color: var(--color-gray-900);
1436
1437
  }
@@ -1532,6 +1533,10 @@ html.dark .canopy-iiif-image .clover-iiif-image-openseadragon .clover-iiif-image
1532
1533
  font-weight: 600;
1533
1534
  }
1534
1535
 
1536
+ .clover-viewer-media-navigation button svg {
1537
+ filter: unset !important;
1538
+ }
1539
+
1535
1540
  .canopy-search-form-shell {
1536
1541
  --search-form-label-padding-x: 0.75rem;
1537
1542
  --search-form-label-padding-y: 0.625rem;
@@ -2721,6 +2726,7 @@ html.dark .canopy-iiif-image .clover-iiif-image-openseadragon .clover-iiif-image
2721
2726
  border-radius: 0.5rem;
2722
2727
  overflow: hidden;
2723
2728
  background-color: var(--color-gray-100);
2729
+ z-index: 0;
2724
2730
  }
2725
2731
  .canopy-map .leaflet-control-attribution {
2726
2732
  display: none;
package/ui/theme.js CHANGED
@@ -125,12 +125,11 @@ function buildVariablesMap(brandScale, grayScale, options = {}) {
125
125
  if (grayScale["800"]) vars["--color-gray-muted"] = grayScale["800"];
126
126
  }
127
127
  if (brandScale && grayScale) {
128
- if (brandScale["800"])
128
+ if (brandScale["800"]) {
129
129
  vars["--colors-accent"] = `${brandScale["800"]} !important`;
130
- if (brandScale["900"])
131
- vars["--colors-accentAlt"] = `${brandScale["900"]} !important`;
132
- if (brandScale["600"])
133
- vars["--colors-accentMuted"] = `${brandScale["600"]} !important`;
130
+ vars["--colors-accentAlt"] = `${brandScale["800"]} !important`;
131
+ vars["--colors-accentMuted"] = `${brandScale["800"]} !important`;
132
+ }
134
133
  if (grayScale["900"]) {
135
134
  const primary = `${grayScale["900"]} !important`;
136
135
  vars["--colors-primary"] = primary;