@penn-libraries/web 0.3.0-dev.4 → 0.3.0-dev.5
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/{index-B6Rjt_WH.js → index-B6HF5D3u.js} +652 -8
- package/dist/cjs/index-B6HF5D3u.js.map +1 -0
- package/dist/cjs/index.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/pennlibs-banner.cjs.entry.js +1 -1
- package/dist/cjs/pennlibs-chat.pennlibs-feedback.pennlibs-footer.pennlibs-header.pennlibs-hero.entry.cjs.js.map +1 -1
- package/dist/cjs/pennlibs-chat_5.cjs.entry.js +15 -11
- package/dist/cjs/pennlibs-chat_5.cjs.entry.js.map +1 -1
- package/dist/cjs/pennlibs-colors.cjs.entry.js +1 -1
- package/dist/cjs/web.cjs.js +2 -2
- package/dist/collection/components/pennlibs-footer/pennlibs-footer.css +4 -0
- package/dist/collection/components/pennlibs-footer/pennlibs-footer.js +3 -32
- package/dist/collection/components/pennlibs-footer/pennlibs-footer.js.map +1 -1
- package/dist/collection/components/pennlibs-header/pennlibs-header.css +9 -9
- package/dist/collection/components/pennlibs-header/pennlibs-header.js +45 -14
- package/dist/collection/components/pennlibs-header/pennlibs-header.js.map +1 -1
- package/dist/collection/components/pennlibs-hero/pennlibs-hero.js +8 -1
- package/dist/collection/components/pennlibs-hero/pennlibs-hero.js.map +1 -1
- package/dist/components/pennlibs-footer.js +4 -7
- package/dist/components/pennlibs-footer.js.map +1 -1
- package/dist/components/pennlibs-header.js +9 -3
- package/dist/components/pennlibs-header.js.map +1 -1
- package/dist/components/pennlibs-hero.js +1 -1
- package/dist/components/pennlibs-hero.js.map +1 -1
- package/dist/docs.d.ts +443 -0
- package/dist/docs.json +332 -0
- package/dist/esm/{index-BQRdy1TQ.js → index-BAQIT3Vo.js} +652 -8
- package/dist/esm/index-BAQIT3Vo.js.map +1 -0
- package/dist/esm/index.js +1 -1
- package/dist/esm/loader.js +3 -3
- package/dist/esm/pennlibs-banner.entry.js +1 -1
- package/dist/esm/pennlibs-chat.pennlibs-feedback.pennlibs-footer.pennlibs-header.pennlibs-hero.entry.js.map +1 -1
- package/dist/esm/pennlibs-chat_5.entry.js +15 -11
- package/dist/esm/pennlibs-chat_5.entry.js.map +1 -1
- package/dist/esm/pennlibs-colors.entry.js +1 -1
- package/dist/esm/web.js +3 -3
- package/dist/types/components/pennlibs-footer/pennlibs-footer.d.ts +0 -10
- package/dist/types/components/pennlibs-header/pennlibs-header.d.ts +28 -8
- package/dist/types/components/pennlibs-hero/pennlibs-hero.d.ts +7 -0
- package/dist/types/components.d.ts +85 -33
- package/dist/web/index.esm.js +1 -1
- package/dist/web/{p-dac033ee.entry.js → p-072fba0a.entry.js} +2 -2
- package/dist/web/{p-2edaa432.entry.js → p-42b20949.entry.js} +2 -2
- package/dist/web/{p-a24d914e.entry.js → p-64706047.entry.js} +16 -12
- package/dist/web/p-64706047.entry.js.map +1 -0
- package/dist/web/{p-BQRdy1TQ.js → p-BAQIT3Vo.js} +652 -8
- package/dist/web/p-BAQIT3Vo.js.map +1 -0
- package/dist/web/pennlibs-chat.pennlibs-feedback.pennlibs-footer.pennlibs-header.pennlibs-hero.entry.esm.js.map +1 -1
- package/dist/web/web.css +6 -1
- package/dist/web/web.esm.js +3 -3
- package/hydrate/index.d.ts +271 -0
- package/hydrate/index.js +19572 -0
- package/hydrate/index.mjs +19564 -0
- package/hydrate/package.json +12 -0
- package/package.json +12 -8
- package/dist/cjs/index-B6Rjt_WH.js.map +0 -1
- package/dist/esm/index-BQRdy1TQ.js.map +0 -1
- package/dist/web/p-BQRdy1TQ.js.map +0 -1
- package/dist/web/p-a24d914e.entry.js.map +0 -1
- /package/dist/web/{p-dac033ee.entry.js.map → p-072fba0a.entry.js.map} +0 -0
- /package/dist/web/{p-2edaa432.entry.js.map → p-42b20949.entry.js.map} +0 -0
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-B6HF5D3u.js');
|
|
4
4
|
|
|
5
5
|
const pennlibsColorsCss = ":host{font-family:var(--font-family);font-size:var(--font-size);--max-width:1080px}*{box-sizing:border-box}.viewport-margins{max-width:var(--max-width);margin:0 auto;padding:0 1rem}.colors-container{display:grid;grid-template-columns:repeat(auto-fill, minmax(22rem, 1fr));gap:2rem;margin-bottom:2rem}.colors-container code{display:block;width:100%;padding:3em 1.5em}.colors-container code+code{margin-top:1em}.colors-container code span{font-size:0.875em;display:inline-block;background:var(--color-bg-default);padding:0.25em 0.5em}.colors-container code{display:flex;justify-content:space-between}h2{font-size:1.25em;font-weight:600;margin-bottom:0.25em}";
|
|
6
6
|
|
package/dist/cjs/web.cjs.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-B6HF5D3u.js');
|
|
4
4
|
var appGlobals = require('./app-globals-V2Kpy_OQ.js');
|
|
5
5
|
|
|
6
6
|
var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null;
|
|
@@ -19,7 +19,7 @@ var patchBrowser = () => {
|
|
|
19
19
|
|
|
20
20
|
patchBrowser().then(async (options) => {
|
|
21
21
|
await appGlobals.globalScripts();
|
|
22
|
-
return index.bootstrapLazy([["pennlibs-chat_5.cjs",[[1,"pennlibs-chat",{"href":[32]}],[1,"pennlibs-feedback",{"error":[32],"answer":[32]}],[1,"pennlibs-footer",{"
|
|
22
|
+
return index.bootstrapLazy([["pennlibs-chat_5.cjs",[[1,"pennlibs-chat",{"href":[32]}],[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]}]]],["pennlibs-banner.cjs",[[1,"pennlibs-banner"]]],["pennlibs-colors.cjs",[[1,"pennlibs-colors",{"navigation":[16]}]]]], options);
|
|
23
23
|
});
|
|
24
24
|
|
|
25
25
|
exports.setNonce = index.setNonce;
|
|
@@ -23,14 +23,12 @@ export class Footer {
|
|
|
23
23
|
}
|
|
24
24
|
render() {
|
|
25
25
|
const footerBackgroundSrc = getAssetPath('./assets/footer-bg.webp');
|
|
26
|
-
return (h("div", { key: '
|
|
26
|
+
return (h("div", { key: '40bee22231ae7f79cf368a06b34fc479490d90e2', class: "website-footer-wrapper" }, h("footer", { key: '7ffcbb84fc096a1a3a19fdbaa999f031944df14b', class: "website-footer", style: {
|
|
27
27
|
background: `var(--color-penn-blue) url(${footerBackgroundSrc}) no-repeat 50% 50%`,
|
|
28
28
|
backgroundSize: 'cover',
|
|
29
|
-
} }, h("div", { key: '
|
|
29
|
+
} }, h("div", { key: 'ccb8cafc9f49d4796b158bd2bf0c2e4a81e7c301', class: "viewport-margins" }, h("div", { key: 'e3461be746bbf460422d24448bfdcd35d75f143e', class: "website-footer__content" }, h("div", { key: 'ceb536cf8d1e8cb4cbd008415e84367869fa319a', class: "website-footer__links-container" }, h("section", { key: 'a936c772c58f083f7cb4d03c4e2c9563412a029f' }, h("h2", { key: '8562595447974e570026a3295c6b8a4ea2eadcfc', class: "website-footer__heading" }, "Penn Libraries"), h("ul", { key: 'a49281bd1399c6713f2c2165b941585464e32653', class: "website-footer__links" }, h("li", { key: '3aaff28e4c8e15d97f5722850d4fe5a5b84ca7c7' }, h("a", { key: '9c46688197ae90029c46cfc40d84970a8f6a4956', href: "https://maps.google.com/?q=Van Pelt Library 3420 Walnut Street, Philadelphia, PA 19104-6206" }, "3420 Walnut Street", h("br", { key: '8fda816b66576fc26d6888dd101674af025042e6' }), "Philadelphia, PA 19104-6206")), h("li", { key: '18ac4042e695b00e1e6816a8108eb47b40097b17' }, h("a", { key: '2d1df64e1abbdfb5c852597c3c1fe5064d929780', href: "tel:(215) 898-7555" }, "(215) 898-7555")), h("li", { key: '50b7e0d1937695dd2d91d4888e72849e55bbc230' }, h("a", { key: 'e6e329346b6df142ec21c9454ce4beda59400064', href: "https://www.library.upenn.edu/contact-us" }, "Contact us")), h("li", { key: '95f0d1e8a6c5bf44931f33cae7acd4b1aad094bb' }, h("a", { key: '12782dc2f58ab2f0d438ca2b3136c2956821ad67', href: "https://www.library.upenn.edu/about/hours", target: "_blank" }, "Locations and hours")))), h("section", { key: 'c06ef6b6bdbeeb1399ae4fe997492b69724b905f' }, h("h2", { key: 'e669081302570c944677ace470a94adc2cca2c61', class: "website-footer__heading" }, "Stay in touch"), h("ul", { key: '73f90d530da56d6866425db3ca3512a77c34230f', class: "website-footer__links" }, h("li", { key: 'e2ae803e424a77f96c390e4175940dbcc16bf141' }, h("a", { key: 'f8b2f47e20efa037126c936065744509f586af16', href: "https://www.alumni.upenn.edu/libsignup" }, "Newsletter")), h("li", { key: '47728d60b3f7df3f5561c9d6366655bd572c3b1a' }, h("a", { key: 'be6191de186e4c7bc5a4600946d10fd5e3ac5051', href: "https://www.instagram.com/upennlib/" }, "Instagram")), h("li", { key: '5e195c6da1431647529831c64e8e29218aa5b629' }, h("a", { key: 'b452a29c023f2cf4e5ebe00e13029f6c25c5cb1d', href: "https://www.facebook.com/PennLibraries/" }, "Facebook")), h("li", { key: '0264616dde4c2fadc9de0a2dca75f8a424c2744e' }, h("a", { key: '969ba001ed12c911f1ab2f96666a68e6629c1e63', href: "https://www.linkedin.com/company/penn-libraries" }, "LinkedIn")))), this.navigationByChildren && [
|
|
30
30
|
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))))))))
|
|
31
|
-
],
|
|
32
|
-
this.navigation.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))))))))
|
|
33
|
-
]))), h("div", { key: '92ba07834ec5907ab47c59925d5d09d3dc7960df', class: "website-footer__footer" }, h("div", { key: 'f649f0dde206c92a41c10cb871137ccb725f2394', class: "viewport-margins" }, h("ul", { key: '82244f9c342acdcb9dd9ff0ae651c4b4cb2939e4', class: "website-footer__links website-footer__links--footer" }, h("li", { key: '44be5c6a8380af4482a97080df640c34b852a865' }, h("a", { key: '8eb4ffa492285f6a2f3f42df1b2b5a784f042332', href: "https://www.upenn.edu/" }, "UPenn")), h("li", { key: '658402f36047ba302a90521a57e414a995bc19f4' }, h("a", { key: 'a0f85214bea0883b03abd4a1afc8ef97a6eddf27', href: "https://www.upenn.edu/about/privacy-policy" }, "Privacy Policy")), h("li", { key: '0f43503a3c031967429ef9021457bafa3ec9325b' }, h("a", { key: '21b9c566ef1b8800b41a21ba70e4444128653b9c', href: "https://accessibility.web-resources.upenn.edu/get-help" }, "Report Accessibility Issues and Get Help")), h("li", { key: '92b1311cebfe09923505d0c9db17f2cc79bc8b09' }, h("a", { key: 'ed7ca974f5cea0841bb3946efc39cc6e13e8748f', href: "https://www.upenn.edu/about/disclaimer" }, "Disclaimer")), h("li", { key: 'effb3c2ef3eb3b8611bf8bf6cba2db907bde3d5d' }, h("a", { key: '1a6f73099f9311e189987988317dda7390dda6a5', href: "https://www.publicsafety.upenn.edu/contact/" }, "Emergency Services")), h("li", { key: '3b1f57c5073869e4a5f3f4fbd94b28bee437bc72' }, h("a", { key: '4e2ab4fd8a1fcf310a5b67a5a264b7dc5b2aed11', href: "https://www.upenn.edu/about/report-copyright-infringement" }, "Report Copyright Infringement"))))))));
|
|
31
|
+
]))), h("div", { key: 'b0f07d479fc29d673758d97a0f242397e9c434fd', class: "website-footer__footer" }, h("div", { key: '7b2201088c578e0c7dc54d26c0642bd2221efba0', class: "viewport-margins" }, h("ul", { key: '6ccf0109682bc0c63553ae4ce45076ecc06a1506', class: "website-footer__links website-footer__links--footer" }, h("li", { key: 'bd61ce924e4cd2e19665427743640c23d531335a' }, h("a", { key: '2326f72667de436ebee473e81c21c0d478306b7c', href: "https://www.upenn.edu/" }, "UPenn")), h("li", { key: 'e0be39fea786c611f61d6215901b887c773489fc' }, h("a", { key: '10e1a39069f966ba3a1894352f93adf0bd05e184', href: "https://www.upenn.edu/about/privacy-policy" }, "Privacy Policy")), h("li", { key: 'be0fe00a2614d2eb1179d63e223f0cacefd7d640' }, h("a", { key: 'a45dcae52ba1c8389408f998a20547fe27e9ff04', href: "https://accessibility.web-resources.upenn.edu/get-help" }, "Report Accessibility Issues and Get Help")), h("li", { key: 'f00048be9bd71c503dd0b29d7dd1841f34dfa7d1' }, h("a", { key: '3d5cc82cb2ddb4fa61eabe92f3c9f8a0e3263d3a', href: "https://www.upenn.edu/about/disclaimer" }, "Disclaimer")), h("li", { key: '75d566a8e7e17b5102dd697a5ac2d2bdf3189586' }, h("a", { key: '143c075d181701e9f1a90be037f9888b0fad153a', href: "https://www.publicsafety.upenn.edu/contact/" }, "Emergency Services")), h("li", { key: '08d8bceb70f47a13dcdb33c8be43de26491379d8' }, h("a", { key: '6451e811d74f807cef2d3009bcc99117109118c3', href: "https://www.upenn.edu/about/report-copyright-infringement" }, "Report Copyright Infringement"))))))));
|
|
34
32
|
}
|
|
35
33
|
static get is() { return "pennlibs-footer"; }
|
|
36
34
|
static get encapsulation() { return "shadow"; }
|
|
@@ -45,33 +43,6 @@ export class Footer {
|
|
|
45
43
|
};
|
|
46
44
|
}
|
|
47
45
|
static get assetsDirs() { return ["assets"]; }
|
|
48
|
-
static get properties() {
|
|
49
|
-
return {
|
|
50
|
-
"navigation": {
|
|
51
|
-
"type": "unknown",
|
|
52
|
-
"attribute": "navigation",
|
|
53
|
-
"mutable": false,
|
|
54
|
-
"complexType": {
|
|
55
|
-
"original": "Array<{\n heading: string;\n links: Array<{\n label: string;\n href: string;\n }>;\n }>",
|
|
56
|
-
"resolved": "{ heading: string; links: { label: string; href: string; }[]; }[]",
|
|
57
|
-
"references": {
|
|
58
|
-
"Array": {
|
|
59
|
-
"location": "global",
|
|
60
|
-
"id": "global::Array"
|
|
61
|
-
}
|
|
62
|
-
}
|
|
63
|
-
},
|
|
64
|
-
"required": false,
|
|
65
|
-
"optional": false,
|
|
66
|
-
"docs": {
|
|
67
|
-
"tags": [],
|
|
68
|
-
"text": "The navigation sections."
|
|
69
|
-
},
|
|
70
|
-
"getter": false,
|
|
71
|
-
"setter": false
|
|
72
|
-
}
|
|
73
|
-
};
|
|
74
|
-
}
|
|
75
46
|
static get states() {
|
|
76
47
|
return {
|
|
77
48
|
"navigationByChildren": {}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pennlibs-footer.js","sourceRoot":"","sources":["../../../src/components/pennlibs-footer/pennlibs-footer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,
|
|
1
|
+
{"version":3,"file":"pennlibs-footer.js","sourceRoot":"","sources":["../../../src/components/pennlibs-footer/pennlibs-footer.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, h, getAssetPath, State } from '@stencil/core';\n\n@Component({\n tag: 'pennlibs-footer',\n styleUrl: 'pennlibs-footer.css',\n shadow: true,\n assetsDirs: ['assets']\n})\nexport class Footer {\n @State() navigationByChildren;\n\n @Element() hostElement: HTMLElement;\n\n componentWillLoad() {\n this.setNavigationByChildren();\n }\n\n setNavigationByChildren() {\n try {\n if (this.hostElement.children) {\n this.navigationByChildren = Array.from(this.hostElement.children).reduce(\n (acc, element) => {\n acc = acc.concat({\n heading: element.querySelector('h2').innerText,\n links: Array.from(element.querySelectorAll('a')).map(link => {\n return { label: link.innerText, href: link.href }\n })\n })\n \n return acc;\n }, []);\n }\n } catch {\n console.warn('<pennlibs-footer> Composed with unexpected HTML', this.hostElement.children)\n }\n }\n\n render() {\n const footerBackgroundSrc = getAssetPath('./assets/footer-bg.webp');\n \n return (\n <div class=\"website-footer-wrapper\">\n <footer class=\"website-footer\" style={{\n background: `var(--color-penn-blue) url(${footerBackgroundSrc}) no-repeat 50% 50%`,\n backgroundSize: 'cover',\n }}>\n <div class=\"viewport-margins\">\n <div class=\"website-footer__content\">\n <div class=\"website-footer__links-container\">\n <section>\n <h2 class=\"website-footer__heading\">Penn Libraries</h2>\n <ul class=\"website-footer__links\">\n <li><a href=\"https://maps.google.com/?q=Van Pelt Library 3420 Walnut Street, Philadelphia, PA 19104-6206\">3420 Walnut Street<br />Philadelphia, PA 19104-6206</a></li>\n <li><a href=\"tel:(215) 898-7555\">(215) 898-7555</a></li>\n <li><a href=\"https://www.library.upenn.edu/contact-us\">Contact us</a></li>\n <li><a href=\"https://www.library.upenn.edu/about/hours\" target=\"_blank\">Locations and hours</a></li>\n </ul>\n </section>\n <section>\n <h2 class=\"website-footer__heading\">Stay in touch</h2>\n <ul class=\"website-footer__links\">\n <li><a href=\"https://www.alumni.upenn.edu/libsignup\">Newsletter</a></li>\n <li><a href=\"https://www.instagram.com/upennlib/\">Instagram</a></li>\n <li><a href=\"https://www.facebook.com/PennLibraries/\">Facebook</a></li>\n <li><a href=\"https://www.linkedin.com/company/penn-libraries\">LinkedIn</a></li>\n </ul>\n </section>\n {this.navigationByChildren && [\n this.navigationByChildren.map(section => (\n <section>\n <h2 class=\"website-footer__heading\">{section.heading}</h2>\n <ul class=\"website-footer__links\">\n {section.links.map(link => (\n <li><a href={link.href}>{link.label}</a></li>\n ))}\n </ul>\n </section>\n ))\n ]}\n </div>\n </div>\n </div>\n <div class=\"website-footer__footer\">\n <div class=\"viewport-margins\"> \n <ul class=\"website-footer__links website-footer__links--footer\">\n <li><a href=\"https://www.upenn.edu/\">UPenn</a></li>\n <li><a href=\"https://www.upenn.edu/about/privacy-policy\">Privacy Policy</a></li>\n <li><a href=\"https://accessibility.web-resources.upenn.edu/get-help\">Report Accessibility Issues and Get Help</a></li>\n <li><a href=\"https://www.upenn.edu/about/disclaimer\">Disclaimer</a></li>\n <li><a href=\"https://www.publicsafety.upenn.edu/contact/\">Emergency Services</a></li>\n <li><a href=\"https://www.upenn.edu/about/report-copyright-infringement\">Report Copyright Infringement</a></li>\n </ul>\n </div>\n </div>\n </footer>\n </div>\n );\n }\n}\n"]}
|
|
@@ -62,7 +62,7 @@ a {
|
|
|
62
62
|
margin-right: 1em;
|
|
63
63
|
}
|
|
64
64
|
|
|
65
|
-
@media (max-width:
|
|
65
|
+
@media (max-width: 1000px) {
|
|
66
66
|
.website-header__logo {
|
|
67
67
|
max-width: 200px;
|
|
68
68
|
}
|
|
@@ -83,7 +83,7 @@ a {
|
|
|
83
83
|
color: var(--color-fg-service);
|
|
84
84
|
}
|
|
85
85
|
|
|
86
|
-
@media (min-width:
|
|
86
|
+
@media (min-width: 1001px) {
|
|
87
87
|
.website-header__service-link {
|
|
88
88
|
padding-left: 0.5em;
|
|
89
89
|
}
|
|
@@ -118,7 +118,7 @@ a {
|
|
|
118
118
|
padding: 1em 0;
|
|
119
119
|
}
|
|
120
120
|
|
|
121
|
-
@media (max-width:
|
|
121
|
+
@media (max-width: 1000px) {
|
|
122
122
|
.website-header__inner-container {
|
|
123
123
|
flex-direction: column;
|
|
124
124
|
align-items: flex-start;
|
|
@@ -126,7 +126,7 @@ a {
|
|
|
126
126
|
}
|
|
127
127
|
|
|
128
128
|
/* Navigation */
|
|
129
|
-
@media (max-width:
|
|
129
|
+
@media (max-width: 1000px) {
|
|
130
130
|
.website-header__navigation {
|
|
131
131
|
width: 100%;
|
|
132
132
|
}
|
|
@@ -139,13 +139,13 @@ a {
|
|
|
139
139
|
padding: 0;
|
|
140
140
|
}
|
|
141
141
|
|
|
142
|
-
@media (max-width:
|
|
142
|
+
@media (max-width: 1000px) {
|
|
143
143
|
.website-header__navigation-list {
|
|
144
144
|
display: none;
|
|
145
145
|
}
|
|
146
146
|
}
|
|
147
147
|
|
|
148
|
-
@media (max-width:
|
|
148
|
+
@media (max-width: 1000px) {
|
|
149
149
|
.website-header__navigation-list--visible {
|
|
150
150
|
display: block;
|
|
151
151
|
margin-top: 1rem;
|
|
@@ -175,7 +175,7 @@ a {
|
|
|
175
175
|
cursor: pointer;
|
|
176
176
|
}
|
|
177
177
|
|
|
178
|
-
@media (max-width:
|
|
178
|
+
@media (max-width: 1000px) {
|
|
179
179
|
.website-header__navigation-list a,
|
|
180
180
|
.website-header__navigation-list button {
|
|
181
181
|
padding: 0.75em 0;
|
|
@@ -187,7 +187,7 @@ a {
|
|
|
187
187
|
padding: 0.5em 0;
|
|
188
188
|
}
|
|
189
189
|
|
|
190
|
-
@media (min-width:
|
|
190
|
+
@media (min-width: 1001px) {
|
|
191
191
|
.website-header__navigation-list a,
|
|
192
192
|
.website-header__navigation-list button {
|
|
193
193
|
padding: 0.5em;
|
|
@@ -217,7 +217,7 @@ a {
|
|
|
217
217
|
cursor: pointer;
|
|
218
218
|
}
|
|
219
219
|
|
|
220
|
-
@media (min-width:
|
|
220
|
+
@media (min-width: 1001px) {
|
|
221
221
|
.website-header__navigation-button {
|
|
222
222
|
display: none;
|
|
223
223
|
}
|
|
@@ -1,10 +1,34 @@
|
|
|
1
1
|
import { h } from "@stencil/core";
|
|
2
2
|
import { LogoWhite } from "./logo-white";
|
|
3
3
|
import { LogoBlue } from "./logo-blue";
|
|
4
|
+
/**
|
|
5
|
+
* A header component for Penn Libraries websites that displays the Penn Libraries logo,
|
|
6
|
+
* service branding, and navigation. Supports both light and dark themes.
|
|
7
|
+
*
|
|
8
|
+
* @component
|
|
9
|
+
* @example
|
|
10
|
+
* <pennlibs-header
|
|
11
|
+
* service-name="Find Books"
|
|
12
|
+
* service-lede="Search our catalog and collections"
|
|
13
|
+
* theme="light">
|
|
14
|
+
* <a href="/search">Search</a>
|
|
15
|
+
* <a href="/help">Help</a>
|
|
16
|
+
* </pennlibs-header>
|
|
17
|
+
*
|
|
18
|
+
* @slot end - Content to display at the end of the header (right side)
|
|
19
|
+
*
|
|
20
|
+
* @prop --max-width: The maximum width of the header.
|
|
21
|
+
*/
|
|
4
22
|
export class Header {
|
|
5
23
|
constructor() {
|
|
6
24
|
/**
|
|
7
|
-
* The service
|
|
25
|
+
* The URL where the service name links to, typically the service homepage or main landing page.
|
|
26
|
+
* @default "/"
|
|
27
|
+
*/
|
|
28
|
+
this.serviceHref = "/";
|
|
29
|
+
/**
|
|
30
|
+
* The visual theme of the header. Light theme uses blue logo, dark theme uses white logo.
|
|
31
|
+
* @default 'light'
|
|
8
32
|
*/
|
|
9
33
|
this.theme = 'light';
|
|
10
34
|
this.isMenuOpen = false;
|
|
@@ -37,7 +61,7 @@ export class Header {
|
|
|
37
61
|
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" })));
|
|
38
62
|
}
|
|
39
63
|
render() {
|
|
40
|
-
return (h("header", { key: '
|
|
64
|
+
return (h("header", { key: '707a9337f77742da7588908387e20e89217cfef4', class: `viewport-margins website-header ${this.theme === 'dark' && 'website-header--dark'}` }, h("div", { key: '828414077205b9bcccd391b5d49196673c204855', class: "website-header__inner-container" }, h("div", { key: '14d2eadb7d366cf1a0b1a737a3c701f42d43deae', class: "website-header__logo-name-container" }, h("a", { key: 'c34ae1516dd6e37f07ec39c5f6cf9d519c41c898', 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: 'e7084e840463f5598faef98ff5bf5c5e3229ffb3', href: "/", class: "website-header__service-link" }, h("span", { key: 'ea3f3ecd778592244e671b40a41a26c17b6a47b3', class: "website-header__service-name" }, this.serviceName), this.serviceLede && h("span", { key: '0ba8b8697e1d22d526c453ba1b7428550ec30dde', class: "website-header__service-lede" }, this.serviceLede)))), this.navigation.length > 0 && (h("nav", { key: '9d872495646af129b045777b0cdf211f1d3a5102', class: "website-header__navigation" }, h("button", { key: '57069987df48a530b1314c5de7215d00c82bbfe1', class: "website-header__navigation-button", "aria-expanded": `${this.isMenuOpen}`, onClick: () => this.handleToggleMenu() }, this.renderMenuIcon(), " Menu"), this.navigation && (h("ol", { key: '235b39191eb97292b8ca915cc462e1e84101915a', class: `website-header__navigation-list ${this.isMenuOpen && 'website-header__navigation-list--visible'}` }, this.navigation.map(element => h("li", { innerHTML: element.outerHTML })))))), h("slot", { key: '1768bad83b473f6c765da4b8b3823423472c6c06', name: "end" }))));
|
|
41
65
|
}
|
|
42
66
|
static get is() { return "pennlibs-header"; }
|
|
43
67
|
static get encapsulation() { return "shadow"; }
|
|
@@ -64,10 +88,10 @@ export class Header {
|
|
|
64
88
|
"references": {}
|
|
65
89
|
},
|
|
66
90
|
"required": false,
|
|
67
|
-
"optional":
|
|
91
|
+
"optional": true,
|
|
68
92
|
"docs": {
|
|
69
93
|
"tags": [],
|
|
70
|
-
"text": "The name
|
|
94
|
+
"text": "The service name should clearly describe what users want to accomplish. Avoid technical jargon, technology names, and acronyms."
|
|
71
95
|
},
|
|
72
96
|
"getter": false,
|
|
73
97
|
"setter": false,
|
|
@@ -83,10 +107,10 @@ export class Header {
|
|
|
83
107
|
"references": {}
|
|
84
108
|
},
|
|
85
109
|
"required": false,
|
|
86
|
-
"optional":
|
|
110
|
+
"optional": true,
|
|
87
111
|
"docs": {
|
|
88
112
|
"tags": [],
|
|
89
|
-
"text": "
|
|
113
|
+
"text": "A brief, compelling description that helps users understand what they can do here. Keep it short and focused on user benefits."
|
|
90
114
|
},
|
|
91
115
|
"getter": false,
|
|
92
116
|
"setter": false,
|
|
@@ -102,29 +126,36 @@ export class Header {
|
|
|
102
126
|
"references": {}
|
|
103
127
|
},
|
|
104
128
|
"required": false,
|
|
105
|
-
"optional":
|
|
129
|
+
"optional": true,
|
|
106
130
|
"docs": {
|
|
107
|
-
"tags": [
|
|
108
|
-
|
|
131
|
+
"tags": [{
|
|
132
|
+
"name": "default",
|
|
133
|
+
"text": "\"/\""
|
|
134
|
+
}],
|
|
135
|
+
"text": "The URL where the service name links to, typically the service homepage or main landing page."
|
|
109
136
|
},
|
|
110
137
|
"getter": false,
|
|
111
138
|
"setter": false,
|
|
112
|
-
"reflect": false
|
|
139
|
+
"reflect": false,
|
|
140
|
+
"defaultValue": "\"/\""
|
|
113
141
|
},
|
|
114
142
|
"theme": {
|
|
115
143
|
"type": "string",
|
|
116
144
|
"attribute": "theme",
|
|
117
145
|
"mutable": false,
|
|
118
146
|
"complexType": {
|
|
119
|
-
"original": "
|
|
120
|
-
"resolved": "
|
|
147
|
+
"original": "'light' | 'dark'",
|
|
148
|
+
"resolved": "\"dark\" | \"light\"",
|
|
121
149
|
"references": {}
|
|
122
150
|
},
|
|
123
151
|
"required": false,
|
|
124
152
|
"optional": false,
|
|
125
153
|
"docs": {
|
|
126
|
-
"tags": [
|
|
127
|
-
|
|
154
|
+
"tags": [{
|
|
155
|
+
"name": "default",
|
|
156
|
+
"text": "'light'"
|
|
157
|
+
}],
|
|
158
|
+
"text": "The visual theme of the header. Light theme uses blue logo, dark theme uses white logo."
|
|
128
159
|
},
|
|
129
160
|
"getter": false,
|
|
130
161
|
"setter": false,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pennlibs-header.js","sourceRoot":"","sources":["../../../src/components/pennlibs-header/pennlibs-header.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAEnE,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AACxC,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;
|
|
1
|
+
{"version":3,"file":"pennlibs-header.js","sourceRoot":"","sources":["../../../src/components/pennlibs-header/pennlibs-header.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Prop, h, State } from '@stencil/core';\n\nimport { LogoWhite } from \"./logo-white\"\nimport { LogoBlue } from \"./logo-blue\"\n\n/**\n * A header component for Penn Libraries websites that displays the Penn Libraries logo,\n * service branding, and navigation. Supports both light and dark themes.\n * \n * @component\n * @example\n * <pennlibs-header \n * service-name=\"Find Books\" \n * service-lede=\"Search our catalog and collections\"\n * theme=\"light\">\n * <a href=\"/search\">Search</a>\n * <a href=\"/help\">Help</a>\n * </pennlibs-header>\n * \n * @slot end - Content to display at the end of the header (right side)\n * \n * @prop --max-width: The maximum width of the header.\n */\n@Component({\n tag: 'pennlibs-header',\n styleUrl: 'pennlibs-header.css',\n shadow: true,\n assetsDirs: ['assets']\n})\nexport class Header {\n /**\n * The service name should clearly describe what users want to accomplish. Avoid technical jargon, technology names, and acronyms.\n */\n @Prop() serviceName?: string;\n\n /**\n * A brief, compelling description that helps users understand what they can do here. Keep it short and focused on user benefits.\n */\n @Prop() serviceLede?: string;\n\n /**\n * The URL where the service name links to, typically the service homepage or main landing page.\n * @default \"/\"\n */\n @Prop() serviceHref?: string = \"/\";\n\n /**\n * The visual theme of the header. Light theme uses blue logo, dark theme uses white logo.\n * @default 'light'\n */\n @Prop() theme: 'light' | 'dark' = 'light';\n\n @State() isMenuOpen: boolean = false;\n @State() navigation = [];\n\n @Element() hostElement: HTMLElement;\n\n componentWillLoad() {\n if (this.navigation.length === 0) {\n this.setNavigation();\n }\n }\n\n handleToggleMenu() {\n this.isMenuOpen = !this.isMenuOpen\n }\n\n setNavigation() {\n this.navigation = Array.from(this.hostElement.children).reduce((acc, element) => {\n if (element.hasAttribute('slot')) {\n return acc;\n }\n\n switch (element.tagName) {\n case 'A':\n case 'FORM':\n acc = acc.concat(element)\n default:\n break;\n }\n\n return acc;\n }, []);\n }\n\n renderMenuIcon() {\n return (\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" viewBox=\"0 -960 960 960\" width=\"24\"><path fill=\"currentColor\" d=\"M480-345 240-585l56-56 184 184 184-184 56 56-240 240Z\"/></svg>\n )\n }\n\n render() {\n return (\n <header class={`viewport-margins website-header ${this.theme === 'dark' && 'website-header--dark'}`}>\n <div class=\"website-header__inner-container\">\n <div class=\"website-header__logo-name-container\">\n <a href=\"https://www.library.upenn.edu/\" class=\"website-header_logo-link\" aria-label=\"Penn Libraries\">\n {this.theme === 'dark' ? <LogoWhite /> : <LogoBlue />}\n </a>\n {this.serviceName && (\n <a href=\"/\" class=\"website-header__service-link\">\n <span class=\"website-header__service-name\">{this.serviceName}</span>\n {this.serviceLede && <span class=\"website-header__service-lede\">{this.serviceLede}</span>}\n </a>\n )}\n </div>\n\n {this.navigation.length > 0 && (\n <nav class=\"website-header__navigation\">\n <button class=\"website-header__navigation-button\" aria-expanded={`${this.isMenuOpen}`} onClick={() => this.handleToggleMenu()}>\n {this.renderMenuIcon()} Menu\n </button>\n {this.navigation && (\n <ol class={`website-header__navigation-list ${this.isMenuOpen && 'website-header__navigation-list--visible'}`}>\n {this.navigation.map(element => <li innerHTML={element.outerHTML} />)}\n </ol>\n )}\n </nav>\n )}\n\n <slot name=\"end\" />\n </div>\n </header>\n );\n }\n}"]}
|
|
@@ -3,6 +3,13 @@ const getCurrentImageSource = (pictureElement) => {
|
|
|
3
3
|
const imgElement = pictureElement.querySelector('img');
|
|
4
4
|
return (imgElement === null || imgElement === void 0 ? void 0 : imgElement.currentSrc) || '';
|
|
5
5
|
};
|
|
6
|
+
/**
|
|
7
|
+
* Place your most important content in a prominent space, often at the top of your website.
|
|
8
|
+
*
|
|
9
|
+
* @slot start - Content to display at the start (top) of the hero.
|
|
10
|
+
*
|
|
11
|
+
* @prop --max-width: The maximum width of the hero inner content.
|
|
12
|
+
*/
|
|
6
13
|
export class Hero {
|
|
7
14
|
constructor() {
|
|
8
15
|
this.heroPictureElement = null;
|
|
@@ -43,7 +50,7 @@ export class Hero {
|
|
|
43
50
|
}
|
|
44
51
|
}
|
|
45
52
|
render() {
|
|
46
|
-
return (h("div", { key: '
|
|
53
|
+
return (h("div", { key: 'e7da72dc8de6e2039c4b1158fb41b5ca6279b01b', class: "hero", style: { backgroundImage: `url(${this.heroSrc})` } }, h("div", { key: '1a17497f3da0857c01c3bf0871312c9ebe350475', class: "hero__content" }, h("slot", { key: '4b3747eeec4170ce12f3ec7e8b575e611327f39b', name: "start" }), h("div", { key: 'f915238e4b2ad0ea221b51c51ccc19b36985be12', class: "hero__heading-container" }, this.heroHeadingElement && (h("div", { key: '71181c2ae063871138a3c8338305422b2e0c7315', class: "viewport-margins" }, h("h1", { key: 'c52fbf359e35d152441d2704d271b83c9999026a', class: "hero__heading", innerHTML: this.heroHeadingElement.innerText }), this.heroParagraphElement && h("p", { key: '7acf7c6aa459cd083a8101642b218888277ccadd', class: "hero__sub-heading", innerHTML: this.heroParagraphElement.innerHTML })))))));
|
|
47
54
|
}
|
|
48
55
|
static get is() { return "pennlibs-hero"; }
|
|
49
56
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pennlibs-hero.js","sourceRoot":"","sources":["../../../src/components/pennlibs-hero/pennlibs-hero.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAE7D,MAAM,qBAAqB,GAAG,CAAC,cAAkC,EAAU,EAAE;IAC3E,MAAM,UAAU,GAAG,cAAc,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IACvD,OAAO,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,UAAU,KAAI,EAAE,CAAC;AACtC,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"pennlibs-hero.js","sourceRoot":"","sources":["../../../src/components/pennlibs-hero/pennlibs-hero.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAE7D,MAAM,qBAAqB,GAAG,CAAC,cAAkC,EAAU,EAAE;IAC3E,MAAM,UAAU,GAAG,cAAc,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IACvD,OAAO,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,UAAU,KAAI,EAAE,CAAC;AACtC,CAAC,CAAC;AAEF;;;;;;GAMG;AAOH,MAAM,OAAO,IAAI;IANjB;QAQW,uBAAkB,GAA8B,IAAI,CAAC;QACrD,uBAAkB,GAA8B,IAAI,CAAC;QACrD,yBAAoB,GAAgC,IAAI,CAAC;QACzD,YAAO,GAAW,EAAE,CAAC;QACtB,YAAO,GAAW,EAAE,CAAC;KAyD9B;IAtDC,iBAAiB;QACf,MAAM,kBAAkB,GAAG,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,6BAA6B,CAAuB,CAAC;QAC/G,IAAI,kBAAkB,EAAE,CAAC;YACvB,IAAI,CAAC,kBAAkB,GAAG,kBAAkB,CAAC;YAC7C,IAAI,CAAC,uBAAuB,CAAC,kBAAkB,CAAC,CAAC;QACnD,CAAC;QAED,MAAM,kBAAkB,GAAG,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,kBAAkB,CAAuB,CAAC;QACpG,IAAI,kBAAkB,EAAE,CAAC;YACvB,IAAI,CAAC,kBAAkB,GAAG,kBAAkB,CAAC;QAC/C,CAAC;QAED,MAAM,oBAAoB,GAAG,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,qBAAqB,CAAyB,CAAC;QAC3G,IAAI,oBAAoB,EAAE,CAAC;YACzB,IAAI,CAAC,oBAAoB,GAAG,oBAAoB,CAAC;QACnD,CAAC;IACH,CAAC;IAEO,uBAAuB,CAAC,cAAkC;QAChE,MAAM,eAAe,GAAG,GAAG,EAAE;YAC3B,MAAM,UAAU,GAAG,qBAAqB,CAAC,cAAc,CAAC,CAAC;YACzD,IAAI,UAAU,KAAK,IAAI,CAAC,OAAO,EAAE,CAAC;gBAChC,IAAI,CAAC,OAAO,GAAG,UAAU,CAAC;gBAC1B,IAAI,CAAC,OAAO,GAAG,UAAU,CAAC;YAC5B,CAAC;YACD,IAAI,CAAC,gBAAgB,GAAG,qBAAqB,CAAC,eAAe,CAAC,CAAC;QACjE,CAAC,CAAC;QAEF,IAAI,CAAC,gBAAgB,GAAG,qBAAqB,CAAC,eAAe,CAAC,CAAC;IACjE,CAAC;IAED,oBAAoB;QAClB,IAAI,IAAI,CAAC,gBAAgB,EAAE,CAAC;YAC1B,oBAAoB,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;QAC9C,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAC,MAAM,EAAC,KAAK,EAAE,EAAE,eAAe,EAAE,OAAO,IAAI,CAAC,OAAO,GAAG,EAAE;YAClE,4DAAK,KAAK,EAAC,eAAe;gBACxB,6DAAM,IAAI,EAAC,OAAO,GAAG;gBACrB,4DAAK,KAAK,EAAC,yBAAyB,IACjC,IAAI,CAAC,kBAAkB,IAAI,CAC1B,4DAAK,KAAK,EAAC,kBAAkB;oBAC3B,2DAAI,KAAK,EAAC,eAAe,EAAC,SAAS,EAAE,IAAI,CAAC,kBAAkB,CAAC,SAAS,GAAI;oBACzE,IAAI,CAAC,oBAAoB,IAAI,0DAAG,KAAK,EAAC,mBAAmB,EAAC,SAAS,EAAE,IAAI,CAAC,oBAAoB,CAAC,SAAS,GAAI,CACzG,CACP,CACG,CACF,CACF,CACP,CAAA;IACH,CAAC;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { h, Component, State, Element } from \"@stencil/core\";\n\nconst getCurrentImageSource = (pictureElement: HTMLPictureElement): string => {\n const imgElement = pictureElement.querySelector('img');\n return imgElement?.currentSrc || '';\n};\n\n/**\n * Place your most important content in a prominent space, often at the top of your website.\n *\n * @slot start - Content to display at the start (top) of the hero.\n * \n * @prop --max-width: The maximum width of the hero inner content.\n */\n@Component({\n tag: 'pennlibs-hero',\n styleUrl: 'pennlibs-hero.css',\n shadow: true,\n assetsDirs: ['assets']\n})\nexport class Hero {\n @Element() hostElement: HTMLElement;\n @State() heroPictureElement: null | HTMLPictureElement = null;\n @State() heroHeadingElement: null | HTMLHeadingElement = null;\n @State() heroParagraphElement: null | HTMLParagraphElement = null;\n @State() heroSrc: string = \"\";\n private lastSrc: string = \"\";\n private animationFrameId: number;\n\n componentWillLoad() {\n const heroPictureElement = this.hostElement.querySelector('picture[hero=art-direction]') as HTMLPictureElement;\n if (heroPictureElement) {\n this.heroPictureElement = heroPictureElement;\n this.startWatchingCurrentSrc(heroPictureElement);\n }\n\n const heroHeadingElement = this.hostElement.querySelector('h1[hero=heading]') as HTMLHeadingElement;\n if (heroHeadingElement) {\n this.heroHeadingElement = heroHeadingElement;\n }\n\n const heroParagraphElement = this.hostElement.querySelector('p[hero=sub-heading]') as HTMLParagraphElement;\n if (heroParagraphElement) {\n this.heroParagraphElement = heroParagraphElement;\n }\n }\n\n private startWatchingCurrentSrc(pictureElement: HTMLPictureElement) {\n const checkCurrentSrc = () => {\n const currentSrc = getCurrentImageSource(pictureElement);\n if (currentSrc !== this.lastSrc) {\n this.lastSrc = currentSrc;\n this.heroSrc = currentSrc;\n }\n this.animationFrameId = requestAnimationFrame(checkCurrentSrc);\n };\n \n this.animationFrameId = requestAnimationFrame(checkCurrentSrc);\n }\n\n disconnectedCallback() {\n if (this.animationFrameId) {\n cancelAnimationFrame(this.animationFrameId);\n }\n }\n\n render() {\n return (\n <div class=\"hero\" style={{ backgroundImage: `url(${this.heroSrc})` }}>\n <div class=\"hero__content\">\n <slot name=\"start\" />\n <div class=\"hero__heading-container\">\n {this.heroHeadingElement && (\n <div class=\"viewport-margins\">\n <h1 class=\"hero__heading\" innerHTML={this.heroHeadingElement.innerText} />\n {this.heroParagraphElement && <p class=\"hero__sub-heading\" innerHTML={this.heroParagraphElement.innerHTML} />}\n </div>\n )}\n </div>\n </div>\n </div>\n )\n }\n}"]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, getAssetPath, h } from '@stencil/core/internal/client';
|
|
2
2
|
|
|
3
|
-
const pennlibsFooterCss = ":host {\n font-family: var(--font-family);\n font-size: var(--font-size);\n --max-width: 1080px;\n --padding-bottom: 5.75rem;\n}\n\n.website-footer-wrapper {\n background: var(--color-penn-blue);\n padding-bottom: var(--padding-bottom);\n}\n\n.viewport-margins {\n max-width: var(--max-width);\n margin: 0 auto;\n padding: 0 1em;\n}\n\n.website-footer {\n background-size: cover;\n color: var(--color-fg-subtle-on-emphasis);\n}\n\n.website-footer a {\n color: var(--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(14em, 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(--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(--link-text-underline-offset);\n}";
|
|
3
|
+
const pennlibsFooterCss = ":host {\n font-family: var(--font-family);\n font-size: var(--font-size);\n --max-width: 1080px;\n --padding-bottom: 5.75rem;\n}\n\n*, *::before, *::after {\n box-sizing: border-box;\n}\n\n.website-footer-wrapper {\n background: var(--color-penn-blue);\n padding-bottom: var(--padding-bottom);\n}\n\n.viewport-margins {\n max-width: var(--max-width);\n margin: 0 auto;\n padding: 0 1em;\n}\n\n.website-footer {\n background-size: cover;\n color: var(--color-fg-subtle-on-emphasis);\n}\n\n.website-footer a {\n color: var(--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(14em, 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(--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(--link-text-underline-offset);\n}";
|
|
4
4
|
|
|
5
5
|
const Footer = /*@__PURE__*/ proxyCustomElement(class Footer extends HTMLElement {
|
|
6
6
|
constructor() {
|
|
@@ -31,20 +31,17 @@ const Footer = /*@__PURE__*/ proxyCustomElement(class Footer extends HTMLElement
|
|
|
31
31
|
}
|
|
32
32
|
render() {
|
|
33
33
|
const footerBackgroundSrc = getAssetPath('./assets/footer-bg.webp');
|
|
34
|
-
return (h("div", { key: '
|
|
34
|
+
return (h("div", { key: '40bee22231ae7f79cf368a06b34fc479490d90e2', class: "website-footer-wrapper" }, h("footer", { key: '7ffcbb84fc096a1a3a19fdbaa999f031944df14b', class: "website-footer", style: {
|
|
35
35
|
background: `var(--color-penn-blue) url(${footerBackgroundSrc}) no-repeat 50% 50%`,
|
|
36
36
|
backgroundSize: 'cover',
|
|
37
|
-
} }, h("div", { key: '
|
|
37
|
+
} }, h("div", { key: 'ccb8cafc9f49d4796b158bd2bf0c2e4a81e7c301', class: "viewport-margins" }, h("div", { key: 'e3461be746bbf460422d24448bfdcd35d75f143e', class: "website-footer__content" }, h("div", { key: 'ceb536cf8d1e8cb4cbd008415e84367869fa319a', class: "website-footer__links-container" }, h("section", { key: 'a936c772c58f083f7cb4d03c4e2c9563412a029f' }, h("h2", { key: '8562595447974e570026a3295c6b8a4ea2eadcfc', class: "website-footer__heading" }, "Penn Libraries"), h("ul", { key: 'a49281bd1399c6713f2c2165b941585464e32653', class: "website-footer__links" }, h("li", { key: '3aaff28e4c8e15d97f5722850d4fe5a5b84ca7c7' }, h("a", { key: '9c46688197ae90029c46cfc40d84970a8f6a4956', href: "https://maps.google.com/?q=Van Pelt Library 3420 Walnut Street, Philadelphia, PA 19104-6206" }, "3420 Walnut Street", h("br", { key: '8fda816b66576fc26d6888dd101674af025042e6' }), "Philadelphia, PA 19104-6206")), h("li", { key: '18ac4042e695b00e1e6816a8108eb47b40097b17' }, h("a", { key: '2d1df64e1abbdfb5c852597c3c1fe5064d929780', href: "tel:(215) 898-7555" }, "(215) 898-7555")), h("li", { key: '50b7e0d1937695dd2d91d4888e72849e55bbc230' }, h("a", { key: 'e6e329346b6df142ec21c9454ce4beda59400064', href: "https://www.library.upenn.edu/contact-us" }, "Contact us")), h("li", { key: '95f0d1e8a6c5bf44931f33cae7acd4b1aad094bb' }, h("a", { key: '12782dc2f58ab2f0d438ca2b3136c2956821ad67', href: "https://www.library.upenn.edu/about/hours", target: "_blank" }, "Locations and hours")))), h("section", { key: 'c06ef6b6bdbeeb1399ae4fe997492b69724b905f' }, h("h2", { key: 'e669081302570c944677ace470a94adc2cca2c61', class: "website-footer__heading" }, "Stay in touch"), h("ul", { key: '73f90d530da56d6866425db3ca3512a77c34230f', class: "website-footer__links" }, h("li", { key: 'e2ae803e424a77f96c390e4175940dbcc16bf141' }, h("a", { key: 'f8b2f47e20efa037126c936065744509f586af16', href: "https://www.alumni.upenn.edu/libsignup" }, "Newsletter")), h("li", { key: '47728d60b3f7df3f5561c9d6366655bd572c3b1a' }, h("a", { key: 'be6191de186e4c7bc5a4600946d10fd5e3ac5051', href: "https://www.instagram.com/upennlib/" }, "Instagram")), h("li", { key: '5e195c6da1431647529831c64e8e29218aa5b629' }, h("a", { key: 'b452a29c023f2cf4e5ebe00e13029f6c25c5cb1d', href: "https://www.facebook.com/PennLibraries/" }, "Facebook")), h("li", { key: '0264616dde4c2fadc9de0a2dca75f8a424c2744e' }, h("a", { key: '969ba001ed12c911f1ab2f96666a68e6629c1e63', href: "https://www.linkedin.com/company/penn-libraries" }, "LinkedIn")))), this.navigationByChildren && [
|
|
38
38
|
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))))))))
|
|
39
|
-
],
|
|
40
|
-
this.navigation.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))))))))
|
|
41
|
-
]))), h("div", { key: '92ba07834ec5907ab47c59925d5d09d3dc7960df', class: "website-footer__footer" }, h("div", { key: 'f649f0dde206c92a41c10cb871137ccb725f2394', class: "viewport-margins" }, h("ul", { key: '82244f9c342acdcb9dd9ff0ae651c4b4cb2939e4', class: "website-footer__links website-footer__links--footer" }, h("li", { key: '44be5c6a8380af4482a97080df640c34b852a865' }, h("a", { key: '8eb4ffa492285f6a2f3f42df1b2b5a784f042332', href: "https://www.upenn.edu/" }, "UPenn")), h("li", { key: '658402f36047ba302a90521a57e414a995bc19f4' }, h("a", { key: 'a0f85214bea0883b03abd4a1afc8ef97a6eddf27', href: "https://www.upenn.edu/about/privacy-policy" }, "Privacy Policy")), h("li", { key: '0f43503a3c031967429ef9021457bafa3ec9325b' }, h("a", { key: '21b9c566ef1b8800b41a21ba70e4444128653b9c', href: "https://accessibility.web-resources.upenn.edu/get-help" }, "Report Accessibility Issues and Get Help")), h("li", { key: '92b1311cebfe09923505d0c9db17f2cc79bc8b09' }, h("a", { key: 'ed7ca974f5cea0841bb3946efc39cc6e13e8748f', href: "https://www.upenn.edu/about/disclaimer" }, "Disclaimer")), h("li", { key: 'effb3c2ef3eb3b8611bf8bf6cba2db907bde3d5d' }, h("a", { key: '1a6f73099f9311e189987988317dda7390dda6a5', href: "https://www.publicsafety.upenn.edu/contact/" }, "Emergency Services")), h("li", { key: '3b1f57c5073869e4a5f3f4fbd94b28bee437bc72' }, h("a", { key: '4e2ab4fd8a1fcf310a5b67a5a264b7dc5b2aed11', href: "https://www.upenn.edu/about/report-copyright-infringement" }, "Report Copyright Infringement"))))))));
|
|
39
|
+
]))), h("div", { key: 'b0f07d479fc29d673758d97a0f242397e9c434fd', class: "website-footer__footer" }, h("div", { key: '7b2201088c578e0c7dc54d26c0642bd2221efba0', class: "viewport-margins" }, h("ul", { key: '6ccf0109682bc0c63553ae4ce45076ecc06a1506', class: "website-footer__links website-footer__links--footer" }, h("li", { key: 'bd61ce924e4cd2e19665427743640c23d531335a' }, h("a", { key: '2326f72667de436ebee473e81c21c0d478306b7c', href: "https://www.upenn.edu/" }, "UPenn")), h("li", { key: 'e0be39fea786c611f61d6215901b887c773489fc' }, h("a", { key: '10e1a39069f966ba3a1894352f93adf0bd05e184', href: "https://www.upenn.edu/about/privacy-policy" }, "Privacy Policy")), h("li", { key: 'be0fe00a2614d2eb1179d63e223f0cacefd7d640' }, h("a", { key: 'a45dcae52ba1c8389408f998a20547fe27e9ff04', href: "https://accessibility.web-resources.upenn.edu/get-help" }, "Report Accessibility Issues and Get Help")), h("li", { key: 'f00048be9bd71c503dd0b29d7dd1841f34dfa7d1' }, h("a", { key: '3d5cc82cb2ddb4fa61eabe92f3c9f8a0e3263d3a', href: "https://www.upenn.edu/about/disclaimer" }, "Disclaimer")), h("li", { key: '75d566a8e7e17b5102dd697a5ac2d2bdf3189586' }, h("a", { key: '143c075d181701e9f1a90be037f9888b0fad153a', href: "https://www.publicsafety.upenn.edu/contact/" }, "Emergency Services")), h("li", { key: '08d8bceb70f47a13dcdb33c8be43de26491379d8' }, h("a", { key: '6451e811d74f807cef2d3009bcc99117109118c3', href: "https://www.upenn.edu/about/report-copyright-infringement" }, "Report Copyright Infringement"))))))));
|
|
42
40
|
}
|
|
43
41
|
static get assetsDirs() { return ["assets"]; }
|
|
44
42
|
get hostElement() { return this; }
|
|
45
43
|
static get style() { return pennlibsFooterCss; }
|
|
46
44
|
}, [1, "pennlibs-footer", {
|
|
47
|
-
"navigation": [16],
|
|
48
45
|
"navigationByChildren": [32]
|
|
49
46
|
}]);
|
|
50
47
|
function defineCustomElement$1() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"pennlibs-footer.js","mappings":"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","names":["__stencil_proxyCustomElement"],"sources":["src/components/pennlibs-footer/pennlibs-footer.css?tag=pennlibs-footer&encapsulation=shadow","src/components/pennlibs-footer/pennlibs-footer.tsx"],"sourcesContent":[":host {\n font-family: var(--font-family);\n font-size: var(--font-size);\n --max-width: 1080px;\n --padding-bottom: 5.75rem;\n}\n\n.website-footer-wrapper {\n background: var(--color-penn-blue);\n padding-bottom: var(--padding-bottom);\n}\n\n.viewport-margins {\n max-width: var(--max-width);\n margin: 0 auto;\n padding: 0 1em;\n}\n\n.website-footer {\n background-size: cover;\n color: var(--color-fg-subtle-on-emphasis);\n}\n\n.website-footer a {\n color: var(--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(14em, 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(--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(--link-text-underline-offset);\n}","import { Component, Element, h, Prop, getAssetPath, State } from '@stencil/core';\n\n@Component({\n tag: 'pennlibs-footer',\n styleUrl: 'pennlibs-footer.css',\n shadow: true,\n assetsDirs: ['assets']\n})\nexport class Footer {\n /**\n * The navigation sections.\n */\n @Prop() navigation: Array<{\n heading: string;\n links: Array<{\n label: string;\n href: string;\n }>;\n }>;\n\n @State() navigationByChildren;\n\n @Element() hostElement: HTMLElement;\n\n componentWillLoad() {\n this.setNavigationByChildren();\n }\n\n setNavigationByChildren() {\n try {\n if (this.hostElement.children) {\n this.navigationByChildren = Array.from(this.hostElement.children).reduce(\n (acc, element) => {\n acc = acc.concat({\n heading: element.querySelector('h2').innerText,\n links: Array.from(element.querySelectorAll('a')).map(link => {\n return { label: link.innerText, href: link.href }\n })\n })\n \n return acc;\n }, []);\n }\n } catch {\n console.warn('<pennlibs-footer> Composed with unexpected HTML', this.hostElement.children)\n }\n }\n\n render() {\n const footerBackgroundSrc = getAssetPath('./assets/footer-bg.webp');\n \n return (\n <div class=\"website-footer-wrapper\">\n <footer class=\"website-footer\" style={{\n background: `var(--color-penn-blue) url(${footerBackgroundSrc}) no-repeat 50% 50%`,\n backgroundSize: 'cover',\n }}>\n <div class=\"viewport-margins\">\n <div class=\"website-footer__content\">\n <div class=\"website-footer__links-container\">\n <section>\n <h2 class=\"website-footer__heading\">Penn Libraries</h2>\n <ul class=\"website-footer__links\">\n <li><a href=\"https://maps.google.com/?q=Van Pelt Library 3420 Walnut Street, Philadelphia, PA 19104-6206\">3420 Walnut Street<br />Philadelphia, PA 19104-6206</a></li>\n <li><a href=\"tel:(215) 898-7555\">(215) 898-7555</a></li>\n <li><a href=\"https://www.library.upenn.edu/contact-us\">Contact us</a></li>\n <li><a href=\"https://www.library.upenn.edu/about/hours\" target=\"_blank\">Locations and hours</a></li>\n </ul>\n </section>\n <section>\n <h2 class=\"website-footer__heading\">Stay in touch</h2>\n <ul class=\"website-footer__links\">\n <li><a href=\"https://www.alumni.upenn.edu/libsignup\">Newsletter</a></li>\n <li><a href=\"https://www.instagram.com/upennlib/\">Instagram</a></li>\n <li><a href=\"https://www.facebook.com/PennLibraries/\">Facebook</a></li>\n <li><a href=\"https://www.linkedin.com/company/penn-libraries\">LinkedIn</a></li>\n </ul>\n </section>\n {this.navigationByChildren && [\n this.navigationByChildren.map(section => (\n <section>\n <h2 class=\"website-footer__heading\">{section.heading}</h2>\n <ul class=\"website-footer__links\">\n {section.links.map(link => (\n <li><a href={link.href}>{link.label}</a></li>\n ))}\n </ul>\n </section>\n ))\n ]}\n {this.navigation && [\n this.navigation.map(section => (\n <section>\n <h2 class=\"website-footer__heading\">{section.heading}</h2>\n <ul class=\"website-footer__links\">\n {section.links.map(link => (\n <li><a href={link.href}>{link.label}</a></li>\n ))}\n </ul>\n </section>\n ))\n ]}\n </div>\n </div>\n </div>\n <div class=\"website-footer__footer\">\n <div class=\"viewport-margins\"> \n <ul class=\"website-footer__links website-footer__links--footer\">\n <li><a href=\"https://www.upenn.edu/\">UPenn</a></li>\n <li><a href=\"https://www.upenn.edu/about/privacy-policy\">Privacy Policy</a></li>\n <li><a href=\"https://accessibility.web-resources.upenn.edu/get-help\">Report Accessibility Issues and Get Help</a></li>\n <li><a href=\"https://www.upenn.edu/about/disclaimer\">Disclaimer</a></li>\n <li><a href=\"https://www.publicsafety.upenn.edu/contact/\">Emergency Services</a></li>\n <li><a href=\"https://www.upenn.edu/about/report-copyright-infringement\">Report Copyright Infringement</a></li>\n </ul>\n </div>\n </div>\n </footer>\n </div>\n );\n }\n}\n"],"version":3}
|
|
1
|
+
{"file":"pennlibs-footer.js","mappings":"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","names":["__stencil_proxyCustomElement"],"sources":["src/components/pennlibs-footer/pennlibs-footer.css?tag=pennlibs-footer&encapsulation=shadow","src/components/pennlibs-footer/pennlibs-footer.tsx"],"sourcesContent":[":host {\n font-family: var(--font-family);\n font-size: var(--font-size);\n --max-width: 1080px;\n --padding-bottom: 5.75rem;\n}\n\n*, *::before, *::after {\n box-sizing: border-box;\n}\n\n.website-footer-wrapper {\n background: var(--color-penn-blue);\n padding-bottom: var(--padding-bottom);\n}\n\n.viewport-margins {\n max-width: var(--max-width);\n margin: 0 auto;\n padding: 0 1em;\n}\n\n.website-footer {\n background-size: cover;\n color: var(--color-fg-subtle-on-emphasis);\n}\n\n.website-footer a {\n color: var(--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(14em, 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(--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(--link-text-underline-offset);\n}","import { Component, Element, h, getAssetPath, State } from '@stencil/core';\n\n@Component({\n tag: 'pennlibs-footer',\n styleUrl: 'pennlibs-footer.css',\n shadow: true,\n assetsDirs: ['assets']\n})\nexport class Footer {\n @State() navigationByChildren;\n\n @Element() hostElement: HTMLElement;\n\n componentWillLoad() {\n this.setNavigationByChildren();\n }\n\n setNavigationByChildren() {\n try {\n if (this.hostElement.children) {\n this.navigationByChildren = Array.from(this.hostElement.children).reduce(\n (acc, element) => {\n acc = acc.concat({\n heading: element.querySelector('h2').innerText,\n links: Array.from(element.querySelectorAll('a')).map(link => {\n return { label: link.innerText, href: link.href }\n })\n })\n \n return acc;\n }, []);\n }\n } catch {\n console.warn('<pennlibs-footer> Composed with unexpected HTML', this.hostElement.children)\n }\n }\n\n render() {\n const footerBackgroundSrc = getAssetPath('./assets/footer-bg.webp');\n \n return (\n <div class=\"website-footer-wrapper\">\n <footer class=\"website-footer\" style={{\n background: `var(--color-penn-blue) url(${footerBackgroundSrc}) no-repeat 50% 50%`,\n backgroundSize: 'cover',\n }}>\n <div class=\"viewport-margins\">\n <div class=\"website-footer__content\">\n <div class=\"website-footer__links-container\">\n <section>\n <h2 class=\"website-footer__heading\">Penn Libraries</h2>\n <ul class=\"website-footer__links\">\n <li><a href=\"https://maps.google.com/?q=Van Pelt Library 3420 Walnut Street, Philadelphia, PA 19104-6206\">3420 Walnut Street<br />Philadelphia, PA 19104-6206</a></li>\n <li><a href=\"tel:(215) 898-7555\">(215) 898-7555</a></li>\n <li><a href=\"https://www.library.upenn.edu/contact-us\">Contact us</a></li>\n <li><a href=\"https://www.library.upenn.edu/about/hours\" target=\"_blank\">Locations and hours</a></li>\n </ul>\n </section>\n <section>\n <h2 class=\"website-footer__heading\">Stay in touch</h2>\n <ul class=\"website-footer__links\">\n <li><a href=\"https://www.alumni.upenn.edu/libsignup\">Newsletter</a></li>\n <li><a href=\"https://www.instagram.com/upennlib/\">Instagram</a></li>\n <li><a href=\"https://www.facebook.com/PennLibraries/\">Facebook</a></li>\n <li><a href=\"https://www.linkedin.com/company/penn-libraries\">LinkedIn</a></li>\n </ul>\n </section>\n {this.navigationByChildren && [\n this.navigationByChildren.map(section => (\n <section>\n <h2 class=\"website-footer__heading\">{section.heading}</h2>\n <ul class=\"website-footer__links\">\n {section.links.map(link => (\n <li><a href={link.href}>{link.label}</a></li>\n ))}\n </ul>\n </section>\n ))\n ]}\n </div>\n </div>\n </div>\n <div class=\"website-footer__footer\">\n <div class=\"viewport-margins\"> \n <ul class=\"website-footer__links website-footer__links--footer\">\n <li><a href=\"https://www.upenn.edu/\">UPenn</a></li>\n <li><a href=\"https://www.upenn.edu/about/privacy-policy\">Privacy Policy</a></li>\n <li><a href=\"https://accessibility.web-resources.upenn.edu/get-help\">Report Accessibility Issues and Get Help</a></li>\n <li><a href=\"https://www.upenn.edu/about/disclaimer\">Disclaimer</a></li>\n <li><a href=\"https://www.publicsafety.upenn.edu/contact/\">Emergency Services</a></li>\n <li><a href=\"https://www.upenn.edu/about/report-copyright-infringement\">Report Copyright Infringement</a></li>\n </ul>\n </div>\n </div>\n </footer>\n </div>\n );\n }\n}\n"],"version":3}
|