@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
|
@@ -20,7 +20,7 @@
|
|
|
20
20
|
*
|
|
21
21
|
* @slot default - Custom navigation sections with h2 headings and anchor links
|
|
22
22
|
*
|
|
23
|
-
* @prop --pl-viewport-max-width: The maximum width of the footer content.
|
|
23
|
+
* @prop --pl-viewport-margins-max-width: The maximum width of the footer content.
|
|
24
24
|
* @prop --pl-viewport-margins-gutter: The gutter width of the footer content.
|
|
25
25
|
*/
|
|
26
26
|
export declare class Footer {
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
* @slot end - Content to display at the end of the header (right side)
|
|
16
16
|
* @slot name-end - Content to display at the end of the service name (right side)
|
|
17
17
|
*
|
|
18
|
-
* @prop --pl-viewport-max-width: The maximum width of the header.
|
|
18
|
+
* @prop --pl-viewport-margins-max-width: The maximum width of the header.
|
|
19
19
|
* @prop --pl-viewport-margins-gutter: The gutter width of the header content.
|
|
20
20
|
*/
|
|
21
21
|
export declare class Header {
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
*
|
|
4
4
|
* @slot start - Content to display at the start (top) of the hero.
|
|
5
5
|
*
|
|
6
|
-
* @prop --pl-viewport-max-width: The maximum width of the hero inner content.
|
|
6
|
+
* @prop --pl-viewport-margins-max-width: The maximum width of the hero inner content.
|
|
7
7
|
* @prop --pl-viewport-margins-gutter: The gutter width of the hero inner content.
|
|
8
8
|
*/
|
|
9
9
|
export declare class Hero {
|
|
@@ -31,7 +31,7 @@ export namespace Components {
|
|
|
31
31
|
* <a href="/instruction">Library Instruction</a>
|
|
32
32
|
* </section>
|
|
33
33
|
* </pennlibs-footer>
|
|
34
|
-
* @prop --pl-viewport-max-width: The maximum width of the footer content.
|
|
34
|
+
* @prop --pl-viewport-margins-max-width: The maximum width of the footer content.
|
|
35
35
|
* @prop --pl-viewport-margins-gutter: The gutter width of the footer content.
|
|
36
36
|
*/
|
|
37
37
|
interface PennlibsFooter {
|
|
@@ -47,7 +47,7 @@ export namespace Components {
|
|
|
47
47
|
* <a href="/search">Search</a>
|
|
48
48
|
* <a href="/help">Help</a>
|
|
49
49
|
* </pennlibs-header>
|
|
50
|
-
* @prop --pl-viewport-max-width: The maximum width of the header.
|
|
50
|
+
* @prop --pl-viewport-margins-max-width: The maximum width of the header.
|
|
51
51
|
* @prop --pl-viewport-margins-gutter: The gutter width of the header content.
|
|
52
52
|
*/
|
|
53
53
|
interface PennlibsHeader {
|
|
@@ -72,7 +72,7 @@ export namespace Components {
|
|
|
72
72
|
}
|
|
73
73
|
/**
|
|
74
74
|
* Place your most important content in a prominent space, often at the top of your website.
|
|
75
|
-
* @prop --pl-viewport-max-width: The maximum width of the hero inner content.
|
|
75
|
+
* @prop --pl-viewport-margins-max-width: The maximum width of the hero inner content.
|
|
76
76
|
* @prop --pl-viewport-margins-gutter: The gutter width of the hero inner content.
|
|
77
77
|
*/
|
|
78
78
|
interface PennlibsHero {
|
|
@@ -141,7 +141,7 @@ declare global {
|
|
|
141
141
|
* <a href="/instruction">Library Instruction</a>
|
|
142
142
|
* </section>
|
|
143
143
|
* </pennlibs-footer>
|
|
144
|
-
* @prop --pl-viewport-max-width: The maximum width of the footer content.
|
|
144
|
+
* @prop --pl-viewport-margins-max-width: The maximum width of the footer content.
|
|
145
145
|
* @prop --pl-viewport-margins-gutter: The gutter width of the footer content.
|
|
146
146
|
*/
|
|
147
147
|
interface HTMLPennlibsFooterElement extends Components.PennlibsFooter, HTMLStencilElement {
|
|
@@ -161,7 +161,7 @@ declare global {
|
|
|
161
161
|
* <a href="/search">Search</a>
|
|
162
162
|
* <a href="/help">Help</a>
|
|
163
163
|
* </pennlibs-header>
|
|
164
|
-
* @prop --pl-viewport-max-width: The maximum width of the header.
|
|
164
|
+
* @prop --pl-viewport-margins-max-width: The maximum width of the header.
|
|
165
165
|
* @prop --pl-viewport-margins-gutter: The gutter width of the header content.
|
|
166
166
|
*/
|
|
167
167
|
interface HTMLPennlibsHeaderElement extends Components.PennlibsHeader, HTMLStencilElement {
|
|
@@ -172,7 +172,7 @@ declare global {
|
|
|
172
172
|
};
|
|
173
173
|
/**
|
|
174
174
|
* Place your most important content in a prominent space, often at the top of your website.
|
|
175
|
-
* @prop --pl-viewport-max-width: The maximum width of the hero inner content.
|
|
175
|
+
* @prop --pl-viewport-margins-max-width: The maximum width of the hero inner content.
|
|
176
176
|
* @prop --pl-viewport-margins-gutter: The gutter width of the hero inner content.
|
|
177
177
|
*/
|
|
178
178
|
interface HTMLPennlibsHeroElement extends Components.PennlibsHero, HTMLStencilElement {
|
|
@@ -224,7 +224,7 @@ declare namespace LocalJSX {
|
|
|
224
224
|
* <a href="/instruction">Library Instruction</a>
|
|
225
225
|
* </section>
|
|
226
226
|
* </pennlibs-footer>
|
|
227
|
-
* @prop --pl-viewport-max-width: The maximum width of the footer content.
|
|
227
|
+
* @prop --pl-viewport-margins-max-width: The maximum width of the footer content.
|
|
228
228
|
* @prop --pl-viewport-margins-gutter: The gutter width of the footer content.
|
|
229
229
|
*/
|
|
230
230
|
interface PennlibsFooter {
|
|
@@ -240,7 +240,7 @@ declare namespace LocalJSX {
|
|
|
240
240
|
* <a href="/search">Search</a>
|
|
241
241
|
* <a href="/help">Help</a>
|
|
242
242
|
* </pennlibs-header>
|
|
243
|
-
* @prop --pl-viewport-max-width: The maximum width of the header.
|
|
243
|
+
* @prop --pl-viewport-margins-max-width: The maximum width of the header.
|
|
244
244
|
* @prop --pl-viewport-margins-gutter: The gutter width of the header content.
|
|
245
245
|
*/
|
|
246
246
|
interface PennlibsHeader {
|
|
@@ -265,7 +265,7 @@ declare namespace LocalJSX {
|
|
|
265
265
|
}
|
|
266
266
|
/**
|
|
267
267
|
* Place your most important content in a prominent space, often at the top of your website.
|
|
268
|
-
* @prop --pl-viewport-max-width: The maximum width of the hero inner content.
|
|
268
|
+
* @prop --pl-viewport-margins-max-width: The maximum width of the hero inner content.
|
|
269
269
|
* @prop --pl-viewport-margins-gutter: The gutter width of the hero inner content.
|
|
270
270
|
*/
|
|
271
271
|
interface PennlibsHero {
|
|
@@ -305,7 +305,7 @@ declare module "@stencil/core" {
|
|
|
305
305
|
* <a href="/instruction">Library Instruction</a>
|
|
306
306
|
* </section>
|
|
307
307
|
* </pennlibs-footer>
|
|
308
|
-
* @prop --pl-viewport-max-width: The maximum width of the footer content.
|
|
308
|
+
* @prop --pl-viewport-margins-max-width: The maximum width of the footer content.
|
|
309
309
|
* @prop --pl-viewport-margins-gutter: The gutter width of the footer content.
|
|
310
310
|
*/
|
|
311
311
|
"pennlibs-footer": LocalJSX.PennlibsFooter & JSXBase.HTMLAttributes<HTMLPennlibsFooterElement>;
|
|
@@ -320,13 +320,13 @@ declare module "@stencil/core" {
|
|
|
320
320
|
* <a href="/search">Search</a>
|
|
321
321
|
* <a href="/help">Help</a>
|
|
322
322
|
* </pennlibs-header>
|
|
323
|
-
* @prop --pl-viewport-max-width: The maximum width of the header.
|
|
323
|
+
* @prop --pl-viewport-margins-max-width: The maximum width of the header.
|
|
324
324
|
* @prop --pl-viewport-margins-gutter: The gutter width of the header content.
|
|
325
325
|
*/
|
|
326
326
|
"pennlibs-header": LocalJSX.PennlibsHeader & JSXBase.HTMLAttributes<HTMLPennlibsHeaderElement>;
|
|
327
327
|
/**
|
|
328
328
|
* Place your most important content in a prominent space, often at the top of your website.
|
|
329
|
-
* @prop --pl-viewport-max-width: The maximum width of the hero inner content.
|
|
329
|
+
* @prop --pl-viewport-margins-max-width: The maximum width of the hero inner content.
|
|
330
330
|
* @prop --pl-viewport-margins-gutter: The gutter width of the hero inner content.
|
|
331
331
|
*/
|
|
332
332
|
"pennlibs-hero": LocalJSX.PennlibsHero & JSXBase.HTMLAttributes<HTMLPennlibsHeroElement>;
|
|
@@ -83,7 +83,7 @@ const PennlibsFeedback = class {
|
|
|
83
83
|
};
|
|
84
84
|
PennlibsFeedback.style = pennlibsFeedbackCss;
|
|
85
85
|
|
|
86
|
-
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}";
|
|
86
|
+
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}";
|
|
87
87
|
|
|
88
88
|
const Footer = class {
|
|
89
89
|
constructor(hostRef) {
|
|
@@ -112,12 +112,12 @@ const Footer = class {
|
|
|
112
112
|
}
|
|
113
113
|
render() {
|
|
114
114
|
const footerBackgroundSrc = getAssetPath('./assets/footer-bg.webp');
|
|
115
|
-
return (h("div", { key: '
|
|
115
|
+
return (h("div", { key: 'a1cbb7636191cb3ac934a1bb375054357bcf93fc', class: "website-footer-wrapper" }, h("footer", { key: 'f2f2ab282f7d8e5a4603e0a6d8337135c4625ba6', class: "website-footer", style: {
|
|
116
116
|
background: `var(--pl-color-penn-blue) url(${footerBackgroundSrc}) no-repeat 50% 50%`,
|
|
117
117
|
backgroundSize: 'cover',
|
|
118
|
-
} }, h("div", { key: '
|
|
118
|
+
} }, h("div", { key: 'eb24a52f9c3f135bc75f3e23ef3088a928a3ce65', class: "viewport-margins" }, h("div", { key: '439be8c6582f5eaa173251af97f17252fce9243c', class: "website-footer__content" }, h("div", { key: '3f30c3156c96a35a772fb85d890e1f5d81af8ec6', class: "website-footer__links-container" }, h("section", { key: 'e32be08455a07061a8eaeb13b2ae3f377f818c5f' }, h("h2", { key: 'bc2be34b67cc0953338d8f418950f428a5f55172', class: "website-footer__heading" }, "Penn Libraries"), h("ul", { key: 'bae0ee381df1883da90752c9476491217a2c2ca7', class: "website-footer__links" }, h("li", { key: 'f5025e51424e5c972b46a5d1650552b6187aa4e9' }, h("a", { key: '836172e6d531eb0d37d0c0a5e66a3a6c92ba95b3', href: "https://maps.google.com/?q=Van Pelt Library 3420 Walnut Street, Philadelphia, PA 19104-6206" }, "3420 Walnut Street", h("br", { key: 'ae8b8d41baccd3bb62c15d336c7664100f407886' }), "Philadelphia, PA 19104-6206")), h("li", { key: 'ed016c0fbe56c899bedb3e25eabbb1b3773b0167' }, h("a", { key: '04eab3b14fcda0ccff15f069beceb0bd0ef111fa', href: "tel:(215) 898-7555" }, "(215) 898-7555")), h("li", { key: 'e1968b748a2303a2b6176f502f68f7ed20e90c9b' }, h("a", { key: '9823456a1a5d7016431f88cd5a1c871cc8ef6a6d', href: "https://www.library.upenn.edu/contact-us" }, "Contact us")), h("li", { key: 'aedd3b51a66e6a78c463d0e76a9fddd60a0e4fa8' }, h("a", { key: '1972520903c54834e83c3f99ea4b35964d09b8a5', href: "https://www.library.upenn.edu/about/hours", target: "_blank" }, "Locations and hours")))), h("section", { key: '3604f648361768c4c4fdae3bb19af3625ccc5cbd' }, h("h2", { key: 'a79782bb074b215f3e44ebaf7e2bdcb8e1b37e27', class: "website-footer__heading" }, "Stay in touch"), h("ul", { key: 'cf7d5c3ddf5473471a5e4f154a82a3c4c6d3b7b5', class: "website-footer__links" }, h("li", { key: '8eb5e4f10197d0a428088e676d55620cc4a5ca6a' }, h("a", { key: '8e698ca0cc1614db65e64466dd1912bd74a8f58c', href: "https://www.alumni.upenn.edu/libsignup" }, "Newsletter")), h("li", { key: '62e6161d9ef81872473cb3c7df8df82fa5e49027' }, h("a", { key: 'b24bd5cfea7998bdf3b7674e32b0e72597cdf6c9', href: "https://www.instagram.com/upennlib/" }, "Instagram")), h("li", { key: 'd7260d10fda8fcde1bb799b2a6f5d9e34c47b4e1' }, h("a", { key: 'b24f2b33851e30a61d859c507ee5781caec47cb3', href: "https://www.facebook.com/PennLibraries/" }, "Facebook")), h("li", { key: '796d833e8f9e21a2739079ee7c5e7cf4f5bf5aa4' }, h("a", { key: 'e8ec25b48d06450abe3db34eb98f338e1caadd1b', href: "https://www.linkedin.com/company/penn-libraries" }, "LinkedIn")))), this.navigationByChildren && [
|
|
119
119
|
this.navigationByChildren.map(section => (h("section", null, h("h2", { class: "website-footer__heading" }, section.heading), h("ul", { class: "website-footer__links" }, section.links.map(link => (h("li", null, h("a", { href: link.href }, link.label))))))))
|
|
120
|
-
]))), h("div", { key: '
|
|
120
|
+
]))), h("div", { key: 'eb01f1b9475979942a291cecb5c49a7f99ac76ff', class: "website-footer__footer" }, h("div", { key: 'fe811b0a667ac77fbd65c6947fc64b11e6fd105a', class: "viewport-margins" }, h("ul", { key: '2999c3b798c86365232fa948bba6ba42bad4ac05', class: "website-footer__links website-footer__links--footer" }, h("li", { key: '5fbd7893982b9bd85dd0bec9ae0ced8fa254b01c' }, h("a", { key: '9ae82c6cad2c9d97a479407a8c1a2b7db451ba6e', href: "https://www.upenn.edu/" }, "UPenn")), h("li", { key: '9a312ef71677395ae9e36140b50f26283e463e1f' }, h("a", { key: '34881d92dd5bafaddda98f492e531663993ebcb5', href: "https://www.upenn.edu/about/privacy-policy" }, "Privacy Policy")), h("li", { key: 'be80ff6346e925d3d4ca73148cab8f87e9eafc00' }, h("a", { key: '1aa4f3965db242abaaea538a6c3d5a5358215348', href: "https://accessibility.web-resources.upenn.edu/get-help" }, "Report Accessibility Issues and Get Help")), h("li", { key: '4f6e9174acdf75d75b8beefc12950fee8d185f94' }, h("a", { key: '81b1a21a40057f8b1bb66efdd6fc264ebf132370', href: "https://www.upenn.edu/about/disclaimer" }, "Disclaimer")), h("li", { key: 'd9054f8cb3a387947a75e0ce686401d43fbfac9a' }, h("a", { key: '2bf7344740a7418eb68170b46afdb5eefc73dae3', href: "https://www.publicsafety.upenn.edu/contact/" }, "Emergency Services")), h("li", { key: 'c6962c1ea1e96c351da514ac41eb7782a79d3c22' }, h("a", { key: '0fd6ebe891954438f46c0265366a69ae319c2b7e', href: "https://www.upenn.edu/about/report-copyright-infringement" }, "Report Copyright Infringement"))))))));
|
|
121
121
|
}
|
|
122
122
|
static get assetsDirs() { return ["assets"]; }
|
|
123
123
|
get hostElement() { return getElement(this); }
|
|
@@ -147,7 +147,7 @@ const LogoBlue = () => {
|
|
|
147
147
|
h("path", { fill: "#fff", d: "M0 0H444.165V95H0z" })))));
|
|
148
148
|
};
|
|
149
149
|
|
|
150
|
-
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(--
|
|
150
|
+
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}}";
|
|
151
151
|
|
|
152
152
|
const Header = class {
|
|
153
153
|
constructor(hostRef) {
|
|
@@ -190,14 +190,14 @@ const Header = class {
|
|
|
190
190
|
return (h("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24", viewBox: "0 -960 960 960", width: "24" }, h("path", { fill: "currentColor", d: "M480-345 240-585l56-56 184 184 184-184 56 56-240 240Z" })));
|
|
191
191
|
}
|
|
192
192
|
render() {
|
|
193
|
-
return (h("header", { key: '
|
|
193
|
+
return (h("header", { key: 'b0f71640bc4b1fb494f78cac49c3f7383ab80aad', class: `viewport-margins website-header ${this.theme === 'dark' && 'website-header--dark'}` }, h("div", { key: '5492827910960ab2ccb95879d512ef9b029ec852', class: "website-header__inner-container" }, h("div", { key: '298b7f9aa12d67009b61ff5df6215117943e2d6c', class: "website-header__logo-name-container" }, h("a", { key: '2664b772fda1ea60ba2fbe84a4383faee5111dce', href: "https://www.library.upenn.edu/", class: "website-header_logo-link", "aria-label": "Penn Libraries" }, this.theme === 'dark' ? h(LogoWhite, null) : h(LogoBlue, null)), this.serviceName && (h("a", { key: '6310df5c59a848778bc9fa7525ca43eb0b40acdf', href: "/", class: "website-header__service-link" }, h("span", { key: '55b750954e5576380e0341bc6506db961644593b', class: "website-header__service-name" }, this.serviceName), this.serviceLede && h("span", { key: '3cf6efc9e14dd0e3aa9ca5f18d87ebe8ed0f3a55', class: "website-header__service-lede" }, this.serviceLede))), h("slot", { key: 'd549e890b64cf848f2a9854d9e8e27af372d4d13', name: "name-end" })), this.navigation.length > 0 && (h("nav", { key: '3577977564128734899f3725454ab405bab1524d', class: "website-header__navigation" }, h("button", { key: '5f6d6d8c3f9428741d8920ba402e5427b450c9be', class: "website-header__navigation-button", "aria-expanded": `${this.isMenuOpen}`, onClick: () => this.handleToggleMenu() }, this.renderMenuIcon(), " Menu"), this.navigation && (h("ol", { key: '73c47406768a97690b06b18f84acc3822a646b12', class: `website-header__navigation-list ${this.isMenuOpen && 'website-header__navigation-list--visible'}` }, this.navigation.map(element => h("li", { innerHTML: element.outerHTML })))))), h("slot", { key: '28c4bae6cd0c86909c991a501cc5e7e1cb94b73c', name: "end" }))));
|
|
194
194
|
}
|
|
195
195
|
static get assetsDirs() { return ["assets"]; }
|
|
196
196
|
get hostElement() { return getElement(this); }
|
|
197
197
|
};
|
|
198
198
|
Header.style = pennlibsHeaderCss;
|
|
199
199
|
|
|
200
|
-
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:
|
|
200
|
+
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}}";
|
|
201
201
|
|
|
202
202
|
const getCurrentImageSource = (pictureElement) => {
|
|
203
203
|
const imgElement = pictureElement.querySelector('img');
|
|
@@ -244,7 +244,7 @@ const Hero = class {
|
|
|
244
244
|
}
|
|
245
245
|
}
|
|
246
246
|
render() {
|
|
247
|
-
return (h("div", { key: '
|
|
247
|
+
return (h("div", { key: '284eede0a201fc23f19af63ce875cf82514c007f', class: "hero", style: { backgroundImage: `url(${this.heroSrc})` } }, h("div", { key: '6d1643211563e173e20be38fa480d622a2e08d9b', class: "hero__content" }, h("slot", { key: 'd5905b079db6367dd6c917588d76c3bc949cc078', name: "start" }), h("div", { key: 'ecfbcb172bfb018ede01a1773ce12f135dac60f6', class: "hero__heading-container" }, this.heroHeadingElement && (h("div", { key: 'fd285ee37293132a02b03c70eb53b31fde007c7e', class: "viewport-margins" }, h("h1", { key: '3d71930c47c9c5d6a64c240847407953f424dac2', class: "hero__heading", innerHTML: this.heroHeadingElement.innerText }), this.heroParagraphElement && h("p", { key: '828d2a13daa5ae92c1591d0ea00ee8e91ab4f6cf', class: "hero__sub-heading", innerHTML: this.heroParagraphElement.innerHTML })))))));
|
|
248
248
|
}
|
|
249
249
|
static get assetsDirs() { return ["assets"]; }
|
|
250
250
|
get hostElement() { return getElement(this); }
|
|
@@ -254,4 +254,4 @@ Hero.style = pennlibsHeroCss;
|
|
|
254
254
|
export { Chat as pennlibs_chat, NoImage as pennlibs_fallback_img, PennlibsFeedback as pennlibs_feedback, Footer as pennlibs_footer, Header as pennlibs_header, Hero as pennlibs_hero };
|
|
255
255
|
//# sourceMappingURL=pennlibs-chat.pennlibs-fallback-img.pennlibs-feedback.pennlibs-footer.pennlibs-header.pennlibs-hero.entry.esm.js.map
|
|
256
256
|
|
|
257
|
-
//# sourceMappingURL=p-
|
|
257
|
+
//# sourceMappingURL=p-ffdd436d.entry.js.map
|