@penn-libraries/web 1.2.0-dev.1 → 1.2.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/loader.cjs.js +1 -1
- package/dist/cjs/pennlibs-autocomplete.pennlibs-feedback.pennlibs-footer.pennlibs-header.entry.cjs.js.map +1 -1
- package/dist/cjs/pennlibs-autocomplete_4.cjs.entry.js +10 -6
- package/dist/cjs/web.cjs.js +1 -1
- package/dist/collection/components/pennlibs-feedback/pennlibs-feedback.css +1 -1
- package/dist/collection/components/pennlibs-feedback/pennlibs-feedback.js +1 -1
- package/dist/collection/components/pennlibs-feedback/pennlibs-feedback.js.map +1 -1
- package/dist/collection/components/pennlibs-footer/pennlibs-footer.css +12 -3
- package/dist/collection/components/pennlibs-footer/pennlibs-footer.js +33 -3
- package/dist/collection/components/pennlibs-footer/pennlibs-footer.js.map +1 -1
- package/dist/components/pennlibs-feedback.js +2 -2
- package/dist/components/pennlibs-feedback.js.map +1 -1
- package/dist/components/pennlibs-footer.js +9 -4
- package/dist/components/pennlibs-footer.js.map +1 -1
- package/dist/docs.json +32 -2
- package/dist/esm/loader.js +1 -1
- package/dist/esm/pennlibs-autocomplete.pennlibs-feedback.pennlibs-footer.pennlibs-header.entry.js.map +1 -1
- package/dist/esm/pennlibs-autocomplete_4.entry.js +10 -6
- package/dist/esm/web.js +1 -1
- package/dist/types/components/pennlibs-footer/pennlibs-footer.d.ts +4 -0
- package/dist/types/components.d.ts +10 -0
- package/dist/web/{p-b9538aed.entry.js → p-3da26275.entry.js} +10 -6
- package/dist/web/pennlibs-autocomplete.pennlibs-feedback.pennlibs-footer.pennlibs-header.entry.esm.js.map +1 -1
- package/dist/web/web.esm.js +1 -1
- package/hydrate/index.js +11 -6
- package/hydrate/index.mjs +11 -6
- package/package.json +1 -1
package/dist/web/web.esm.js
CHANGED
|
@@ -16,6 +16,6 @@ var patchBrowser = () => {
|
|
|
16
16
|
|
|
17
17
|
patchBrowser().then(async (options) => {
|
|
18
18
|
await globalScripts();
|
|
19
|
-
return bootstrapLazy([["p-eb633f4d",[[257,"pennlibs-iiif-img",{"uuid":[1],"alt":[1],"region":[513],"rotation":[1],"quality":[1],"loading":[1],"showFallback":[4,"show-fallback"],"isLoaded":[32],"hasError":[32],"imageDimensions":[32],"observedWidth":[32]},null,{"region":["handleRegionChange"]}]]],["p-
|
|
19
|
+
return bootstrapLazy([["p-eb633f4d",[[257,"pennlibs-iiif-img",{"uuid":[1],"alt":[1],"region":[513],"rotation":[1],"quality":[1],"loading":[1],"showFallback":[4,"show-fallback"],"isLoaded":[32],"hasError":[32],"imageDimensions":[32],"observedWidth":[32]},null,{"region":["handleRegionChange"]}]]],["p-3da26275",[[257,"pennlibs-autocomplete",{"for":[1],"showSuggestions":[32],"currentIndex":[32],"originalValue":[32],"options":[32]},[[0,"slotchange","handleSlotChange"],[16,"input","handleInputEvent"],[16,"focus","handleFocusEvent"],[16,"blur","handleBlurEvent"],[0,"focusout","handleFocusOut"],[4,"keydown","handleKeyDown"]]],[257,"pennlibs-feedback",{"hideQuestion":[4,"hide-question"],"error":[32],"answer":[32]}],[257,"pennlibs-footer",{"showBuiltWith":[4,"show-built-with"],"navigationByChildren":[32]}],[257,"pennlibs-header",{"serviceName":[1,"service-name"],"serviceLede":[1,"service-lede"],"serviceHref":[1,"service-href"],"theme":[1],"isMenuOpen":[32],"navigation":[32]}]]],["p-a34e1e3e",[[257,"pennlibs-banner"]]],["p-c96a3643",[[257,"pennlibs-chat",{"href":[32]}]]],["p-b6e686d1",[[257,"pennlibs-hero",{"heroPictureElement":[32],"heroHeadingElement":[32],"heroParagraphElement":[32],"heroSrc":[32]}]]],["p-662e4125",[[257,"pennlibs-fallback-img"]]]], options);
|
|
20
20
|
});
|
|
21
21
|
//# sourceMappingURL=web.esm.js.map
|
package/hydrate/index.js
CHANGED
|
@@ -3660,7 +3660,7 @@ class Chat {
|
|
|
3660
3660
|
}; }
|
|
3661
3661
|
}
|
|
3662
3662
|
|
|
3663
|
-
const pennlibsFooterCss = ":host {\n font-family: var(--pl-font-family);\n font-size: var(--pl-font-size);\n --padding-bottom: 3em;\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.built-with,\n.built-with a {\n color: var(--pl-color-
|
|
3663
|
+
const pennlibsFooterCss = ":host {\n font-family: var(--pl-font-family);\n font-size: var(--pl-font-size);\n --padding-bottom: 3em;\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.built-with,\n.built-with a {\n color: var(--pl-color-fg-subtle-on-emphasis);\n}\n\n.built-with a {\n font-weight: 500;\n text-underline-offset: var(--pl-link-text-underline-offset);\n\n &:hover {\n text-decoration-thickness: var(--pl-link-hover-text-decoration-thickness);\n }\n}\n\n.built-with {\n opacity: 0.875;\n margin: 0; \n padding: 1.5em 0;\n font-size: 0.875em;\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.75em;\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}";
|
|
3664
3664
|
|
|
3665
3665
|
/**
|
|
3666
3666
|
* A footer component for Penn Libraries websites that displays contact information,
|
|
@@ -3690,6 +3690,10 @@ const pennlibsFooterCss = ":host {\n font-family: var(--pl-font-family);\n fon
|
|
|
3690
3690
|
class Footer {
|
|
3691
3691
|
constructor(hostRef) {
|
|
3692
3692
|
registerInstance(this, hostRef);
|
|
3693
|
+
/**
|
|
3694
|
+
* When true, shows a "Built with the Penn Libraries Design System" line below the footer.
|
|
3695
|
+
*/
|
|
3696
|
+
this.showBuiltWith = false;
|
|
3693
3697
|
}
|
|
3694
3698
|
componentWillLoad() {
|
|
3695
3699
|
this.setNavigationByChildren();
|
|
@@ -3714,12 +3718,12 @@ class Footer {
|
|
|
3714
3718
|
}
|
|
3715
3719
|
render() {
|
|
3716
3720
|
const footerBackgroundSrc = getAssetPath('./assets/footer-bg.webp');
|
|
3717
|
-
return (hAsync("footer", { key: '
|
|
3721
|
+
return (hAsync("footer", { key: '39b1bc7336fe2aa28e8c6093d13b8dfb3dd70d3e', class: "website-footer-wrapper" }, hAsync("div", { key: '7902cf7cde3a468dec8ea71c2a139addafa5af79', class: "website-footer", style: {
|
|
3718
3722
|
background: `var(--pl-color-penn-blue) url(${footerBackgroundSrc}) no-repeat 50% 50%`,
|
|
3719
3723
|
backgroundSize: 'cover',
|
|
3720
|
-
} }, hAsync("div", { key: '
|
|
3724
|
+
} }, hAsync("div", { key: '804f9cd3f101997ee2d15d4a4749945ef553a118', class: "viewport-margins" }, hAsync("div", { key: '3a09637400e74e729641666eb8142c0cf77d66b3', class: "website-footer__content" }, hAsync("div", { key: 'cdb9270db298aa7781859a80c799949cb4c35787', class: "website-footer__links-container" }, hAsync("section", { key: '20d953d2b85178798d2298aa8aaa9fb8e47d7af4' }, hAsync("h2", { key: '79b1fe7f4fc2dff03134c7d4e96e9fd657131fc8', class: "website-footer__heading" }, "Penn Libraries"), hAsync("ul", { key: 'ba8002b17457f979f9817c45a89f332064f0b5bb', class: "website-footer__links" }, hAsync("li", { key: 'cb65fc4ad6432ef447a4b98a8dfdc0323bf37ccc' }, hAsync("a", { key: '0b61506da9a1c18919f77410fa39d3937f7485df', href: "https://maps.google.com/?q=Van Pelt Library 3420 Walnut Street, Philadelphia, PA 19104-6206" }, "3420 Walnut Street", hAsync("br", { key: 'ebd3def13a3107d1b301c0932d421b054e2bb338' }), "Philadelphia, PA 19104-6206")), hAsync("li", { key: '3f26ebab3b90a33ba2d17cd3cfd8a485f1c7e74f' }, hAsync("a", { key: 'c2dcf7a3d936eb5376b2568e677bb8a7dc7ab445', href: "tel:(215) 898-7555" }, "(215) 898-7555")), hAsync("li", { key: '8c9374110f2d386c7275fad9522ea2565daf6c06' }, hAsync("a", { key: 'd40a2fd7490f1b233e4839e38faf29d9bb04f519', href: "https://www.library.upenn.edu/contact-us" }, "Contact us")), hAsync("li", { key: 'ab3016b1cfcc8827af060ec383d8556e8346713a' }, hAsync("a", { key: '76a8d246128fb76606c1cdf24640198c23c9d317', href: "https://www.library.upenn.edu/about/hours", target: "_blank" }, "Locations and hours")))), hAsync("section", { key: 'fd0abacbc35ffaafbb2016064c7a6194616ee2dc' }, hAsync("h2", { key: 'a812d7d26e21a1808ce6bd115ec620e1b033a8bf', class: "website-footer__heading" }, "Stay in touch"), hAsync("ul", { key: 'fe158ff1336379e1236a88c4a3d0f5e1efd9cdb8', class: "website-footer__links" }, hAsync("li", { key: '32396df360b39190ff587400fabe405ee319a507' }, hAsync("a", { key: '07ac56362dde7a2807e86c2a22564689ed9de90c', href: "https://www.alumni.upenn.edu/libsignup" }, "Newsletter")), hAsync("li", { key: '95abd2bf0f6a79c0597c1e57e878f986002adde2' }, hAsync("a", { key: '374044fae62fd82c9369cfba8b7c6223ded48d5a', href: "https://www.instagram.com/upennlib/" }, "Instagram")), hAsync("li", { key: '86cc74d4ec21dfb51a072cfad87ed395e961f26f' }, hAsync("a", { key: 'fda9e8c73918252b91e40dc23d289613a3fe5802', href: "https://www.facebook.com/PennLibraries/" }, "Facebook")), hAsync("li", { key: 'b1ce60d7aa5ac8a2aa8bd4f826c11cc753b1488c' }, hAsync("a", { key: 'ccfef8131fc7f9edd44936f1c212d31c08c61682', href: "https://www.linkedin.com/company/penn-libraries" }, "LinkedIn")))), this.navigationByChildren && [
|
|
3721
3725
|
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))))))))
|
|
3722
|
-
]))), hAsync("div", { key: '
|
|
3726
|
+
]))), hAsync("div", { key: '4430d39b9b8943d9336020d5ed04cdb80a3b91af', class: "website-footer__footer" }, hAsync("div", { key: '437f0b8894b63c3857f8871eaaaf3d28277738ad', class: "viewport-margins" }, hAsync("ul", { key: '8c4ac37a89006d543a66c8c1ba6bc9d7acc0d6db', class: "website-footer__links website-footer__links--footer" }, hAsync("li", { key: 'ac1db31f3c5331a26c0aee171974c10f22d5da08' }, hAsync("a", { key: 'ad8a6251cca9b0c904ccecff96a8800b22ed5568', href: "https://www.upenn.edu/" }, "UPenn")), hAsync("li", { key: '1189f7119ec768d34ea9435f9ff85df2764abe61' }, hAsync("a", { key: 'eb53d4f15fe49d32899d435670a34369a4e7e190', href: "https://www.upenn.edu/about/privacy-policy" }, "Privacy Policy")), hAsync("li", { key: 'd2a155f7f91a31cca41df9d0c9d37f151bded247' }, hAsync("a", { key: '8e329a895a25bd139867063dd7eed9c0aa7c0060', href: "https://accessibility.web-resources.upenn.edu/get-help" }, "Report Accessibility Issues and Get Help")), hAsync("li", { key: '0b65f3da18b54b91158515d7966e010e4e0d64ac' }, hAsync("a", { key: 'f8615c438f94216372fdb8afa26ae7150bbef816', href: "https://www.upenn.edu/about/disclaimer" }, "Disclaimer")), hAsync("li", { key: 'cbf5febfb926a1b569e73d4a57e7ca8315f6d876' }, hAsync("a", { key: '1116c792623c0fa819ce0189e105ee54c69ba73e', href: "https://www.publicsafety.upenn.edu/contact/" }, "Emergency Services")), hAsync("li", { key: '385a84f264b263a9738d38d66ac917e3a6055db4' }, hAsync("a", { key: 'dcd8517fb32ae46b983cb4802adb86e33e29bd71', href: "https://www.upenn.edu/about/report-copyright-infringement" }, "Report Copyright Infringement")))))), this.showBuiltWith && (hAsync("div", { key: 'd3bca43144b06b50091b54dee5c8734de4f80d60', class: "viewport-margins" }, hAsync("p", { key: 'a3d974ea56f521406bffc2a8eaf6b6e6c57bb595', class: "built-with" }, "Built with the ", hAsync("a", { key: '7aa9fc3901510e0ad7d2b0ca4abf4f8c6f92d735', href: "https://designsystem.library.upenn.edu/" }, "Penn Libraries Design System"), ".")))));
|
|
3723
3727
|
}
|
|
3724
3728
|
static get assetsDirs() { return ["assets"]; }
|
|
3725
3729
|
get hostElement() { return getElement(this); }
|
|
@@ -3728,6 +3732,7 @@ class Footer {
|
|
|
3728
3732
|
"$flags$": 265,
|
|
3729
3733
|
"$tagName$": "pennlibs-footer",
|
|
3730
3734
|
"$members$": {
|
|
3735
|
+
"showBuiltWith": [4, "show-built-with"],
|
|
3731
3736
|
"navigationByChildren": [32]
|
|
3732
3737
|
},
|
|
3733
3738
|
"$listeners$": undefined,
|
|
@@ -4201,7 +4206,7 @@ class NoImage {
|
|
|
4201
4206
|
}; }
|
|
4202
4207
|
}
|
|
4203
4208
|
|
|
4204
|
-
const pennlibsFeedbackCss = ":host{display:block;background:#eeeff4;font-family:var(--pl-font-family);font-size:var(--pl-font-size);color:var(--pl-color-fg-default);line-height:1.4;box-sizing:border-box;padding:0.75em 0}@media print{:host{display:none}}*,*::before,*::after{box-sizing:border-box}.viewport-margins{max-width:var(--pl-viewport-margins-max-width);margin:0 auto;padding:0 var(--pl-viewport-margins-gutter, 1em)}.feedback__content{display:flex;justify-content:space-between;gap:var(--pl-space-s);flex-wrap:wrap}.feedback__inline-question{display:flex;flex-wrap:wrap;gap:0.5em;align-items:center}h2{display:inline-block;margin:0;font-family:var(--pl-font-sans-serif);font-size:1em;font-weight:
|
|
4209
|
+
const pennlibsFeedbackCss = ":host{display:block;background:#eeeff4;font-family:var(--pl-font-family);font-size:var(--pl-font-size);color:var(--pl-color-fg-default);line-height:1.4;box-sizing:border-box;padding:0.75em 0}@media print{:host{display:none}}*,*::before,*::after{box-sizing:border-box}.viewport-margins{max-width:var(--pl-viewport-margins-max-width);margin:0 auto;padding:0 var(--pl-viewport-margins-gutter, 1em)}.feedback__content{display:flex;justify-content:space-between;gap:var(--pl-space-s);flex-wrap:wrap}.feedback__inline-question{display:flex;flex-wrap:wrap;gap:0.5em;align-items:center}h2{display:inline-block;margin:0;font-family:var(--pl-font-sans-serif);font-size:1em;font-weight:400}p{margin:0;padding:calc(0.5em + 1px) 0}strong{font-weight:600}a{color:var(--pl-color-fg-accent);text-decoration:underline;text-underline-offset:var(--pl-link-text-underline-offset);text-decoration-thickness:var(--pl-link-hover-text-decoration-thickness)}button{all:unset;display:flex;align-items:center;gap:0.5em;padding:0.25em 1.25em;font-family:var(--pl-font-family);font-weight:500;line-height:1.4;color:var(--pl-color-fg-default);background:var(--pl-color-bg-default);border:solid 1px var(--pl-color-fg-subtle);border-radius:1em;box-sizing:border-box}button:hover{cursor:pointer}button:hover span{text-decoration:underline}*:focus{outline:0;box-shadow:0 0 0 2px var(--pl-color-bg-attention),\n 0 0 0 3px var(--pl-color-bg-emphasis)}p:focus{outline:none;box-shadow:0 0 0 2px var(--pl-color-bg-attention), 0 0 0 3px var(--pl-color-bg-emphasis)}@media (max-width: 26em){h2{display:block;width:100%;text-align:center}}.help-us{display:flex;flex-direction:column;gap:0.5em}.visually-hidden{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.visually-hidden:focus,.visually-hidden:active{clip:auto;clip-path:none;height:auto;overflow:visible;position:static;white-space:normal;width:auto}";
|
|
4205
4210
|
|
|
4206
4211
|
const FEEDBACK_STORAGE_KEY = 'pennlibs-feedback-answer';
|
|
4207
4212
|
const FEEDBACK_TIMESTAMP_KEY = 'pennlibs-feedback-timestamp';
|
|
@@ -4257,7 +4262,7 @@ class PennlibsFeedback {
|
|
|
4257
4262
|
});
|
|
4258
4263
|
}
|
|
4259
4264
|
render() {
|
|
4260
|
-
return (hAsync("div", { key: '04053c96e964ee9f240ca1a77d7944ae0f53248d', class: "feedback__container" }, hAsync("div", { key: 'f5f524b449d3473c1ecc2d454787034c54a811a0', class: "viewport-margins" }, hAsync("div", { key: 'd0c832edc9361dac49d9cbfc143332fea04434ea', class: "feedback__content" }, !this.hideQuestion && (this.answer === 'yes' ? (hAsync("p", null, "Thank you for letting us know.")) : this.answer === 'no' ? (hAsync("p", null, "Thank you for letting us know. ", hAsync("a", { href: "https://www.library.upenn.edu/contact-us" }, "Contact us"), " if you need help.")) : (hAsync("div", { class: "feedback__inline-question" }, hAsync("h2", null, "Did you find what you need?"), hAsync("button", { onClick: () => this.handleFeedback('yes') }, hAsync("span", null, "Yes")), hAsync("button", { onClick: () => this.handleFeedback('no') }, hAsync("span", null, "No"))))), hAsync("div", { key: '
|
|
4265
|
+
return (hAsync("div", { key: '04053c96e964ee9f240ca1a77d7944ae0f53248d', class: "feedback__container" }, hAsync("div", { key: 'f5f524b449d3473c1ecc2d454787034c54a811a0', class: "viewport-margins" }, hAsync("div", { key: 'd0c832edc9361dac49d9cbfc143332fea04434ea', class: "feedback__content" }, !this.hideQuestion && (this.answer === 'yes' ? (hAsync("p", null, "Thank you for letting us know.")) : this.answer === 'no' ? (hAsync("p", null, "Thank you for letting us know. ", hAsync("a", { href: "https://www.library.upenn.edu/contact-us" }, "Contact us"), " if you need help.")) : (hAsync("div", { class: "feedback__inline-question" }, hAsync("h2", null, "Did you find what you need?"), hAsync("button", { onClick: () => this.handleFeedback('yes') }, hAsync("span", null, "Yes"), hAsync("span", { class: "visually-hidden" }, ", I found what I needed.")), hAsync("button", { onClick: () => this.handleFeedback('no') }, hAsync("span", null, "No"), hAsync("span", { class: "visually-hidden" }, ", I did not find what I needed."))))), hAsync("div", { key: '9d4de668c9e3696d8983c48fcc20ea89b2163ea1', class: "feedback__share-feedback" }, hAsync("p", { key: '1377153ebba81c48b0a70756b190503b9cd33c61' }, "To help us improve, ", hAsync("a", { key: '26f3f05b0af848ff58d959190a380d5b64db254a', href: "http://library.upenn.edu/feedback" }, "share your feedback"), "."))))));
|
|
4261
4266
|
}
|
|
4262
4267
|
static get style() { return pennlibsFeedbackCss; }
|
|
4263
4268
|
static get cmpMeta() { return {
|
package/hydrate/index.mjs
CHANGED
|
@@ -3658,7 +3658,7 @@ class Chat {
|
|
|
3658
3658
|
}; }
|
|
3659
3659
|
}
|
|
3660
3660
|
|
|
3661
|
-
const pennlibsFooterCss = ":host {\n font-family: var(--pl-font-family);\n font-size: var(--pl-font-size);\n --padding-bottom: 3em;\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.built-with,\n.built-with a {\n color: var(--pl-color-
|
|
3661
|
+
const pennlibsFooterCss = ":host {\n font-family: var(--pl-font-family);\n font-size: var(--pl-font-size);\n --padding-bottom: 3em;\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.built-with,\n.built-with a {\n color: var(--pl-color-fg-subtle-on-emphasis);\n}\n\n.built-with a {\n font-weight: 500;\n text-underline-offset: var(--pl-link-text-underline-offset);\n\n &:hover {\n text-decoration-thickness: var(--pl-link-hover-text-decoration-thickness);\n }\n}\n\n.built-with {\n opacity: 0.875;\n margin: 0; \n padding: 1.5em 0;\n font-size: 0.875em;\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.75em;\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}";
|
|
3662
3662
|
|
|
3663
3663
|
/**
|
|
3664
3664
|
* A footer component for Penn Libraries websites that displays contact information,
|
|
@@ -3688,6 +3688,10 @@ const pennlibsFooterCss = ":host {\n font-family: var(--pl-font-family);\n fon
|
|
|
3688
3688
|
class Footer {
|
|
3689
3689
|
constructor(hostRef) {
|
|
3690
3690
|
registerInstance(this, hostRef);
|
|
3691
|
+
/**
|
|
3692
|
+
* When true, shows a "Built with the Penn Libraries Design System" line below the footer.
|
|
3693
|
+
*/
|
|
3694
|
+
this.showBuiltWith = false;
|
|
3691
3695
|
}
|
|
3692
3696
|
componentWillLoad() {
|
|
3693
3697
|
this.setNavigationByChildren();
|
|
@@ -3712,12 +3716,12 @@ class Footer {
|
|
|
3712
3716
|
}
|
|
3713
3717
|
render() {
|
|
3714
3718
|
const footerBackgroundSrc = getAssetPath('./assets/footer-bg.webp');
|
|
3715
|
-
return (hAsync("footer", { key: '
|
|
3719
|
+
return (hAsync("footer", { key: '39b1bc7336fe2aa28e8c6093d13b8dfb3dd70d3e', class: "website-footer-wrapper" }, hAsync("div", { key: '7902cf7cde3a468dec8ea71c2a139addafa5af79', class: "website-footer", style: {
|
|
3716
3720
|
background: `var(--pl-color-penn-blue) url(${footerBackgroundSrc}) no-repeat 50% 50%`,
|
|
3717
3721
|
backgroundSize: 'cover',
|
|
3718
|
-
} }, hAsync("div", { key: '
|
|
3722
|
+
} }, hAsync("div", { key: '804f9cd3f101997ee2d15d4a4749945ef553a118', class: "viewport-margins" }, hAsync("div", { key: '3a09637400e74e729641666eb8142c0cf77d66b3', class: "website-footer__content" }, hAsync("div", { key: 'cdb9270db298aa7781859a80c799949cb4c35787', class: "website-footer__links-container" }, hAsync("section", { key: '20d953d2b85178798d2298aa8aaa9fb8e47d7af4' }, hAsync("h2", { key: '79b1fe7f4fc2dff03134c7d4e96e9fd657131fc8', class: "website-footer__heading" }, "Penn Libraries"), hAsync("ul", { key: 'ba8002b17457f979f9817c45a89f332064f0b5bb', class: "website-footer__links" }, hAsync("li", { key: 'cb65fc4ad6432ef447a4b98a8dfdc0323bf37ccc' }, hAsync("a", { key: '0b61506da9a1c18919f77410fa39d3937f7485df', href: "https://maps.google.com/?q=Van Pelt Library 3420 Walnut Street, Philadelphia, PA 19104-6206" }, "3420 Walnut Street", hAsync("br", { key: 'ebd3def13a3107d1b301c0932d421b054e2bb338' }), "Philadelphia, PA 19104-6206")), hAsync("li", { key: '3f26ebab3b90a33ba2d17cd3cfd8a485f1c7e74f' }, hAsync("a", { key: 'c2dcf7a3d936eb5376b2568e677bb8a7dc7ab445', href: "tel:(215) 898-7555" }, "(215) 898-7555")), hAsync("li", { key: '8c9374110f2d386c7275fad9522ea2565daf6c06' }, hAsync("a", { key: 'd40a2fd7490f1b233e4839e38faf29d9bb04f519', href: "https://www.library.upenn.edu/contact-us" }, "Contact us")), hAsync("li", { key: 'ab3016b1cfcc8827af060ec383d8556e8346713a' }, hAsync("a", { key: '76a8d246128fb76606c1cdf24640198c23c9d317', href: "https://www.library.upenn.edu/about/hours", target: "_blank" }, "Locations and hours")))), hAsync("section", { key: 'fd0abacbc35ffaafbb2016064c7a6194616ee2dc' }, hAsync("h2", { key: 'a812d7d26e21a1808ce6bd115ec620e1b033a8bf', class: "website-footer__heading" }, "Stay in touch"), hAsync("ul", { key: 'fe158ff1336379e1236a88c4a3d0f5e1efd9cdb8', class: "website-footer__links" }, hAsync("li", { key: '32396df360b39190ff587400fabe405ee319a507' }, hAsync("a", { key: '07ac56362dde7a2807e86c2a22564689ed9de90c', href: "https://www.alumni.upenn.edu/libsignup" }, "Newsletter")), hAsync("li", { key: '95abd2bf0f6a79c0597c1e57e878f986002adde2' }, hAsync("a", { key: '374044fae62fd82c9369cfba8b7c6223ded48d5a', href: "https://www.instagram.com/upennlib/" }, "Instagram")), hAsync("li", { key: '86cc74d4ec21dfb51a072cfad87ed395e961f26f' }, hAsync("a", { key: 'fda9e8c73918252b91e40dc23d289613a3fe5802', href: "https://www.facebook.com/PennLibraries/" }, "Facebook")), hAsync("li", { key: 'b1ce60d7aa5ac8a2aa8bd4f826c11cc753b1488c' }, hAsync("a", { key: 'ccfef8131fc7f9edd44936f1c212d31c08c61682', href: "https://www.linkedin.com/company/penn-libraries" }, "LinkedIn")))), this.navigationByChildren && [
|
|
3719
3723
|
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))))))))
|
|
3720
|
-
]))), hAsync("div", { key: '
|
|
3724
|
+
]))), hAsync("div", { key: '4430d39b9b8943d9336020d5ed04cdb80a3b91af', class: "website-footer__footer" }, hAsync("div", { key: '437f0b8894b63c3857f8871eaaaf3d28277738ad', class: "viewport-margins" }, hAsync("ul", { key: '8c4ac37a89006d543a66c8c1ba6bc9d7acc0d6db', class: "website-footer__links website-footer__links--footer" }, hAsync("li", { key: 'ac1db31f3c5331a26c0aee171974c10f22d5da08' }, hAsync("a", { key: 'ad8a6251cca9b0c904ccecff96a8800b22ed5568', href: "https://www.upenn.edu/" }, "UPenn")), hAsync("li", { key: '1189f7119ec768d34ea9435f9ff85df2764abe61' }, hAsync("a", { key: 'eb53d4f15fe49d32899d435670a34369a4e7e190', href: "https://www.upenn.edu/about/privacy-policy" }, "Privacy Policy")), hAsync("li", { key: 'd2a155f7f91a31cca41df9d0c9d37f151bded247' }, hAsync("a", { key: '8e329a895a25bd139867063dd7eed9c0aa7c0060', href: "https://accessibility.web-resources.upenn.edu/get-help" }, "Report Accessibility Issues and Get Help")), hAsync("li", { key: '0b65f3da18b54b91158515d7966e010e4e0d64ac' }, hAsync("a", { key: 'f8615c438f94216372fdb8afa26ae7150bbef816', href: "https://www.upenn.edu/about/disclaimer" }, "Disclaimer")), hAsync("li", { key: 'cbf5febfb926a1b569e73d4a57e7ca8315f6d876' }, hAsync("a", { key: '1116c792623c0fa819ce0189e105ee54c69ba73e', href: "https://www.publicsafety.upenn.edu/contact/" }, "Emergency Services")), hAsync("li", { key: '385a84f264b263a9738d38d66ac917e3a6055db4' }, hAsync("a", { key: 'dcd8517fb32ae46b983cb4802adb86e33e29bd71', href: "https://www.upenn.edu/about/report-copyright-infringement" }, "Report Copyright Infringement")))))), this.showBuiltWith && (hAsync("div", { key: 'd3bca43144b06b50091b54dee5c8734de4f80d60', class: "viewport-margins" }, hAsync("p", { key: 'a3d974ea56f521406bffc2a8eaf6b6e6c57bb595', class: "built-with" }, "Built with the ", hAsync("a", { key: '7aa9fc3901510e0ad7d2b0ca4abf4f8c6f92d735', href: "https://designsystem.library.upenn.edu/" }, "Penn Libraries Design System"), ".")))));
|
|
3721
3725
|
}
|
|
3722
3726
|
static get assetsDirs() { return ["assets"]; }
|
|
3723
3727
|
get hostElement() { return getElement(this); }
|
|
@@ -3726,6 +3730,7 @@ class Footer {
|
|
|
3726
3730
|
"$flags$": 265,
|
|
3727
3731
|
"$tagName$": "pennlibs-footer",
|
|
3728
3732
|
"$members$": {
|
|
3733
|
+
"showBuiltWith": [4, "show-built-with"],
|
|
3729
3734
|
"navigationByChildren": [32]
|
|
3730
3735
|
},
|
|
3731
3736
|
"$listeners$": undefined,
|
|
@@ -4199,7 +4204,7 @@ class NoImage {
|
|
|
4199
4204
|
}; }
|
|
4200
4205
|
}
|
|
4201
4206
|
|
|
4202
|
-
const pennlibsFeedbackCss = ":host{display:block;background:#eeeff4;font-family:var(--pl-font-family);font-size:var(--pl-font-size);color:var(--pl-color-fg-default);line-height:1.4;box-sizing:border-box;padding:0.75em 0}@media print{:host{display:none}}*,*::before,*::after{box-sizing:border-box}.viewport-margins{max-width:var(--pl-viewport-margins-max-width);margin:0 auto;padding:0 var(--pl-viewport-margins-gutter, 1em)}.feedback__content{display:flex;justify-content:space-between;gap:var(--pl-space-s);flex-wrap:wrap}.feedback__inline-question{display:flex;flex-wrap:wrap;gap:0.5em;align-items:center}h2{display:inline-block;margin:0;font-family:var(--pl-font-sans-serif);font-size:1em;font-weight:
|
|
4207
|
+
const pennlibsFeedbackCss = ":host{display:block;background:#eeeff4;font-family:var(--pl-font-family);font-size:var(--pl-font-size);color:var(--pl-color-fg-default);line-height:1.4;box-sizing:border-box;padding:0.75em 0}@media print{:host{display:none}}*,*::before,*::after{box-sizing:border-box}.viewport-margins{max-width:var(--pl-viewport-margins-max-width);margin:0 auto;padding:0 var(--pl-viewport-margins-gutter, 1em)}.feedback__content{display:flex;justify-content:space-between;gap:var(--pl-space-s);flex-wrap:wrap}.feedback__inline-question{display:flex;flex-wrap:wrap;gap:0.5em;align-items:center}h2{display:inline-block;margin:0;font-family:var(--pl-font-sans-serif);font-size:1em;font-weight:400}p{margin:0;padding:calc(0.5em + 1px) 0}strong{font-weight:600}a{color:var(--pl-color-fg-accent);text-decoration:underline;text-underline-offset:var(--pl-link-text-underline-offset);text-decoration-thickness:var(--pl-link-hover-text-decoration-thickness)}button{all:unset;display:flex;align-items:center;gap:0.5em;padding:0.25em 1.25em;font-family:var(--pl-font-family);font-weight:500;line-height:1.4;color:var(--pl-color-fg-default);background:var(--pl-color-bg-default);border:solid 1px var(--pl-color-fg-subtle);border-radius:1em;box-sizing:border-box}button:hover{cursor:pointer}button:hover span{text-decoration:underline}*:focus{outline:0;box-shadow:0 0 0 2px var(--pl-color-bg-attention),\n 0 0 0 3px var(--pl-color-bg-emphasis)}p:focus{outline:none;box-shadow:0 0 0 2px var(--pl-color-bg-attention), 0 0 0 3px var(--pl-color-bg-emphasis)}@media (max-width: 26em){h2{display:block;width:100%;text-align:center}}.help-us{display:flex;flex-direction:column;gap:0.5em}.visually-hidden{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.visually-hidden:focus,.visually-hidden:active{clip:auto;clip-path:none;height:auto;overflow:visible;position:static;white-space:normal;width:auto}";
|
|
4203
4208
|
|
|
4204
4209
|
const FEEDBACK_STORAGE_KEY = 'pennlibs-feedback-answer';
|
|
4205
4210
|
const FEEDBACK_TIMESTAMP_KEY = 'pennlibs-feedback-timestamp';
|
|
@@ -4255,7 +4260,7 @@ class PennlibsFeedback {
|
|
|
4255
4260
|
});
|
|
4256
4261
|
}
|
|
4257
4262
|
render() {
|
|
4258
|
-
return (hAsync("div", { key: '04053c96e964ee9f240ca1a77d7944ae0f53248d', class: "feedback__container" }, hAsync("div", { key: 'f5f524b449d3473c1ecc2d454787034c54a811a0', class: "viewport-margins" }, hAsync("div", { key: 'd0c832edc9361dac49d9cbfc143332fea04434ea', class: "feedback__content" }, !this.hideQuestion && (this.answer === 'yes' ? (hAsync("p", null, "Thank you for letting us know.")) : this.answer === 'no' ? (hAsync("p", null, "Thank you for letting us know. ", hAsync("a", { href: "https://www.library.upenn.edu/contact-us" }, "Contact us"), " if you need help.")) : (hAsync("div", { class: "feedback__inline-question" }, hAsync("h2", null, "Did you find what you need?"), hAsync("button", { onClick: () => this.handleFeedback('yes') }, hAsync("span", null, "Yes")), hAsync("button", { onClick: () => this.handleFeedback('no') }, hAsync("span", null, "No"))))), hAsync("div", { key: '
|
|
4263
|
+
return (hAsync("div", { key: '04053c96e964ee9f240ca1a77d7944ae0f53248d', class: "feedback__container" }, hAsync("div", { key: 'f5f524b449d3473c1ecc2d454787034c54a811a0', class: "viewport-margins" }, hAsync("div", { key: 'd0c832edc9361dac49d9cbfc143332fea04434ea', class: "feedback__content" }, !this.hideQuestion && (this.answer === 'yes' ? (hAsync("p", null, "Thank you for letting us know.")) : this.answer === 'no' ? (hAsync("p", null, "Thank you for letting us know. ", hAsync("a", { href: "https://www.library.upenn.edu/contact-us" }, "Contact us"), " if you need help.")) : (hAsync("div", { class: "feedback__inline-question" }, hAsync("h2", null, "Did you find what you need?"), hAsync("button", { onClick: () => this.handleFeedback('yes') }, hAsync("span", null, "Yes"), hAsync("span", { class: "visually-hidden" }, ", I found what I needed.")), hAsync("button", { onClick: () => this.handleFeedback('no') }, hAsync("span", null, "No"), hAsync("span", { class: "visually-hidden" }, ", I did not find what I needed."))))), hAsync("div", { key: '9d4de668c9e3696d8983c48fcc20ea89b2163ea1', class: "feedback__share-feedback" }, hAsync("p", { key: '1377153ebba81c48b0a70756b190503b9cd33c61' }, "To help us improve, ", hAsync("a", { key: '26f3f05b0af848ff58d959190a380d5b64db254a', href: "http://library.upenn.edu/feedback" }, "share your feedback"), "."))))));
|
|
4259
4264
|
}
|
|
4260
4265
|
static get style() { return pennlibsFeedbackCss; }
|
|
4261
4266
|
static get cmpMeta() { return {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@penn-libraries/web",
|
|
3
|
-
"version": "1.2.0-dev.
|
|
3
|
+
"version": "1.2.0-dev.2",
|
|
4
4
|
"description": "Reusable web designs for University of Pennsylvania Libraries websites. This package contains our code for shared Web Components and Cascading Style Sheets (CSS).",
|
|
5
5
|
"main": "dist/index.cjs.js",
|
|
6
6
|
"module": "dist/index.js",
|