diff --git a/packages/uvalib-alerts/demo/regional.html b/packages/uvalib-alerts/demo/regional.html index 0bd3cc8..d2755e9 100644 --- a/packages/uvalib-alerts/demo/regional.html +++ b/packages/uvalib-alerts/demo/regional.html @@ -15,6 +15,6 @@ - + diff --git a/packages/uvalib-alerts/demo/uvalib-alerts-regional.js b/packages/uvalib-alerts/demo/uvalib-alerts-regional.js index d36d80a..86195c3 100644 --- a/packages/uvalib-alerts/demo/uvalib-alerts-regional.js +++ b/packages/uvalib-alerts/demo/uvalib-alerts-regional.js @@ -1 +1 @@ -import"./icons-be9eff67.js";const n=new CSSStyleSheet;n.replaceSync('/** @color Black */\n/** @color White */\n/** @color Danger */\n/** @color Success */\n/* OFFICIAL 2019-2020 BRAND COLORS */\n/**\n * @color Blue (lightest)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Blue (lighter)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Blue (light)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Blue\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Orange (lightest)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Orange (lighter)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Orange (light)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Orange\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Orange (dark)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Orange (darker)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Alternative Blue (lightest)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Alternative Blue (lighter)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Alternative Blue (light)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Alternative Blue\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Alternative Blue (dark)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Alternative Blue (darkest)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Teal (lightest)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Teal (light)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Teal\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Teal (dark)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Teal (darker)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Green (lightest)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Green (lighter)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Green\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Green (dark)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Red (lightest)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Red\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Red (dark)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Red (darker)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Yellow (light)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Yellow (lightest)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Yellow\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Yellow (dark)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Beige\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Beige (dark)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Grey (lightest)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Grey (light)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Grey\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Grey Dark\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Grey Darkest\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Text Light\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Red Emergency\n * @section 2019-2020 Brand Colors\n */\n/*Secondary Brand Colors*/\n/**\n * @color Secondary Web Orange\n * @section Secondary Brand Colors\n */\n/**\n * @color Secondary Web Blue\n * @section Secondary Brand Colors\n */\n/**\n * @color Secondary Cyan\n * @section Secondary Brand Colors\n */\n/**\n * @color Secondary Yellow\n * @section Secondary Brand Colors\n */\n/**\n * @color Secondary Teal\n * @section Secondary Brand Colors\n */\n/**\n * @color Secondary Magenta\n * @section Secondary Brand Colors\n */\n/**\n * @color Secondary Green (ADA compliant)\n * @section Secondary Brand Colors\n */\n/*ADA compliant*/\n/**\n * @color Secondary Light Gray\n * @section Secondary Brand Colors\n */\n/**\n * @color Secondary Medium Gray\n * @section Secondary Brand Colors\n */\n/**\n * @color Secondary Text Grey (ADA compliant)\n * @section Secondary Brand Colors\n */\n/*ADA compliant*/\n/**\n * @color Secondary Dark Grey (ADA compliant for hover over shaded table rows)\n * @section Secondary Brand Colors\n */\n/*ADA compliant for hover over shaded table rows*/\n/**\n * @color Secondary Text Almost Black (ADA compliant)\n * @section Secondary Brand Colors\n */\n/*ADA compliant*/\n/**\n * @color Secondary Emergency Red (ADA compliant)\n * @section Secondary Brand Colors\n */\n/*ADA compliant*/\n/* PHASE OUT THE CODE BELOW */\n/* Brand Color Palate*/\n/* link colors for body links */\n/* Other color palette */\n/* color variables */\n/*var(--uvalib-blue-700);*/\n/* paper components reference this */\n/* testing out colors for focus states */\n/* Color Remapping */\n/** @color Black */\n/** @color White */\n/** @color Danger */\n/** @color Success */\n/* OFFICIAL 2019-2020 BRAND COLORS */\n/**\n * @color Blue (lightest)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Blue (lighter)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Blue (light)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Blue\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Orange (lightest)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Orange (lighter)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Orange (light)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Orange\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Orange (dark)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Orange (darker)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Alternative Blue (lightest)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Alternative Blue (lighter)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Alternative Blue (light)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Alternative Blue\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Alternative Blue (dark)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Alternative Blue (darkest)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Teal (lightest)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Teal (light)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Teal\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Teal (dark)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Teal (darker)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Green (lightest)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Green (lighter)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Green\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Green (dark)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Red (lightest)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Red\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Red (dark)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Red (darker)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Yellow (light)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Yellow (lightest)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Yellow\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Yellow (dark)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Beige\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Beige (dark)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Grey (lightest)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Grey (light)\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Grey\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Grey Dark\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Grey Darkest\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Text Light\n * @section 2019-2020 Brand Colors\n */\n/**\n * @color Red Emergency\n * @section 2019-2020 Brand Colors\n */\n/*Secondary Brand Colors*/\n/**\n * @color Secondary Web Orange\n * @section Secondary Brand Colors\n */\n/**\n * @color Secondary Web Blue\n * @section Secondary Brand Colors\n */\n/**\n * @color Secondary Cyan\n * @section Secondary Brand Colors\n */\n/**\n * @color Secondary Yellow\n * @section Secondary Brand Colors\n */\n/**\n * @color Secondary Teal\n * @section Secondary Brand Colors\n */\n/**\n * @color Secondary Magenta\n * @section Secondary Brand Colors\n */\n/**\n * @color Secondary Green (ADA compliant)\n * @section Secondary Brand Colors\n */\n/*ADA compliant*/\n/**\n * @color Secondary Light Gray\n * @section Secondary Brand Colors\n */\n/**\n * @color Secondary Medium Gray\n * @section Secondary Brand Colors\n */\n/**\n * @color Secondary Text Grey (ADA compliant)\n * @section Secondary Brand Colors\n */\n/*ADA compliant*/\n/**\n * @color Secondary Dark Grey (ADA compliant for hover over shaded table rows)\n * @section Secondary Brand Colors\n */\n/*ADA compliant for hover over shaded table rows*/\n/**\n * @color Secondary Text Almost Black (ADA compliant)\n * @section Secondary Brand Colors\n */\n/*ADA compliant*/\n/**\n * @color Secondary Emergency Red (ADA compliant)\n * @section Secondary Brand Colors\n */\n/*ADA compliant*/\n/* PHASE OUT THE CODE BELOW */\n/* Brand Color Palate*/\n/* link colors for body links */\n/* Other color palette */\n/* color variables */\n/*var(--uvalib-blue-700);*/\n/* paper components reference this */\n/* testing out colors for focus states */\n/* Color Remapping */\n/* common scsss variables for V4 client */\n/* small media width */\n/* spacing unit of measure */\n/* font variables */\n/* be sure to load fonts.js */\n/*Pulling in fonts via Typekit, weights will pull in font variants*/\n/*try to refrain from using this one, difficult to read on small screens*/\n/*not used?*/\n/* Main sizing unit - changing this will update most of the font size/spacing variables on the site */\n/* typography variables */\n/* used for headers in card body */\n/* main body font */\n.fa, .fas, .far, .icon-window-close-regular, .fal, .icon-exclamation-circle, .icon-exclamation-triangle, .icon-info-circle, .icon-ban, .icon-check-circle, .icon-clock, .icon-comment-dots, .icon-user-circle, .icon-bell, .icon-chevron-circle-up, .icon-search, .icon-check, .icon-external-link-alt, .icon-search-plus, .icon-university, .icon-plus, .icon-minus, .icon-caret-up, .icon-caret-down, .icon-quote-right, .icon-print, .icon-copy, .icon-edit, .icon-trash-alt, .icon-download, .icon-calendar-alt, .icon-file-pdf, .icon-envelope, .icon-bookmark, .icon-times-circle, .icon-plus-circle, .icon-redo-alt, .icon-chevron-double-left, .icon-chevron-double-right, .icon-arrow-right, .icon-arrow-left, .icon-star, .fad, .fab, .icon-facebook-square, .icon-instagram, .icon-twitter-square, .icon-vimeo, .icon-youtube {\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n display: inline-block;\n font-style: normal;\n font-variant: normal;\n text-rendering: auto;\n line-height: 1; }\n\n.fa.fa-pull-left, .fas.fa-pull-left, .far.fa-pull-left, .fa-pull-left.icon-window-close-regular, .fal.fa-pull-left, .fa-pull-left.icon-exclamation-circle, .fa-pull-left.icon-exclamation-triangle, .fa-pull-left.icon-info-circle, .fa-pull-left.icon-ban, .fa-pull-left.icon-check-circle, .fa-pull-left.icon-clock, .fa-pull-left.icon-comment-dots, .fa-pull-left.icon-user-circle, .fa-pull-left.icon-bell, .fa-pull-left.icon-chevron-circle-up, .fa-pull-left.icon-search, .fa-pull-left.icon-check, .fa-pull-left.icon-external-link-alt, .fa-pull-left.icon-search-plus, .fa-pull-left.icon-university, .fa-pull-left.icon-plus, .fa-pull-left.icon-minus, .fa-pull-left.icon-caret-up, .fa-pull-left.icon-caret-down, .fa-pull-left.icon-quote-right, .fa-pull-left.icon-print, .fa-pull-left.icon-copy, .fa-pull-left.icon-edit, .fa-pull-left.icon-trash-alt, .fa-pull-left.icon-download, .fa-pull-left.icon-calendar-alt, .fa-pull-left.icon-file-pdf, .fa-pull-left.icon-envelope, .fa-pull-left.icon-bookmark, .fa-pull-left.icon-times-circle, .fa-pull-left.icon-plus-circle, .fa-pull-left.icon-redo-alt, .fa-pull-left.icon-chevron-double-left, .fa-pull-left.icon-chevron-double-right, .fa-pull-left.icon-arrow-right, .fa-pull-left.icon-arrow-left, .fa-pull-left.icon-star, .fab.fa-pull-left, .fa-pull-left.icon-facebook-square, .fa-pull-left.icon-instagram, .fa-pull-left.icon-twitter-square, .fa-pull-left.icon-vimeo, .fa-pull-left.icon-youtube {\n margin-right: .3em; }\n\n.fa.fa-pull-right, .fas.fa-pull-right, .far.fa-pull-right, .fa-pull-right.icon-window-close-regular, .fal.fa-pull-right, .fa-pull-right.icon-exclamation-circle, .fa-pull-right.icon-exclamation-triangle, .fa-pull-right.icon-info-circle, .fa-pull-right.icon-ban, .fa-pull-right.icon-check-circle, .fa-pull-right.icon-clock, .fa-pull-right.icon-comment-dots, .fa-pull-right.icon-user-circle, .fa-pull-right.icon-bell, .fa-pull-right.icon-chevron-circle-up, .fa-pull-right.icon-search, .fa-pull-right.icon-check, .fa-pull-right.icon-external-link-alt, .fa-pull-right.icon-search-plus, .fa-pull-right.icon-university, .fa-pull-right.icon-plus, .fa-pull-right.icon-minus, .fa-pull-right.icon-caret-up, .fa-pull-right.icon-caret-down, .fa-pull-right.icon-quote-right, .fa-pull-right.icon-print, .fa-pull-right.icon-copy, .fa-pull-right.icon-edit, .fa-pull-right.icon-trash-alt, .fa-pull-right.icon-download, .fa-pull-right.icon-calendar-alt, .fa-pull-right.icon-file-pdf, .fa-pull-right.icon-envelope, .fa-pull-right.icon-bookmark, .fa-pull-right.icon-times-circle, .fa-pull-right.icon-plus-circle, .fa-pull-right.icon-redo-alt, .fa-pull-right.icon-chevron-double-left, .fa-pull-right.icon-chevron-double-right, .fa-pull-right.icon-arrow-right, .fa-pull-right.icon-arrow-left, .fa-pull-right.icon-star, .fab.fa-pull-right, .fa-pull-right.icon-facebook-square, .fa-pull-right.icon-instagram, .fa-pull-right.icon-twitter-square, .fa-pull-right.icon-vimeo, .fa-pull-right.icon-youtube {\n margin-left: .3em; }\n\n.fal, .icon-exclamation-circle, .icon-exclamation-triangle, .icon-info-circle, .icon-ban, .icon-check-circle, .icon-clock, .icon-comment-dots, .icon-user-circle, .icon-bell, .icon-chevron-circle-up, .icon-search, .icon-check, .icon-external-link-alt, .icon-search-plus, .icon-university, .icon-plus, .icon-minus, .icon-caret-up, .icon-caret-down, .icon-quote-right, .icon-print, .icon-copy, .icon-edit, .icon-trash-alt, .icon-download, .icon-calendar-alt, .icon-file-pdf, .icon-envelope, .icon-bookmark, .icon-times-circle, .icon-plus-circle, .icon-redo-alt, .icon-chevron-double-left, .icon-chevron-double-right, .icon-arrow-right, .icon-arrow-left, .icon-star {\n font-family: \'Font Awesome 5 Pro\';\n font-weight: 300; }\n\n.fab, .icon-facebook-square, .icon-instagram, .icon-twitter-square, .icon-vimeo, .icon-youtube {\n font-family: \'Font Awesome 5 Brands\';\n font-weight: 400; }\n\n.far, .icon-window-close-regular {\n font-family: \'Font Awesome 5 Pro\';\n font-weight: 400; }\n\n/**\n * Critical, Emergency Alerts / Attention Status\n *\n * @atom .icon-exclamation-circle\n * @section Icons\n * @markup\n * \n */\n.icon-exclamation-circle:before {\n content: "\\f06a"; }\n\n/**\n * Warning Alerts / Modified Status\n *\n * @atom .icon-exclamation-triangle\n * @section Icons\n * @markup\n * \n */\n.icon-exclamation-triangle:before {\n content: "\\f071"; }\n\n/**\n * Info / FYI / Informational Alerts\n *\n * @atom .icon-info-circle\n * @section Icons\n * @markup\n * \n */\n.icon-info-circle:before {\n content: "\\f05a"; }\n\n/**\n * Error, Problem Alerts / Not Available\n *\n * @atom .icon-ban\n * @section Icons\n * @markup\n * \n */\n.icon-ban:before {\n content: "\\f05e"; }\n\n/**\n * Success / Conformation Alerts\n *\n * @atom .icon-check-circle\n * @section Icons\n * @markup\n * \n */\n.icon-check-circle:before {\n content: "\\f058"; }\n\n/**\n * Hours\n *\n * @atom .icon-clock\n * @section Icons\n * @markup\n * \n */\n.icon-clock:before {\n content: "\\f017"; }\n\n/**\n * Ask a Librarian\n *\n * @atom .icon-comment-dots\n * @section Icons\n * @markup\n * \n */\n.icon-comment-dots:before {\n content: "\\f4ad"; }\n\n/**\n * Account / MyAccount\n *\n * @atom .icon-user-circle\n * @section Icons\n * @markup\n * \n */\n.icon-user-circle:before {\n content: "\\f2bd"; }\n\n/**\n * Alert (appears in navbar)\n *\n * @atom .icon-bell\n * @section Icons\n * @markup\n * \n */\n.icon-bell:before {\n content: "\\f0f3"; }\n\n/**\n * Return to top\n *\n * @atom .icon-chevron-circle-up\n * @section Icons\n * @markup\n * \n */\n.icon-chevron-circle-up:before {\n content: "\\f139"; }\n\n/**\n * Search\n *\n * @atom .icon-search\n * @section Icons\n * @markup\n * \n */\n.icon-search:before {\n content: "\\f002"; }\n\n/**\n * Status Available / Conformation\n *\n * @atom .icon-check\n * @section Icons\n * @markup\n * \n */\n.icon-check:before {\n content: "\\f00c"; }\n\n/**\n * External Link\n *\n * @atom .icon-external-link-alt\n * @section Icons\n * @markup\n * \n */\n.icon-external-link-alt:before {\n content: "\\f35d"; }\n\n/**\n * Image Expand\n *\n * @atom .icon-search-plus\n * @section Icons\n * @markup\n * \n */\n.icon-search-plus:before {\n content: "\\f00e"; }\n\n/**\n * Course Reserves\n *\n * @atom .icon-university\n * @section Icons\n * @markup\n * \n */\n.icon-university:before {\n content: "\\f19c"; }\n\n/**\n * Accordion Expand\n *\n * @atom .icon-plus\n * @section Icons\n * @markup\n * \n */\n.icon-plus:before {\n content: "\\f067"; }\n\n/**\n * Accordion Collapse\n *\n * @atom .icon-minus\n * @section Icons\n * @markup\n * \n */\n.icon-minus:before {\n content: "\\f068"; }\n\n/**\n * Drop Down Menu up\n *\n * @atom .icon-caret-up\n * @section Icons\n * @markup\n * \n */\n.icon-caret-up:before {\n content: "\\f0d8"; }\n\n/**\n * Drop Down Menu down \n *\n * @atom .icon-caret-down\n * @section Icons\n * @markup\n * \n */\n.icon-caret-down:before {\n content: "\\f0d7"; }\n\n/**\n * Cite\n *\n * @atom .icon-quote-right\n * @section Icons\n * @markup\n * \n */\n.icon-quote-right:before {\n content: "\\f10e"; }\n\n/**\n * Print\n *\n * @atom .icon-print\n * @section Icons\n * @markup\n * \n */\n.icon-print:before {\n content: "\\f02f"; }\n\n/**\n * Copy\n *\n * @atom .icon-copy\n * @section Icons\n * @markup\n * \n */\n.icon-copy:before {\n content: "\\f0c5"; }\n\n/**\n * Edit\n *\n * @atom .icon-edit\n * @section Icons\n * @markup\n * \n */\n.icon-edit:before {\n content: "\\f044"; }\n\n/**\n * Delete\n *\n * @atom .icon-trash-alt\n * @section Icons\n * @markup\n * \n */\n.icon-trash-alt:before {\n content: "\\f2ed"; }\n\n/**\n * Download\n *\n * @atom .icon-download\n * @section Icons\n * @markup\n * \n */\n.icon-download:before {\n content: "\\f019"; }\n\n/**\n * Calendar \n *\n * @atom .icon-calendar-alt\n * @section Icons\n * @markup\n * \n */\n.icon-calendar-alt:before {\n content: "\\f073"; }\n\n/**\n * PDF \n *\n * @atom .icon-file-pdf\n * @section Icons\n * @markup\n * \n */\n.icon-file-pdf:before {\n content: "\\f1c1"; }\n\n/**\n * Facebook\n *\n * @atom .icon-facebook-square\n * @section Icons\n * @markup\n * \n */\n.icon-facebook-square:before {\n content: "\\f082"; }\n\n/**\n * Instagram\n *\n * @atom .icon-instagram\n * @section Icons\n * @markup\n * \n */\n.icon-instagram:before {\n content: "\\f16d"; }\n\n/**\n * Twitter\n *\n * @atom .icon-twitter-square\n * @section Icons\n * @markup\n * \n */\n.icon-twitter-square:before {\n content: "\\f081"; }\n\n/**\n * Vimeo\n *\n * @atom .icon-vimeo\n * @section Icons\n * @markup\n * \n */\n.icon-vimeo:before {\n content: "\\f40a"; }\n\n/**\n * Youtube\n *\n * @atom .icon-youtube\n * @section Icons\n * @markup\n * \n */\n.icon-youtube:before {\n content: "\\f167"; }\n\n/**\n * Email\n *\n * @atom .icon-envelope\n * @section Icons\n * @markup\n * \n */\n.icon-envelope:before {\n content: "\\f0e0"; }\n\n/**\n * Bookmark\n *\n * @atom .icon-bookmark\n * @section Icons\n * @markup\n * \n */\n.icon-bookmark:before {\n content: "\\f02e"; }\n\n/**\n * Close Window / Close Dialog\n *\n * @atom .icon-window-close\n * @section Icons\n * @markup\n * \n */\n.icon-window-close-regular:before {\n content: "\\f2d3"; }\n\n/**\n * Remove Search Criteria\n *\n * @atom .icon-x-circle\n * @section Icons\n * @markup\n * \n */\n.icon-times-circle:before {\n content: "\\f057"; }\n\n/**\n * Add Criteria\n * \n * @atom .icon-plus-circle\n * @section Icons\n * @markup\n * \n */\n.icon-plus-circle:before {\n content: "\\f055"; }\n\n/**\n * Refresh Page / Reload / Reset\n * @atom .icon-redo-alt\n * @section Icons\n * @markup\n * \n */\n.icon-redo-alt:before {\n content: "\\f2f9"; }\n\n/**\n * Slide Left (on page)\n *\n * @atom .icon-chevron-double-left\n * @section Icons\n * @markup\n * \n */\n.icon-chevron-double-left:before {\n content: "\\f323"; }\n\n/**\n * Slide Right (on page)\n *\n * @atom .icon-chevron-double-right\n * @section Icons\n * @markup\n * \n */\n.icon-chevron-double-right:before {\n content: "\\f324"; }\n\n/**\n * Page Forward\n *\n * @atom .icon-arrow-right\n * @section Icons\n * @markup\n * \n */\n.icon-arrow-right:before {\n content: "\\f178"; }\n\n/**\n * Page Back\n *\n * @atom .icon-arrow-left\n * @section Icons\n * @markup\n * \n */\n.icon-arrow-left:before {\n content: "\\f177"; }\n\n/**\n * Special Selected / Preferred\n *\n * @atom .icon-star\n * @section Icons\n * @markup\n * \n */\n.icon-star:before {\n content: "\\f005"; }\n\n/* common scsss variables for V4 client */\n/* small media width */\n/* spacing unit of measure */\n:host {\n display: none;\n font-family: "franklin-gothic-urw", arial, sans-serif;\n font-weight: 400;\n font-style: normal;\n font-size: 16px;\n line-height: calc($uvalib-main-font-size-unit*1.25);\n color: #595959; }\n\n[hidden] {\n display: none; }\n\n/*END*/\n/* Custom Backgrounds */\n.alertbox {\n position: relative;\n padding: .75rem 1.25rem;\n margin-bottom: 1rem;\n border: 1px solid transparent;\n border-radius: .25rem; }\n\n.alertbox h2:first-of-type {\n margin-top: .5rem; }\n\n.alertbox-primary {\n background-color: #C8F2F4;\n border-color: #5BD7DE;\n color: #2B2B2B; }\n'),document.adoptedStyleSheets=[...document.adoptedStyleSheets,n];class o extends HTMLElement{static get observedAttributes(){return["override","alerts","url"]}get override(){return!!this._override}set override(n){this._override=!!n}get alerts(){return this._alerts}set alerts(n){this._alerts=Array.isArray(n)?n:[],this._updateAlerts()}get url(){return this._url}set url(n){this._url=n}attributeChangedCallback(n,o,e){switch(n){case"override":this.override=""===e;break;case"alerts":this.alerts=JSON.parse(e);break;case"url":this.url=e}}constructor(){super(),this._setupDom()}connectedCallback(){this.override||this._setupAlertsModel(),window.addEventListener("popstate",function(n){this._updateAlerts()}.bind(this))}_setupAlertsModel(){import("./debounce-2d1f3432.js").then(function(n){import("./uvalib-model-realtime-database-5f0d0bc2.js").then(function(){this._alertsModel=document.createElement("uvalib-model-realtime-database"),this._alertsModel.addEventListener("uvalib-model-data-value",n.default(function(n){this.alerts=n.detail}.bind(this),300).bind(this)),this._alertsModel.setAttribute("auto",""),this._alertsModel.setAttribute("path","regionalalerts"),this._alertsModel.setAttribute("database","https://uvalib-api.firebaseio.com/"),this.shadow.appendChild(this._alertsModel)}.bind(this))}.bind(this))}_updateAlerts(){var n=this.alerts;Array.isArray(n)&&n.length>0&&(console.log(n),n=n.filter(n=>this._matchesURL(n.url)),Array.isArray(n)&&n.length>0?(console.log(n),this._alertsContainer.innerHTML="",n.forEach(n=>{this._alertsContainer.innerHTML+=`\n
${n.body}
\n `}),this._setupStyle(),this._alertsContainer.removeAttribute("hidden"),this.style.display="block"):(this._alertsContainer.setAttribute("hidden",""),this.style.display="none"))}_matchesURL(n){Array.isArray(n)||(n=[{value:n}]);for(var o=0;o\n */\n.icon-exclamation-circle:before {\n content: "\\f06a"; }\n\n/**\n * Warning Alerts / Modified Status\n *\n * @atom .icon-exclamation-triangle\n * @section Icons\n * @markup\n * \n */\n.icon-exclamation-triangle:before {\n content: "\\f071"; }\n\n/**\n * Info / FYI / Informational Alerts\n *\n * @atom .icon-info-circle\n * @section Icons\n * @markup\n * \n */\n.icon-info-circle:before {\n content: "\\f05a"; }\n\n/**\n * Error, Problem Alerts / Not Available\n *\n * @atom .icon-ban\n * @section Icons\n * @markup\n * \n */\n.icon-ban:before {\n content: "\\f05e"; }\n\n/**\n * Success / Conformation Alerts\n *\n * @atom .icon-check-circle\n * @section Icons\n * @markup\n * \n */\n.icon-check-circle:before {\n content: "\\f058"; }\n\n/**\n * Hours\n *\n * @atom .icon-clock\n * @section Icons\n * @markup\n * \n */\n.icon-clock:before {\n content: "\\f017"; }\n\n/**\n * Ask a Librarian\n *\n * @atom .icon-comment-dots\n * @section Icons\n * @markup\n * \n */\n.icon-comment-dots:before {\n content: "\\f4ad"; }\n\n/**\n * Account / MyAccount\n *\n * @atom .icon-user-circle\n * @section Icons\n * @markup\n * \n */\n.icon-user-circle:before {\n content: "\\f2bd"; }\n\n/**\n * Alert (appears in navbar)\n *\n * @atom .icon-bell\n * @section Icons\n * @markup\n * \n */\n.icon-bell:before {\n content: "\\f0f3"; }\n\n/**\n * Return to top\n *\n * @atom .icon-chevron-circle-up\n * @section Icons\n * @markup\n * \n */\n.icon-chevron-circle-up:before {\n content: "\\f139"; }\n\n/**\n * Search\n *\n * @atom .icon-search\n * @section Icons\n * @markup\n * \n */\n.icon-search:before {\n content: "\\f002"; }\n\n/**\n * Status Available / Conformation\n *\n * @atom .icon-check\n * @section Icons\n * @markup\n * \n */\n.icon-check:before {\n content: "\\f00c"; }\n\n/**\n * External Link\n *\n * @atom .icon-external-link-alt\n * @section Icons\n * @markup\n * \n */\n.icon-external-link-alt:before {\n content: "\\f35d"; }\n\n/**\n * Image Expand\n *\n * @atom .icon-search-plus\n * @section Icons\n * @markup\n * \n */\n.icon-search-plus:before {\n content: "\\f00e"; }\n\n/**\n * Course Reserves\n *\n * @atom .icon-university\n * @section Icons\n * @markup\n * \n */\n.icon-university:before {\n content: "\\f19c"; }\n\n/**\n * Accordion Expand\n *\n * @atom .icon-plus\n * @section Icons\n * @markup\n * \n */\n.icon-plus:before {\n content: "\\f067"; }\n\n/**\n * Accordion Collapse\n *\n * @atom .icon-minus\n * @section Icons\n * @markup\n * \n */\n.icon-minus:before {\n content: "\\f068"; }\n\n/**\n * Drop Down Menu up\n *\n * @atom .icon-caret-up\n * @section Icons\n * @markup\n * \n */\n.icon-caret-up:before {\n content: "\\f0d8"; }\n\n/**\n * Drop Down Menu down \n *\n * @atom .icon-caret-down\n * @section Icons\n * @markup\n * \n */\n.icon-caret-down:before {\n content: "\\f0d7"; }\n\n/**\n * Cite\n *\n * @atom .icon-quote-right\n * @section Icons\n * @markup\n * \n */\n.icon-quote-right:before {\n content: "\\f10e"; }\n\n/**\n * Print\n *\n * @atom .icon-print\n * @section Icons\n * @markup\n * \n */\n.icon-print:before {\n content: "\\f02f"; }\n\n/**\n * Copy\n *\n * @atom .icon-copy\n * @section Icons\n * @markup\n * \n */\n.icon-copy:before {\n content: "\\f0c5"; }\n\n/**\n * Edit\n *\n * @atom .icon-edit\n * @section Icons\n * @markup\n * \n */\n.icon-edit:before {\n content: "\\f044"; }\n\n/**\n * Delete\n *\n * @atom .icon-trash-alt\n * @section Icons\n * @markup\n * \n */\n.icon-trash-alt:before {\n content: "\\f2ed"; }\n\n/**\n * Download\n *\n * @atom .icon-download\n * @section Icons\n * @markup\n * \n */\n.icon-download:before {\n content: "\\f019"; }\n\n/**\n * Calendar \n *\n * @atom .icon-calendar-alt\n * @section Icons\n * @markup\n * \n */\n.icon-calendar-alt:before {\n content: "\\f073"; }\n\n/**\n * PDF \n *\n * @atom .icon-file-pdf\n * @section Icons\n * @markup\n * \n */\n.icon-file-pdf:before {\n content: "\\f1c1"; }\n\n/**\n * Facebook\n *\n * @atom .icon-facebook-square\n * @section Icons\n * @markup\n * \n */\n.icon-facebook-square:before {\n content: "\\f082"; }\n\n/**\n * Instagram\n *\n * @atom .icon-instagram\n * @section Icons\n * @markup\n * \n */\n.icon-instagram:before {\n content: "\\f16d"; }\n\n/**\n * Twitter\n *\n * @atom .icon-twitter-square\n * @section Icons\n * @markup\n * \n */\n.icon-twitter-square:before {\n content: "\\f081"; }\n\n/**\n * Vimeo\n *\n * @atom .icon-vimeo\n * @section Icons\n * @markup\n * \n */\n.icon-vimeo:before {\n content: "\\f40a"; }\n\n/**\n * Youtube\n *\n * @atom .icon-youtube\n * @section Icons\n * @markup\n * \n */\n.icon-youtube:before {\n content: "\\f167"; }\n\n/**\n * Email\n *\n * @atom .icon-envelope\n * @section Icons\n * @markup\n * \n */\n.icon-envelope:before {\n content: "\\f0e0"; }\n\n/**\n * Bookmark\n *\n * @atom .icon-bookmark\n * @section Icons\n * @markup\n * \n */\n.icon-bookmark:before {\n content: "\\f02e"; }\n\n/**\n * Close Window / Close Dialog\n *\n * @atom .icon-window-close\n * @section Icons\n * @markup\n * \n */\n.icon-window-close-regular:before {\n content: "\\f2d3"; }\n\n/**\n * Remove Search Criteria\n *\n * @atom .icon-x-circle\n * @section Icons\n * @markup\n * \n */\n.icon-times-circle:before {\n content: "\\f057"; }\n\n/**\n * Add Criteria\n * \n * @atom .icon-plus-circle\n * @section Icons\n * @markup\n * \n */\n.icon-plus-circle:before {\n content: "\\f055"; }\n\n/**\n * Refresh Page / Reload / Reset\n * @atom .icon-redo-alt\n * @section Icons\n * @markup\n * \n */\n.icon-redo-alt:before {\n content: "\\f2f9"; }\n\n/**\n * Slide Left (on page)\n *\n * @atom .icon-chevron-double-left\n * @section Icons\n * @markup\n * \n */\n.icon-chevron-double-left:before {\n content: "\\f323"; }\n\n/**\n * Slide Right (on page)\n *\n * @atom .icon-chevron-double-right\n * @section Icons\n * @markup\n * \n */\n.icon-chevron-double-right:before {\n content: "\\f324"; }\n\n/**\n * Page Forward\n *\n * @atom .icon-arrow-right\n * @section Icons\n * @markup\n * \n */\n.icon-arrow-right:before {\n content: "\\f178"; }\n\n/**\n * Page Back\n *\n * @atom .icon-arrow-left\n * @section Icons\n * @markup\n * \n */\n.icon-arrow-left:before {\n content: "\\f177"; }\n\n/**\n * Special Selected / Preferred\n *\n * @atom .icon-star\n * @section Icons\n * @markup\n * \n */\n.icon-star:before {\n content: "\\f005"; }\n\n/* common scsss variables for V4 client */\n/* small media width */\n/* spacing unit of measure */\n:host {\n display: none;\n font-family: "franklin-gothic-urw", arial, sans-serif;\n font-weight: 400;\n font-style: normal;\n font-size: 16px;\n line-height: calc($uvalib-main-font-size-unit*1.25);\n color: #595959; }\n\n[hidden] {\n display: none; }\n\n.uva-alert {\n font-size: 1.06rem;\n line-height: 1.5;\n position: relative;\n color: #2B2B2B; }\n\n.uva-alert--r1, .uva-alert--r2 {\n border: 0.2em solid var(--alert-border-color);\n border-radius: 0.5em;\n padding: 0.75rem 1rem;\n margin-bottom: 1rem; }\n\n.uva-alert--r1 {\n background-color: #FEF6C8;\n --alert-border-color: $uvalib-alert-r1-border; }\n\n.uva-alert--r2 {\n background-color: #C8F2F4;\n --alert-border-color: $uvalib-alert-r2-border; }\n\n.uva-alert__body {\n padding-left: 1.25rem;\n display: table-cell;\n vertical-align: top; }\n\n.uva-alert__text, .uva-alert__text p {\n margin-bottom: 0;\n margin-top: 0; }\n'),document.adoptedStyleSheets=[...document.adoptedStyleSheets,n];class o extends HTMLElement{static get observedAttributes(){return["override","alerts","url"]}get override(){return!!this._override}set override(n){this._override=!!n}get alerts(){return this._alerts}set alerts(n){this._alerts=Array.isArray(n)?n:[],this._updateAlerts()}get url(){return this._url}set url(n){this._url=n}attributeChangedCallback(n,o,e){switch(n){case"override":this.override=""===e;break;case"alerts":this.alerts=JSON.parse(e);break;case"url":this.url=e}}constructor(){super(),this._setupDom()}connectedCallback(){this.override||this._setupAlertsModel(),window.addEventListener("popstate",function(n){this._updateAlerts()}.bind(this))}_setupAlertsModel(){import("./debounce-2d1f3432.js").then(function(n){import("./uvalib-model-realtime-database-5f0d0bc2.js").then(function(){this._alertsModel=document.createElement("uvalib-model-realtime-database"),this._alertsModel.addEventListener("uvalib-model-data-value",n.default(function(n){this.alerts=n.detail}.bind(this),300).bind(this)),this._alertsModel.setAttribute("auto",""),this._alertsModel.setAttribute("path","regionalalerts"),this._alertsModel.setAttribute("database","https://uvalib-api.firebaseio.com/"),this.shadow.appendChild(this._alertsModel)}.bind(this))}.bind(this))}_updateAlerts(){var n=this.alerts;Array.isArray(n)&&n.length>0&&(console.log(n),n=n.filter(n=>this._matchesURL(n.url)),Array.isArray(n)&&n.length>0?(console.log(n),this._alertsContainer.innerHTML="",n.forEach(n=>{this._alertsContainer.innerHTML+=`\n
\n
\n
${n.body}
\n
\n
\n `}),this._setupStyle(),this._alertsContainer.removeAttribute("hidden"),this.style.display="block"):(this._alertsContainer.setAttribute("hidden",""),this.style.display="none"))}_matchesURL(n){Array.isArray(n)||(n=[{value:n}]);for(var o=0;o\n */\n.icon-exclamation-circle:before {\n content: "\\f06a"; }\n\n/**\n * Warning Alerts / Modified Status\n *\n * @atom .icon-exclamation-triangle\n * @section Icons\n * @markup\n * \n */\n.icon-exclamation-triangle:before {\n content: "\\f071"; }\n\n/**\n * Info / FYI / Informational Alerts\n *\n * @atom .icon-info-circle\n * @section Icons\n * @markup\n * \n */\n.icon-info-circle:before {\n content: "\\f05a"; }\n\n/**\n * Error, Problem Alerts / Not Available\n *\n * @atom .icon-ban\n * @section Icons\n * @markup\n * \n */\n.icon-ban:before {\n content: "\\f05e"; }\n\n/**\n * Success / Conformation Alerts\n *\n * @atom .icon-check-circle\n * @section Icons\n * @markup\n * \n */\n.icon-check-circle:before {\n content: "\\f058"; }\n\n/**\n * Hours\n *\n * @atom .icon-clock\n * @section Icons\n * @markup\n * \n */\n.icon-clock:before {\n content: "\\f017"; }\n\n/**\n * Ask a Librarian\n *\n * @atom .icon-comment-dots\n * @section Icons\n * @markup\n * \n */\n.icon-comment-dots:before {\n content: "\\f4ad"; }\n\n/**\n * Account / MyAccount\n *\n * @atom .icon-user-circle\n * @section Icons\n * @markup\n * \n */\n.icon-user-circle:before {\n content: "\\f2bd"; }\n\n/**\n * Alert (appears in navbar)\n *\n * @atom .icon-bell\n * @section Icons\n * @markup\n * \n */\n.icon-bell:before {\n content: "\\f0f3"; }\n\n/**\n * Return to top\n *\n * @atom .icon-chevron-circle-up\n * @section Icons\n * @markup\n * \n */\n.icon-chevron-circle-up:before {\n content: "\\f139"; }\n\n/**\n * Search\n *\n * @atom .icon-search\n * @section Icons\n * @markup\n * \n */\n.icon-search:before {\n content: "\\f002"; }\n\n/**\n * Status Available / Conformation\n *\n * @atom .icon-check\n * @section Icons\n * @markup\n * \n */\n.icon-check:before {\n content: "\\f00c"; }\n\n/**\n * External Link\n *\n * @atom .icon-external-link-alt\n * @section Icons\n * @markup\n * \n */\n.icon-external-link-alt:before {\n content: "\\f35d"; }\n\n/**\n * Image Expand\n *\n * @atom .icon-search-plus\n * @section Icons\n * @markup\n * \n */\n.icon-search-plus:before {\n content: "\\f00e"; }\n\n/**\n * Course Reserves\n *\n * @atom .icon-university\n * @section Icons\n * @markup\n * \n */\n.icon-university:before {\n content: "\\f19c"; }\n\n/**\n * Accordion Expand\n *\n * @atom .icon-plus\n * @section Icons\n * @markup\n * \n */\n.icon-plus:before {\n content: "\\f067"; }\n\n/**\n * Accordion Collapse\n *\n * @atom .icon-minus\n * @section Icons\n * @markup\n * \n */\n.icon-minus:before {\n content: "\\f068"; }\n\n/**\n * Drop Down Menu up\n *\n * @atom .icon-caret-up\n * @section Icons\n * @markup\n * \n */\n.icon-caret-up:before {\n content: "\\f0d8"; }\n\n/**\n * Drop Down Menu down \n *\n * @atom .icon-caret-down\n * @section Icons\n * @markup\n * \n */\n.icon-caret-down:before {\n content: "\\f0d7"; }\n\n/**\n * Cite\n *\n * @atom .icon-quote-right\n * @section Icons\n * @markup\n * \n */\n.icon-quote-right:before {\n content: "\\f10e"; }\n\n/**\n * Print\n *\n * @atom .icon-print\n * @section Icons\n * @markup\n * \n */\n.icon-print:before {\n content: "\\f02f"; }\n\n/**\n * Copy\n *\n * @atom .icon-copy\n * @section Icons\n * @markup\n * \n */\n.icon-copy:before {\n content: "\\f0c5"; }\n\n/**\n * Edit\n *\n * @atom .icon-edit\n * @section Icons\n * @markup\n * \n */\n.icon-edit:before {\n content: "\\f044"; }\n\n/**\n * Delete\n *\n * @atom .icon-trash-alt\n * @section Icons\n * @markup\n * \n */\n.icon-trash-alt:before {\n content: "\\f2ed"; }\n\n/**\n * Download\n *\n * @atom .icon-download\n * @section Icons\n * @markup\n * \n */\n.icon-download:before {\n content: "\\f019"; }\n\n/**\n * Calendar \n *\n * @atom .icon-calendar-alt\n * @section Icons\n * @markup\n * \n */\n.icon-calendar-alt:before {\n content: "\\f073"; }\n\n/**\n * PDF \n *\n * @atom .icon-file-pdf\n * @section Icons\n * @markup\n * \n */\n.icon-file-pdf:before {\n content: "\\f1c1"; }\n\n/**\n * Facebook\n *\n * @atom .icon-facebook-square\n * @section Icons\n * @markup\n * \n */\n.icon-facebook-square:before {\n content: "\\f082"; }\n\n/**\n * Instagram\n *\n * @atom .icon-instagram\n * @section Icons\n * @markup\n * \n */\n.icon-instagram:before {\n content: "\\f16d"; }\n\n/**\n * Twitter\n *\n * @atom .icon-twitter-square\n * @section Icons\n * @markup\n * \n */\n.icon-twitter-square:before {\n content: "\\f081"; }\n\n/**\n * Vimeo\n *\n * @atom .icon-vimeo\n * @section Icons\n * @markup\n * \n */\n.icon-vimeo:before {\n content: "\\f40a"; }\n\n/**\n * Youtube\n *\n * @atom .icon-youtube\n * @section Icons\n * @markup\n * \n */\n.icon-youtube:before {\n content: "\\f167"; }\n\n/**\n * Email\n *\n * @atom .icon-envelope\n * @section Icons\n * @markup\n * \n */\n.icon-envelope:before {\n content: "\\f0e0"; }\n\n/**\n * Bookmark\n *\n * @atom .icon-bookmark\n * @section Icons\n * @markup\n * \n */\n.icon-bookmark:before {\n content: "\\f02e"; }\n\n/**\n * Close Window / Close Dialog\n *\n * @atom .icon-window-close\n * @section Icons\n * @markup\n * \n */\n.icon-window-close-regular:before {\n content: "\\f2d3"; }\n\n/**\n * Remove Search Criteria\n *\n * @atom .icon-x-circle\n * @section Icons\n * @markup\n * \n */\n.icon-times-circle:before {\n content: "\\f057"; }\n\n/**\n * Add Criteria\n * \n * @atom .icon-plus-circle\n * @section Icons\n * @markup\n * \n */\n.icon-plus-circle:before {\n content: "\\f055"; }\n\n/**\n * Refresh Page / Reload / Reset\n * @atom .icon-redo-alt\n * @section Icons\n * @markup\n * \n */\n.icon-redo-alt:before {\n content: "\\f2f9"; }\n\n/**\n * Slide Left (on page)\n *\n * @atom .icon-chevron-double-left\n * @section Icons\n * @markup\n * \n */\n.icon-chevron-double-left:before {\n content: "\\f323"; }\n\n/**\n * Slide Right (on page)\n *\n * @atom .icon-chevron-double-right\n * @section Icons\n * @markup\n * \n */\n.icon-chevron-double-right:before {\n content: "\\f324"; }\n\n/**\n * Page Forward\n *\n * @atom .icon-arrow-right\n * @section Icons\n * @markup\n * \n */\n.icon-arrow-right:before {\n content: "\\f178"; }\n\n/**\n * Page Back\n *\n * @atom .icon-arrow-left\n * @section Icons\n * @markup\n * \n */\n.icon-arrow-left:before {\n content: "\\f177"; }\n\n/**\n * Special Selected / Preferred\n *\n * @atom .icon-star\n * @section Icons\n * @markup\n * \n */\n.icon-star:before {\n content: "\\f005"; }\n\n/* common scsss variables for V4 client */\n/* small media width */\n/* spacing unit of measure */\n:host {\n display: none;\n font-family: "franklin-gothic-urw", arial, sans-serif;\n font-weight: 400;\n font-style: normal;\n font-size: 16px;\n line-height: calc($uvalib-main-font-size-unit*1.25);\n color: #595959; }\n\n[hidden] {\n display: none; }\n\n/*END*/\n/* Custom Backgrounds */\n.alertbox {\n position: relative;\n padding: .75rem 1.25rem;\n margin-bottom: 1rem;\n border: 1px solid transparent;\n border-radius: .25rem; }\n\n.alertbox h2:first-of-type {\n margin-top: .5rem; }\n\n.alertbox-primary {\n background-color: #C8F2F4;\n border-color: #5BD7DE;\n color: #2B2B2B; }\n'),document.adoptedStyleSheets=[...document.adoptedStyleSheets,n];class o extends HTMLElement{static get observedAttributes(){return["override","alerts","url"]}get override(){return!!this._override}set override(n){this._override=!!n}get alerts(){return this._alerts}set alerts(n){this._alerts=Array.isArray(n)?n:[],this._updateAlerts()}get url(){return this._url}set url(n){this._url=n}attributeChangedCallback(n,o,e){switch(n){case"override":this.override=""===e;break;case"alerts":this.alerts=JSON.parse(e);break;case"url":this.url=e}}constructor(){super(),this._setupDom()}connectedCallback(){this.override||this._setupAlertsModel(),window.addEventListener("popstate",function(n){this._updateAlerts()}.bind(this))}_setupAlertsModel(){import("./debounce-2d1f3432.js").then(function(n){import("./uvalib-model-realtime-database-5f0d0bc2.js").then(function(){this._alertsModel=document.createElement("uvalib-model-realtime-database"),this._alertsModel.addEventListener("uvalib-model-data-value",n.default(function(n){this.alerts=n.detail}.bind(this),300).bind(this)),this._alertsModel.setAttribute("auto",""),this._alertsModel.setAttribute("path","regionalalerts"),this._alertsModel.setAttribute("database","https://uvalib-api.firebaseio.com/"),this.shadow.appendChild(this._alertsModel)}.bind(this))}.bind(this))}_updateAlerts(){var n=this.alerts;Array.isArray(n)&&n.length>0&&(console.log(n),n=n.filter(n=>this._matchesURL(n.url)),Array.isArray(n)&&n.length>0?(console.log(n),this._alertsContainer.innerHTML="",n.forEach(n=>{this._alertsContainer.innerHTML+=`\n
${n.body}
\n `}),this._setupStyle(),this._alertsContainer.removeAttribute("hidden"),this.style.display="block"):(this._alertsContainer.setAttribute("hidden",""),this.style.display="none"))}_matchesURL(n){Array.isArray(n)||(n=[{value:n}]);for(var o=0;o\n */\n.icon-exclamation-circle:before {\n content: "\\f06a"; }\n\n/**\n * Warning Alerts / Modified Status\n *\n * @atom .icon-exclamation-triangle\n * @section Icons\n * @markup\n * \n */\n.icon-exclamation-triangle:before {\n content: "\\f071"; }\n\n/**\n * Info / FYI / Informational Alerts\n *\n * @atom .icon-info-circle\n * @section Icons\n * @markup\n * \n */\n.icon-info-circle:before {\n content: "\\f05a"; }\n\n/**\n * Error, Problem Alerts / Not Available\n *\n * @atom .icon-ban\n * @section Icons\n * @markup\n * \n */\n.icon-ban:before {\n content: "\\f05e"; }\n\n/**\n * Success / Conformation Alerts\n *\n * @atom .icon-check-circle\n * @section Icons\n * @markup\n * \n */\n.icon-check-circle:before {\n content: "\\f058"; }\n\n/**\n * Hours\n *\n * @atom .icon-clock\n * @section Icons\n * @markup\n * \n */\n.icon-clock:before {\n content: "\\f017"; }\n\n/**\n * Ask a Librarian\n *\n * @atom .icon-comment-dots\n * @section Icons\n * @markup\n * \n */\n.icon-comment-dots:before {\n content: "\\f4ad"; }\n\n/**\n * Account / MyAccount\n *\n * @atom .icon-user-circle\n * @section Icons\n * @markup\n * \n */\n.icon-user-circle:before {\n content: "\\f2bd"; }\n\n/**\n * Alert (appears in navbar)\n *\n * @atom .icon-bell\n * @section Icons\n * @markup\n * \n */\n.icon-bell:before {\n content: "\\f0f3"; }\n\n/**\n * Return to top\n *\n * @atom .icon-chevron-circle-up\n * @section Icons\n * @markup\n * \n */\n.icon-chevron-circle-up:before {\n content: "\\f139"; }\n\n/**\n * Search\n *\n * @atom .icon-search\n * @section Icons\n * @markup\n * \n */\n.icon-search:before {\n content: "\\f002"; }\n\n/**\n * Status Available / Conformation\n *\n * @atom .icon-check\n * @section Icons\n * @markup\n * \n */\n.icon-check:before {\n content: "\\f00c"; }\n\n/**\n * External Link\n *\n * @atom .icon-external-link-alt\n * @section Icons\n * @markup\n * \n */\n.icon-external-link-alt:before {\n content: "\\f35d"; }\n\n/**\n * Image Expand\n *\n * @atom .icon-search-plus\n * @section Icons\n * @markup\n * \n */\n.icon-search-plus:before {\n content: "\\f00e"; }\n\n/**\n * Course Reserves\n *\n * @atom .icon-university\n * @section Icons\n * @markup\n * \n */\n.icon-university:before {\n content: "\\f19c"; }\n\n/**\n * Accordion Expand\n *\n * @atom .icon-plus\n * @section Icons\n * @markup\n * \n */\n.icon-plus:before {\n content: "\\f067"; }\n\n/**\n * Accordion Collapse\n *\n * @atom .icon-minus\n * @section Icons\n * @markup\n * \n */\n.icon-minus:before {\n content: "\\f068"; }\n\n/**\n * Drop Down Menu up\n *\n * @atom .icon-caret-up\n * @section Icons\n * @markup\n * \n */\n.icon-caret-up:before {\n content: "\\f0d8"; }\n\n/**\n * Drop Down Menu down \n *\n * @atom .icon-caret-down\n * @section Icons\n * @markup\n * \n */\n.icon-caret-down:before {\n content: "\\f0d7"; }\n\n/**\n * Cite\n *\n * @atom .icon-quote-right\n * @section Icons\n * @markup\n * \n */\n.icon-quote-right:before {\n content: "\\f10e"; }\n\n/**\n * Print\n *\n * @atom .icon-print\n * @section Icons\n * @markup\n * \n */\n.icon-print:before {\n content: "\\f02f"; }\n\n/**\n * Copy\n *\n * @atom .icon-copy\n * @section Icons\n * @markup\n * \n */\n.icon-copy:before {\n content: "\\f0c5"; }\n\n/**\n * Edit\n *\n * @atom .icon-edit\n * @section Icons\n * @markup\n * \n */\n.icon-edit:before {\n content: "\\f044"; }\n\n/**\n * Delete\n *\n * @atom .icon-trash-alt\n * @section Icons\n * @markup\n * \n */\n.icon-trash-alt:before {\n content: "\\f2ed"; }\n\n/**\n * Download\n *\n * @atom .icon-download\n * @section Icons\n * @markup\n * \n */\n.icon-download:before {\n content: "\\f019"; }\n\n/**\n * Calendar \n *\n * @atom .icon-calendar-alt\n * @section Icons\n * @markup\n * \n */\n.icon-calendar-alt:before {\n content: "\\f073"; }\n\n/**\n * PDF \n *\n * @atom .icon-file-pdf\n * @section Icons\n * @markup\n * \n */\n.icon-file-pdf:before {\n content: "\\f1c1"; }\n\n/**\n * Facebook\n *\n * @atom .icon-facebook-square\n * @section Icons\n * @markup\n * \n */\n.icon-facebook-square:before {\n content: "\\f082"; }\n\n/**\n * Instagram\n *\n * @atom .icon-instagram\n * @section Icons\n * @markup\n * \n */\n.icon-instagram:before {\n content: "\\f16d"; }\n\n/**\n * Twitter\n *\n * @atom .icon-twitter-square\n * @section Icons\n * @markup\n * \n */\n.icon-twitter-square:before {\n content: "\\f081"; }\n\n/**\n * Vimeo\n *\n * @atom .icon-vimeo\n * @section Icons\n * @markup\n * \n */\n.icon-vimeo:before {\n content: "\\f40a"; }\n\n/**\n * Youtube\n *\n * @atom .icon-youtube\n * @section Icons\n * @markup\n * \n */\n.icon-youtube:before {\n content: "\\f167"; }\n\n/**\n * Email\n *\n * @atom .icon-envelope\n * @section Icons\n * @markup\n * \n */\n.icon-envelope:before {\n content: "\\f0e0"; }\n\n/**\n * Bookmark\n *\n * @atom .icon-bookmark\n * @section Icons\n * @markup\n * \n */\n.icon-bookmark:before {\n content: "\\f02e"; }\n\n/**\n * Close Window / Close Dialog\n *\n * @atom .icon-window-close\n * @section Icons\n * @markup\n * \n */\n.icon-window-close-regular:before {\n content: "\\f2d3"; }\n\n/**\n * Remove Search Criteria\n *\n * @atom .icon-x-circle\n * @section Icons\n * @markup\n * \n */\n.icon-times-circle:before {\n content: "\\f057"; }\n\n/**\n * Add Criteria\n * \n * @atom .icon-plus-circle\n * @section Icons\n * @markup\n * \n */\n.icon-plus-circle:before {\n content: "\\f055"; }\n\n/**\n * Refresh Page / Reload / Reset\n * @atom .icon-redo-alt\n * @section Icons\n * @markup\n * \n */\n.icon-redo-alt:before {\n content: "\\f2f9"; }\n\n/**\n * Slide Left (on page)\n *\n * @atom .icon-chevron-double-left\n * @section Icons\n * @markup\n * \n */\n.icon-chevron-double-left:before {\n content: "\\f323"; }\n\n/**\n * Slide Right (on page)\n *\n * @atom .icon-chevron-double-right\n * @section Icons\n * @markup\n * \n */\n.icon-chevron-double-right:before {\n content: "\\f324"; }\n\n/**\n * Page Forward\n *\n * @atom .icon-arrow-right\n * @section Icons\n * @markup\n * \n */\n.icon-arrow-right:before {\n content: "\\f178"; }\n\n/**\n * Page Back\n *\n * @atom .icon-arrow-left\n * @section Icons\n * @markup\n * \n */\n.icon-arrow-left:before {\n content: "\\f177"; }\n\n/**\n * Special Selected / Preferred\n *\n * @atom .icon-star\n * @section Icons\n * @markup\n * \n */\n.icon-star:before {\n content: "\\f005"; }\n\n/* common scsss variables for V4 client */\n/* small media width */\n/* spacing unit of measure */\n:host {\n display: none;\n font-family: "franklin-gothic-urw", arial, sans-serif;\n font-weight: 400;\n font-style: normal;\n font-size: 16px;\n line-height: calc($uvalib-main-font-size-unit*1.25);\n color: #595959; }\n\n[hidden] {\n display: none; }\n\n.uva-alert {\n font-size: 1.06rem;\n line-height: 1.5;\n position: relative;\n color: #2B2B2B; }\n\n.uva-alert--r1, .uva-alert--r2 {\n border: 0.2em solid var(--alert-border-color);\n border-radius: 0.5em;\n padding: 0.75rem 1rem;\n margin-bottom: 1rem; }\n\n.uva-alert--r1 {\n background-color: #FEF6C8;\n --alert-border-color: $uvalib-alert-r1-border; }\n\n.uva-alert--r2 {\n background-color: #C8F2F4;\n --alert-border-color: $uvalib-alert-r2-border; }\n\n.uva-alert__body {\n padding-left: 1.25rem;\n display: table-cell;\n vertical-align: top; }\n\n.uva-alert__text, .uva-alert__text p {\n margin-bottom: 0;\n margin-top: 0; }\n'),document.adoptedStyleSheets=[...document.adoptedStyleSheets,n];class o extends HTMLElement{static get observedAttributes(){return["override","alerts","url"]}get override(){return!!this._override}set override(n){this._override=!!n}get alerts(){return this._alerts}set alerts(n){this._alerts=Array.isArray(n)?n:[],this._updateAlerts()}get url(){return this._url}set url(n){this._url=n}attributeChangedCallback(n,o,e){switch(n){case"override":this.override=""===e;break;case"alerts":this.alerts=JSON.parse(e);break;case"url":this.url=e}}constructor(){super(),this._setupDom()}connectedCallback(){this.override||this._setupAlertsModel(),window.addEventListener("popstate",function(n){this._updateAlerts()}.bind(this))}_setupAlertsModel(){import("./debounce-2d1f3432.js").then(function(n){import("./uvalib-model-realtime-database-5f0d0bc2.js").then(function(){this._alertsModel=document.createElement("uvalib-model-realtime-database"),this._alertsModel.addEventListener("uvalib-model-data-value",n.default(function(n){this.alerts=n.detail}.bind(this),300).bind(this)),this._alertsModel.setAttribute("auto",""),this._alertsModel.setAttribute("path","regionalalerts"),this._alertsModel.setAttribute("database","https://uvalib-api.firebaseio.com/"),this.shadow.appendChild(this._alertsModel)}.bind(this))}.bind(this))}_updateAlerts(){var n=this.alerts;Array.isArray(n)&&n.length>0&&(console.log(n),n=n.filter(n=>this._matchesURL(n.url)),Array.isArray(n)&&n.length>0?(console.log(n),this._alertsContainer.innerHTML="",n.forEach(n=>{this._alertsContainer.innerHTML+=`\n
\n
\n
${n.body}
\n
\n
\n `}),this._setupStyle(),this._alertsContainer.removeAttribute("hidden"),this.style.display="block"):(this._alertsContainer.setAttribute("hidden",""),this.style.display="none"))}_matchesURL(n){Array.isArray(n)||(n=[{value:n}]);for(var o=0;o{ - console.log("loaded polyfill"); - var script2 = document.createElement('script'); - script2.type = 'module'; - script2.innerText = ` - console.log("hello from module load"); - `; - document.getElementsByTagName('head')[0].appendChild(script2); -}; - -//import('https://static.lib.virginia.edu/js/controllers/components-build/alerts.js'); -//}) -// WebComponents.waitFor(async () => { -// console.log("foobar!!!!"); -// var promises = []; -// promises.push( import('./uvalib-alerts.js') ); -// promises.push( import('./uvalib-alerts-level4.js') ); -// return Promise.all(promises); -// }) \ No newline at end of file diff --git a/packages/uvalib-alerts/uvalib-alerts-regional.js b/packages/uvalib-alerts/uvalib-alerts-regional.js index 8a8ebb8..31d4d38 100644 --- a/packages/uvalib-alerts/uvalib-alerts-regional.js +++ b/packages/uvalib-alerts/uvalib-alerts-regional.js @@ -83,7 +83,11 @@ export class UvalibAlertsRegional extends HTMLElement { this._alertsContainer.innerHTML = ""; alerts.forEach(a=>{ this._alertsContainer.innerHTML += ` -
${a.body}
+
+
+
${a.body}
+
+
`; }); this._setupStyle(); diff --git a/packages/uvalib-alerts/uvalib-alerts-regional.scss b/packages/uvalib-alerts/uvalib-alerts-regional.scss index 1d5ae85..3a583b5 100644 --- a/packages/uvalib-alerts/uvalib-alerts-regional.scss +++ b/packages/uvalib-alerts/uvalib-alerts-regional.scss @@ -3,33 +3,11 @@ @import "~@uvalib/web-styles/scss/_icons.scss"; @import "~@uvalib/web-styles/scss/_variables.scss"; -$uvalib-alert-a1-bg: $uvalib-red-lightest; -$uvalib-alert-a1-border: $uvalib-red-dark; -$uvalib-alert-a2-bg: $uvalib-yellow-lightest; -$uvalib-alert-a2-border: $uvalib-yellow; -$uvalib-alert-a3-bg: $uvalib-blue-alt-lightest; -$uvalib-alert-a3-border: $uvalib-blue-alt; -$uvalib-alert-a4-bg: $uvalib-teal; $uvalib-alert-r1-bg: $uvalib-yellow-lightest; $uvalib-alert-r1-border: $uvalib-yellow; $uvalib-alert-r2-bg: $uvalib-teal-lightest; $uvalib-alert-r2-border: $uvalib-teal; -$uvalib-alert-error-inline: $uvalib-red-darker; -$uvalib-alert-confirmation-inline: $uvalib-green-dark; - -$uvalib-alert-info-bg: $uvalib-blue-alt-lightest; -$uvalib-alert-info-border: $uvalib-blue-alt; -$uvalib-alert-confirmation-bg: $uvalib-green-lightest; -$uvalib-alert-confirmation-border: $uvalib-green-dark; - -$uvalib-status-available: $uvalib-blue-alt; -$uvalib-status-modified: $uvalib-yellow; -$uvalib-status-notavailable: $uvalib-red-darker; - -$accessibility-outline-color--bgislight: $uvalib-blue-alt-dark; -$accessibility-outline-color--bgisdark: $uvalib-blue-alt-lightest; - :host { display: none; @include font-body1; @@ -37,20 +15,34 @@ $accessibility-outline-color--bgisdark: $uvalib-blue-alt-lightest; [hidden] { display: none; } -/*END*/ -/* Custom Backgrounds */ -.alertbox { + +.uva-alert { + font-size: 1.06rem; + line-height: 1.5; position: relative; - padding: .75rem 1.25rem; + color: $uvalib-text-dark; +} + +.uva-alert--r1, .uva-alert--r2 { + border: 0.2em solid var(--alert-border-color); + border-radius: 0.5em; + padding: 0.75rem 1rem; margin-bottom: 1rem; - border: 1px solid transparent; - border-radius: .25rem; } -.alertbox h2:first-of-type { - margin-top: .5rem; +.uva-alert--r1 { + background-color: $uvalib-alert-r1-bg; + --alert-border-color: $uvalib-alert-r1-border; } -.alertbox-primary { - background-color: $uvalib-teal-lightest; - border-color: $uvalib-teal-light; - color: $uvalib-text-dark; +.uva-alert--r2 { + background-color: $uvalib-alert-r2-bg; + --alert-border-color: $uvalib-alert-r2-border; +} +.uva-alert__body { + padding-left: 1.25rem; + display: table-cell; + vertical-align: top; } +.uva-alert__text, .uva-alert__text p { + margin-bottom: 0; + margin-top: 0; +} \ No newline at end of file