New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
@myuw-web-components/myuw-app-bar
Advanced tools
@myuw-web-components/myuw-app-bar - npm Package Compare versions
Comparing version 1.7.5 to 1.7.6
@@ -141,3 +141,3 @@ var MyUWAppBar = (function () { | ||
| var tpl = "<style> #spacer {\n display: block;\n height: 81px;\n }\n\n #bar {\n position: relative;\n top: 1.8em;\n width: 100vw;\n height: 64px;\n background: var(--myuw-app-bar-bg, var( --myuw-primary-bg, #c5050c));\n font-family: var(--myuw-app-bar-font, var( --myuw-font, Red Hat Display, sans-serif));\n font-size: 14px;\n font-weight: var(--myuw-app-bar-font-weight, 400);\n -webkit-font-smoothing: antialiased;\n background-color: var(--myuw-app-bar-bg, var( --myuw-primary-bg, #c5050c));\n color: var(--myuw-app-bar-color, var(--myuw-primary-color, #fff));\n z-index: var(--z-index, 80);\n box-sizing: border-box;\n display: -webkit-box;\n display: -webkit-flex;\n display: flex;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -webkit-flex-direction: row;\n flex-direction: row;\n padding: 0 16px;\n transition: box-shadow 0.3s ease-in-out;\n }\n\n #bar.shadow {\n box-shadow: 0 1px 3px 0 rgba(0,0,0,0.2), 0 1px 1px 0 rgba(0,0,0,0.14), 0 2px 1px -1px rgba(0,0,0,0.12);\n }\n\n #bar .region {\n box-sizing: border-box;\n display: -webkit-box;\n display: -webkit-flex;\n display: flex;\n -webkit-box-orient: horizontal;\n -webkit-flex-direction: row;\n flex-direction: row;\n -webkit-box-align: center;\n -webkit-align-items: center;\n -ms-grid-row-align: center;\n align-items: center;\n -webkit-align-content: center;\n align-content: center;\n -webkit-box-pack: start;\n -webkit-justify-content: flex-start;\n justify-content: flex-start;\n }\n\n #region__left,\n #region__right {\n -webkit-box-flex: 1;\n -webkit-flex: 1 1 30%;\n flex: 1 1 30%;\n box-sizing: border-box;\n max-width: 30%;\n }\n\n #bar #region__right {\n -webkit-box-pack: end;\n -webkit-justify-content: flex-end;\n justify-content: flex-end;\n }\n\n #slot__navigation,\n #slot__help,\n #slot__feedback,\n #slot__notifications,\n #slot__profile {\n margin: 0;\n }\n\n #bar #region__center {\n display: -webkit-box;\n display: -webkit-flex;\n display: flex;\n flex: auto;\n margin: 0 24px;\n -webkit-justify-content: center;\n justify-content: center;\n }\n\n #title {\n font-size: var(--myuw-app-bar-title-font-size, 18px);\n font-weight: 630;\n }\n\n #title #themeText {\n font-weight: var(--theme-name-font-weight, 600);\n }\n\n #title a {\n text-decoration: none;\n color: inherit;\n }\n\n #title a:hover,\n #title a:visited {\n text-decoration: none;\n cursor: pointer;\n color: inherit;\n }\n\n @media (max-width: 600px) {\n #myuw-app-bar #region__left,\n #bar #region__left {\n flex: auto;\n max-width: none;\n }\n #myuw-app-bar #region__center {\n max-width: 42px;\n margin: 0;\n justify-content: flex-end;\n }\n #myuw-app-bar #region__right,\n #bar #region__right {\n flex: 0;\n max-width: 50%;\n justify-content: flex-end;\n }\n #bar #region__center {\n margin: 0;\n }\n }\n\n.fixed-header-container {\n position: fixed;\n top: 0;\n left: 0;\n}\n\n.uw-global-bar {\n padding: 0.4rem 1rem 0.1rem 1rem;\n background-color: #fff;\n position: fixed;\n top: 0;\n z-index: 100;\n width: 100%;\n font-family: Red Hat Text, sans-serif;\n}\n\n.uw-global-bar a {\n color: #333;\n text-decoration: none;\n font-size: 18px;\n}\n\n.uw-global-bar a:hover {\n text-decoration: none;\n} </style> <div class=\"fixed-header-container\"> <!-- Utility bar --> <div class=\"uw-global-bar\" role=\"navigation\"> <a target=\"_blank\" class=\"uw-global-name-link\" href=\"https://www.wisc.edu\" aria-label=\"University of Wisconsin–Madison home page\"> University of Wisconsin–Madison</a> </div> <div id=\"bar\"> <div class=\"region\" id=\"region__left\"> <div class=\"slot\" id=\"slot__navigation\"> <slot id=\"navigation-slot\" name=\"myuw-navigation\"> </div> <h1 id=\"title\"> <a id=\"app-anchor\" href=\"#\" target=\"_self\"><span id=\"themeText\"></span> <span id=\"appText\"></span></a> </h1> </div> <div class=\"region\" id=\"region__center\"> <slot id=\"search-slot\" name=\"myuw-search\"> </div> <div class=\"region\" id=\"region__right\"> <div class=\"slot\" id=\"slot__feedback\"> <slot id=\"feedback-slot\" name=\"myuw-feedback\"> </div> <div class=\"slot\" id=\"slot__help\"> <slot id=\"help-slot\" name=\"myuw-help\"> </div> <div class=\"slot\" id=\"slot__notifications\"> <slot id=\"notifications-slot\" name=\"myuw-notifications\"> </div> <div class=\"slot\" id=\"slot__profile\"> <slot id=\"profile-slot\" name=\"myuw-profile\"> </div> </div> </div> </div> <div id=\"spacer\"></div> "; | ||
| var tpl = "<style> #spacer {\n display: block;\n height: 81px;\n }\n\n #bar {\n position: relative;\n top: 2.4em;\n width: 100vw;\n height: 64px;\n background: var(--myuw-app-bar-bg, var( --myuw-primary-bg, #c5050c));\n font-family: var(--myuw-app-bar-font, var( --myuw-font, Red Hat Display, sans-serif));\n font-size: 14px;\n font-weight: var(--myuw-app-bar-font-weight, 400);\n -webkit-font-smoothing: antialiased;\n background-color: var(--myuw-app-bar-bg, var( --myuw-primary-bg, #c5050c));\n color: var(--myuw-app-bar-color, var(--myuw-primary-color, #fff));\n z-index: var(--z-index, 80);\n box-sizing: border-box;\n display: -webkit-box;\n display: -webkit-flex;\n display: flex;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -webkit-flex-direction: row;\n flex-direction: row;\n padding: 0 16px;\n transition: box-shadow 0.3s ease-in-out;\n }\n\n #bar.shadow {\n box-shadow: 0 1px 3px 0 rgba(0,0,0,0.2), 0 1px 1px 0 rgba(0,0,0,0.14), 0 2px 1px -1px rgba(0,0,0,0.12);\n }\n\n #bar .region {\n box-sizing: border-box;\n display: -webkit-box;\n display: -webkit-flex;\n display: flex;\n -webkit-box-orient: horizontal;\n -webkit-flex-direction: row;\n flex-direction: row;\n -webkit-box-align: center;\n -webkit-align-items: center;\n -ms-grid-row-align: center;\n align-items: center;\n -webkit-align-content: center;\n align-content: center;\n -webkit-box-pack: start;\n -webkit-justify-content: flex-start;\n justify-content: flex-start;\n }\n\n #region__left,\n #region__right {\n -webkit-box-flex: 1;\n -webkit-flex: 1 1 30%;\n flex: 1 1 30%;\n box-sizing: border-box;\n max-width: 30%;\n }\n\n #bar #region__right {\n -webkit-box-pack: end;\n -webkit-justify-content: flex-end;\n justify-content: flex-end;\n }\n\n #slot__navigation,\n #slot__help,\n #slot__feedback,\n #slot__notifications,\n #slot__profile {\n margin: 0;\n }\n\n #bar #region__center {\n display: -webkit-box;\n display: -webkit-flex;\n display: flex;\n flex: auto;\n margin: 0 24px;\n -webkit-justify-content: center;\n justify-content: center;\n }\n\n #title {\n font-size: var(--myuw-app-bar-title-font-size, 18px);\n font-weight: 630;\n }\n\n #title #themeText {\n font-weight: var(--theme-name-font-weight, 600);\n }\n\n #title a {\n text-decoration: none;\n color: inherit;\n }\n\n #title a:hover,\n #title a:visited {\n text-decoration: none;\n cursor: pointer;\n color: inherit;\n }\n\n @media (max-width: 600px) {\n #myuw-app-bar #region__left,\n #bar #region__left {\n flex: auto;\n max-width: none;\n }\n #myuw-app-bar #region__center {\n max-width: 42px;\n margin: 0;\n justify-content: flex-end;\n }\n #myuw-app-bar #region__right,\n #bar #region__right {\n flex: 0;\n max-width: 50%;\n justify-content: flex-end;\n }\n #bar #region__center {\n margin: 0;\n }\n }\n\n.fixed-header-container {\n position: fixed;\n top: 0;\n left: 0;\n}\n\n.uw-global-bar {\n padding: 0.4rem 1rem 0.5rem 1rem;\n background-color: #fff;\n position: fixed;\n top: 0;\n z-index: 100;\n width: 100%;\n font-family: Red Hat Text, sans-serif;\n}\n\n.uw-global-bar a {\n color: #333;\n text-decoration: none;\n font-size: 18px;\n}\n\n.uw-global-bar a:hover {\n text-decoration: none;\n} </style> <div class=\"fixed-header-container\"> <!-- Utility bar --> <div class=\"uw-global-bar\" role=\"navigation\"> <a target=\"_blank\" class=\"uw-global-name-link\" href=\"https://www.wisc.edu\" aria-label=\"University of Wisconsin–Madison home page\"> University of Wisconsin–Madison</a> </div> <div id=\"bar\"> <div class=\"region\" id=\"region__left\"> <div class=\"slot\" id=\"slot__navigation\"> <slot id=\"navigation-slot\" name=\"myuw-navigation\"> </div> <h1 id=\"title\"> <a id=\"app-anchor\" href=\"#\" target=\"_self\"><span id=\"themeText\"></span> <span id=\"appText\"></span></a> </h1> </div> <div class=\"region\" id=\"region__center\"> <slot id=\"search-slot\" name=\"myuw-search\"> </div> <div class=\"region\" id=\"region__right\"> <div class=\"slot\" id=\"slot__feedback\"> <slot id=\"feedback-slot\" name=\"myuw-feedback\"> </div> <div class=\"slot\" id=\"slot__help\"> <slot id=\"help-slot\" name=\"myuw-help\"> </div> <div class=\"slot\" id=\"slot__notifications\"> <slot id=\"notifications-slot\" name=\"myuw-notifications\"> </div> <div class=\"slot\" id=\"slot__profile\"> <slot id=\"profile-slot\" name=\"myuw-profile\"> </div> </div> </div> </div> <div id=\"spacer\"></div> "; | ||
@@ -144,0 +144,0 @@ var MyUWAppBar = |
@@ -1,1 +0,1 @@ | ||
| var MyUWAppBar=(function(){"use strict";function n(n,e){for(var t=0;t<e.length;t++){var i=e[t];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(n,i.key,i)}}function e(e,t,i){return t&&n(e.prototype,t),i&&n(e,i),e}function t(n){return(t=Object.setPrototypeOf?Object.getPrototypeOf:function(n){return n.__proto__||Object.getPrototypeOf(n)})(n)}function i(n,e){return(i=Object.setPrototypeOf||function(n,e){return n.__proto__=e,n})(n,e)}function o(n,e,t){return(o=(function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Date.prototype.toString.call(Reflect.construct(Date,[],function(){})),!0}catch(n){return!1}})()?Reflect.construct:function(n,e,t){var o=[null];o.push.apply(o,e);var r=new(Function.bind.apply(n,o));return t&&i(r,t.prototype),r}).apply(null,arguments)}function r(n){var e="function"==typeof Map?new Map:void 0;return(r=function(n){if(null===n||(r=n,-1===Function.toString.call(r).indexOf("[native code]")))return n;var r;if("function"!=typeof n)throw new TypeError("Super expression must either be null or a function");if(void 0!==e){if(e.has(n))return e.get(n);e.set(n,a)}function a(){return o(n,arguments,t(this).constructor)}return a.prototype=Object.create(n.prototype,{constructor:{value:a,enumerable:!1,writable:!0,configurable:!0}}),i(a,n)})(n)}function a(n,e){return!e||"object"!=typeof e&&"function"!=typeof e?(function(n){if(void 0===n)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return n})(n):e}var l=(function(n){function o(){var n;return(function(n,e){if(!(n instanceof e))throw new TypeError("Cannot call a class as a function")})(this,o),(n=a(this,t(o).call(this))).attachShadow({mode:"open"}),n.shadowRoot.appendChild(n.constructor.template.content.cloneNode(!0)),n.appAnchorElement=n.shadowRoot.getElementById("app-anchor"),n.appBarElement=n.shadowRoot.getElementById("bar"),n.appTextElement=n.shadowRoot.getElementById("appText"),n.themeTextElement=n.shadowRoot.getElementById("themeText"),n.eventListeners=[{target:window,type:"scroll",handler:function(e){return n.handleWindowScroll(e)}}],n}return(function(n,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");n.prototype=Object.create(e&&e.prototype,{constructor:{value:n,writable:!0,configurable:!0}}),e&&i(n,e)})(o,r(HTMLElement)),e(o,null,[{key:"elementName",get:function(){return"myuw-app-bar"}},{key:"observedAttributes",get:function(){return["app-url","app-name","theme-name"]}},{key:"template",get:function(){return void 0===this._template&&(this._template=document.createElement("template"),this._template.innerHTML='<style> #spacer {\n display: block;\n height: 81px;\n }\n\n #bar {\n position: relative;\n top: 1.8em;\n width: 100vw;\n height: 64px;\n background: var(--myuw-app-bar-bg, var( --myuw-primary-bg, #c5050c));\n font-family: var(--myuw-app-bar-font, var( --myuw-font, Red Hat Display, sans-serif));\n font-size: 14px;\n font-weight: var(--myuw-app-bar-font-weight, 400);\n -webkit-font-smoothing: antialiased;\n background-color: var(--myuw-app-bar-bg, var( --myuw-primary-bg, #c5050c));\n color: var(--myuw-app-bar-color, var(--myuw-primary-color, #fff));\n z-index: var(--z-index, 80);\n box-sizing: border-box;\n display: -webkit-box;\n display: -webkit-flex;\n display: flex;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -webkit-flex-direction: row;\n flex-direction: row;\n padding: 0 16px;\n transition: box-shadow 0.3s ease-in-out;\n }\n\n #bar.shadow {\n box-shadow: 0 1px 3px 0 rgba(0,0,0,0.2), 0 1px 1px 0 rgba(0,0,0,0.14), 0 2px 1px -1px rgba(0,0,0,0.12);\n }\n\n #bar .region {\n box-sizing: border-box;\n display: -webkit-box;\n display: -webkit-flex;\n display: flex;\n -webkit-box-orient: horizontal;\n -webkit-flex-direction: row;\n flex-direction: row;\n -webkit-box-align: center;\n -webkit-align-items: center;\n -ms-grid-row-align: center;\n align-items: center;\n -webkit-align-content: center;\n align-content: center;\n -webkit-box-pack: start;\n -webkit-justify-content: flex-start;\n justify-content: flex-start;\n }\n\n #region__left,\n #region__right {\n -webkit-box-flex: 1;\n -webkit-flex: 1 1 30%;\n flex: 1 1 30%;\n box-sizing: border-box;\n max-width: 30%;\n }\n\n #bar #region__right {\n -webkit-box-pack: end;\n -webkit-justify-content: flex-end;\n justify-content: flex-end;\n }\n\n #slot__navigation,\n #slot__help,\n #slot__feedback,\n #slot__notifications,\n #slot__profile {\n margin: 0;\n }\n\n #bar #region__center {\n display: -webkit-box;\n display: -webkit-flex;\n display: flex;\n flex: auto;\n margin: 0 24px;\n -webkit-justify-content: center;\n justify-content: center;\n }\n\n #title {\n font-size: var(--myuw-app-bar-title-font-size, 18px);\n font-weight: 630;\n }\n\n #title #themeText {\n font-weight: var(--theme-name-font-weight, 600);\n }\n\n #title a {\n text-decoration: none;\n color: inherit;\n }\n\n #title a:hover,\n #title a:visited {\n text-decoration: none;\n cursor: pointer;\n color: inherit;\n }\n\n @media (max-width: 600px) {\n #myuw-app-bar #region__left,\n #bar #region__left {\n flex: auto;\n max-width: none;\n }\n #myuw-app-bar #region__center {\n max-width: 42px;\n margin: 0;\n justify-content: flex-end;\n }\n #myuw-app-bar #region__right,\n #bar #region__right {\n flex: 0;\n max-width: 50%;\n justify-content: flex-end;\n }\n #bar #region__center {\n margin: 0;\n }\n }\n\n.fixed-header-container {\n position: fixed;\n top: 0;\n left: 0;\n}\n\n.uw-global-bar {\n padding: 0.4rem 1rem 0.1rem 1rem;\n background-color: #fff;\n position: fixed;\n top: 0;\n z-index: 100;\n width: 100%;\n font-family: Red Hat Text, sans-serif;\n}\n\n.uw-global-bar a {\n color: #333;\n text-decoration: none;\n font-size: 18px;\n}\n\n.uw-global-bar a:hover {\n text-decoration: none;\n} </style> <div class="fixed-header-container"> \x3c!-- Utility bar --\x3e <div class="uw-global-bar" role="navigation"> <a target="_blank" class="uw-global-name-link" href="https://www.wisc.edu" aria-label="University of Wisconsin–Madison home page"> University of Wisconsin–Madison</a> </div> <div id="bar"> <div class="region" id="region__left"> <div class="slot" id="slot__navigation"> <slot id="navigation-slot" name="myuw-navigation"> </div> <h1 id="title"> <a id="app-anchor" href="#" target="_self"><span id="themeText"></span> <span id="appText"></span></a> </h1> </div> <div class="region" id="region__center"> <slot id="search-slot" name="myuw-search"> </div> <div class="region" id="region__right"> <div class="slot" id="slot__feedback"> <slot id="feedback-slot" name="myuw-feedback"> </div> <div class="slot" id="slot__help"> <slot id="help-slot" name="myuw-help"> </div> <div class="slot" id="slot__notifications"> <slot id="notifications-slot" name="myuw-notifications"> </div> <div class="slot" id="slot__profile"> <slot id="profile-slot" name="myuw-profile"> </div> </div> </div> </div> <div id="spacer"></div> '),this._template}}]),e(o,[{key:"attributeChangedCallback",value:function(n,e,t){switch(n){case"theme-name":this.themeTextElement.textContent=t;break;case"app-name":this.appTextElement.textContent=t;break;case"app-url":this.appAnchorElement.href=t}}},{key:"connectedCallback",value:function(){this.eventListeners.forEach(function(n){var e=n.target,t=n.type,i=n.handler;return e.addEventListener(t,i)})}},{key:"disconnectedCallback",value:function(){this.eventListeners.forEach(function(n){var e=n.target,t=n.type,i=n.handler;return e.removeEventListener(t,i)})}},{key:"handleWindowScroll",value:function(n){0!==window.scrollY?this.appBarElement.classList.add("shadow"):this.appBarElement.classList.remove("shadow")}}]),o})();return void 0===customElements.get(l.elementName)&&customElements.define(l.elementName,l),l})(); | ||
| var MyUWAppBar=(function(){"use strict";function n(n,e){for(var t=0;t<e.length;t++){var i=e[t];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(n,i.key,i)}}function e(e,t,i){return t&&n(e.prototype,t),i&&n(e,i),e}function t(n){return(t=Object.setPrototypeOf?Object.getPrototypeOf:function(n){return n.__proto__||Object.getPrototypeOf(n)})(n)}function i(n,e){return(i=Object.setPrototypeOf||function(n,e){return n.__proto__=e,n})(n,e)}function o(n,e,t){return(o=(function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Date.prototype.toString.call(Reflect.construct(Date,[],function(){})),!0}catch(n){return!1}})()?Reflect.construct:function(n,e,t){var o=[null];o.push.apply(o,e);var r=new(Function.bind.apply(n,o));return t&&i(r,t.prototype),r}).apply(null,arguments)}function r(n){var e="function"==typeof Map?new Map:void 0;return(r=function(n){if(null===n||(r=n,-1===Function.toString.call(r).indexOf("[native code]")))return n;var r;if("function"!=typeof n)throw new TypeError("Super expression must either be null or a function");if(void 0!==e){if(e.has(n))return e.get(n);e.set(n,a)}function a(){return o(n,arguments,t(this).constructor)}return a.prototype=Object.create(n.prototype,{constructor:{value:a,enumerable:!1,writable:!0,configurable:!0}}),i(a,n)})(n)}function a(n,e){return!e||"object"!=typeof e&&"function"!=typeof e?(function(n){if(void 0===n)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return n})(n):e}var l=(function(n){function o(){var n;return(function(n,e){if(!(n instanceof e))throw new TypeError("Cannot call a class as a function")})(this,o),(n=a(this,t(o).call(this))).attachShadow({mode:"open"}),n.shadowRoot.appendChild(n.constructor.template.content.cloneNode(!0)),n.appAnchorElement=n.shadowRoot.getElementById("app-anchor"),n.appBarElement=n.shadowRoot.getElementById("bar"),n.appTextElement=n.shadowRoot.getElementById("appText"),n.themeTextElement=n.shadowRoot.getElementById("themeText"),n.eventListeners=[{target:window,type:"scroll",handler:function(e){return n.handleWindowScroll(e)}}],n}return(function(n,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");n.prototype=Object.create(e&&e.prototype,{constructor:{value:n,writable:!0,configurable:!0}}),e&&i(n,e)})(o,r(HTMLElement)),e(o,null,[{key:"elementName",get:function(){return"myuw-app-bar"}},{key:"observedAttributes",get:function(){return["app-url","app-name","theme-name"]}},{key:"template",get:function(){return void 0===this._template&&(this._template=document.createElement("template"),this._template.innerHTML='<style> #spacer {\n display: block;\n height: 81px;\n }\n\n #bar {\n position: relative;\n top: 2.4em;\n width: 100vw;\n height: 64px;\n background: var(--myuw-app-bar-bg, var( --myuw-primary-bg, #c5050c));\n font-family: var(--myuw-app-bar-font, var( --myuw-font, Red Hat Display, sans-serif));\n font-size: 14px;\n font-weight: var(--myuw-app-bar-font-weight, 400);\n -webkit-font-smoothing: antialiased;\n background-color: var(--myuw-app-bar-bg, var( --myuw-primary-bg, #c5050c));\n color: var(--myuw-app-bar-color, var(--myuw-primary-color, #fff));\n z-index: var(--z-index, 80);\n box-sizing: border-box;\n display: -webkit-box;\n display: -webkit-flex;\n display: flex;\n -webkit-box-align: center;\n -webkit-align-items: center;\n align-items: center;\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -webkit-flex-direction: row;\n flex-direction: row;\n padding: 0 16px;\n transition: box-shadow 0.3s ease-in-out;\n }\n\n #bar.shadow {\n box-shadow: 0 1px 3px 0 rgba(0,0,0,0.2), 0 1px 1px 0 rgba(0,0,0,0.14), 0 2px 1px -1px rgba(0,0,0,0.12);\n }\n\n #bar .region {\n box-sizing: border-box;\n display: -webkit-box;\n display: -webkit-flex;\n display: flex;\n -webkit-box-orient: horizontal;\n -webkit-flex-direction: row;\n flex-direction: row;\n -webkit-box-align: center;\n -webkit-align-items: center;\n -ms-grid-row-align: center;\n align-items: center;\n -webkit-align-content: center;\n align-content: center;\n -webkit-box-pack: start;\n -webkit-justify-content: flex-start;\n justify-content: flex-start;\n }\n\n #region__left,\n #region__right {\n -webkit-box-flex: 1;\n -webkit-flex: 1 1 30%;\n flex: 1 1 30%;\n box-sizing: border-box;\n max-width: 30%;\n }\n\n #bar #region__right {\n -webkit-box-pack: end;\n -webkit-justify-content: flex-end;\n justify-content: flex-end;\n }\n\n #slot__navigation,\n #slot__help,\n #slot__feedback,\n #slot__notifications,\n #slot__profile {\n margin: 0;\n }\n\n #bar #region__center {\n display: -webkit-box;\n display: -webkit-flex;\n display: flex;\n flex: auto;\n margin: 0 24px;\n -webkit-justify-content: center;\n justify-content: center;\n }\n\n #title {\n font-size: var(--myuw-app-bar-title-font-size, 18px);\n font-weight: 630;\n }\n\n #title #themeText {\n font-weight: var(--theme-name-font-weight, 600);\n }\n\n #title a {\n text-decoration: none;\n color: inherit;\n }\n\n #title a:hover,\n #title a:visited {\n text-decoration: none;\n cursor: pointer;\n color: inherit;\n }\n\n @media (max-width: 600px) {\n #myuw-app-bar #region__left,\n #bar #region__left {\n flex: auto;\n max-width: none;\n }\n #myuw-app-bar #region__center {\n max-width: 42px;\n margin: 0;\n justify-content: flex-end;\n }\n #myuw-app-bar #region__right,\n #bar #region__right {\n flex: 0;\n max-width: 50%;\n justify-content: flex-end;\n }\n #bar #region__center {\n margin: 0;\n }\n }\n\n.fixed-header-container {\n position: fixed;\n top: 0;\n left: 0;\n}\n\n.uw-global-bar {\n padding: 0.4rem 1rem 0.5rem 1rem;\n background-color: #fff;\n position: fixed;\n top: 0;\n z-index: 100;\n width: 100%;\n font-family: Red Hat Text, sans-serif;\n}\n\n.uw-global-bar a {\n color: #333;\n text-decoration: none;\n font-size: 18px;\n}\n\n.uw-global-bar a:hover {\n text-decoration: none;\n} </style> <div class="fixed-header-container"> \x3c!-- Utility bar --\x3e <div class="uw-global-bar" role="navigation"> <a target="_blank" class="uw-global-name-link" href="https://www.wisc.edu" aria-label="University of Wisconsin–Madison home page"> University of Wisconsin–Madison</a> </div> <div id="bar"> <div class="region" id="region__left"> <div class="slot" id="slot__navigation"> <slot id="navigation-slot" name="myuw-navigation"> </div> <h1 id="title"> <a id="app-anchor" href="#" target="_self"><span id="themeText"></span> <span id="appText"></span></a> </h1> </div> <div class="region" id="region__center"> <slot id="search-slot" name="myuw-search"> </div> <div class="region" id="region__right"> <div class="slot" id="slot__feedback"> <slot id="feedback-slot" name="myuw-feedback"> </div> <div class="slot" id="slot__help"> <slot id="help-slot" name="myuw-help"> </div> <div class="slot" id="slot__notifications"> <slot id="notifications-slot" name="myuw-notifications"> </div> <div class="slot" id="slot__profile"> <slot id="profile-slot" name="myuw-profile"> </div> </div> </div> </div> <div id="spacer"></div> '),this._template}}]),e(o,[{key:"attributeChangedCallback",value:function(n,e,t){switch(n){case"theme-name":this.themeTextElement.textContent=t;break;case"app-name":this.appTextElement.textContent=t;break;case"app-url":this.appAnchorElement.href=t}}},{key:"connectedCallback",value:function(){this.eventListeners.forEach(function(n){var e=n.target,t=n.type,i=n.handler;return e.addEventListener(t,i)})}},{key:"disconnectedCallback",value:function(){this.eventListeners.forEach(function(n){var e=n.target,t=n.type,i=n.handler;return e.removeEventListener(t,i)})}},{key:"handleWindowScroll",value:function(n){0!==window.scrollY?this.appBarElement.classList.add("shadow"):this.appBarElement.classList.remove("shadow")}}]),o})();return void 0===customElements.get(l.elementName)&&customElements.define(l.elementName,l),l})(); |
| { | ||
| "name": "@myuw-web-components/myuw-app-bar", | ||
| "version": "1.7.5", | ||
| "version": "1.7.6", | ||
| "description": "A material top app bar designed for use with other MyUW web components", | ||
@@ -5,0 +5,0 @@ "module": "dist/myuw-app-bar.min.mjs", |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
No alert changes
No metric changes
No dependency changes