@penn-libraries/web 1.0.0-dev.0 → 1.0.0-dev.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.
- package/dist/cjs/pennlibs-chat.pennlibs-fallback-img.pennlibs-feedback.pennlibs-footer.pennlibs-header.pennlibs-hero.entry.cjs.js.map +1 -1
- package/dist/cjs/pennlibs-chat_6.cjs.entry.js +8 -8
- package/dist/cjs/pennlibs-chat_6.cjs.entry.js.map +1 -1
- package/dist/collection/components/pennlibs-footer/pennlibs-footer.css +1 -1
- package/dist/collection/components/pennlibs-footer/pennlibs-footer.js +4 -4
- package/dist/collection/components/pennlibs-footer/pennlibs-footer.js.map +1 -1
- package/dist/collection/components/pennlibs-header/pennlibs-header.css +2 -2
- package/dist/collection/components/pennlibs-header/pennlibs-header.js +2 -2
- package/dist/collection/components/pennlibs-header/pennlibs-header.js.map +1 -1
- package/dist/collection/components/pennlibs-hero/pennlibs-hero.css +6 -6
- package/dist/collection/components/pennlibs-hero/pennlibs-hero.js +2 -2
- package/dist/collection/components/pennlibs-hero/pennlibs-hero.js.map +1 -1
- package/dist/components/pennlibs-footer.js +4 -4
- package/dist/components/pennlibs-footer.js.map +1 -1
- package/dist/components/pennlibs-header.js +2 -2
- package/dist/components/pennlibs-header.js.map +1 -1
- package/dist/components/pennlibs-hero.js +2 -2
- package/dist/components/pennlibs-hero.js.map +1 -1
- package/dist/docs.json +4 -4
- package/dist/esm/pennlibs-chat.pennlibs-fallback-img.pennlibs-feedback.pennlibs-footer.pennlibs-header.pennlibs-hero.entry.js.map +1 -1
- package/dist/esm/pennlibs-chat_6.entry.js +8 -8
- package/dist/esm/pennlibs-chat_6.entry.js.map +1 -1
- package/dist/types/components/pennlibs-footer/pennlibs-footer.d.ts +1 -1
- package/dist/types/components/pennlibs-header/pennlibs-header.d.ts +1 -1
- package/dist/types/components/pennlibs-hero/pennlibs-hero.d.ts +1 -1
- package/dist/types/components.d.ts +12 -12
- package/dist/web/{p-1f149b52.entry.js → p-ffdd436d.entry.js} +9 -9
- package/dist/web/p-ffdd436d.entry.js.map +1 -0
- package/dist/web/pennlibs-chat.pennlibs-fallback-img.pennlibs-feedback.pennlibs-footer.pennlibs-header.pennlibs-hero.entry.esm.js.map +1 -1
- package/dist/web/web.css +103 -70
- package/dist/web/web.esm.js +1 -1
- package/hydrate/index.js +11 -11
- package/hydrate/index.mjs +11 -11
- package/package.json +1 -1
- package/dist/web/p-1f149b52.entry.js.map +0 -1
package/dist/web/web.css
CHANGED
|
@@ -24,7 +24,7 @@
|
|
|
24
24
|
--pl-link-text-underline-offset: 0.2em;
|
|
25
25
|
--pl-link-text-decoration-thickness: 1px;
|
|
26
26
|
--pl-link-hover-text-decoration-thickness: 2px;
|
|
27
|
-
--pl-viewport-max-width: 1440px;
|
|
27
|
+
--pl-viewport-margins-max-width: 1440px;
|
|
28
28
|
--pl-viewport-margins-gutter: 1em;
|
|
29
29
|
--pl-color-fg-default: var(--pl-color-gray-dark);
|
|
30
30
|
--pl-color-fg-subtle: var(--pl-color-gray);
|
|
@@ -52,30 +52,30 @@
|
|
|
52
52
|
--pl-link-hover-text-decoration-thickness: 2px;
|
|
53
53
|
|
|
54
54
|
/* Font size tokens */
|
|
55
|
-
--pl-font-size-5xl:
|
|
56
|
-
--pl-font-size-4xl: 2.
|
|
57
|
-
--pl-font-size-3xl:
|
|
55
|
+
--pl-font-size-5xl: 3rem;
|
|
56
|
+
--pl-font-size-4xl: 2.75rem;
|
|
57
|
+
--pl-font-size-3xl: 2.25rem;
|
|
58
58
|
--pl-font-size-2xl: 1.5rem;
|
|
59
59
|
--pl-font-size-xl: 1.25rem;
|
|
60
|
-
--pl-font-size-
|
|
61
|
-
--pl-font-size-
|
|
62
|
-
--pl-font-size-
|
|
60
|
+
--pl-font-size-l: 1.125rem;
|
|
61
|
+
--pl-font-size-m: 1rem;
|
|
62
|
+
--pl-font-size-s: 0.875rem;
|
|
63
63
|
--pl-font-size-xs: 0.75rem;
|
|
64
64
|
|
|
65
65
|
/* Spacing tokens */
|
|
66
|
-
--pl-space-
|
|
67
|
-
--pl-space-
|
|
68
|
-
--pl-space-
|
|
69
|
-
--pl-space-
|
|
70
|
-
--pl-space-
|
|
71
|
-
--pl-space-
|
|
66
|
+
--pl-space-3xs: 0.125rem;
|
|
67
|
+
--pl-space-2xs: 0.25rem;
|
|
68
|
+
--pl-space-xs: 0.5rem;
|
|
69
|
+
--pl-space-s: 0.75rem;
|
|
70
|
+
--pl-space-m: 1rem;
|
|
71
|
+
--pl-space-l: 1.5rem;
|
|
72
72
|
--pl-space-xl: 2rem;
|
|
73
73
|
--pl-space-2xl: 3rem;
|
|
74
74
|
--pl-space-3xl: 4rem;
|
|
75
75
|
|
|
76
76
|
/* Border radius tokens */
|
|
77
|
-
--pl-border-radius-subtle: 0.
|
|
78
|
-
--pl-border-radius
|
|
77
|
+
--pl-border-radius-subtle: 0.25rem;
|
|
78
|
+
--pl-border-radius: 1rem;
|
|
79
79
|
|
|
80
80
|
/* Focus box shadow tokens */
|
|
81
81
|
--pl-focus-box-shadow: 0 0 0 2px var(--pl-color-bg-accent), 0 0 0 4px var(--pl-color-fg-default);
|
|
@@ -87,8 +87,14 @@
|
|
|
87
87
|
}
|
|
88
88
|
}
|
|
89
89
|
|
|
90
|
+
@media print {
|
|
91
|
+
body {
|
|
92
|
+
zoom: 80%;
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
|
|
90
96
|
.pl-viewport-margins {
|
|
91
|
-
max-width: var(--pl-viewport-max-width);
|
|
97
|
+
max-width: var(--pl-viewport-margins-max-width);
|
|
92
98
|
margin: 0 auto;
|
|
93
99
|
padding: 0 var(--pl-viewport-margins-gutter, 1rem);
|
|
94
100
|
width: 100%;
|
|
@@ -209,7 +215,7 @@
|
|
|
209
215
|
|
|
210
216
|
& :is(h2, .pl-h2) {
|
|
211
217
|
font-size: var(--pl-font-size-3xl);
|
|
212
|
-
margin-bottom: 0.
|
|
218
|
+
margin-bottom: 0.5em;
|
|
213
219
|
|
|
214
220
|
&::after {
|
|
215
221
|
background: #d6d6dc;
|
|
@@ -221,7 +227,16 @@
|
|
|
221
227
|
font-size: var(--pl-font-size-xl);
|
|
222
228
|
font-family: var(--pl-font-sans-serif);
|
|
223
229
|
color: var(--pl-color-fg-default);
|
|
224
|
-
margin-bottom: var(--pl-space-
|
|
230
|
+
margin-bottom: var(--pl-space-m);
|
|
231
|
+
|
|
232
|
+
&:after {
|
|
233
|
+
content: none;
|
|
234
|
+
}
|
|
235
|
+
}
|
|
236
|
+
|
|
237
|
+
& :is(h4, .pl-h4) {
|
|
238
|
+
font-size: var(--pl-font-size-m);
|
|
239
|
+
margin-bottom: var(--pl-space-s);
|
|
225
240
|
|
|
226
241
|
&:after {
|
|
227
242
|
content: none;
|
|
@@ -229,6 +244,24 @@
|
|
|
229
244
|
}
|
|
230
245
|
}
|
|
231
246
|
|
|
247
|
+
/*
|
|
248
|
+
Display
|
|
249
|
+
*/
|
|
250
|
+
.pl-block { display: block; }
|
|
251
|
+
.pl-inline { display: inline; }
|
|
252
|
+
.pl-inline-block { display: inline-block; }
|
|
253
|
+
.pl-flex { display: flex; }
|
|
254
|
+
.pl-inline-flex { display: inline-flex; }
|
|
255
|
+
.pl-grid { display: grid; }
|
|
256
|
+
.pl-inline-grid { display: inline-grid; }
|
|
257
|
+
.pl-none { display: none; }
|
|
258
|
+
|
|
259
|
+
/*
|
|
260
|
+
Flex direction utilities
|
|
261
|
+
*/
|
|
262
|
+
.pl-flex-row { flex-direction: row; }
|
|
263
|
+
.pl-flex-col { flex-direction: column; }
|
|
264
|
+
|
|
232
265
|
/*
|
|
233
266
|
Spacing
|
|
234
267
|
*/
|
|
@@ -237,9 +270,9 @@
|
|
|
237
270
|
.pl-margin-0 { margin: 0; }
|
|
238
271
|
.pl-margin-2xs { margin: var(--pl-space-2xs); }
|
|
239
272
|
.pl-margin-xs { margin: var(--pl-space-xs); }
|
|
240
|
-
.pl-margin-
|
|
241
|
-
.pl-margin-
|
|
242
|
-
.pl-margin-
|
|
273
|
+
.pl-margin-s { margin: var(--pl-space-s); }
|
|
274
|
+
.pl-margin-m { margin: var(--pl-space-m); }
|
|
275
|
+
.pl-margin-l { margin: var(--pl-space-l); }
|
|
243
276
|
.pl-margin-xl { margin: var(--pl-space-xl); }
|
|
244
277
|
.pl-margin-2xl { margin: var(--pl-space-2xl); }
|
|
245
278
|
.pl-margin-3xl { margin: var(--pl-space-3xl); }
|
|
@@ -248,9 +281,9 @@
|
|
|
248
281
|
.pl-margin-t-0 { margin-top: 0; }
|
|
249
282
|
.pl-margin-t-2xs { margin-top: var(--pl-space-2xs); }
|
|
250
283
|
.pl-margin-t-xs { margin-top: var(--pl-space-xs); }
|
|
251
|
-
.pl-margin-t-
|
|
252
|
-
.pl-margin-t-
|
|
253
|
-
.pl-margin-t-
|
|
284
|
+
.pl-margin-t-s { margin-top: var(--pl-space-s); }
|
|
285
|
+
.pl-margin-t-m { margin-top: var(--pl-space-m); }
|
|
286
|
+
.pl-margin-t-l { margin-top: var(--pl-space-l); }
|
|
254
287
|
.pl-margin-t-xl { margin-top: var(--pl-space-xl); }
|
|
255
288
|
.pl-margin-t-2xl { margin-top: var(--pl-space-2xl); }
|
|
256
289
|
.pl-margin-t-3xl { margin-top: var(--pl-space-3xl); }
|
|
@@ -259,9 +292,9 @@
|
|
|
259
292
|
.pl-margin-b-0 { margin-bottom: 0; }
|
|
260
293
|
.pl-margin-b-2xs { margin-bottom: var(--pl-space-2xs); }
|
|
261
294
|
.pl-margin-b-xs { margin-bottom: var(--pl-space-xs); }
|
|
262
|
-
.pl-margin-b-
|
|
263
|
-
.pl-margin-b-
|
|
264
|
-
.pl-margin-b-
|
|
295
|
+
.pl-margin-b-s { margin-bottom: var(--pl-space-s); }
|
|
296
|
+
.pl-margin-b-m { margin-bottom: var(--pl-space-m); }
|
|
297
|
+
.pl-margin-b-l { margin-bottom: var(--pl-space-l); }
|
|
265
298
|
.pl-margin-b-xl { margin-bottom: var(--pl-space-xl); }
|
|
266
299
|
.pl-margin-b-2xl { margin-bottom: var(--pl-space-2xl); }
|
|
267
300
|
.pl-margin-b-3xl { margin-bottom: var(--pl-space-3xl); }
|
|
@@ -270,9 +303,9 @@
|
|
|
270
303
|
.pl-margin-l-0 { margin-left: 0; }
|
|
271
304
|
.pl-margin-l-2xs { margin-left: var(--pl-space-2xs); }
|
|
272
305
|
.pl-margin-l-xs { margin-left: var(--pl-space-xs); }
|
|
273
|
-
.pl-margin-l-
|
|
274
|
-
.pl-margin-l-
|
|
275
|
-
.pl-margin-l-
|
|
306
|
+
.pl-margin-l-s { margin-left: var(--pl-space-s); }
|
|
307
|
+
.pl-margin-l-m { margin-left: var(--pl-space-m); }
|
|
308
|
+
.pl-margin-l-l { margin-left: var(--pl-space-l); }
|
|
276
309
|
.pl-margin-l-xl { margin-left: var(--pl-space-xl); }
|
|
277
310
|
.pl-margin-l-2xl { margin-left: var(--pl-space-2xl); }
|
|
278
311
|
.pl-margin-l-3xl { margin-left: var(--pl-space-3xl); }
|
|
@@ -281,9 +314,9 @@
|
|
|
281
314
|
.pl-margin-r-0 { margin-right: 0; }
|
|
282
315
|
.pl-margin-r-2xs { margin-right: var(--pl-space-2xs); }
|
|
283
316
|
.pl-margin-r-xs { margin-right: var(--pl-space-xs); }
|
|
284
|
-
.pl-margin-r-
|
|
285
|
-
.pl-margin-r-
|
|
286
|
-
.pl-margin-r-
|
|
317
|
+
.pl-margin-r-s { margin-right: var(--pl-space-s); }
|
|
318
|
+
.pl-margin-r-m { margin-right: var(--pl-space-m); }
|
|
319
|
+
.pl-margin-r-l { margin-right: var(--pl-space-l); }
|
|
287
320
|
.pl-margin-r-xl { margin-right: var(--pl-space-xl); }
|
|
288
321
|
.pl-margin-r-2xl { margin-right: var(--pl-space-2xl); }
|
|
289
322
|
.pl-margin-r-3xl { margin-right: var(--pl-space-3xl); }
|
|
@@ -292,9 +325,9 @@
|
|
|
292
325
|
.pl-margin-x-0 { margin-left: 0; margin-right: 0; }
|
|
293
326
|
.pl-margin-x-2xs { margin-left: var(--pl-space-2xs); margin-right: var(--pl-space-2xs); }
|
|
294
327
|
.pl-margin-x-xs { margin-left: var(--pl-space-xs); margin-right: var(--pl-space-xs); }
|
|
295
|
-
.pl-margin-x-
|
|
296
|
-
.pl-margin-x-
|
|
297
|
-
.pl-margin-x-
|
|
328
|
+
.pl-margin-x-s { margin-left: var(--pl-space-s); margin-right: var(--pl-space-s); }
|
|
329
|
+
.pl-margin-x-m { margin-left: var(--pl-space-m); margin-right: var(--pl-space-m); }
|
|
330
|
+
.pl-margin-x-l { margin-left: var(--pl-space-l); margin-right: var(--pl-space-l); }
|
|
298
331
|
.pl-margin-x-xl { margin-left: var(--pl-space-xl); margin-right: var(--pl-space-xl); }
|
|
299
332
|
.pl-margin-x-2xl { margin-left: var(--pl-space-2xl); margin-right: var(--pl-space-2xl); }
|
|
300
333
|
.pl-margin-x-3xl { margin-left: var(--pl-space-3xl); margin-right: var(--pl-space-3xl); }
|
|
@@ -303,9 +336,9 @@
|
|
|
303
336
|
.pl-margin-y-0 { margin-top: 0; margin-bottom: 0; }
|
|
304
337
|
.pl-margin-y-2xs { margin-top: var(--pl-space-2xs); margin-bottom: var(--pl-space-2xs); }
|
|
305
338
|
.pl-margin-y-xs { margin-top: var(--pl-space-xs); margin-bottom: var(--pl-space-xs); }
|
|
306
|
-
.pl-margin-y-
|
|
307
|
-
.pl-margin-y-
|
|
308
|
-
.pl-margin-y-
|
|
339
|
+
.pl-margin-y-s { margin-top: var(--pl-space-s); margin-bottom: var(--pl-space-s); }
|
|
340
|
+
.pl-margin-y-m { margin-top: var(--pl-space-m); margin-bottom: var(--pl-space-m); }
|
|
341
|
+
.pl-margin-y-l { margin-top: var(--pl-space-l); margin-bottom: var(--pl-space-l); }
|
|
309
342
|
.pl-margin-y-xl { margin-top: var(--pl-space-xl); margin-bottom: var(--pl-space-xl); }
|
|
310
343
|
.pl-margin-y-2xl { margin-top: var(--pl-space-2xl); margin-bottom: var(--pl-space-2xl); }
|
|
311
344
|
.pl-margin-y-3xl { margin-top: var(--pl-space-3xl); margin-bottom: var(--pl-space-3xl); }
|
|
@@ -314,9 +347,9 @@
|
|
|
314
347
|
.pl-padding-0 { padding: 0; }
|
|
315
348
|
.pl-padding-2xs { padding: var(--pl-space-2xs); }
|
|
316
349
|
.pl-padding-xs { padding: var(--pl-space-xs); }
|
|
317
|
-
.pl-padding-
|
|
318
|
-
.pl-padding-
|
|
319
|
-
.pl-padding-
|
|
350
|
+
.pl-padding-s { padding: var(--pl-space-s); }
|
|
351
|
+
.pl-padding-m { padding: var(--pl-space-m); }
|
|
352
|
+
.pl-padding-l { padding: var(--pl-space-l); }
|
|
320
353
|
.pl-padding-xl { padding: var(--pl-space-xl); }
|
|
321
354
|
.pl-padding-2xl { padding: var(--pl-space-2xl); }
|
|
322
355
|
.pl-padding-3xl { padding: var(--pl-space-3xl); }
|
|
@@ -325,9 +358,9 @@
|
|
|
325
358
|
.pl-padding-t-0 { padding-top: 0; }
|
|
326
359
|
.pl-padding-t-2xs { padding-top: var(--pl-space-2xs); }
|
|
327
360
|
.pl-padding-t-xs { padding-top: var(--pl-space-xs); }
|
|
328
|
-
.pl-padding-t-
|
|
329
|
-
.pl-padding-t-
|
|
330
|
-
.pl-padding-t-
|
|
361
|
+
.pl-padding-t-s { padding-top: var(--pl-space-s); }
|
|
362
|
+
.pl-padding-t-m { padding-top: var(--pl-space-m); }
|
|
363
|
+
.pl-padding-t-l { padding-top: var(--pl-space-l); }
|
|
331
364
|
.pl-padding-t-xl { padding-top: var(--pl-space-xl); }
|
|
332
365
|
.pl-padding-t-2xl { padding-top: var(--pl-space-2xl); }
|
|
333
366
|
.pl-padding-t-3xl { padding-top: var(--pl-space-3xl); }
|
|
@@ -336,9 +369,9 @@
|
|
|
336
369
|
.pl-padding-b-0 { padding-bottom: 0; }
|
|
337
370
|
.pl-padding-b-2xs { padding-bottom: var(--pl-space-2xs); }
|
|
338
371
|
.pl-padding-b-xs { padding-bottom: var(--pl-space-xs); }
|
|
339
|
-
.pl-padding-b-
|
|
340
|
-
.pl-padding-b-
|
|
341
|
-
.pl-padding-b-
|
|
372
|
+
.pl-padding-b-s { padding-bottom: var(--pl-space-s); }
|
|
373
|
+
.pl-padding-b-m { padding-bottom: var(--pl-space-m); }
|
|
374
|
+
.pl-padding-b-l { padding-bottom: var(--pl-space-l); }
|
|
342
375
|
.pl-padding-b-xl { padding-bottom: var(--pl-space-xl); }
|
|
343
376
|
.pl-padding-b-2xl { padding-bottom: var(--pl-space-2xl); }
|
|
344
377
|
.pl-padding-b-3xl { padding-bottom: var(--pl-space-3xl); }
|
|
@@ -347,9 +380,9 @@
|
|
|
347
380
|
.pl-padding-l-0 { padding-left: 0; }
|
|
348
381
|
.pl-padding-l-2xs { padding-left: var(--pl-space-2xs); }
|
|
349
382
|
.pl-padding-l-xs { padding-left: var(--pl-space-xs); }
|
|
350
|
-
.pl-padding-l-
|
|
351
|
-
.pl-padding-l-
|
|
352
|
-
.pl-padding-l-
|
|
383
|
+
.pl-padding-l-s { padding-left: var(--pl-space-s); }
|
|
384
|
+
.pl-padding-l-m { padding-left: var(--pl-space-m); }
|
|
385
|
+
.pl-padding-l-l { padding-left: var(--pl-space-l); }
|
|
353
386
|
.pl-padding-l-xl { padding-left: var(--pl-space-xl); }
|
|
354
387
|
.pl-padding-l-2xl { padding-left: var(--pl-space-2xl); }
|
|
355
388
|
.pl-padding-l-3xl { padding-left: var(--pl-space-3xl); }
|
|
@@ -358,9 +391,9 @@
|
|
|
358
391
|
.pl-padding-r-0 { padding-right: 0; }
|
|
359
392
|
.pl-padding-r-2xs { padding-right: var(--pl-space-2xs); }
|
|
360
393
|
.pl-padding-r-xs { padding-right: var(--pl-space-xs); }
|
|
361
|
-
.pl-padding-r-
|
|
362
|
-
.pl-padding-r-
|
|
363
|
-
.pl-padding-r-
|
|
394
|
+
.pl-padding-r-s { padding-right: var(--pl-space-s); }
|
|
395
|
+
.pl-padding-r-m { padding-right: var(--pl-space-m); }
|
|
396
|
+
.pl-padding-r-l { padding-right: var(--pl-space-l); }
|
|
364
397
|
.pl-padding-r-xl { padding-right: var(--pl-space-xl); }
|
|
365
398
|
.pl-padding-r-2xl { padding-right: var(--pl-space-2xl); }
|
|
366
399
|
.pl-padding-r-3xl { padding-right: var(--pl-space-3xl); }
|
|
@@ -369,9 +402,9 @@
|
|
|
369
402
|
.pl-padding-x-0 { padding-left: 0; padding-right: 0; }
|
|
370
403
|
.pl-padding-x-2xs { padding-left: var(--pl-space-2xs); padding-right: var(--pl-space-2xs); }
|
|
371
404
|
.pl-padding-x-xs { padding-left: var(--pl-space-xs); padding-right: var(--pl-space-xs); }
|
|
372
|
-
.pl-padding-x-
|
|
373
|
-
.pl-padding-x-
|
|
374
|
-
.pl-padding-x-
|
|
405
|
+
.pl-padding-x-s { padding-left: var(--pl-space-s); padding-right: var(--pl-space-s); }
|
|
406
|
+
.pl-padding-x-m { padding-left: var(--pl-space-m); padding-right: var(--pl-space-m); }
|
|
407
|
+
.pl-padding-x-l { padding-left: var(--pl-space-l); padding-right: var(--pl-space-l); }
|
|
375
408
|
.pl-padding-x-xl { padding-left: var(--pl-space-xl); padding-right: var(--pl-space-xl); }
|
|
376
409
|
.pl-padding-x-2xl { padding-left: var(--pl-space-2xl); padding-right: var(--pl-space-2xl); }
|
|
377
410
|
.pl-padding-x-3xl { padding-left: var(--pl-space-3xl); padding-right: var(--pl-space-3xl); }
|
|
@@ -380,9 +413,9 @@
|
|
|
380
413
|
.pl-padding-y-0 { padding-top: 0; padding-bottom: 0; }
|
|
381
414
|
.pl-padding-y-2xs { padding-top: var(--pl-space-2xs); padding-bottom: var(--pl-space-2xs); }
|
|
382
415
|
.pl-padding-y-xs { padding-top: var(--pl-space-xs); padding-bottom: var(--pl-space-xs); }
|
|
383
|
-
.pl-padding-y-
|
|
384
|
-
.pl-padding-y-
|
|
385
|
-
.pl-padding-y-
|
|
416
|
+
.pl-padding-y-s { padding-top: var(--pl-space-s); padding-bottom: var(--pl-space-s); }
|
|
417
|
+
.pl-padding-y-m { padding-top: var(--pl-space-m); padding-bottom: var(--pl-space-m); }
|
|
418
|
+
.pl-padding-y-l { padding-top: var(--pl-space-l); padding-bottom: var(--pl-space-l); }
|
|
386
419
|
.pl-padding-y-xl { padding-top: var(--pl-space-xl); padding-bottom: var(--pl-space-xl); }
|
|
387
420
|
.pl-padding-y-2xl { padding-top: var(--pl-space-2xl); padding-bottom: var(--pl-space-2xl); }
|
|
388
421
|
.pl-padding-y-3xl { padding-top: var(--pl-space-3xl); padding-bottom: var(--pl-space-3xl); }
|
|
@@ -391,9 +424,9 @@
|
|
|
391
424
|
.pl-gap-0 { gap: 0; }
|
|
392
425
|
.pl-gap-2xs { gap: var(--pl-space-2xs); }
|
|
393
426
|
.pl-gap-xs { gap: var(--pl-space-xs); }
|
|
394
|
-
.pl-gap-
|
|
395
|
-
.pl-gap-
|
|
396
|
-
.pl-gap-
|
|
427
|
+
.pl-gap-s { gap: var(--pl-space-s); }
|
|
428
|
+
.pl-gap-m { gap: var(--pl-space-m); }
|
|
429
|
+
.pl-gap-l { gap: var(--pl-space-l); }
|
|
397
430
|
.pl-gap-xl { gap: var(--pl-space-xl); }
|
|
398
431
|
.pl-gap-2xl { gap: var(--pl-space-2xl); }
|
|
399
432
|
.pl-gap-3xl { gap: var(--pl-space-3xl); }
|
|
@@ -406,16 +439,16 @@
|
|
|
406
439
|
font-size: var(--pl-font-size-xs);
|
|
407
440
|
}
|
|
408
441
|
|
|
409
|
-
.pl-font-size-
|
|
410
|
-
font-size: var(--pl-font-size-
|
|
442
|
+
.pl-font-size-s {
|
|
443
|
+
font-size: var(--pl-font-size-s);
|
|
411
444
|
}
|
|
412
445
|
|
|
413
|
-
.pl-font-size-
|
|
414
|
-
font-size: var(--pl-font-size-
|
|
446
|
+
.pl-font-size-m {
|
|
447
|
+
font-size: var(--pl-font-size-m);
|
|
415
448
|
}
|
|
416
449
|
|
|
417
|
-
.pl-font-size-
|
|
418
|
-
font-size: var(--pl-font-size-
|
|
450
|
+
.pl-font-size-l {
|
|
451
|
+
font-size: var(--pl-font-size-l);
|
|
419
452
|
}
|
|
420
453
|
|
|
421
454
|
.pl-font-size-xl {
|
|
@@ -455,7 +488,7 @@
|
|
|
455
488
|
}
|
|
456
489
|
|
|
457
490
|
.pl-border-radius {
|
|
458
|
-
border-radius: var(--pl-border-radius
|
|
491
|
+
border-radius: var(--pl-border-radius);
|
|
459
492
|
}
|
|
460
493
|
|
|
461
494
|
/*
|
package/dist/web/web.esm.js
CHANGED
|
@@ -17,7 +17,7 @@ var patchBrowser = () => {
|
|
|
17
17
|
|
|
18
18
|
patchBrowser().then(async (options) => {
|
|
19
19
|
await globalScripts();
|
|
20
|
-
return bootstrapLazy([["p-
|
|
20
|
+
return bootstrapLazy([["p-ffdd436d",[[1,"pennlibs-chat",{"href":[32]}],[1,"pennlibs-fallback-img"],[1,"pennlibs-feedback",{"error":[32],"answer":[32]}],[1,"pennlibs-footer",{"navigationByChildren":[32]}],[1,"pennlibs-header",{"serviceName":[1,"service-name"],"serviceLede":[1,"service-lede"],"serviceHref":[1,"service-href"],"theme":[1],"isMenuOpen":[32],"navigation":[32]}],[1,"pennlibs-hero",{"heroPictureElement":[32],"heroHeadingElement":[32],"heroParagraphElement":[32],"heroSrc":[32]}]]],["p-e331a309",[[1,"pennlibs-banner"]]]], options);
|
|
21
21
|
});
|
|
22
22
|
//# sourceMappingURL=web.esm.js.map
|
|
23
23
|
|
package/hydrate/index.js
CHANGED
|
@@ -3170,7 +3170,7 @@ class Chat {
|
|
|
3170
3170
|
}; }
|
|
3171
3171
|
}
|
|
3172
3172
|
|
|
3173
|
-
const pennlibsFooterCss = ":host {\n font-family: var(--pl-font-family);\n font-size: var(--pl-font-size);\n --padding-bottom: 5.75rem;\n}\n\n@media print {\n :host {\n display: none;\n }\n}\n\n*, *::before, *::after {\n box-sizing: border-box;\n}\n\n.website-footer-wrapper {\n background: var(--pl-color-penn-blue);\n padding-bottom: var(--padding-bottom);\n}\n\n.viewport-margins {\n max-width: var(--pl-viewport-max-width);\n margin: 0 auto;\n padding: 0 var(--pl-viewport-margins-gutter, 1em);\n}\n\n.website-footer {\n background-size: cover;\n color: var(--pl-color-fg-subtle-on-emphasis);\n}\n\n.website-footer a {\n color: var(--pl-color-fg-subtle-on-emphasis);\n}\n\n.website-footer__content {\n padding: 4em 0;\n}\n\n.website-footer__links-container {\n gap: 4em 2em;\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(12em, 1fr));\n}\n\n.website-footer__heading {\n font-size: 0.8em;\n text-transform: uppercase;\n letter-spacing: 0.075em;\n margin-bottom: 1em;\n opacity: 0.75;\n}\n\n.website-footer__links {\n margin: 0;\n padding: 0;\n list-style: none;\n display: flex;\n flex-direction: column;\n gap: 0.75em;\n}\n\n.website-footer__links a {\n text-decoration: none;\n}\n\n.website-footer__links a:hover {\n text-decoration: underline;\n text-underline-offset: var(--pl-link-text-underline-offset);\n}\n\n.website-footer__footer {\n padding: 1em 0;\n background: rgba(1, 31, 91, 0.65);\n}\n\n.website-footer__links--footer {\n display: flex;\n flex-wrap: wrap;\n gap: 0;\n flex-direction: row;\n margin-left: -0.5em;\n\n @media (max-width: 1080px) {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(16em, 1fr));\n }\n}\n\n.website-footer__links--footer a {\n display: inline-block;\n padding: 0.5em 0.75em;\n font-size: 0.875em;\n opacity: 0.875;\n font-weight: 500;\n}\n\n.website-footer__links--footer a:hover {\n text-decoration: underline;\n text-underline-offset: var(--pl-link-text-underline-offset);\n}";
|
|
3173
|
+
const pennlibsFooterCss = ":host {\n font-family: var(--pl-font-family);\n font-size: var(--pl-font-size);\n --padding-bottom: 5.75rem;\n}\n\n@media print {\n :host {\n display: none;\n }\n}\n\n*, *::before, *::after {\n box-sizing: border-box;\n}\n\n.website-footer-wrapper {\n background: var(--pl-color-penn-blue);\n padding-bottom: var(--padding-bottom);\n}\n\n.viewport-margins {\n max-width: var(--pl-viewport-margins-max-width);\n margin: 0 auto;\n padding: 0 var(--pl-viewport-margins-gutter, 1em);\n}\n\n.website-footer {\n background-size: cover;\n color: var(--pl-color-fg-subtle-on-emphasis);\n}\n\n.website-footer a {\n color: var(--pl-color-fg-subtle-on-emphasis);\n}\n\n.website-footer__content {\n padding: 4em 0;\n}\n\n.website-footer__links-container {\n gap: 4em 2em;\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(12em, 1fr));\n}\n\n.website-footer__heading {\n font-size: 0.8em;\n text-transform: uppercase;\n letter-spacing: 0.075em;\n margin-bottom: 1em;\n opacity: 0.75;\n}\n\n.website-footer__links {\n margin: 0;\n padding: 0;\n list-style: none;\n display: flex;\n flex-direction: column;\n gap: 0.75em;\n}\n\n.website-footer__links a {\n text-decoration: none;\n}\n\n.website-footer__links a:hover {\n text-decoration: underline;\n text-underline-offset: var(--pl-link-text-underline-offset);\n}\n\n.website-footer__footer {\n padding: 1em 0;\n background: rgba(1, 31, 91, 0.65);\n}\n\n.website-footer__links--footer {\n display: flex;\n flex-wrap: wrap;\n gap: 0;\n flex-direction: row;\n margin-left: -0.5em;\n\n @media (max-width: 1080px) {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(16em, 1fr));\n }\n}\n\n.website-footer__links--footer a {\n display: inline-block;\n padding: 0.5em 0.75em;\n font-size: 0.875em;\n opacity: 0.875;\n font-weight: 500;\n}\n\n.website-footer__links--footer a:hover {\n text-decoration: underline;\n text-underline-offset: var(--pl-link-text-underline-offset);\n}";
|
|
3174
3174
|
|
|
3175
3175
|
/**
|
|
3176
3176
|
* A footer component for Penn Libraries websites that displays contact information,
|
|
@@ -3194,7 +3194,7 @@ const pennlibsFooterCss = ":host {\n font-family: var(--pl-font-family);\n fon
|
|
|
3194
3194
|
*
|
|
3195
3195
|
* @slot default - Custom navigation sections with h2 headings and anchor links
|
|
3196
3196
|
*
|
|
3197
|
-
* @prop --pl-viewport-max-width: The maximum width of the footer content.
|
|
3197
|
+
* @prop --pl-viewport-margins-max-width: The maximum width of the footer content.
|
|
3198
3198
|
* @prop --pl-viewport-margins-gutter: The gutter width of the footer content.
|
|
3199
3199
|
*/
|
|
3200
3200
|
class Footer {
|
|
@@ -3224,12 +3224,12 @@ class Footer {
|
|
|
3224
3224
|
}
|
|
3225
3225
|
render() {
|
|
3226
3226
|
const footerBackgroundSrc = getAssetPath('./assets/footer-bg.webp');
|
|
3227
|
-
return (hAsync("div", { key: '
|
|
3227
|
+
return (hAsync("div", { key: 'a1cbb7636191cb3ac934a1bb375054357bcf93fc', class: "website-footer-wrapper" }, hAsync("footer", { key: 'f2f2ab282f7d8e5a4603e0a6d8337135c4625ba6', class: "website-footer", style: {
|
|
3228
3228
|
background: `var(--pl-color-penn-blue) url(${footerBackgroundSrc}) no-repeat 50% 50%`,
|
|
3229
3229
|
backgroundSize: 'cover',
|
|
3230
|
-
} }, hAsync("div", { key: '
|
|
3230
|
+
} }, hAsync("div", { key: 'eb24a52f9c3f135bc75f3e23ef3088a928a3ce65', class: "viewport-margins" }, hAsync("div", { key: '439be8c6582f5eaa173251af97f17252fce9243c', class: "website-footer__content" }, hAsync("div", { key: '3f30c3156c96a35a772fb85d890e1f5d81af8ec6', class: "website-footer__links-container" }, hAsync("section", { key: 'e32be08455a07061a8eaeb13b2ae3f377f818c5f' }, hAsync("h2", { key: 'bc2be34b67cc0953338d8f418950f428a5f55172', class: "website-footer__heading" }, "Penn Libraries"), hAsync("ul", { key: 'bae0ee381df1883da90752c9476491217a2c2ca7', class: "website-footer__links" }, hAsync("li", { key: 'f5025e51424e5c972b46a5d1650552b6187aa4e9' }, hAsync("a", { key: '836172e6d531eb0d37d0c0a5e66a3a6c92ba95b3', href: "https://maps.google.com/?q=Van Pelt Library 3420 Walnut Street, Philadelphia, PA 19104-6206" }, "3420 Walnut Street", hAsync("br", { key: 'ae8b8d41baccd3bb62c15d336c7664100f407886' }), "Philadelphia, PA 19104-6206")), hAsync("li", { key: 'ed016c0fbe56c899bedb3e25eabbb1b3773b0167' }, hAsync("a", { key: '04eab3b14fcda0ccff15f069beceb0bd0ef111fa', href: "tel:(215) 898-7555" }, "(215) 898-7555")), hAsync("li", { key: 'e1968b748a2303a2b6176f502f68f7ed20e90c9b' }, hAsync("a", { key: '9823456a1a5d7016431f88cd5a1c871cc8ef6a6d', href: "https://www.library.upenn.edu/contact-us" }, "Contact us")), hAsync("li", { key: 'aedd3b51a66e6a78c463d0e76a9fddd60a0e4fa8' }, hAsync("a", { key: '1972520903c54834e83c3f99ea4b35964d09b8a5', href: "https://www.library.upenn.edu/about/hours", target: "_blank" }, "Locations and hours")))), hAsync("section", { key: '3604f648361768c4c4fdae3bb19af3625ccc5cbd' }, hAsync("h2", { key: 'a79782bb074b215f3e44ebaf7e2bdcb8e1b37e27', class: "website-footer__heading" }, "Stay in touch"), hAsync("ul", { key: 'cf7d5c3ddf5473471a5e4f154a82a3c4c6d3b7b5', class: "website-footer__links" }, hAsync("li", { key: '8eb5e4f10197d0a428088e676d55620cc4a5ca6a' }, hAsync("a", { key: '8e698ca0cc1614db65e64466dd1912bd74a8f58c', href: "https://www.alumni.upenn.edu/libsignup" }, "Newsletter")), hAsync("li", { key: '62e6161d9ef81872473cb3c7df8df82fa5e49027' }, hAsync("a", { key: 'b24bd5cfea7998bdf3b7674e32b0e72597cdf6c9', href: "https://www.instagram.com/upennlib/" }, "Instagram")), hAsync("li", { key: 'd7260d10fda8fcde1bb799b2a6f5d9e34c47b4e1' }, hAsync("a", { key: 'b24f2b33851e30a61d859c507ee5781caec47cb3', href: "https://www.facebook.com/PennLibraries/" }, "Facebook")), hAsync("li", { key: '796d833e8f9e21a2739079ee7c5e7cf4f5bf5aa4' }, hAsync("a", { key: 'e8ec25b48d06450abe3db34eb98f338e1caadd1b', href: "https://www.linkedin.com/company/penn-libraries" }, "LinkedIn")))), this.navigationByChildren && [
|
|
3231
3231
|
this.navigationByChildren.map(section => (hAsync("section", null, hAsync("h2", { class: "website-footer__heading" }, section.heading), hAsync("ul", { class: "website-footer__links" }, section.links.map(link => (hAsync("li", null, hAsync("a", { href: link.href }, link.label))))))))
|
|
3232
|
-
]))), hAsync("div", { key: '
|
|
3232
|
+
]))), hAsync("div", { key: 'eb01f1b9475979942a291cecb5c49a7f99ac76ff', class: "website-footer__footer" }, hAsync("div", { key: 'fe811b0a667ac77fbd65c6947fc64b11e6fd105a', class: "viewport-margins" }, hAsync("ul", { key: '2999c3b798c86365232fa948bba6ba42bad4ac05', class: "website-footer__links website-footer__links--footer" }, hAsync("li", { key: '5fbd7893982b9bd85dd0bec9ae0ced8fa254b01c' }, hAsync("a", { key: '9ae82c6cad2c9d97a479407a8c1a2b7db451ba6e', href: "https://www.upenn.edu/" }, "UPenn")), hAsync("li", { key: '9a312ef71677395ae9e36140b50f26283e463e1f' }, hAsync("a", { key: '34881d92dd5bafaddda98f492e531663993ebcb5', href: "https://www.upenn.edu/about/privacy-policy" }, "Privacy Policy")), hAsync("li", { key: 'be80ff6346e925d3d4ca73148cab8f87e9eafc00' }, hAsync("a", { key: '1aa4f3965db242abaaea538a6c3d5a5358215348', href: "https://accessibility.web-resources.upenn.edu/get-help" }, "Report Accessibility Issues and Get Help")), hAsync("li", { key: '4f6e9174acdf75d75b8beefc12950fee8d185f94' }, hAsync("a", { key: '81b1a21a40057f8b1bb66efdd6fc264ebf132370', href: "https://www.upenn.edu/about/disclaimer" }, "Disclaimer")), hAsync("li", { key: 'd9054f8cb3a387947a75e0ce686401d43fbfac9a' }, hAsync("a", { key: '2bf7344740a7418eb68170b46afdb5eefc73dae3', href: "https://www.publicsafety.upenn.edu/contact/" }, "Emergency Services")), hAsync("li", { key: 'c6962c1ea1e96c351da514ac41eb7782a79d3c22' }, hAsync("a", { key: '0fd6ebe891954438f46c0265366a69ae319c2b7e', href: "https://www.upenn.edu/about/report-copyright-infringement" }, "Report Copyright Infringement"))))))));
|
|
3233
3233
|
}
|
|
3234
3234
|
static get assetsDirs() { return ["assets"]; }
|
|
3235
3235
|
get hostElement() { return getElement(this); }
|
|
@@ -3269,7 +3269,7 @@ const LogoBlue = () => {
|
|
|
3269
3269
|
hAsync("path", { fill: "#fff", d: "M0 0H444.165V95H0z" })))));
|
|
3270
3270
|
};
|
|
3271
3271
|
|
|
3272
|
-
const pennlibsHeaderCss = ":host{font-family:var(--pl-font-family);font-size:var(--pl-font-size);color:var(--pl-color-fg-default)}*,*:before,*:after{box-sizing:inherit}.viewport-margins{width:100%;max-width:var(--pl-viewport-max-width);margin:0 auto;padding:0 var(--pl-viewport-margins-gutter, 1em)}a{color:var(--
|
|
3272
|
+
const pennlibsHeaderCss = ":host{font-family:var(--pl-font-family);font-size:var(--pl-font-size);color:var(--pl-color-fg-default)}*,*:before,*:after{box-sizing:inherit}.viewport-margins{width:100%;max-width:var(--pl-viewport-margins-max-width);margin:0 auto;padding:0 var(--pl-viewport-margins-gutter, 1em)}a{color:var(--color-fg-menu)}*:focus{box-shadow:0 0 0 2px var(--pl-color-bg-accent), 0 0 0 4px var(--pl-color-bg-accent-emphasis);outline:none}.website-header{--color-fg-service:var(--pl-color-penn-blue);--color-fg-menu:var(--pl-color-fg-default);--color-bg-menu:var(--pl-color-bg-default)}.website-header--dark{--color-fg-service:var(--pl-color-fg-on-emphasis);--color-fg-menu:var(--pl-color-fg-on-emphasis);--color-bg-menu:var(--pl-color-penn-blue)}.website-header__logo-name-container{display:flex;align-items:stretch;margin-right:auto}@media (max-width: 620px){.website-header__logo-name-container{margin-right:6em;flex-direction:column;gap:0.5rem}}.website-header_logo-link{line-height:0}.website-header__logo{max-width:260px;margin-right:1em}@media (max-width: 1000px){.website-header__logo{max-width:200px}}@media (max-width: 620px){.website-header__logo{max-width:190px}}.website-header__service-link{display:flex;justify-content:center;flex-direction:column;text-decoration:none;line-height:1;color:var(--color-fg-service)}@media (min-width: 1001px){.website-header__service-link{padding-left:0.5em}}.website-header__hero .website-header__service-link{border-left:none}.website-header__service-link:hover .website-header__service-name{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:0.1em;text-decoration-color:var(--color-fg-service)}.website-header__service-name{font-size:1.5em;font-weight:500}.website-header__service-lede{font-size:1em}.website-header__inner-container{display:flex;justify-content:space-between;align-items:center;position:relative;padding:1em 0}@media (max-width: 1000px){.website-header__inner-container{flex-direction:column;align-items:flex-start}}@media (max-width: 1000px){.website-header__navigation{width:100%}}.website-header__navigation-list{list-style:none;display:flex;margin:0;padding:0}@media (max-width: 1000px){.website-header__navigation-list{display:none}}@media (max-width: 1000px){.website-header__navigation-list--visible{display:block;margin-top:1rem}.website-header__navigation-list--visible a{display:inline-block}}.website-header__navigation-list button{background-color:transparent;border-width:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;line-height:inherit;padding:0;color:inherit}.website-header__navigation-list a,.website-header__navigation-list button{display:block;text-decoration:none;cursor:pointer}@media (max-width: 1000px){.website-header__navigation-list a,.website-header__navigation-list button{padding:0.75em 0}}.website-header__navigation-list--visible a,.website-header__navigation-list--visible button{padding:0.5em 0}@media (min-width: 1001px){.website-header__navigation-list a,.website-header__navigation-list button{padding:0.5em}}.website-header__navigation-list a:hover,.website-header__navigation-list button:hover{text-decoration:underline;text-underline-offset:var(--pl-link-text-underline-offset)}.website-header__navigation-button{all:unset;text-transform:uppercase;font-size:0.75em;letter-spacing:0.075em;font-weight:600;padding:0.5em;border-radius:0.25em;position:absolute;right:0;top:1.5em;display:flex;align-items:center;color:var(--color-fg-service);cursor:pointer}@media (min-width: 1001px){.website-header__navigation-button{display:none}}.website-header__navigation-button[aria-expanded=true] svg{rotate:180deg}@media print{.website-header__inner-container>*:not(.website-header__logo-name-container){display:none}}";
|
|
3273
3273
|
|
|
3274
3274
|
/**
|
|
3275
3275
|
* A header component for Penn Libraries websites that displays the Penn Libraries logo,
|
|
@@ -3288,7 +3288,7 @@ const pennlibsHeaderCss = ":host{font-family:var(--pl-font-family);font-size:var
|
|
|
3288
3288
|
* @slot end - Content to display at the end of the header (right side)
|
|
3289
3289
|
* @slot name-end - Content to display at the end of the service name (right side)
|
|
3290
3290
|
*
|
|
3291
|
-
* @prop --pl-viewport-max-width: The maximum width of the header.
|
|
3291
|
+
* @prop --pl-viewport-margins-max-width: The maximum width of the header.
|
|
3292
3292
|
* @prop --pl-viewport-margins-gutter: The gutter width of the header content.
|
|
3293
3293
|
*/
|
|
3294
3294
|
class Header {
|
|
@@ -3332,7 +3332,7 @@ class Header {
|
|
|
3332
3332
|
return (hAsync("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24", viewBox: "0 -960 960 960", width: "24" }, hAsync("path", { fill: "currentColor", d: "M480-345 240-585l56-56 184 184 184-184 56 56-240 240Z" })));
|
|
3333
3333
|
}
|
|
3334
3334
|
render() {
|
|
3335
|
-
return (hAsync("header", { key: '
|
|
3335
|
+
return (hAsync("header", { key: 'b0f71640bc4b1fb494f78cac49c3f7383ab80aad', class: `viewport-margins website-header ${this.theme === 'dark' && 'website-header--dark'}` }, hAsync("div", { key: '5492827910960ab2ccb95879d512ef9b029ec852', class: "website-header__inner-container" }, hAsync("div", { key: '298b7f9aa12d67009b61ff5df6215117943e2d6c', class: "website-header__logo-name-container" }, hAsync("a", { key: '2664b772fda1ea60ba2fbe84a4383faee5111dce', href: "https://www.library.upenn.edu/", class: "website-header_logo-link", "aria-label": "Penn Libraries" }, this.theme === 'dark' ? hAsync(LogoWhite, null) : hAsync(LogoBlue, null)), this.serviceName && (hAsync("a", { key: '6310df5c59a848778bc9fa7525ca43eb0b40acdf', href: "/", class: "website-header__service-link" }, hAsync("span", { key: '55b750954e5576380e0341bc6506db961644593b', class: "website-header__service-name" }, this.serviceName), this.serviceLede && hAsync("span", { key: '3cf6efc9e14dd0e3aa9ca5f18d87ebe8ed0f3a55', class: "website-header__service-lede" }, this.serviceLede))), hAsync("slot", { key: 'd549e890b64cf848f2a9854d9e8e27af372d4d13', name: "name-end" })), this.navigation.length > 0 && (hAsync("nav", { key: '3577977564128734899f3725454ab405bab1524d', class: "website-header__navigation" }, hAsync("button", { key: '5f6d6d8c3f9428741d8920ba402e5427b450c9be', class: "website-header__navigation-button", "aria-expanded": `${this.isMenuOpen}`, onClick: () => this.handleToggleMenu() }, this.renderMenuIcon(), " Menu"), this.navigation && (hAsync("ol", { key: '73c47406768a97690b06b18f84acc3822a646b12', class: `website-header__navigation-list ${this.isMenuOpen && 'website-header__navigation-list--visible'}` }, this.navigation.map(element => hAsync("li", { innerHTML: element.outerHTML })))))), hAsync("slot", { key: '28c4bae6cd0c86909c991a501cc5e7e1cb94b73c', name: "end" }))));
|
|
3336
3336
|
}
|
|
3337
3337
|
static get assetsDirs() { return ["assets"]; }
|
|
3338
3338
|
get hostElement() { return getElement(this); }
|
|
@@ -3354,7 +3354,7 @@ class Header {
|
|
|
3354
3354
|
}; }
|
|
3355
3355
|
}
|
|
3356
3356
|
|
|
3357
|
-
const pennlibsHeroCss = ":host{--pl-hero-height:clamp(42vh, 32rem, 26rem);--pl-hero-heading-font:var(--pl-font-serif);--pl-hero-color:var(--pl-color-fg-on-emphasis)}*,*:before,*:after{box-sizing:inherit}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}.viewport-margins{width:100%;max-width:var(--pl-viewport-max-width);margin:0 auto;padding:0 var(--pl-viewport-margins-gutter, 1em)}.hero{position:relative;min-height:var(--pl-hero-height);height:100%;background-size:cover;background-repeat:no-repeat;background-position:50% 33%;display:flex}.hero::before{content:\"\";display:flex;width:100%;height:100%;top:0;position:absolute;background:linear-gradient(360deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 20%, rgba(0, 0, 0, 0.4) 40%, rgba(0, 0, 0, 0.05) 100%);z-index:0}.hero::after{content:\"\";display:flex;width:100%;height:100%;top:0;position:absolute;background:linear-gradient(180deg, rgba(1, 31, 91, 1) 0%, rgba(1, 31, 91, 0.9) 10%, rgba(1, 31, 91, 0.8) 20%, rgba(1, 31, 91, 0.1) 50%, rgba(1, 31, 91, 0.0) 100%);z-index:0}.hero__content{position:relative;display:flex;flex-direction:column;width:100%;z-index:1}.hero__heading-container{margin-top:auto;padding-top:
|
|
3357
|
+
const pennlibsHeroCss = ":host{--pl-hero-height:clamp(42vh, 32rem, 26rem);--pl-hero-heading-font:var(--pl-font-serif);--pl-hero-color:var(--pl-color-fg-on-emphasis)}*,*:before,*:after{box-sizing:inherit}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}.viewport-margins{width:100%;max-width:var(--pl-viewport-margins-max-width);margin:0 auto;padding:0 var(--pl-viewport-margins-gutter, 1em)}.hero{position:relative;min-height:var(--pl-hero-height);height:100%;background-size:cover;background-repeat:no-repeat;background-position:50% 33%;display:flex}.hero::before{content:\"\";display:flex;width:100%;height:100%;top:0;position:absolute;background:linear-gradient(360deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 20%, rgba(0, 0, 0, 0.4) 40%, rgba(0, 0, 0, 0.05) 100%);z-index:0}.hero::after{content:\"\";display:flex;width:100%;height:100%;top:0;position:absolute;background:linear-gradient(180deg, rgba(1, 31, 91, 1) 0%, rgba(1, 31, 91, 0.9) 10%, rgba(1, 31, 91, 0.8) 20%, rgba(1, 31, 91, 0.1) 50%, rgba(1, 31, 91, 0.0) 100%);z-index:0}.hero__content{position:relative;display:flex;flex-direction:column;width:100%;z-index:1}.hero__heading-container{margin-top:auto;padding-top:var(--pl-space-3xl);padding-bottom:var(--pl-space-3xl)}.hero__heading{text-shadow:1px 1px 2px var(--pl-color-fg-default);line-height:1.1;font-size:3em;font-weight:bold;font-family:var(--pl-hero-heading-font);text-wrap:pretty;max-width:30ch;margin:0;color:var(--pl-hero-color)}@media (max-width: 920px){.hero__heading{font-size:2.5em}}.hero__sub-heading{font-size:1.25em;font-family:var(--pl-font-family);font-weight:500;color:var(--pl-hero-color);max-width:52ch;text-wrap:pretty;margin-top:1em;margin-bottom:0}.hero__sub-heading a{text-decoration:underline;text-underline-offset:var(--pl-link-text-underline-offset);text-decoration-thickness:var(--pl-link-text-decoration-thickness);color:var(--pl-hero-color)}.hero__sub-heading a:hover{text-decoration-thickness:var(--pl-link-hover-text-decoration-thickness)}.hero__sub-heading strong{font-weight:bold}@media (max-width: 620px){.hero__heading{font-size:2.75em}.hero__sub-heading{font-size:1em}}";
|
|
3358
3358
|
|
|
3359
3359
|
const getCurrentImageSource = (pictureElement) => {
|
|
3360
3360
|
const imgElement = pictureElement.querySelector('img');
|
|
@@ -3365,7 +3365,7 @@ const getCurrentImageSource = (pictureElement) => {
|
|
|
3365
3365
|
*
|
|
3366
3366
|
* @slot start - Content to display at the start (top) of the hero.
|
|
3367
3367
|
*
|
|
3368
|
-
* @prop --pl-viewport-max-width: The maximum width of the hero inner content.
|
|
3368
|
+
* @prop --pl-viewport-margins-max-width: The maximum width of the hero inner content.
|
|
3369
3369
|
* @prop --pl-viewport-margins-gutter: The gutter width of the hero inner content.
|
|
3370
3370
|
*/
|
|
3371
3371
|
class Hero {
|
|
@@ -3409,7 +3409,7 @@ class Hero {
|
|
|
3409
3409
|
}
|
|
3410
3410
|
}
|
|
3411
3411
|
render() {
|
|
3412
|
-
return (hAsync("div", { key: '
|
|
3412
|
+
return (hAsync("div", { key: '284eede0a201fc23f19af63ce875cf82514c007f', class: "hero", style: { backgroundImage: `url(${this.heroSrc})` } }, hAsync("div", { key: '6d1643211563e173e20be38fa480d622a2e08d9b', class: "hero__content" }, hAsync("slot", { key: 'd5905b079db6367dd6c917588d76c3bc949cc078', name: "start" }), hAsync("div", { key: 'ecfbcb172bfb018ede01a1773ce12f135dac60f6', class: "hero__heading-container" }, this.heroHeadingElement && (hAsync("div", { key: 'fd285ee37293132a02b03c70eb53b31fde007c7e', class: "viewport-margins" }, hAsync("h1", { key: '3d71930c47c9c5d6a64c240847407953f424dac2', class: "hero__heading", innerHTML: this.heroHeadingElement.innerText }), this.heroParagraphElement && hAsync("p", { key: '828d2a13daa5ae92c1591d0ea00ee8e91ab4f6cf', class: "hero__sub-heading", innerHTML: this.heroParagraphElement.innerHTML })))))));
|
|
3413
3413
|
}
|
|
3414
3414
|
static get assetsDirs() { return ["assets"]; }
|
|
3415
3415
|
get hostElement() { return getElement(this); }
|