@penn-libraries/web 0.0.5 → 0.0.7

package/dist/web/web.css

@@ -1 +1,142 @@
-@import url('https://fonts.googleapis.com/css2?family=Hind+Madurai:wght@300;400;500;600;700&display=swap'); :root{--color-penn-red:#990000;--color-penn-blue:#011F5B;--color-default:#2D3545;--color-muted:#595F6A;--color-on-emphasis:#fff;--color-subtle:#F2F3F5;--color-accent:#1B5993;--color-success:#288441;--color-attention:#9F6127;--color-danger:#BE0000;--color-done:#288441;--color-closed:#BE0000;--color-done:#7707AC;--color-accent-light:#eef5fc;--color-success-light:#eaf9ee;--color-attention-light:#faf2eb;--color-danger-light:#ffe5e5;--color-done-light:#eaf9ee;--color-closed-light:#ffe5e5;--color-done-light:#f9effe}html{--font-family:'Hind Madurai', sans-serif;--font-size:16px;--font-serif:'Cormorant Garamond', serif;--color-fg-default:var(--color-default);--color-fg-muted:var(--color-muted);--color-fg-on-emphasis:var(--color-on-emphasis);--color-fg-accent:var(--color-accent);--color-fg-success:var(--color-success);--color-fg-attention:var(--color-attention);--color-fg-danger:var(--color-danger);--color-fg-done:var(--color-success);--color-fg-closed:var(--color-danger);--color-fg-done:var(--color-done);--color-bg-default:var(--color-on-emphasis);--color-bg-subtle:var(--color-subtle);--color-bg-accent:var(--color-accent-light);--color-bg-success:var(--color-success-light);--color-bg-attention:var(--color-attention-light);--color-bg-danger:var(--color-danger-light);--color-bg-done:var(--color-success-light);--color-bg-closed:var(--color-danger-light);--color-bg-done:var(--color-done-light);--color-bg-accent-emphasis:var(--color-accent);--color-bg-success-emphasis:var(--color-success);--color-bg-attention-emphasis:var(--color-attention);--color-bg-danger-emphasis:var(--color-danger);--color-bg-done-emphasis:var(--color-success);--color-bg-closed-emphasis:var(--color-danger);--color-bg-done-emphasis:var(--color-done);--color-bg-gradient-1:linear-gradient(45deg, rgba(200, 219, 232, 0.8), rgba(239, 210, 215, 0.8));--color-bg-gradient-2:linear-gradient(45deg, #dbe9f5, #feefdf)}pennlibs-header:not(.hydrated){min-height:110.84px}
+@import url("https://use.typekit.net/gbh8cmg.css");
+
+:root {
+  --color-penn-red: #990000;
+  --color-penn-blue: #011F5B;
+
+  --color-white: #ffffff;
+  
+/*
+  Shades of lighter and darker are made with the
+  following tool:
+  https://noeldelgado.github.io/shadowlord/#3479be
+
+  The base colors is mainly from Brand Guidelines 5/2023,
+  but may be adjusted to be near 5:1 ratio contrast with
+  on a white background to be accessible.
+
+  Color range is from 1 to 9 and the tint percentage is:
+  - Lightness: 95%, 90%, 80%, 40%, 0%
+  - Darkness: 15%, 50%, 75%, 82.5%
+*/
+
+  --color-blue-1: #f5f8fc;
+  --color-blue-2: #ebf2f9;
+  --color-blue-3: #d6e4f2;
+  --color-blue-4: #85afd8;
+  --color-blue-5: #3479be;
+  --color-blue-6: #275b8f;
+  --color-blue-7: #1a3d5f;
+  --color-blue-8: #0d1e30;
+  --color-blue-9: #091521;
+
+  --color-orange-1: #fff6ee;
+  --color-orange-2: #fee9d5;
+  --color-orange-3: #fcca99;
+  --color-orange-4: #faa755;
+  --color-orange-5: #9c6835;
+  --color-orange-6: #7d542b;
+  --color-orange-7: #583a1e;
+  --color-orange-8: #3f2a15;
+  --color-orange-9: #191108;
+
+  --color-green-1: #f8fbf0;
+  --color-green-2: #f3f8e5;
+  --color-green-3: #ddecb5;
+  --color-green-4: #bbd86b;
+  --color-green-5: #67773b;
+  --color-green-6: #586532;
+  --color-green-7: #343c1e;
+  --color-green-8: #1a1e0f;
+  --color-green-9: #12150a;
+
+  --color-purple-1: #faf6f9;
+  --color-purple-2: #f6eef4;
+  --color-purple-3: #ecdce8;
+  --color-purple-4: #c797ba;
+  --color-purple-5: #a1528c;
+  --color-purple-6: #894677;
+  --color-purple-7: #512946;
+  --color-purple-8: #281523;
+  --color-purple-9: #1c0e19;
+
+  --color-gray-1: #f7f7f7;
+  --color-gray-2: #efeff0;
+  --color-gray-3: #dfe0e1;
+  --color-gray-4: #9fa1a4;
+  --color-gray-5: #5f6268;
+  --color-gray-6: #515358;
+  --color-gray-7: #303134;
+  --color-gray-8: #18191a;
+  --color-gray-9: #111112;
+
+  --color-bg-gradient-1: linear-gradient(45deg, rgba(200, 219, 232, 0.8), rgba(239, 210, 215, 0.8));
+  --color-bg-gradient-2: linear-gradient(45deg, #dbe9f5, #feefdf);
+
+  --font-family: "proxima-nova", sans-serif;
+  --font-size: 16px;
+  --font-serif: 'Cormorant Garamond', serif;
+}
+
+html {
+  /* Foundation Colors */
+  --color-default: var(--color-gray-7);
+  --color-muted: var(--color-gray-5);
+  --color-on-emphasis: var(--color-white);
+  --color-subtle: var(--color-gray-2);
+
+  /* Role Colors */
+  --color-accent: var(--color-blue-6);
+  --color-success: var(--color-green-5);
+  --color-attention: var(--color-orange-5);
+  --color-danger: var(--color-orange-5);
+  --color-done: var(--color-green-5);
+  --color-closed: var(--color-orange-5);
+  --color-done: var(--color-purple-5);
+  
+  /* Role Colors */
+  --color-accent-light: var(--color-blue-2);
+  --color-success-light: var(--color-green-2);
+  --color-attention-light: var(--color-orange-2);
+  --color-danger-light: var(--color-orange-2);
+  --color-done-light: var(--color-green-2);
+  --color-closed-light: var(--color-orange-2);
+  --color-done-light: var(--color-purple-2);
+}
+
+body {
+  --color-fg-default: var(--color-default);
+  --color-fg-muted: var(--color-muted);
+  --color-fg-on-emphasis: var(--color-on-emphasis);
+
+  --color-fg-accent: var(--color-accent);
+  --color-fg-success: var(--color-success);
+  --color-fg-attention: var(--color-attention);
+  --color-fg-danger: var(--color-danger);
+  --color-fg-done: var(--color-success);
+  --color-fg-closed: var(--color-danger);
+  --color-fg-done: var(--color-done);
+
+  --color-bg-default: var(--color-on-emphasis); /* What is a good role name here? */
+  --color-bg-subtle: var(--color-subtle);
+
+  --color-bg-accent: var(--color-accent-light);
+  --color-bg-success: var(--color-success-light);
+  --color-bg-attention: var(--color-attention-light);
+  --color-bg-danger: var(--color-danger-light);
+  --color-bg-done: var(--color-success-light);
+  --color-bg-closed: var(--color-danger-light);
+  --color-bg-done: var(--color-done-light);
+
+  --color-bg-accent-emphasis: var(--color-accent);
+  --color-bg-success-emphasis: var(--color-success);
+  --color-bg-attention-emphasis: var(--color-attention);
+  --color-bg-danger-emphasis: var(--color-danger);
+  --color-bg-done-emphasis: var(--color-success);
+  --color-bg-closed-emphasis: var(--color-danger);
+  --color-bg-done-emphasis: var(--color-done);
+}
+
+pennlibs-header:not(.hydrated) {
+  min-height: 110.84px;
+}

package/dist/web/web.esm.js

@@ -1,2 +1,20 @@
-import{p as e,b as n}from"./p-7caf2266.js";export{s as setNonce}from"./p-7caf2266.js";const i=()=>{const n=import.meta.url;const s={};if(n!==""){s.resourcesUrl=new URL(".",n).href}return e(s)};i().then((e=>n([["p-b75e12be",[[1,"pennlibs-header",{serviceName:[1,"service-name"],serviceLede:[1,"service-lede"],serviceHref:[1,"service-href"],navigation:[16],isMenuVisible:[32]},[[2,"click","handleToggleMenu"]]],[1,"pennlibs-footer",{navigation:[16]}],[1,"pennlibs-banner"]]]],e)));
+import { p as promiseResolve, b as bootstrapLazy } from './p-d9c828d7.js';
+export { s as setNonce } from './p-d9c828d7.js';
+
+/*
+ Stencil Client Patch Browser v4.7.1 | MIT Licensed | https://stenciljs.com
+ */
+const patchBrowser = () => {
+    const importMeta = import.meta.url;
+    const opts = {};
+    if (importMeta !== '') {
+        opts.resourcesUrl = new URL('.', importMeta).href;
+    }
+    return promiseResolve(opts);
+};
+
+patchBrowser().then(options => {
+  return bootstrapLazy([["p-d85c4348",[[1,"pennlibs-header",{"serviceName":[1,"service-name"],"serviceLede":[1,"service-lede"],"serviceHref":[1,"service-href"],"isMenuVisible":[32],"links":[32]},[[2,"click","handleToggleMenu"]]],[1,"pennlibs-footer",{"navigation":[16]}],[1,"pennlibs-banner"]]]], options);
+});
+
 //# sourceMappingURL=web.esm.js.map

package/dist/web/web.esm.js.map

@@ -1 +1 @@
-{"version":3,"names":["patchBrowser","importMeta","url","opts","resourcesUrl","URL","href","promiseResolve","then","options","bootstrapLazy","serviceName","serviceLede","serviceHref","navigation","isMenuVisible"],"sources":["node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.7.1 | MIT Licensed | https://stenciljs.com\n */\nimport { BUILD, NAMESPACE } from '@stencil/core/internal/app-data';\nimport { consoleDevInfo, doc, promiseResolve, H } from '@stencil/core';\nconst patchBrowser = () => {\n    // NOTE!! This fn cannot use async/await!\n    if (BUILD.isDev && !BUILD.isTesting) {\n        consoleDevInfo('Running in development mode.');\n    }\n    if (BUILD.cloneNodeFix) {\n        // opted-in to polyfill cloneNode() for slot polyfilled components\n        patchCloneNodeFix(H.prototype);\n    }\n    const scriptElm = BUILD.scriptDataOpts\n        ? Array.from(doc.querySelectorAll('script')).find((s) => new RegExp(`\\/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) ||\n            s.getAttribute('data-stencil-namespace') === NAMESPACE)\n        : null;\n    const importMeta = import.meta.url;\n    const opts = BUILD.scriptDataOpts ? (scriptElm || {})['data-opts'] || {} : {};\n    if (importMeta !== '') {\n        opts.resourcesUrl = new URL('.', importMeta).href;\n    }\n    return promiseResolve(opts);\n};\nconst patchCloneNodeFix = (HTMLElementPrototype) => {\n    const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n    HTMLElementPrototype.cloneNode = function (deep) {\n        if (this.nodeName === 'TEMPLATE') {\n            return nativeCloneNodeFn.call(this, deep);\n        }\n        const clonedNode = nativeCloneNodeFn.call(this, false);\n        const srcChildNodes = this.childNodes;\n        if (deep) {\n            for (let i = 0; i < srcChildNodes.length; i++) {\n                // Node.ATTRIBUTE_NODE === 2, and checking because IE11\n                if (srcChildNodes[i].nodeType !== 2) {\n                    clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n                }\n            }\n        }\n        return clonedNode;\n    };\n};\nexport { patchBrowser };\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(options => {\n  globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"mappings":"sFAKA,MAAMA,EAAe,KAajB,MAAMC,cAAyBC,IAC/B,MAAMC,EAAqE,GAC3E,GAAIF,IAAe,GAAI,CACnBE,EAAKC,aAAe,IAAIC,IAAI,IAAKJ,GAAYK,IACrD,CACI,OAAOC,EAAeJ,EAAK,ECnB/BH,IAAeQ,MAAKC,GAEXC,EAAc,qCAAqC,CAACC,YAAC,mBAAAC,YAAA,mBAAAC,YAAA,mBAAAC,WAAA,KAAAC,cAAA,8DAAAD,WAAA,gCAAAL"}
+{"file":"web.esm.js","mappings":";;;AAAA;AACA;AACA;AAGA,MAAM,YAAY,GAAG,MAAM;AAa3B,IAAI,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC;AACvC,IAAI,MAAM,IAAI,GAAiE,EAAE,CAAC;AAClF,IAAI,IAAI,UAAU,KAAK,EAAE,EAAE;AAC3B,QAAQ,IAAI,CAAC,YAAY,GAAG,IAAI,GAAG,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,IAAI,CAAC;AAC1D,KAAK;AACL,IAAI,OAAO,cAAc,CAAC,IAAI,CAAC,CAAC;AAChC,CAAC;;ACpBD,YAAY,EAAE,CAAC,IAAI,CAAC,OAAO,IAAI;AAE/B,EAAE,OAAO,aAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC,CAAC;AAC9D,CAAC,CAAC","names":[],"sources":["node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.7.1 | MIT Licensed | https://stenciljs.com\n */\nimport { BUILD, NAMESPACE } from '@stencil/core/internal/app-data';\nimport { consoleDevInfo, doc, promiseResolve, H } from '@stencil/core';\nconst patchBrowser = () => {\n    // NOTE!! This fn cannot use async/await!\n    if (BUILD.isDev && !BUILD.isTesting) {\n        consoleDevInfo('Running in development mode.');\n    }\n    if (BUILD.cloneNodeFix) {\n        // opted-in to polyfill cloneNode() for slot polyfilled components\n        patchCloneNodeFix(H.prototype);\n    }\n    const scriptElm = BUILD.scriptDataOpts\n        ? Array.from(doc.querySelectorAll('script')).find((s) => new RegExp(`\\/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) ||\n            s.getAttribute('data-stencil-namespace') === NAMESPACE)\n        : null;\n    const importMeta = import.meta.url;\n    const opts = BUILD.scriptDataOpts ? (scriptElm || {})['data-opts'] || {} : {};\n    if (importMeta !== '') {\n        opts.resourcesUrl = new URL('.', importMeta).href;\n    }\n    return promiseResolve(opts);\n};\nconst patchCloneNodeFix = (HTMLElementPrototype) => {\n    const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n    HTMLElementPrototype.cloneNode = function (deep) {\n        if (this.nodeName === 'TEMPLATE') {\n            return nativeCloneNodeFn.call(this, deep);\n        }\n        const clonedNode = nativeCloneNodeFn.call(this, false);\n        const srcChildNodes = this.childNodes;\n        if (deep) {\n            for (let i = 0; i < srcChildNodes.length; i++) {\n                // Node.ATTRIBUTE_NODE === 2, and checking because IE11\n                if (srcChildNodes[i].nodeType !== 2) {\n                    clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n                }\n            }\n        }\n        return clonedNode;\n    };\n};\nexport { patchBrowser };\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(options => {\n  globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"version":3}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@penn-libraries/web",
-  "version": "0.0.5",
+  "version": "0.0.7",
   "description": "University of Pennsylvania Libraries web components and assets.",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",