@myuw-web-components/myuw-app-styles - npm Package Compare versions

Comparing version 1.1.6 to 1.2.0

dist/myuw-app-styles.js

@@ -19,3 +19,3 @@ (function () {
 
-	var defaultAppThemeTpl = "<style> :root {\n  /* Main MyUW Theme Variables */\n\n  --myuw-primary-bg: #c5050c;\n  --myuw-primary-color: #fff;\n\n  --myuw-accent-bg: #0479a8;\n  --myuw-accent-color: #fff;\n\n  --myuw-page-bg: #f7f7f7;\n  --myuw-page-color: #494949;\n\n  --myuw-dark: #646569;\n  --myuw-darker: #282728;\n\n  --myuw-font: 'Roboto', Arial, sans-serif;\n  --myuw-app-bar-font: 'Verlag', 'Helvetica Neue', Helvetica, Arial, sans-serif;\n\n}\n\n/* Duplicate :host styles for search to allow polyfills to work */\nmyuw-search {\n  display: flex;\n  flex: auto;\n} </style> ";
+	var defaultAppThemeTpl = "<style> :root {\n  /* Main MyUW Theme Variables */\n\n  --myuw-primary-bg: #c5050c;\n  --myuw-primary-color: #fff;\n\n  --myuw-accent-bg: #0479a8;\n  --myuw-accent-color: #fff;\n\n  --myuw-page-bg: #f7f7f7;\n  --myuw-page-color: #494949;\n\n  --myuw-dark: #646569;\n  --myuw-darker: #282728;\n\n  --myuw-font: 'Roboto', Arial, sans-serif;\n  --myuw-app-bar-font: 'Verlag', 'Helvetica Neue', Helvetica, Arial, sans-serif;\n\n  --myuw-link-color: #0479a8;\n\n  /* Profile/navigation menu item color */\n  --myuw-menu-color: rgba(0,0,0,0.87);\n\n}\n\n/* Duplicate :host styles for search to allow polyfills to work */\nmyuw-search {\n  display: flex;\n  flex: auto;\n  border: var(--myuw-search-border, none);\n  border-radius: 5px;\n}\n\n/* White theme variables */\nbody.uw-madison-white-theme {\n  --myuw-primary-bg: #fff;\n  --myuw-primary-color: #c5050c;\n\n  --myuw-accent-bg: #fff;\n  --myuw-accent-color: #0479a8;\n\n  --myuw-search-border: 1px solid rgba(0,0,0,0.5);\n} </style> ";
 
@@ -22,0 +22,0 @@ var fontsTpl = "<link href=\"https://fonts.googleapis.com/css?family=Roboto:400,500,700\" rel=\"stylesheet\"> <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons\" rel=\"stylesheet\"> ";

dist/myuw-app-styles.min.js

@@ -1,1 +0,1 @@
-!(function(){"use strict";var e,t=((function(e){!(function(){function t(e,t){document.addEventListener?e.addEventListener("scroll",t,!1):e.attachEvent("scroll",t)}function n(e){this.a=document.createElement("div"),this.a.setAttribute("aria-hidden","true"),this.a.appendChild(document.createTextNode(e)),this.b=document.createElement("span"),this.c=document.createElement("span"),this.h=document.createElement("span"),this.f=document.createElement("span"),this.g=-1,this.b.style.cssText="max-width:none;display:inline-block;position:absolute;height:100%;width:100%;overflow:scroll;font-size:16px;",this.c.style.cssText="max-width:none;display:inline-block;position:absolute;height:100%;width:100%;overflow:scroll;font-size:16px;",this.f.style.cssText="max-width:none;display:inline-block;position:absolute;height:100%;width:100%;overflow:scroll;font-size:16px;",this.h.style.cssText="display:inline-block;width:200%;height:200%;font-size:16px;max-width:none;",this.b.appendChild(this.h),this.c.appendChild(this.f),this.a.appendChild(this.b),this.a.appendChild(this.c)}function o(e,t){e.a.style.cssText="max-width:none;min-width:20px;min-height:20px;display:inline-block;overflow:hidden;position:absolute;width:auto;margin:0;padding:0;top:-999px;white-space:nowrap;font-synthesis:none;font:"+t+";"}function i(e){var t=e.a.offsetWidth,n=t+100;return e.f.style.width=n+"px",e.c.scrollLeft=n,e.b.scrollLeft=e.b.scrollWidth+100,e.g!==t&&(e.g=t,!0)}function a(e,n){function o(){var e=a;i(e)&&e.a.parentNode&&n(e.g)}var a=e;t(e.b,o),t(e.c,o),i(e)}function s(e,t){var n=t||{};this.family=e,this.style=n.style||"normal",this.weight=n.weight||"normal",this.stretch=n.stretch||"normal"}var l=null,r=null,c=null,d=null;function u(){return null===d&&(d=!!document.fonts),d}function f(e,t){return[e.style,e.weight,(function(){if(null===c){var e=document.createElement("div");try{e.style.font="condensed 100px sans-serif"}catch(e){}c=""!==e.style.font}return c})()?e.stretch:"","100px",t].join(" ")}s.prototype.load=function(e,t){var i=this,s=e||"BESbswy",c=0,d=t||3e3,h=(new Date).getTime();return new Promise(function(e,t){if(u()&&!(function(){if(null===r)if(u()&&/Apple/.test(window.navigator.vendor)){var e=/AppleWebKit\/([0-9]+)(?:\.([0-9]+))(?:\.([0-9]+))/.exec(window.navigator.userAgent);r=!!e&&603>parseInt(e[1],10)}else r=!1;return r})()){var m=new Promise(function(e,t){!(function n(){(new Date).getTime()-h>=d?t():document.fonts.load(f(i,'"'+i.family+'"'),s).then(function(t){1<=t.length?e():setTimeout(n,25)},function(){t()})})()}),p=new Promise(function(e,t){c=setTimeout(t,d)});Promise.race([p,m]).then(function(){clearTimeout(c),e(i)},function(){t(i)})}else!(function(e){document.body?e():document.addEventListener?document.addEventListener("DOMContentLoaded",function t(){document.removeEventListener("DOMContentLoaded",t),e()}):document.attachEvent("onreadystatechange",function t(){"interactive"!=document.readyState&&"complete"!=document.readyState||(document.detachEvent("onreadystatechange",t),e())})})(function(){function r(){var t;(t=-1!=y&&-1!=w||-1!=y&&-1!=v||-1!=w&&-1!=v)&&((t=y!=w&&y!=v&&w!=v)||(null===l&&(t=/AppleWebKit\/([0-9]+)(?:\.([0-9]+))/.exec(window.navigator.userAgent),l=!!t&&(536>parseInt(t[1],10)||536===parseInt(t[1],10)&&11>=parseInt(t[2],10))),t=l&&(y==b&&w==b&&v==b||y==g&&w==g&&v==g||y==x&&w==x&&v==x)),t=!t),t&&(E.parentNode&&E.parentNode.removeChild(E),clearTimeout(c),e(i))}var u=new n(s),m=new n(s),p=new n(s),y=-1,w=-1,v=-1,b=-1,g=-1,x=-1,E=document.createElement("div");E.dir="ltr",o(u,f(i,"sans-serif")),o(m,f(i,"serif")),o(p,f(i,"monospace")),E.appendChild(u.a),E.appendChild(m.a),E.appendChild(p.a),document.body.appendChild(E),b=u.a.offsetWidth,g=m.a.offsetWidth,x=p.a.offsetWidth,(function e(){if((new Date).getTime()-h>=d)E.parentNode&&E.parentNode.removeChild(E),t(i);else{var n=document.hidden;!0!==n&&void 0!==n||(y=u.a.offsetWidth,w=m.a.offsetWidth,v=p.a.offsetWidth,r()),c=setTimeout(e,50)}})(),a(u,function(e){y=e,r()}),o(u,f(i,'"'+i.family+'",sans-serif')),a(m,function(e){w=e,r()}),o(m,f(i,'"'+i.family+'",serif')),a(p,function(e){v=e,r()}),o(p,f(i,'"'+i.family+'",monospace'))})})},e.exports=s})()})(e={exports:{}},e.exports),e.exports);const n=document.createElement("template");n.setAttribute("style","display: none;"),n.innerHTML='<link href="https://fonts.googleapis.com/css?family=Roboto:400,500,700" rel="stylesheet"> <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> ';const o=document.createElement("template");o.innerHTML="<style> :root {\n  /* Main MyUW Theme Variables */\n\n  --myuw-primary-bg: #c5050c;\n  --myuw-primary-color: #fff;\n\n  --myuw-accent-bg: #0479a8;\n  --myuw-accent-color: #fff;\n\n  --myuw-page-bg: #f7f7f7;\n  --myuw-page-color: #494949;\n\n  --myuw-dark: #646569;\n  --myuw-darker: #282728;\n\n  --myuw-font: 'Roboto', Arial, sans-serif;\n  --myuw-app-bar-font: 'Verlag', 'Helvetica Neue', Helvetica, Arial, sans-serif;\n\n}\n\n/* Duplicate :host styles for search to allow polyfills to work */\nmyuw-search {\n  display: flex;\n  flex: auto;\n} </style> ",document.head.appendChild(n.content),document.head.appendChild(o.content),new t("Roboto",{}).load().then(e=>{document.body.setAttribute("myuw-font-loaded",!0)}).catch(e=>{throw document.body.setAttribute("myuw-font-loaded",!0),new Error(e)})})();
+!(function(){"use strict";var e,t=((function(e){!(function(){function t(e,t){document.addEventListener?e.addEventListener("scroll",t,!1):e.attachEvent("scroll",t)}function n(e){this.a=document.createElement("div"),this.a.setAttribute("aria-hidden","true"),this.a.appendChild(document.createTextNode(e)),this.b=document.createElement("span"),this.c=document.createElement("span"),this.h=document.createElement("span"),this.f=document.createElement("span"),this.g=-1,this.b.style.cssText="max-width:none;display:inline-block;position:absolute;height:100%;width:100%;overflow:scroll;font-size:16px;",this.c.style.cssText="max-width:none;display:inline-block;position:absolute;height:100%;width:100%;overflow:scroll;font-size:16px;",this.f.style.cssText="max-width:none;display:inline-block;position:absolute;height:100%;width:100%;overflow:scroll;font-size:16px;",this.h.style.cssText="display:inline-block;width:200%;height:200%;font-size:16px;max-width:none;",this.b.appendChild(this.h),this.c.appendChild(this.f),this.a.appendChild(this.b),this.a.appendChild(this.c)}function o(e,t){e.a.style.cssText="max-width:none;min-width:20px;min-height:20px;display:inline-block;overflow:hidden;position:absolute;width:auto;margin:0;padding:0;top:-999px;white-space:nowrap;font-synthesis:none;font:"+t+";"}function i(e){var t=e.a.offsetWidth,n=t+100;return e.f.style.width=n+"px",e.c.scrollLeft=n,e.b.scrollLeft=e.b.scrollWidth+100,e.g!==t&&(e.g=t,!0)}function a(e,n){function o(){var e=a;i(e)&&e.a.parentNode&&n(e.g)}var a=e;t(e.b,o),t(e.c,o),i(e)}function s(e,t){var n=t||{};this.family=e,this.style=n.style||"normal",this.weight=n.weight||"normal",this.stretch=n.stretch||"normal"}var r=null,l=null,c=null,d=null;function u(){return null===d&&(d=!!document.fonts),d}function f(e,t){return[e.style,e.weight,(function(){if(null===c){var e=document.createElement("div");try{e.style.font="condensed 100px sans-serif"}catch(e){}c=""!==e.style.font}return c})()?e.stretch:"","100px",t].join(" ")}s.prototype.load=function(e,t){var i=this,s=e||"BESbswy",c=0,d=t||3e3,h=(new Date).getTime();return new Promise(function(e,t){if(u()&&!(function(){if(null===l)if(u()&&/Apple/.test(window.navigator.vendor)){var e=/AppleWebKit\/([0-9]+)(?:\.([0-9]+))(?:\.([0-9]+))/.exec(window.navigator.userAgent);l=!!e&&603>parseInt(e[1],10)}else l=!1;return l})()){var m=new Promise(function(e,t){!(function n(){(new Date).getTime()-h>=d?t():document.fonts.load(f(i,'"'+i.family+'"'),s).then(function(t){1<=t.length?e():setTimeout(n,25)},function(){t()})})()}),p=new Promise(function(e,t){c=setTimeout(t,d)});Promise.race([p,m]).then(function(){clearTimeout(c),e(i)},function(){t(i)})}else!(function(e){document.body?e():document.addEventListener?document.addEventListener("DOMContentLoaded",function t(){document.removeEventListener("DOMContentLoaded",t),e()}):document.attachEvent("onreadystatechange",function t(){"interactive"!=document.readyState&&"complete"!=document.readyState||(document.detachEvent("onreadystatechange",t),e())})})(function(){function l(){var t;(t=-1!=y&&-1!=w||-1!=y&&-1!=b||-1!=w&&-1!=b)&&((t=y!=w&&y!=b&&w!=b)||(null===r&&(t=/AppleWebKit\/([0-9]+)(?:\.([0-9]+))/.exec(window.navigator.userAgent),r=!!t&&(536>parseInt(t[1],10)||536===parseInt(t[1],10)&&11>=parseInt(t[2],10))),t=r&&(y==v&&w==v&&b==v||y==g&&w==g&&b==g||y==x&&w==x&&b==x)),t=!t),t&&(E.parentNode&&E.parentNode.removeChild(E),clearTimeout(c),e(i))}var u=new n(s),m=new n(s),p=new n(s),y=-1,w=-1,b=-1,v=-1,g=-1,x=-1,E=document.createElement("div");E.dir="ltr",o(u,f(i,"sans-serif")),o(m,f(i,"serif")),o(p,f(i,"monospace")),E.appendChild(u.a),E.appendChild(m.a),E.appendChild(p.a),document.body.appendChild(E),v=u.a.offsetWidth,g=m.a.offsetWidth,x=p.a.offsetWidth,(function e(){if((new Date).getTime()-h>=d)E.parentNode&&E.parentNode.removeChild(E),t(i);else{var n=document.hidden;!0!==n&&void 0!==n||(y=u.a.offsetWidth,w=m.a.offsetWidth,b=p.a.offsetWidth,l()),c=setTimeout(e,50)}})(),a(u,function(e){y=e,l()}),o(u,f(i,'"'+i.family+'",sans-serif')),a(m,function(e){w=e,l()}),o(m,f(i,'"'+i.family+'",serif')),a(p,function(e){b=e,l()}),o(p,f(i,'"'+i.family+'",monospace'))})})},e.exports=s})()})(e={exports:{}},e.exports),e.exports);const n=document.createElement("template");n.setAttribute("style","display: none;"),n.innerHTML='<link href="https://fonts.googleapis.com/css?family=Roboto:400,500,700" rel="stylesheet"> <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> ';const o=document.createElement("template");o.innerHTML="<style> :root {\n  /* Main MyUW Theme Variables */\n\n  --myuw-primary-bg: #c5050c;\n  --myuw-primary-color: #fff;\n\n  --myuw-accent-bg: #0479a8;\n  --myuw-accent-color: #fff;\n\n  --myuw-page-bg: #f7f7f7;\n  --myuw-page-color: #494949;\n\n  --myuw-dark: #646569;\n  --myuw-darker: #282728;\n\n  --myuw-font: 'Roboto', Arial, sans-serif;\n  --myuw-app-bar-font: 'Verlag', 'Helvetica Neue', Helvetica, Arial, sans-serif;\n\n  --myuw-link-color: #0479a8;\n\n  /* Profile/navigation menu item color */\n  --myuw-menu-color: rgba(0,0,0,0.87);\n\n}\n\n/* Duplicate :host styles for search to allow polyfills to work */\nmyuw-search {\n  display: flex;\n  flex: auto;\n  border: var(--myuw-search-border, none);\n  border-radius: 5px;\n}\n\n/* White theme variables */\nbody.uw-madison-white-theme {\n  --myuw-primary-bg: #fff;\n  --myuw-primary-color: #c5050c;\n\n  --myuw-accent-bg: #fff;\n  --myuw-accent-color: #0479a8;\n\n  --myuw-search-border: 1px solid rgba(0,0,0,0.5);\n} </style> ",document.head.appendChild(n.content),document.head.appendChild(o.content),new t("Roboto",{}).load().then(e=>{document.body.setAttribute("myuw-font-loaded",!0)}).catch(e=>{throw document.body.setAttribute("myuw-font-loaded",!0),new Error(e)})})();

package.json

 {
   "name": "@myuw-web-components/myuw-app-styles",
-  "version": "1.1.6",
+  "version": "1.2.0",
   "description": "This HTML import contains custom CSS properties that are consumed by other components in the myuw-web-components space.",
@@ -5,0 +5,0 @@ "module": "dist/myuw-app-styles.min.mjs",

README.md

@@ -15,1 +15,13 @@ # MyUW App Styles
 To avoid flashing unstyled text, this component also uses [FontFaceObserver](https://github.com/bramstein/fontfaceobserver) to determine when UW-Madison theme fonts are loaded and updates `<body>` with the attribute `myuw-font-loaded`
+
+## Theming
+
+The default theme is based on UW-Madison red and other colors from the [UW-Madison brand guidelines](https://brand.wisc.edu/web/colors/) for web. You don't have to do anything special to use this theme.
+
+To use the "UW-Madison White" theme, add the "uw-madison-white-theme" class to your page's body element, like so:
+
+```html
+<body class="uw-madison-white-theme">
+    <!-- ... -->
+</body>
+```

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

38304

increased by6.28%

Number of downloads

134

increased by3.88%

Number of package files

8

increased by14.29%

Lines of code

142

increased by2.9%

Number of lines in readme file

26

increased by73.33%

No dependency changes