@utahdts/utah-design-system-header 0.1.0

package/README.md

@@ -0,0 +1,73 @@
+# Utah Header
+The Utah Header is part of the Utah Design System. It provides a common initial entry point experience for users of State of Utah websites. Please submit merge requests or start conversations with the Design System team for anything you would like to see incorporated in to the header.
+
+## What's included
+
+- Compiled CSS
+- SASS CSS
+
+## Documentation
+
+Please see the [documentation site](https://utahdts.github.io/utah-design-system/) for all information related to the Utah Design System.
+
+## Install
+
+[![See it on NPM!](https://img.shields.io/npm/v/@utahdts/utah-design-system.svg?style=for-the-badge&color=orange)](https://www.npmjs.com/package/@utahdts/utah-design-system)
+[![License](https://img.shields.io/npm/l/@utahdts/utah-design-system.svg?color=blue&style=for-the-badge)](https://www.apache.org/licenses/LICENSE-2.0)
+
+```bash
+$ npm i @utahdts/utah-design-system-header
+```
+
+## API Functions
+These functions allow configuring and interacting with the Utah Header. It is suggested to only interact with the header using these functions so as to be more "future proof" as changes to the Utah Header codebase will only account for these functions and not for custom coding.
+* `loadHeader`: This function creates the Utah Header DOM elements. It is called automatically when the Utah Header javascript library is loaded on to a web page.
+* `removeHeader`: This function removes the Utah Header from the DOM. This may be useful for pages that should not have the header on them. The application then may call *loadHeader()* to readd the header.
+
+## Events
+The header emits events at the document level. Applications can listen for these events to be able to time interactions with the header.
+* `utahHeaderLoaded`: fired when the header is done with its initial loading phase and is ready to accept configuration. This event is fired by the *loadHeader()* function
+* `utahHeaderUnloaded`: fired when the header is unloaded when the *removeHeader()* function is called
+
+### Using the components
+
+```JavaScript
+// compiled
+import { getUtahHeaderSettings, setUtahHeaderSettings } from '@utahdts/utah-design-system-header';
+
+//import all scss
+import '@utahdts/utah-design-system-header/src/css/index.scss';
+```
+
+### Using the files in Sass
+
+In most cases you can simply import the Sass file as illustrated below:
+
+```scss
+@import "~@utahdts/utah-design-system-header/src/css/_utah-header-wrapper.scss";
+```
+
+## Pre-processed bundled resource
+
+At a limited scale, some files have been pre-processed to CSS so that it can be delivered via CDN and used in environments where this rendered resource is required.
+
+```
+unpkg.com/:package@:version/:file
+unpkg.com/@utahdts/utah-design-system-header@0.1.0/dist/style.css
+
+Get latest
+unpkg.com/@utahdts/utah-design-system-header/dist/style.css
+```
+
+| resource                | CDN URL                                                                      |
+|-------------------------|------------------------------------------------------------------------------|
+| index.scss<br>(All CSS) | https://unpkg.com/@utahdts/utah-design-system-header@:version/dist/style.css |
+
+
+
+### Site Map
+
+- [Home](https://utahdts.github.io/utah-design-system/)
+- [Library](https://utahdts.github.io/utah-design-system/library/)
+- Header
+- [Documentation and Examples](../website/README.md)

package/dist/style.css

@@ -0,0 +1 @@
+.utds-citizen-experience-wrapper{display:flex;justify-content:flex-end;flex:1}.utds-action-items-wrapper{display:flex;gap:var(--spacing);margin-right:var(--spacing)}.utds-header-action-item{display:flex;align-items:center;position:relative}.utds-header-action-item__icon-button.icon-button{border:2px solid transparent;position:relative}.utds-header-action-item__icon-button.icon-button:hover{background:var(--hover-gray-color);color:#000}.utds-header-action-item__icon-button.icon-button:hover svg{fill:#000}.utds-header-action-item__icon-button--has-title .icon-button{padding:0 var(--spacing-s);flex-direction:row-reverse}.utds-header-action-item__icon-button svg{width:20px;height:20px;fill:var(--gray-color)}.utds-header-action-item__icon-button.icon-waffle .utds-icon-before-waffle:before{font-size:17px}.utds-header-action-item__title{margin-left:var(--spacing-xs)}.utah-design-system{--spacing-3xs: 2px;--spacing-2xs: 4px;--spacing-xs: 8px;--spacing-s: 12px;--spacing: 16px;--spacing-l: 24px;--spacing-xl: 32px;--spacing-2xl: 40px;--spacing-3xl: 48px;--spacing-4xl: 64px;--spacing-5xl: 80px;--spacing-6xl: 96px}.utah-design-system .m-spacing{margin:var(--spacing)}.utah-design-system .mt-spacing{margin-top:var(--spacing)}.utah-design-system .mr-spacing{margin-right:var(--spacing)}.utah-design-system .mb-spacing{margin-bottom:var(--spacing)}.utah-design-system .ml-spacing{margin-left:var(--spacing)}.utah-design-system .mx-spacing{margin-left:var(--spacing);margin-right:var(--spacing)}.utah-design-system .my-spacing{margin-top:var(--spacing);margin-bottom:var(--spacing)}.utah-design-system .m-spacing-l{margin:var(--spacing-l)}.utah-design-system .mt-spacing-l{margin-top:var(--spacing-l)}.utah-design-system .mr-spacing-l{margin-right:var(--spacing-l)}.utah-design-system .mb-spacing-l{margin-bottom:var(--spacing-l)}.utah-design-system .ml-spacing-l{margin-left:var(--spacing-l)}.utah-design-system .mx-spacing-l{margin-left:var(--spacing-l);margin-right:var(--spacing-l)}.utah-design-system .my-spacing-l{margin-top:var(--spacing-l);margin-bottom:var(--spacing-l)}.utah-design-system .m-spacing-s{margin:var(--spacing-s)}.utah-design-system .mt-spacing-s{margin-top:var(--spacing-s)}.utah-design-system .mr-spacing-s{margin-right:var(--spacing-s)}.utah-design-system .mb-spacing-s{margin-bottom:var(--spacing-s)}.utah-design-system .ml-spacing-s{margin-left:var(--spacing-s)}.utah-design-system .mx-spacing-s{margin-left:var(--spacing-s);margin-right:var(--spacing-s)}.utah-design-system .my-spacing-s{margin-top:var(--spacing-s);margin-bottom:var(--spacing-s)}.utah-design-system .m-spacing-xs{margin:var(--spacing-xs)}.utah-design-system .mt-spacing-xs{margin-top:var(--spacing-xs)}.utah-design-system .mr-spacing-xs{margin-right:var(--spacing-xs)}.utah-design-system .mb-spacing-xs{margin-bottom:var(--spacing-xs)}.utah-design-system .ml-spacing-xs{margin-left:var(--spacing-xs)}.utah-design-system .mx-spacing-xs{margin-left:var(--spacing-xs);margin-right:var(--spacing-xs)}.utah-design-system .my-spacing-xs{margin-top:var(--spacing-xs);margin-bottom:var(--spacing-xs)}.utah-design-system .p-spacing{padding:var(--spacing)}.utah-design-system .pt-spacing{padding-top:var(--spacing)}.utah-design-system .pr-spacing{padding-right:var(--spacing)}.utah-design-system .pb-spacing{padding-bottom:var(--spacing)}.utah-design-system .pl-spacing{padding-left:var(--spacing)}.utah-design-system .px-spacing{padding-left:var(--spacing);padding-right:var(--spacing)}.utah-design-system .py-spacing{padding-top:var(--spacing);padding-bottom:var(--spacing)}.utah-design-system .p-spacing-l{padding:var(--spacing-l)}.utah-design-system .pt-spacing-l{padding-top:var(--spacing-l)}.utah-design-system .pr-spacing-l{padding-right:var(--spacing-l)}.utah-design-system .pb-spacing-l{padding-bottom:var(--spacing-l)}.utah-design-system .pl-spacing-l{padding-left:var(--spacing-l)}.utah-design-system .px-spacing-l{padding-left:var(--spacing-l);padding-right:var(--spacing-l)}.utah-design-system .py-spacing-l{padding-top:var(--spacing-l);padding-bottom:var(--spacing-l)}.utah-design-system .m-auto{margin:auto}.utah-design-system .mt-auto{margin-top:auto}.utah-design-system .mr-auto{margin-right:auto}.utah-design-system .mb-auto{margin-bottom:auto}.utah-design-system .ml-auto{margin-left:auto}.utah-design-system .mx-auto{margin-left:auto;margin-right:auto}.utah-design-system .my-auto{margin-top:auto;margin-bottom:auto}.utah-design-system{--grid-fixed: var(--content-width);--grid-fixed-half: calc(var(--grid-fixed) / 2);--grid-fixed-form: calc(var(--grid-fixed) / 2.3);--grid-fixed-third: calc(var(--grid-fixed) / 3);--grid-fixed-fourth: calc(var(--grid-fixed) / 4)}.grid-wrapper{display:flex;justify-content:center}.grid-fixed{max-width:var(--grid-fixed);width:100%;display:grid;grid-template-columns:1fr;gap:var(--spacing-l)}.grid-fixed--2col{grid-template-columns:1fr 1fr}.grid-fixed--3col{grid-template-columns:1fr 1fr 1fr}.grid-fixed--4col{grid-template-columns:1fr 1fr 1fr 1fr}.grid-fixed .grid-column-span-2{grid-column:span 2}.utah-design-system{--normal-font-family: "Source Sans Pro", "Helvetica Neue", sans-serif;--fixed-width-font-family: "Source Code Pro", monospace;--font-size-2xs: .8125rem;--font-size-xs: .875rem;--font-size-s: .9375rem;--font-size: 1rem;--font-size-m: 1.125rem;--font-size-l: 1.25rem;--font-size-xl: 1.5rem;--font-size-2xl: 1.75rem;--font-size-3xl: 2rem;--font-size-4xl: 2.5rem;--font-size-5xl: 3rem;--font-size-6xl: 3.5rem;--font-size-7xl: 4.5rem}.font-size-2xs{font-size:var(--font-size-2xs)}.font-size-xs{font-size:var(--font-size-xs)}.font-size-s{font-size:var(--font-size-s)}.font-size{font-size:var(--font-size)}.font-size-m{font-size:var(--font-size-m)}.font-size-l{font-size:var(--font-size-l)}.font-size-xl{font-size:var(--font-size-xl)}.font-size-2xl{font-size:var(--font-size-2xl)}.font-size-3xl{font-size:var(--font-size-3xl)}.font-size-4xl{font-size:var(--font-size-4xl)}.font-size-5xl{font-size:var(--font-size-5xl)}.font-size-6xl{font-size:var(--font-size-6xl)}.font-size-7xl{font-size:var(--font-size-7xl)}.utah-design-system{--font-weight-normal: 400;--font-weight-semi-bold: 600;--font-weight-bold: 700;--font-weight-black: 900}.font-normal{font-weight:var(--font-weight-normal)}.font-semi-bold{font-weight:var(--font-weight-semi-bold)}.font-bold{font-weight:var(--font-weight-bold)}.font-black{font-weight:var(--font-weight-black)}@font-face{font-family:utah design system;src:url(https://cdn.utah.gov/design-system/fonts/utah-design-system.eot);src:url(https://cdn.utah.gov/design-system/fonts/utah-design-system.eot?#iefix) format("embedded-opentype"),url(https://cdn.utah.gov/design-system/fonts/utah-design-system.woff) format("woff"),url(https://cdn.utah.gov/design-system/fonts/utah-design-system.ttf) format("truetype"),url(https://cdn.utah.gov/design-system/fonts/utah-design-system.svg#utah-design-system) format("svg");font-weight:400;font-style:normal}.utah-design-system{--icon-check-mark-light: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 12.15'%3E%3Cg%3E%3Cpath d='M6.185,12.15L0,5.966,2.335,3.631l3.85,3.849L13.665,0l2.335,2.335L6.185,12.15Z' style='fill: %23fff;'/%3E%3C/g%3E%3C/svg%3E");--icon-chevron-dark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cg%3E%3Crect width='14' height='14' style='fill: none;'/%3E%3Cpath d='M3.142,5l3.716,3.71,3.717-3.71,1.142,1.142-4.859,4.858L2,6.142l1.142-1.142Z' style='fill: %23474747;'/%3E%3C/g%3E%3C/svg%3E")}.utah-design-system [class*=utds-icon-after-]:after{display:inline-block;font-family:utah design system;font-style:normal;font-weight:400;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin-left:var(--spacing-2xs)}.utah-design-system [class*=utds-icon-before-]:before{display:inline-block;font-family:utah design system;font-style:normal;font-weight:400;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin-right:var(--spacing-2xs)}.utah-design-system .utds-icon-before-external-link:before,.utah-design-system .utds-icon-after-external-link:after{content:"A";font-size:.65em}.utah-design-system .utds-icon-before-waffle:before,.utah-design-system .utds-icon-after-waffle:after{content:"B"}.utah-design-system .utds-icon-before-alert:before,.utah-design-system .utds-icon-after-alert:after{content:"C"}.utah-design-system .utds-icon-before-help:before,.utah-design-system .utds-icon-after-help:after{content:"D"}.utah-design-system .utds-icon-before-bookmark:before,.utah-design-system .utds-icon-after-bookmark:after{content:"E"}.utah-design-system .utds-icon-before-search:before,.utah-design-system .utds-icon-after-search:after{content:"F"}.utah-design-system .utds-icon-before-check:before,.utah-design-system .utds-icon-after-check:after{content:"G"}.utah-design-system .utds-icon-before-star:before,.utah-design-system .utds-icon-after-star:after{content:"H"}.utah-design-system .utds-icon-before-info:before,.utah-design-system .utds-icon-after-info:after{content:"I"}.utah-design-system .utds-icon-before-unfold-less:before,.utah-design-system .utds-icon-after-unfold-less:after{content:"J"}.utah-design-system .utds-icon-before-unfold-more:before,.utah-design-system .utds-icon-after-unfold-more:after{content:"K"}.utah-design-system .utds-icon-before-circle-chevron-down:before,.utah-design-system .utds-icon-after-circle-chevron-down:after{content:"L"}.utah-design-system .utds-icon-before-circle-chevron-up:before,.utah-design-system .utds-icon-after-circle-chevron-up:after{content:"M"}.utah-design-system .utds-icon-before-chevron-up:before,.utah-design-system .utds-icon-after-chevron-up:after{content:"N"}.utah-design-system .utds-icon-before-chevron-right:before,.utah-design-system .utds-icon-after-chevron-right:after{content:"O"}.utah-design-system .utds-icon-before-chevron-down:before,.utah-design-system .utds-icon-after-chevron-down:after{content:"P"}.utah-design-system .utds-icon-before-chevron-left:before,.utah-design-system .utds-icon-after-chevron-left:after{content:"Q"}.utah-design-system .utds-icon-before-arrow-up:before,.utah-design-system .utds-icon-after-arrow-up:after{content:"R"}.utah-design-system .utds-icon-before-arrow-right:before,.utah-design-system .utds-icon-after-arrow-right:after{content:"S"}.utah-design-system .utds-icon-before-arrow-down:before,.utah-design-system .utds-icon-after-arrow-down:after{content:"T"}.utah-design-system .utds-icon-before-arrow-left:before,.utah-design-system .utds-icon-after-arrow-left:after{content:"U"}.utah-design-system .utds-icon-before-plus:before,.utah-design-system .utds-icon-after-plus:after{content:"V"}.utah-design-system .utds-icon-before-minus:before,.utah-design-system .utds-icon-after-minus:after{content:"W"}.utah-design-system .utds-icon-before-x-icon:before,.utah-design-system .utds-icon-after-x-icon:after{content:"X"}.utah-design-system .utds-icon-before-edit:before,.utah-design-system .utds-icon-after-edit:after{content:"Y"}.utah-design-system .utds-icon-before-edit-box:before,.utah-design-system .utds-icon-after-edit-box:after{content:"Z"}.utah-design-system .utds-icon-before-verified:before,.utah-design-system .utds-icon-after-verified:after{content:"a"}.utah-design-system .utds-icon-before-gear:before,.utah-design-system .utds-icon-after-gear:after{content:"b"}.utah-design-system .utds-icon-before-doc:before,.utah-design-system .utds-icon-after-doc:after{content:"c"}.utah-design-system .utds-icon-before-doc-square:before,.utah-design-system .utds-icon-after-doc-square:after{content:"d"}.utah-design-system .utds-icon-before-warning:before,.utah-design-system .utds-icon-after-warning:after{content:"e"}.utah-design-system .utds-icon-before-error:before,.utah-design-system .utds-icon-after-error:after{content:"f"}.utah-design-system .utds-icon-before-copy:before,.utah-design-system .utds-icon-after-copy:after{content:"g"}.utah-design-system{--primary-color: purple;--primary-color-dark: rgb(50, 0, 50);--primary-color-light: rgb(219, 159, 219);--gray-on-primary-color: #474747;--secondary-color: rgb(0, 255, 136);--secondary-color-dark: rgb(0, 66, 35);--secondary-color-light: rgb(183, 250, 218);--gray-on-secondary-color: #474747;--accent-color: gold;--accent-color-dark: rgb(114, 97, 0);--accent-color-light: rgb(245, 238, 196);--gray-on-accent-color: #474747;--form-ele-color: #2765e4;--form-ele-color-light: #7aa0ee;--form-ele-disabled-color: #949494;--gray-color: #474747;--gray-medium-color: #616161;--gray-3-1-contrast: #949494;--gray-medium-light-color: #d7d7d7;--gray-light-color: #f1f1f1;--gray-dark-color: #333333;--hover-gray-color: rgba(0,0,0,.07);--hover-gray-color-opaque: rgba(233,233,233);--code-color: #e4e4e4;--gray-border: #d7d7d7;--danger-color: #ba0000;--warning-color: #ba6300;--info-color: var(--secondary-color);--success-color: #2f8700;--timing-xquick: .1s;--timing-quick: .2s;--timing-medium: .4s;--timing-slow: .6s;--radius-small1x: 3px;--radius-small: 6px;--radius-medium: 9px;--radius-large: 12px;--radius-circle: 999px;--form-ele-small4x: .75rem;--form-ele-small3x: 1rem;--form-ele-small2x: 1.25rem;--form-ele-small1x: 1.5rem;--form-ele-small: 1.875rem;--form-ele-medium: 2.25rem;--form-ele-large: 2.5rem;--form-ele-large1x: 3.125rem;--form-checkbox-small: .875rem;--form-checkbox-medium: 1.125rem;--form-checkbox-large: 1.375rem;--content-width-narrow: 800px;--content-width: 1224px;--content-width-wide: 1432px;--documentation-width: 700px;--documentation-left-width: 200px;--documentation-right-width: 200px;--documentation-padding: var(--spacing-2xl) var(--spacing-xl);--drop-shadow-color: rgba(0, 0, 0, .3);--elevation-small: 0 3px 6px var(--drop-shadow-color);--elevation-medium: 0 6px 12px var(--drop-shadow-color);--elevation-large: 0 12px 16px var(--drop-shadow-color)}.primary-color-background{background-color:var(--primary-color)}.primary-color-dark-background{background-color:var(--primary-color-dark)}.primary-color-light-background{background-color:var(--primary-color-light)}.gray-on-primary-background{background-color:var(--gray-on-primary-color)}.primary-color{color:var(--primary-color)}.primary-color-border{border-color:var(--primary-color)}.secondary-color-background{background-color:var(--secondary-color)}.secondary-color-dark-background{background-color:var(--secondary-color-dark)}.secondary-color-light-background{background-color:var(--secondary-color-light)}.gray-on-secondary-background{background-color:var(--gray-on-secondary-color)}.secondary-color{color:var(--secondary-color)}.secondary-color-border{border-color:var(--secondary-color)}.accent-color-background{background-color:var(--accent-color)}.accent-color-dark-background{background-color:var(--accent-color-dark)}.accent-color-light-background{background-color:var(--accent-color-light)}.gray-on-accent-background{background-color:var(--gray-on-accent-color)}.accent-color{color:var(--accent-color)}.accent-color-border{border-color:var(--accent-color)}.gray-color-background{background-color:var(--gray-color)}.gray-color-light-background{background-color:var(--gray-light-color)}.white-color{color:#fff}.background-frosted-dark{background:rgba(0,0,0,.6);backdrop-filter:blur(16px) brightness(1.5);-webkit-backdrop-filter:blur(16px) brightness(1.5)}.background-frosted-light{background:rgba(255,255,255,.1);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.utah-design-system .popup__wrapper{position:absolute;z-index:100;background:none transparent;left:0;top:0;transition:opacity .1s ease-in-out}.utah-design-system .popup__wrapper--visible{opacity:1}.utah-design-system .popup__wrapper--visible .popup__content{transform:scale(1)}.utah-design-system .popup__wrapper--hidden{opacity:0;pointer-events:none}.utah-design-system .popup__wrapper--hidden .popup__content{transform:scale(.7)}.utah-design-system .popup__wrapper--close-button-absolute .popup__close-button{position:absolute;top:var(--spacing-xs);right:var(--spacing-xs)}.utah-design-system .popup__content{background:white;border-radius:var(--radius-small);border:1px solid var(--gray-3-1-contrast);box-sizing:border-box;min-width:180px;padding:var(--spacing-s);transition:transform .1s ease-in-out;box-shadow:var(--elevation-small)}.utah-design-system .popup__close-button{float:right}.utah-design-system .popup__close-button .utds-icon-before-x-icon:before{font-size:.7rem}.utah-design-system .popup__arrow{visibility:hidden}.utah-design-system .popup__arrow,.utah-design-system .popup__arrow:before{position:absolute;width:9px;height:9px;background:inherit;z-index:-1}.utah-design-system .popup__arrow:before{visibility:visible;content:"";transform:rotate(45deg)}.utah-design-system .popup__wrapper[data-popper-placement^=top] .popup__content{transform-origin:bottom}.utah-design-system .popup__wrapper[data-popper-placement^=top] .popup__arrow{bottom:-5px}.utah-design-system .popup__wrapper[data-popper-placement^=top] .popup__arrow:before{border-bottom:1px solid var(--gray-3-1-contrast);border-right:1px solid var(--gray-3-1-contrast)}.utah-design-system .popup__wrapper[data-popper-placement^=bottom] .popup__content{transform-origin:top}.utah-design-system .popup__wrapper[data-popper-placement^=bottom] .popup__arrow{top:-6px}.utah-design-system .popup__wrapper[data-popper-placement^=bottom] .popup__arrow:before{border-top:1px solid var(--gray-3-1-contrast);border-left:1px solid var(--gray-3-1-contrast)}.utah-design-system .popup__wrapper[data-popper-placement^=left] .popup__content{transform-origin:right}.utah-design-system .popup__wrapper[data-popper-placement^=left] .popup__arrow{right:-5px}.utah-design-system .popup__wrapper[data-popper-placement^=left] .popup__arrow:before{border-top:1px solid var(--gray-3-1-contrast);border-right:1px solid var(--gray-3-1-contrast)}.utah-design-system .popup__wrapper[data-popper-placement^=right] .popup__content{transform-origin:left}.utah-design-system .popup__wrapper[data-popper-placement^=right] .popup__arrow{left:-6px}.utah-design-system .popup__wrapper[data-popper-placement^=right] .popup__arrow:before{border-bottom:1px solid var(--gray-3-1-contrast);border-left:1px solid var(--gray-3-1-contrast)}.utds-header{padding:var(--spacing-s) var(--spacing-l);border-bottom:1px solid #d7d7d7!important;width:100%;justify-content:flex-start;height:78px;position:relative;box-sizing:border-box;display:flex;align-items:center}.utds-header--large{height:84px}.utds-header--small{height:60px}.utds-logo-wrapper{position:relative;height:100%;display:flex;align-items:center}.utds-logo-vert-line{height:85%;width:1px;background-color:#707070;margin:0 var(--spacing-xs) 0 var(--spacing);display:block}.utds-title-wrapper{font-size:var(--font-size-3xl);font-weight:600;color:var(--gray-medium-color);display:flex;align-items:center;flex:1;height:100%;gap:var(--spacing-xs);text-decoration:none;border-radius:var(--radius-small);padding:0 var(--spacing-xs)}.utds-title-wrapper__logo{height:100%;width:auto;max-width:100%;max-height:100%;display:flex;align-items:center}.utds-title-wrapper__logo svg,.utds-title-wrapper__logo img{height:100%;width:auto;max-width:100%;max-height:100%}.utds-title-wrapper__logo img{max-width:none}.utds-title-wrapper__title{line-height:.8;color:var(--gray-medium-color)}.utah-logo-svg{height:100%;position:relative;margin-bottom:-4px}.utah-logo-svg svg{height:100%;width:auto;fill:var(--primary-color);font-family:SourceSansPro-Regular,Source Sans Pro;font-weight:400;font-size:14px;display:block}.utds-badge__wrapper{align-items:center;background-color:var(--danger-color);border-radius:var(--radius-circle);box-sizing:border-box;color:#fff;display:flex;font-size:var(--font-size-2xs);font-weight:var(--font-weight-semi-bold);height:15px;justify-content:center;line-height:var(--font-size-2xs);min-width:15px;padding:1px 2px;position:absolute;right:0;top:0}.utds-badge__wrapper--action-item{right:-2px;top:-2px}.utds-badge__wrapper--small{height:9px;min-width:unset;right:2px;top:2px;width:9px}.utah-design-system ul.vertical-menu{list-style-type:none;margin:0;padding:0}.utah-design-system .vertical-menu li>ul{padding-left:var(--spacing-s)}.utah-design-system .vertical-menu button.vertical-menu__button-title,.utah-design-system .vertical-menu a[href].vertical-menu__link-title{border-radius:var(--radius-circle);border:none;box-shadow:none;box-sizing:border-box;color:var(--gray-color);display:flex;font-size:var(--font-size-2xs);justify-content:flex-start;line-height:1.7;margin:var(--spacing-2xs) 0;min-height:unset;padding:var(--spacing-2xs) var(--spacing);text-align:left;text-decoration:none;width:100%}.utah-design-system .vertical-menu button.vertical-menu__button-title:hover,.utah-design-system .vertical-menu a[href].vertical-menu__link-title:hover{background:var(--hover-gray-color);color:var(--primary-color);box-shadow:none}.utah-design-system .vertical-menu button.vertical-menu__button-title:active,.utah-design-system .vertical-menu a[href].vertical-menu__link-title:active{transform:none}.utah-design-system .vertical-menu a.vertical-menu__link-title:hover{box-shadow:none}.utah-design-system .vertical-menu__link-text{flex:1 0 auto}.utah-design-system .vertical-menu__divider{display:block;margin:var(--spacing-s) var(--spacing-s);height:1px;background-color:var(--gray-medium-light-color)}.utah-design-system .vertical-menu .utds-icon-before-chevron-right{font-size:.6rem;line-height:.5;transform:rotate(0);transition:transform var(--timing-quick) ease}.utah-design-system .vertical-menu .utds-icon-before-chevron-right:before{margin-right:0}.utah-design-system .vertical-menu .utds-icon-before-chevron-right.is-open{transform:rotate(90deg)}