@canopy-iiif/app 0.10.14 → 0.10.16

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 (15) hide show
  1. package/lib/build/iiif.js +4 -0
  2. package/lib/build/pages.js +20 -2
  3. package/lib/common.js +33 -2
  4. package/lib/search/search.js +12 -2
  5. package/package.json +1 -1
  6. package/ui/dist/index.mjs +17 -3
  7. package/ui/dist/index.mjs.map +2 -2
  8. package/ui/dist/server.mjs +17 -3
  9. package/ui/dist/server.mjs.map +2 -2
  10. package/ui/styles/base/_heading.scss +7 -0
  11. package/ui/styles/base/_utilities.scss +4 -0
  12. package/ui/styles/components/_work.scss +36 -0
  13. package/ui/styles/components/index.scss +1 -0
  14. package/ui/styles/index.css +103 -65
  15. package/ui/styles/index.scss +1 -1
package/ui/styles/base/_heading.scss CHANGED
@@ -18,6 +18,13 @@
18
18
  margin: 1.618rem 0 1rem;
19
19
  font-weight: 300;
20
20
  }
21
+
22
+ .canopy-lead {
23
+ font-size: 1.382rem;
24
+ color: var(--color-gray-700);
25
+ margin: 0.5rem 0 2rem 0;
26
+ line-height: 1.4;
27
+ }
21
28
  }
22
29
 
23
30
  @utility font-display {
package/ui/styles/base/_utilities.scss CHANGED
@@ -1,3 +1,7 @@
1
1
  @utility max-w-content {
2
2
  max-width: 1080px;
3
3
  }
4
+
5
+ @utility max-w-wide {
6
+ max-width: 1300px;
7
+ }
package/ui/styles/components/_work.scss ADDED
@@ -0,0 +1,36 @@
1
+ @layer components {
2
+ body.canopy-type-work {
3
+ main {
4
+ h1 {
5
+ font-size: 2rem;
6
+ line-height: 1.1;
7
+ margin: 1.618rem 0;
8
+ }
9
+
10
+ dl {
11
+ padding: 0;
12
+ }
13
+
14
+ dl > div {
15
+ display: grid;
16
+ gap: 0.2rem;
17
+ padding: 0.85rem 0;
18
+ }
19
+
20
+ dt {
21
+ font-size: 0.7222rem;
22
+ text-transform: uppercase;
23
+ margin: 0;
24
+ font-weight: 400;
25
+ color: var(--color-gray-700);
26
+ }
27
+
28
+ dd {
29
+ margin: 0;
30
+ color: var(--color-gray-900);
31
+ font-size: 1rem;
32
+ line-height: 1.45;
33
+ }
34
+ }
35
+ }
36
+ }
package/ui/styles/components/index.scss CHANGED
@@ -8,3 +8,4 @@
8
8
  @use "./iiif";
9
9
  @use "./search";
10
10
  @use "./sub-navigation";
11
+ @use "./work";
package/ui/styles/index.css CHANGED
@@ -1,73 +1,73 @@
1
1
  /* canopy-theme */
2
2
  @layer properties {
3
3
  :root {
4
- --color-accent-50: #fdfdfc;
5
- --color-accent-100: #f2f0e7;
6
- --color-accent-200: #eae6db;
7
- --color-accent-300: #d8d0bf;
8
- --color-accent-400: #cbc0aa;
9
- --color-accent-500: #b9a88d;
10
- --color-accent-600: #978365;
11
- --color-accent-700: #8c7a5e;
12
- --color-accent-800: #71624b;
13
- --color-accent-900: #2c2820;
14
- --color-accent-default: #8c7a5e;
15
- --color-gray-50: #fdfdfc;
16
- --color-gray-100: #f1f0ef;
17
- --color-gray-200: #e9e8e6;
18
- --color-gray-300: #dad9d6;
19
- --color-gray-400: #cfceca;
20
- --color-gray-500: #bcbbb5;
21
- --color-gray-600: #8d8d86;
22
- --color-gray-700: #82827c;
23
- --color-gray-800: #63635e;
24
- --color-gray-900: #141311;
25
- --color-gray-default: #141311;
26
- --color-gray-muted: #8d8d86;
27
- --colors-accent: #8c7a5e !important;
28
- --colors-accentAlt: #71624b !important;
29
- --colors-accentMuted: #cbc0aa !important;
30
- --colors-primary: #141311 !important;
31
- --colors-primaryAlt: #141311 !important;
32
- --colors-primaryMuted: #141311 !important;
33
- --colors-secondary: #fdfdfc !important;
34
- --colors-secondaryAlt: #fdfdfc !important;
35
- --colors-secondaryMuted: #fdfdfc !important;
4
+ --color-accent-50: #fdfdfe;
5
+ --color-accent-100: #edf2fe;
6
+ --color-accent-200: #e1e9ff;
7
+ --color-accent-300: #c1d0ff;
8
+ --color-accent-400: #abbdf9;
9
+ --color-accent-500: #8da4ef;
10
+ --color-accent-600: #3e63dd;
11
+ --color-accent-700: #3358d4;
12
+ --color-accent-800: #3a5bc7;
13
+ --color-accent-900: #172245;
14
+ --color-accent-default: #3358d4;
15
+ --color-gray-50: #fcfcfd;
16
+ --color-gray-100: #f0f0f3;
17
+ --color-gray-200: #e8e8ec;
18
+ --color-gray-300: #d9d9e0;
19
+ --color-gray-400: #cdced6;
20
+ --color-gray-500: #b9bbc6;
21
+ --color-gray-600: #8b8d98;
22
+ --color-gray-700: #80838d;
23
+ --color-gray-800: #60646c;
24
+ --color-gray-900: #111316;
25
+ --color-gray-default: #111316;
26
+ --color-gray-muted: #8b8d98;
27
+ --colors-accent: #3358d4 !important;
28
+ --colors-accentAlt: #3a5bc7 !important;
29
+ --colors-accentMuted: #abbdf9 !important;
30
+ --colors-primary: #111316 !important;
31
+ --colors-primaryAlt: #111316 !important;
32
+ --colors-primaryMuted: #111316 !important;
33
+ --colors-secondary: #fcfcfd !important;
34
+ --colors-secondaryAlt: #fcfcfd !important;
35
+ --colors-secondaryMuted: #fcfcfd !important;
36
36
  color-scheme: light;
37
37
  }
38
38
  :host {
39
- --color-accent-50: #fdfdfc;
40
- --color-accent-100: #f2f0e7;
41
- --color-accent-200: #eae6db;
42
- --color-accent-300: #d8d0bf;
43
- --color-accent-400: #cbc0aa;
44
- --color-accent-500: #b9a88d;
45
- --color-accent-600: #978365;
46
- --color-accent-700: #8c7a5e;
47
- --color-accent-800: #71624b;
48
- --color-accent-900: #2c2820;
49
- --color-accent-default: #8c7a5e;
50
- --color-gray-50: #fdfdfc;
51
- --color-gray-100: #f1f0ef;
52
- --color-gray-200: #e9e8e6;
53
- --color-gray-300: #dad9d6;
54
- --color-gray-400: #cfceca;
55
- --color-gray-500: #bcbbb5;
56
- --color-gray-600: #8d8d86;
57
- --color-gray-700: #82827c;
58
- --color-gray-800: #63635e;
59
- --color-gray-900: #141311;
60
- --color-gray-default: #141311;
61
- --color-gray-muted: #8d8d86;
62
- --colors-accent: #8c7a5e !important;
63
- --colors-accentAlt: #71624b !important;
64
- --colors-accentMuted: #cbc0aa !important;
65
- --colors-primary: #141311 !important;
66
- --colors-primaryAlt: #141311 !important;
67
- --colors-primaryMuted: #141311 !important;
68
- --colors-secondary: #fdfdfc !important;
69
- --colors-secondaryAlt: #fdfdfc !important;
70
- --colors-secondaryMuted: #fdfdfc !important;
39
+ --color-accent-50: #fdfdfe;
40
+ --color-accent-100: #edf2fe;
41
+ --color-accent-200: #e1e9ff;
42
+ --color-accent-300: #c1d0ff;
43
+ --color-accent-400: #abbdf9;
44
+ --color-accent-500: #8da4ef;
45
+ --color-accent-600: #3e63dd;
46
+ --color-accent-700: #3358d4;
47
+ --color-accent-800: #3a5bc7;
48
+ --color-accent-900: #172245;
49
+ --color-accent-default: #3358d4;
50
+ --color-gray-50: #fcfcfd;
51
+ --color-gray-100: #f0f0f3;
52
+ --color-gray-200: #e8e8ec;
53
+ --color-gray-300: #d9d9e0;
54
+ --color-gray-400: #cdced6;
55
+ --color-gray-500: #b9bbc6;
56
+ --color-gray-600: #8b8d98;
57
+ --color-gray-700: #80838d;
58
+ --color-gray-800: #60646c;
59
+ --color-gray-900: #111316;
60
+ --color-gray-default: #111316;
61
+ --color-gray-muted: #8b8d98;
62
+ --colors-accent: #3358d4 !important;
63
+ --colors-accentAlt: #3a5bc7 !important;
64
+ --colors-accentMuted: #abbdf9 !important;
65
+ --colors-primary: #111316 !important;
66
+ --colors-primaryAlt: #111316 !important;
67
+ --colors-primaryMuted: #111316 !important;
68
+ --colors-secondary: #fcfcfd !important;
69
+ --colors-secondaryAlt: #fcfcfd !important;
70
+ --colors-secondaryMuted: #fcfcfd !important;
71
71
  color-scheme: light;
72
72
  }
73
73
  }
@@ -130,6 +130,12 @@
130
130
  margin: 1.618rem 0 1rem;
131
131
  font-weight: 300;
132
132
  }
133
+ .canopy-lead {
134
+ font-size: 1.382rem;
135
+ color: var(--color-gray-700);
136
+ margin: 0.5rem 0 2rem 0;
137
+ line-height: 1.4;
138
+ }
133
139
  }
134
140
  @utility font-display {
135
141
  font-family: var(--font-serif);
@@ -177,6 +183,9 @@
177
183
  @utility max-w-content {
178
184
  max-width: 1080px;
179
185
  }
186
+ @utility max-w-wide {
187
+ max-width: 1300px;
188
+ }
180
189
  @layer components {
181
190
  .canopy-button {
182
191
  display: inline-flex;
@@ -1710,6 +1719,35 @@
1710
1719
  display: none;
1711
1720
  }
1712
1721
 
1722
+ @layer components {
1723
+ body.canopy-type-work main h1 {
1724
+ font-size: 2rem;
1725
+ line-height: 1.1;
1726
+ margin: 1.618rem 0;
1727
+ }
1728
+ body.canopy-type-work main dl {
1729
+ padding: 0;
1730
+ }
1731
+ body.canopy-type-work main dl > div {
1732
+ display: grid;
1733
+ gap: 0.2rem;
1734
+ padding: 0.85rem 0;
1735
+ }
1736
+ body.canopy-type-work main dt {
1737
+ font-size: 0.7222rem;
1738
+ text-transform: uppercase;
1739
+ margin: 0;
1740
+ font-weight: 400;
1741
+ color: var(--color-gray-700);
1742
+ }
1743
+ body.canopy-type-work main dd {
1744
+ margin: 0;
1745
+ color: var(--color-gray-900);
1746
+ font-size: 1rem;
1747
+ line-height: 1.45;
1748
+ }
1749
+ }
1713
1750
  /**
1714
1751
  * Define source files for utility classes
1715
- */
1752
+ */
1753
+ @source "../dist";
package/ui/styles/index.scss CHANGED
@@ -7,4 +7,4 @@
7
7
  /**
8
8
  * Define source files for utility classes
9
9
  */
10
- // @source "../dist";
10
+ @source "../dist";