@itcenteratunihelsinki/huds-lib 0.8.42 → 0.8.44
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/accordion-container.js +48 -0
- package/components/accordion-item.js +239 -0
- package/components/color-box.d.ts +11 -0
- package/components/color-box.js +33 -0
- package/components/cta-button.js +57 -0
- package/components/cta-link.js +50 -0
- package/components/custom-elements.d.ts +2 -0
- package/components/emotion.esm.js +1395 -0
- package/{dist/esm/globalScript-4ad40215.js → components/globalScript.js} +7 -9
- package/components/heading.js +80 -0
- package/components/hy-accordion-container.d.ts +11 -0
- package/components/hy-accordion-container.js +6 -0
- package/components/hy-accordion-item.d.ts +11 -0
- package/components/hy-accordion-item.js +6 -0
- package/components/hy-adjacent-image-text.d.ts +11 -0
- package/components/hy-adjacent-image-text.js +106 -0
- package/components/hy-anchor-link-list.d.ts +11 -0
- package/components/hy-anchor-link-list.js +76 -0
- package/components/hy-badge.d.ts +11 -0
- package/components/hy-badge.js +37 -0
- package/components/hy-banner.d.ts +11 -0
- package/components/hy-banner.js +94 -0
- package/components/hy-baseline.d.ts +11 -0
- package/components/hy-baseline.js +44 -0
- package/components/hy-box-container.d.ts +11 -0
- package/components/hy-box-container.js +43 -0
- package/components/hy-box.d.ts +11 -0
- package/components/hy-box.js +6 -0
- package/components/hy-box2.js +195 -0
- package/components/hy-breadcrumbs.d.ts +11 -0
- package/components/hy-breadcrumbs.js +69 -0
- package/components/hy-button.d.ts +11 -0
- package/components/hy-button.js +111 -0
- package/components/hy-checkbox.d.ts +11 -0
- package/components/hy-checkbox.js +55 -0
- package/components/hy-collaboration.d.ts +11 -0
- package/components/hy-collaboration.js +49 -0
- package/components/hy-content-list-item.d.ts +11 -0
- package/components/hy-content-list-item.js +6 -0
- package/components/hy-content-list-item2.js +109 -0
- package/components/hy-content-list.d.ts +11 -0
- package/components/hy-content-list.js +155 -0
- package/components/hy-crisis-banner.d.ts +11 -0
- package/components/hy-crisis-banner.js +47 -0
- package/components/hy-cta-button.d.ts +11 -0
- package/components/hy-cta-button.js +6 -0
- package/components/hy-cta-link.d.ts +11 -0
- package/components/hy-cta-link.js +6 -0
- package/components/hy-docs-container.d.ts +11 -0
- package/components/hy-docs-container.js +32 -0
- package/components/hy-dropdown-panel-item.d.ts +11 -0
- package/components/hy-dropdown-panel-item.js +6 -0
- package/components/hy-dropdown-panel.d.ts +11 -0
- package/components/hy-dropdown-panel.js +6 -0
- package/components/hy-dropdown.d.ts +11 -0
- package/components/hy-dropdown.js +155 -0
- package/components/hy-dropdown.panel.item.js +41 -0
- package/components/hy-dropdown.panel.js +29 -0
- package/components/hy-event-item.d.ts +11 -0
- package/components/hy-event-item.js +73 -0
- package/components/hy-events.d.ts +11 -0
- package/components/hy-events.js +131 -0
- package/components/hy-filter-group-item.d.ts +11 -0
- package/components/hy-filter-group-item.js +6 -0
- package/components/hy-filter-group.d.ts +11 -0
- package/components/hy-filter-group.item.js +38 -0
- package/components/hy-filter-group.js +67 -0
- package/components/hy-filter-list-type.d.ts +11 -0
- package/components/hy-filter-list-type.js +52 -0
- package/components/hy-filter-visibility-tool-reset.d.ts +11 -0
- package/components/hy-filter-visibility-tool-reset.js +6 -0
- package/components/hy-filter-visibility-tool-toggle.d.ts +11 -0
- package/components/hy-filter-visibility-tool-toggle.js +6 -0
- package/components/hy-filter-visibility-tool.d.ts +11 -0
- package/components/hy-filter-visibility-tool.js +58 -0
- package/components/hy-filter-visibility-tool.reset.js +32 -0
- package/components/hy-filter-visibility-tool.reset.toggle.js +32 -0
- package/components/hy-footer-action.d.ts +11 -0
- package/components/hy-footer-action.js +55 -0
- package/components/hy-footer-base.d.ts +11 -0
- package/components/hy-footer-base.js +89 -0
- package/components/hy-footer-info.d.ts +11 -0
- package/components/hy-footer-info.js +167 -0
- package/components/hy-footer-link-item.d.ts +11 -0
- package/components/hy-footer-link-item.js +6 -0
- package/components/hy-footer-link-item2.js +99 -0
- package/components/hy-footer.d.ts +11 -0
- package/components/hy-footer.js +33 -0
- package/components/hy-general-list-item.d.ts +11 -0
- package/components/hy-general-list-item.js +6 -0
- package/components/hy-general-list-item2.js +74 -0
- package/components/hy-general-list.d.ts +11 -0
- package/components/hy-general-list.js +90 -0
- package/components/hy-grid-container.d.ts +11 -0
- package/components/hy-grid-container.js +33 -0
- package/components/hy-grid-item.d.ts +11 -0
- package/components/hy-grid-item.js +49 -0
- package/components/hy-grid-row.d.ts +11 -0
- package/components/hy-grid-row.js +33 -0
- package/components/hy-heading.d.ts +11 -0
- package/components/hy-heading.js +6 -0
- package/components/hy-hero-carousel.d.ts +11 -0
- package/components/hy-hero-carousel.js +4935 -0
- package/components/hy-hero.d.ts +11 -0
- package/components/hy-hero.js +155 -0
- package/components/hy-icon.d.ts +11 -0
- package/components/hy-icon.js +6 -0
- package/components/hy-image.d.ts +11 -0
- package/components/hy-image.js +6 -0
- package/components/hy-ingress.d.ts +11 -0
- package/components/hy-ingress.js +45 -0
- package/components/hy-introduction.d.ts +11 -0
- package/components/hy-introduction.js +118 -0
- package/components/hy-key-figure-group.d.ts +11 -0
- package/components/hy-key-figure-group.js +106 -0
- package/components/hy-key-figure.d.ts +11 -0
- package/components/hy-key-figure.js +6 -0
- package/components/hy-key-figure2.js +39 -0
- package/components/hy-key-highlight-group.d.ts +11 -0
- package/components/hy-key-highlight-group.js +69 -0
- package/components/hy-key-highlight.d.ts +11 -0
- package/components/hy-key-highlight.js +6 -0
- package/components/hy-key-highlight2.js +39 -0
- package/components/hy-large-process-flow-phase.d.ts +11 -0
- package/components/hy-large-process-flow-phase.js +6 -0
- package/components/hy-large-process-flow-phase2.js +63 -0
- package/components/hy-large-process-flow.d.ts +11 -0
- package/components/hy-large-process-flow.js +86 -0
- package/components/hy-link-box-list.d.ts +11 -0
- package/components/hy-link-box-list.js +92 -0
- package/components/hy-link-box.d.ts +11 -0
- package/components/hy-link-box.js +6 -0
- package/components/hy-link-list.d.ts +11 -0
- package/components/hy-link-list.js +77 -0
- package/components/hy-link.d.ts +11 -0
- package/components/hy-link.js +46 -0
- package/components/hy-list-item.d.ts +11 -0
- package/components/hy-list-item.js +293 -0
- package/components/hy-logo-grid-item.d.ts +11 -0
- package/components/hy-logo-grid-item.js +48 -0
- package/components/hy-logo-grid.d.ts +11 -0
- package/components/hy-logo-grid.js +38 -0
- package/components/hy-main-content-wrapper.d.ts +11 -0
- package/components/hy-main-content-wrapper.js +6 -0
- package/components/hy-main-content-wrapper2.js +30 -0
- package/components/hy-main.d.ts +11 -0
- package/components/hy-main.js +40 -0
- package/components/hy-menu-language-item.d.ts +11 -0
- package/components/hy-menu-language-item.js +6 -0
- package/components/hy-menu-language.d.ts +11 -0
- package/components/hy-menu-language.js +6 -0
- package/components/hy-menu-main-group.d.ts +11 -0
- package/components/hy-menu-main-group.js +6 -0
- package/components/hy-menu-main-group2.js +192 -0
- package/components/hy-opening-hours-content.d.ts +11 -0
- package/components/hy-opening-hours-content.js +62 -0
- package/components/hy-opening-hours.d.ts +11 -0
- package/components/hy-opening-hours.js +90 -0
- package/components/hy-pager-item.d.ts +11 -0
- package/components/hy-pager-item.js +73 -0
- package/components/hy-pager.d.ts +11 -0
- package/components/hy-pager.js +34 -0
- package/components/hy-paragraph-text.d.ts +11 -0
- package/components/hy-paragraph-text.js +6 -0
- package/components/hy-person-card.d.ts +11 -0
- package/components/hy-person-card.js +137 -0
- package/components/hy-person-profile-listing.d.ts +11 -0
- package/components/hy-person-profile-listing.js +6 -0
- package/components/hy-person-profile.d.ts +11 -0
- package/components/hy-person-profile.js +142 -0
- package/components/hy-process-flow-box.d.ts +11 -0
- package/components/hy-process-flow-box.js +6 -0
- package/components/hy-process.d.ts +11 -0
- package/components/hy-process.js +89 -0
- package/components/hy-prominent-image.d.ts +11 -0
- package/components/hy-prominent-image.js +71 -0
- package/components/hy-quote.d.ts +11 -0
- package/components/hy-quote.js +54 -0
- package/components/hy-row.d.ts +11 -0
- package/components/hy-row.js +50 -0
- package/components/hy-search-field.d.ts +11 -0
- package/components/hy-search-field.js +6 -0
- package/components/hy-search-field2.js +81 -0
- package/components/hy-section-container.d.ts +11 -0
- package/components/hy-section-container.js +32 -0
- package/components/hy-shortcuts.d.ts +11 -0
- package/components/hy-shortcuts.js +96 -0
- package/components/hy-site-header.d.ts +11 -0
- package/components/hy-site-header.js +369 -0
- package/components/hy-site-logo.d.ts +11 -0
- package/components/hy-site-logo.js +6 -0
- package/components/hy-site-search.d.ts +11 -0
- package/components/hy-site-search.js +6 -0
- package/components/hy-table-container.d.ts +11 -0
- package/components/hy-table-container.js +39 -0
- package/components/hy-tabs-item.d.ts +11 -0
- package/components/hy-tabs-item.js +6 -0
- package/components/hy-tabs-item2.js +33 -0
- package/components/hy-tabs.d.ts +11 -0
- package/components/hy-tabs.js +6 -0
- package/components/hy-tabs2.js +346 -0
- package/components/hy-tag.d.ts +11 -0
- package/components/hy-tag.js +6 -0
- package/components/hy-tag2.js +31 -0
- package/components/hy-tiny-text.d.ts +11 -0
- package/components/hy-tiny-text.js +34 -0
- package/components/hy-twitter-feed.d.ts +11 -0
- package/components/hy-twitter-feed.js +57 -0
- package/components/hy-two-columns.d.ts +11 -0
- package/components/hy-two-columns.js +36 -0
- package/components/hy-user-login-form.d.ts +11 -0
- package/components/hy-user-login-form.js +53 -0
- package/components/hy-video.d.ts +11 -0
- package/components/hy-video.js +156 -0
- package/components/icon.js +830 -0
- package/components/image.js +75 -0
- package/components/index.d.ts +27 -0
- package/components/index.js +2 -0
- package/components/index2.js +965 -0
- package/components/link-box.js +116 -0
- package/components/menu-language-item.js +47 -0
- package/components/menu-language.js +121 -0
- package/components/package.json +8 -0
- package/components/paragraph-text.js +60 -0
- package/components/person-profile.listing.js +57 -0
- package/components/process-flow-box.js +57 -0
- package/components/site-logo.js +59 -0
- package/components/site-search.js +249 -0
- package/{dist/esm/utils-43c56d92.js → components/utils.js} +1 -3
- package/dist/cjs/{hy-accordion-container_83.cjs.entry.js → color-box_91.cjs.entry.js} +1177 -1001
- package/dist/cjs/{globalScript-45ad6d41.js → globalScript-d341436f.js} +7 -9
- package/dist/cjs/huds-lib.cjs.js +3 -5
- package/dist/cjs/hy-event-item.cjs.entry.js +10 -12
- package/dist/cjs/hy-events.cjs.entry.js +22 -24
- package/dist/cjs/hy-hero-carousel.cjs.entry.js +4902 -0
- package/dist/cjs/{index-25bd964b.js → index-ca4e37f2.js} +0 -2
- package/dist/cjs/index.cjs.js +0 -2
- package/dist/cjs/loader.cjs.js +3 -5
- package/dist/cjs/utils-14d5aa6f.js +0 -2
- package/dist/collection/collection-manifest.json +8 -11
- package/dist/collection/components/accordion-container/accordion-container.js +4 -5
- package/dist/collection/components/accordion-item/accordion-item.js +78 -79
- package/dist/collection/components/adjacent-image-text/adjacent-image-text.js +17 -18
- package/dist/collection/components/baseline/baseline.js +2 -3
- package/dist/collection/components/button/button.js +28 -29
- package/dist/collection/components/color-box/color-box.js +1 -2
- package/dist/collection/components/courses/hy-content-list/hy-content-list.js +42 -43
- package/dist/collection/components/courses/hy-content-list-item/hy-content-list-item.js +15 -16
- package/dist/collection/components/cta-button/cta-button.js +12 -13
- package/dist/collection/components/cta-link/cta-link.js +7 -8
- package/dist/collection/components/docs-container/docs-container.js +0 -1
- package/dist/collection/components/footer/hy-footer/hy-footer.js +3 -4
- package/dist/collection/components/footer/hy-footer-action/hy-footer-action.js +5 -6
- package/dist/collection/components/footer/hy-footer-base/hy-footer-base.js +6 -7
- package/dist/collection/components/footer/hy-footer-info/hy-footer-info.js +19 -20
- package/dist/collection/components/footer/hy-footer-link-item/hy-footer-link-item.js +22 -23
- package/dist/collection/components/global-workers/globals.worker.js +0 -1
- package/dist/collection/components/grid-container/grid-container.js +1 -2
- package/dist/collection/components/grid-item/grid-item.js +5 -6
- package/dist/collection/components/grid-row/grid-row.js +3 -4
- package/dist/collection/components/heading/heading.js +17 -18
- package/dist/collection/components/hy-anchor-link-list/hy-anchor-link-list.js +13 -14
- package/dist/collection/components/hy-badge/hy-badge.js +6 -7
- package/dist/collection/components/hy-banner/hy-banner.js +13 -14
- package/dist/collection/components/hy-box/hy-box.js +26 -27
- package/dist/collection/components/hy-box-container/hy-box-container.js +5 -6
- package/dist/collection/components/hy-breadcrumbs/hy-breadcrumbs.js +10 -11
- package/dist/collection/components/hy-checkbox/hy-checkbox.js +5 -6
- package/dist/collection/components/hy-collaboration/hy-collaboration.js +2 -3
- package/dist/collection/components/hy-crisis-banner/hy-crisis-banner.js +2 -3
- package/dist/collection/components/hy-dropdown/hy-dropdown.js +16 -17
- package/dist/collection/components/hy-dropdown/hy-dropdown.panel.item.js +2 -3
- package/dist/collection/components/hy-dropdown/hy-dropdown.panel.js +2 -3
- package/dist/collection/components/hy-event-item/hy-event-item.js +15 -16
- package/dist/collection/components/hy-events/hy-events.js +25 -26
- package/dist/collection/components/hy-filter-group/hy-filter-group.item.js +3 -4
- package/dist/collection/components/hy-filter-group/hy-filter-group.js +3 -4
- package/dist/collection/components/hy-filter-list-type/hy-filter-list-type.js +10 -11
- package/dist/collection/components/hy-filter-visibility-tool/hy-filter-visibility-tool.js +4 -5
- package/dist/collection/components/hy-filter-visibility-tool/hy-filter-visibility-tool.reset.js +2 -3
- package/dist/collection/components/hy-filter-visibility-tool/hy-filter-visibility-tool.reset.toggle.js +2 -3
- package/dist/collection/components/hy-general-list/hy-general-list.js +11 -12
- package/dist/collection/components/hy-general-list-item/hy-general-list-item.js +18 -19
- package/dist/collection/components/hy-hero/hy-hero.js +26 -27
- package/dist/collection/components/hy-hero-carousel/hy-hero-carousel.css +1306 -0
- package/dist/collection/components/hy-hero-carousel/hy-hero-carousel.js +211 -0
- package/dist/collection/components/hy-introduction/hy-introduction.js +23 -24
- package/dist/collection/components/hy-key-figure/hy-key-figure.js +3 -4
- package/dist/collection/components/hy-key-figure-group/hy-key-figure-group.js +17 -18
- package/dist/collection/components/hy-key-highlight/hy-key-highlight.js +3 -4
- package/dist/collection/components/hy-key-highlight-group/hy-key-highlight-group.js +12 -13
- package/dist/collection/components/hy-large-process-flow/hy-large-process-flow.js +11 -12
- package/dist/collection/components/hy-large-process-flow-phase/hy-large-process-flow-phase.js +5 -6
- package/dist/collection/components/hy-link-list/hy-link-list.js +16 -17
- package/dist/collection/components/hy-list-item/hy-list-item.js +71 -72
- package/dist/collection/components/hy-logo-grid/hy-logo-grid.item.js +3 -4
- package/dist/collection/components/hy-logo-grid/hy-logo-grid.js +1 -2
- package/dist/collection/components/hy-main/hy-main.js +5 -6
- package/dist/collection/components/hy-main-content-wrapper/hy-main-content-wrapper.js +2 -3
- package/dist/collection/components/hy-opening-hours/hy-opening-hours.js +12 -13
- package/dist/collection/components/hy-opening-hours-content/hy-opening-hours-content.js +10 -11
- package/dist/collection/components/hy-person-card/hy-person-card.js +17 -18
- package/dist/collection/components/hy-prominent-image/hy-prominent-image.js +12 -13
- package/dist/collection/components/hy-quote/hy-quote.js +8 -9
- package/dist/collection/components/hy-search-field/hy-search-field.js +15 -16
- package/dist/collection/components/hy-shortcuts/hy-shortcuts.js +21 -22
- package/dist/collection/components/hy-table-container/hy-table-container.js +2 -3
- package/dist/collection/components/hy-tabs/hy-tabs.js +52 -53
- package/dist/collection/components/hy-tabs-item/hy-tabs-item.js +2 -3
- package/dist/collection/components/hy-tag/hy-tag.js +2 -3
- package/dist/collection/components/hy-twitter-feed/hy-twitter-feed.js +4 -5
- package/dist/collection/components/hy-two-columns/hy-two-columns.js +2 -3
- package/dist/collection/components/hy-user-login-form/hy-user-login-form.js +4 -5
- package/dist/collection/components/hy-video/hy-video.js +26 -27
- package/dist/collection/components/icon/AddToTodoList.js +0 -1
- package/dist/collection/components/icon/Alert.js +1 -2
- package/dist/collection/components/icon/Archive.js +1 -2
- package/dist/collection/components/icon/Arrow.js +0 -1
- package/dist/collection/components/icon/ArrowDown.js +0 -1
- package/dist/collection/components/icon/ArrowRight.js +1 -2
- package/dist/collection/components/icon/ArrowUp.js +0 -1
- package/dist/collection/components/icon/Avatar.js +0 -1
- package/dist/collection/components/icon/AvatarGroup.js +0 -1
- package/dist/collection/components/icon/Bachelor.js +0 -1
- package/dist/collection/components/icon/BulletList.js +0 -1
- package/dist/collection/components/icon/Camera.js +0 -1
- package/dist/collection/components/icon/CaretDown.js +0 -1
- package/dist/collection/components/icon/CaretLeft.js +0 -1
- package/dist/collection/components/icon/CaretRight.js +1 -2
- package/dist/collection/components/icon/CaretUp.js +0 -1
- package/dist/collection/components/icon/Chat.js +0 -1
- package/dist/collection/components/icon/CodeFork.js +0 -1
- package/dist/collection/components/icon/Cogs.js +0 -1
- package/dist/collection/components/icon/Contentlink.js +0 -1
- package/dist/collection/components/icon/Customlink.js +0 -1
- package/dist/collection/components/icon/Date.js +0 -1
- package/dist/collection/components/icon/Discover.js +0 -1
- package/dist/collection/components/icon/Done.js +0 -1
- package/dist/collection/components/icon/Dot.js +0 -1
- package/dist/collection/components/icon/DotArrowRight.js +1 -2
- package/dist/collection/components/icon/Download.js +0 -1
- package/dist/collection/components/icon/Drag.js +0 -1
- package/dist/collection/components/icon/Dragbutton.js +0 -1
- package/dist/collection/components/icon/DropDown.js +0 -1
- package/dist/collection/components/icon/Edit.js +0 -1
- package/dist/collection/components/icon/EditEvent.js +0 -1
- package/dist/collection/components/icon/Embed.js +0 -1
- package/dist/collection/components/icon/Euro.js +1 -2
- package/dist/collection/components/icon/Events.js +0 -1
- package/dist/collection/components/icon/ExternalLink.js +0 -1
- package/dist/collection/components/icon/EyeSlash.js +0 -1
- package/dist/collection/components/icon/Facebook.js +0 -1
- package/dist/collection/components/icon/Favorites.js +0 -1
- package/dist/collection/components/icon/Feed.js +0 -1
- package/dist/collection/components/icon/FileText.js +0 -1
- package/dist/collection/components/icon/FullScreen.js +0 -1
- package/dist/collection/components/icon/Globe.js +1 -2
- package/dist/collection/components/icon/GooglePlus.js +0 -1
- package/dist/collection/components/icon/Grid.js +0 -1
- package/dist/collection/components/icon/Hamburger.js +0 -1
- package/dist/collection/components/icon/Heart.js +0 -1
- package/dist/collection/components/icon/HeartSupport.js +1 -2
- package/dist/collection/components/icon/Helsinginyliopisto.js +0 -1
- package/dist/collection/components/icon/Home.js +1 -2
- package/dist/collection/components/icon/HorizontalResize.js +0 -1
- package/dist/collection/components/icon/HyLogo.js +0 -1
- package/dist/collection/components/icon/IdNumber.js +0 -1
- package/dist/collection/components/icon/Image.js +0 -1
- package/dist/collection/components/icon/ImageGallery.js +0 -1
- package/dist/collection/components/icon/Images.js +0 -1
- package/dist/collection/components/icon/Info.js +1 -2
- package/dist/collection/components/icon/InfoStroke.js +0 -1
- package/dist/collection/components/icon/Instagram.js +0 -1
- package/dist/collection/components/icon/LeikiList.js +0 -1
- package/dist/collection/components/icon/LinkArrow.js +0 -1
- package/dist/collection/components/icon/LinkArrow1.js +0 -1
- package/dist/collection/components/icon/LinkArrowDown.js +0 -1
- package/dist/collection/components/icon/LinkArrowLeft.js +0 -1
- package/dist/collection/components/icon/LinkArrowOffsite.js +0 -1
- package/dist/collection/components/icon/LinkArrowUp.js +0 -1
- package/dist/collection/components/icon/Linkedin.js +0 -1
- package/dist/collection/components/icon/List.js +0 -1
- package/dist/collection/components/icon/ListAsBlocks.js +0 -1
- package/dist/collection/components/icon/ListStyleGrid.js +1 -2
- package/dist/collection/components/icon/ListStyleList.js +1 -2
- package/dist/collection/components/icon/Listoflinks.js +0 -1
- package/dist/collection/components/icon/Location.js +0 -1
- package/dist/collection/components/icon/Log.js +0 -1
- package/dist/collection/components/icon/Login.js +0 -1
- package/dist/collection/components/icon/Logout.js +0 -1
- package/dist/collection/components/icon/MagnifyMinus.js +0 -1
- package/dist/collection/components/icon/MagnifyPlus.js +0 -1
- package/dist/collection/components/icon/Mail.js +0 -1
- package/dist/collection/components/icon/Master.js +0 -1
- package/dist/collection/components/icon/Minus.js +0 -1
- package/dist/collection/components/icon/Mobile.js +0 -1
- package/dist/collection/components/icon/Modify.js +0 -1
- package/dist/collection/components/icon/NaviTriangle.js +0 -1
- package/dist/collection/components/icon/NewGroup.js +0 -1
- package/dist/collection/components/icon/NewPerson.js +0 -1
- package/dist/collection/components/icon/Notification.js +0 -1
- package/dist/collection/components/icon/OpinderLogo.js +0 -1
- package/dist/collection/components/icon/OpinderLogoNew.js +0 -1
- package/dist/collection/components/icon/Pdf.js +0 -1
- package/dist/collection/components/icon/People.js +0 -1
- package/dist/collection/components/icon/PermissionAll.js +0 -1
- package/dist/collection/components/icon/PermissionGroup.js +0 -1
- package/dist/collection/components/icon/PermissionPrivate.js +0 -1
- package/dist/collection/components/icon/Person.js +0 -1
- package/dist/collection/components/icon/PersonOutline.js +0 -1
- package/dist/collection/components/icon/Phone.js +0 -1
- package/dist/collection/components/icon/Play.js +0 -1
- package/dist/collection/components/icon/Plus.js +0 -1
- package/dist/collection/components/icon/Preview.js +0 -1
- package/dist/collection/components/icon/Profile.js +0 -1
- package/dist/collection/components/icon/Question.js +0 -1
- package/dist/collection/components/icon/Remove.js +0 -1
- package/dist/collection/components/icon/Retweet.js +0 -1
- package/dist/collection/components/icon/RotateLeft.js +0 -1
- package/dist/collection/components/icon/RotateRight.js +0 -1
- package/dist/collection/components/icon/Search.js +1 -2
- package/dist/collection/components/icon/Share.js +0 -1
- package/dist/collection/components/icon/SlimHamburgerMenu.js +1 -2
- package/dist/collection/components/icon/SocialMedia.js +0 -1
- package/dist/collection/components/icon/SomeFacebook.js +1 -2
- package/dist/collection/components/icon/SomeInstagram.js +1 -2
- package/dist/collection/components/icon/SomeLinkedin.js +1 -2
- package/dist/collection/components/icon/SomeTwitter.js +1 -2
- package/dist/collection/components/icon/SomeYoutube.js +1 -2
- package/dist/collection/components/icon/Spinner.js +0 -1
- package/dist/collection/components/icon/Square.js +0 -1
- package/dist/collection/components/icon/SquareChecked.js +0 -1
- package/dist/collection/components/icon/Time.js +0 -1
- package/dist/collection/components/icon/TodoList.js +0 -1
- package/dist/collection/components/icon/Tour.js +0 -1
- package/dist/collection/components/icon/Twitter.js +0 -1
- package/dist/collection/components/icon/TwitterLike.js +1 -2
- package/dist/collection/components/icon/UnitsAndFaculties.js +0 -1
- package/dist/collection/components/icon/Url.js +0 -1
- package/dist/collection/components/icon/Video.js +0 -1
- package/dist/collection/components/icon/Warning.js +0 -1
- package/dist/collection/components/icon/Wrench.js +0 -1
- package/dist/collection/components/icon/Youtube.js +0 -1
- package/dist/collection/components/icon/allIcons.js +114 -115
- package/dist/collection/components/icon/icon.js +134 -135
- package/dist/collection/components/icon/icons.js +132 -133
- package/dist/collection/components/image/image.js +10 -11
- package/dist/collection/components/ingress/ingress.js +7 -8
- package/dist/collection/components/link/link.js +7 -8
- package/dist/collection/components/link-box/link-box.js +23 -24
- package/dist/collection/components/link-box-list/link-box-list.js +12 -13
- package/dist/collection/components/navigation/hy-menu-main-group/hy-menu-main-group.js +45 -46
- package/dist/collection/components/navigation/menu-language/menu-language.js +15 -16
- package/dist/collection/components/navigation/menu-language-item/menu-language-item.js +4 -5
- package/dist/collection/components/pagination/hy-pager/hy-pager.js +2 -3
- package/dist/collection/components/pagination/hy-pager-item/hy-pager-item.js +12 -13
- package/dist/collection/components/paragraph-text/paragraph-text.js +10 -11
- package/dist/collection/components/person-profile/person-profile-listing/person-profile.listing.js +9 -10
- package/dist/collection/components/person-profile/person-profile.js +16 -17
- package/dist/collection/components/process/process.js +12 -13
- package/dist/collection/components/process-flow-box/process-flow-box.js +11 -12
- package/dist/collection/components/row/row.js +6 -7
- package/dist/collection/components/section-container/section-container.js +1 -2
- package/dist/collection/components/site-header/site-header.js +69 -70
- package/dist/collection/components/site-header/site-logo/site-logo.js +7 -8
- package/dist/collection/components/site-header/site-search/site-search.js +56 -57
- package/dist/collection/components/tiny-text/tiny-text.js +0 -1
- package/dist/collection/global/colors.js +21 -22
- package/dist/collection/global/globalScript.js +7 -8
- package/dist/collection/global/typography.js +0 -1
- package/dist/collection/index.js +1 -2
- package/dist/collection/utils/utils.js +0 -1
- package/dist/esm/{hy-accordion-container_83.entry.js → color-box_91.entry.js} +1171 -1003
- package/dist/esm/globalScript-3c6fab71.js +26 -0
- package/dist/esm/huds-lib.js +4 -6
- package/dist/esm/hy-event-item.entry.js +10 -12
- package/dist/esm/hy-events.entry.js +23 -25
- package/dist/esm/hy-hero-carousel.entry.js +4898 -0
- package/dist/esm/{index-3a66d87e.js → index-9920074a.js} +0 -2
- package/dist/esm/index.js +0 -2
- package/dist/esm/loader.js +4 -6
- package/dist/esm/utils-a4d55421.js +239 -0
- package/dist/fonts/fonts.css +20 -20
- package/dist/huds-lib/color-box_91.entry.js +87 -0
- package/dist/huds-lib/globalScript-3c6fab71.js +1 -0
- package/dist/huds-lib/huds-lib.esm.js +1 -2
- package/dist/huds-lib/hy-event-item.entry.js +1 -0
- package/dist/huds-lib/hy-events.entry.js +1 -0
- package/dist/huds-lib/hy-hero-carousel.entry.js +1 -0
- package/dist/huds-lib/index-9920074a.js +2 -0
- package/dist/huds-lib/index.esm.js +0 -2
- package/dist/huds-lib/utils-a4d55421.js +1 -0
- package/dist/loader/cdn.js +3 -0
- package/dist/loader/index.cjs.js +3 -0
- package/dist/loader/index.d.ts +21 -0
- package/dist/loader/index.es2017.js +3 -0
- package/dist/loader/index.js +4 -0
- package/dist/loader/package.json +11 -0
- package/dist/types/components/accordion-item/accordion-item.d.ts +1 -1
- package/dist/types/components/adjacent-image-text/adjacent-image-text.d.ts +1 -1
- package/dist/types/components/button/button.d.ts +3 -3
- package/dist/types/components/color-box/color-box.d.ts +1 -1
- package/dist/types/components/courses/hy-content-list/hy-content-list.d.ts +2 -2
- package/dist/types/components/courses/hy-content-list-item/hy-content-list-item.d.ts +1 -1
- package/dist/types/components/cta-button/cta-button.d.ts +2 -2
- package/dist/types/components/cta-link/cta-link.d.ts +2 -2
- package/dist/types/components/footer/hy-footer-base/hy-footer-base.d.ts +2 -2
- package/dist/types/components/footer/hy-footer-info/hy-footer-info.d.ts +1 -1
- package/dist/types/components/footer/hy-footer-link-item/hy-footer-link-item.d.ts +1 -1
- package/dist/types/components/grid-item/grid-item.d.ts +1 -1
- package/dist/types/components/heading/heading.d.ts +1 -1
- package/dist/types/components/hy-badge/hy-badge.d.ts +2 -2
- package/dist/types/components/hy-breadcrumbs/hy-breadcrumbs.d.ts +1 -1
- package/dist/types/components/hy-checkbox/hy-checkbox.d.ts +1 -1
- package/dist/types/components/hy-filter-visibility-tool/hy-filter-visibility-tool.d.ts +1 -1
- package/dist/types/components/hy-general-list/hy-general-list.d.ts +1 -1
- package/dist/types/components/hy-hero/hy-hero.d.ts +1 -1
- package/dist/types/components/hy-hero-carousel/hy-hero-carousel.d.ts +30 -0
- package/dist/types/components/hy-introduction/hy-introduction.d.ts +1 -1
- package/dist/types/components/hy-key-figure/hy-key-figure.d.ts +2 -2
- package/dist/types/components/hy-key-figure-group/hy-key-figure-group.d.ts +1 -1
- package/dist/types/components/hy-key-highlight/hy-key-highlight.d.ts +2 -2
- package/dist/types/components/hy-key-highlight-group/hy-key-highlight-group.d.ts +2 -2
- package/dist/types/components/hy-large-process-flow/hy-large-process-flow.d.ts +1 -1
- package/dist/types/components/hy-large-process-flow-phase/hy-large-process-flow-phase.d.ts +1 -1
- package/dist/types/components/hy-link-list/hy-link-list.d.ts +1 -1
- package/dist/types/components/hy-list-item/hy-list-item.d.ts +1 -1
- package/dist/types/components/hy-person-card/hy-person-card.d.ts +1 -1
- package/dist/types/components/hy-shortcuts/hy-shortcuts.d.ts +1 -1
- package/dist/types/components/hy-tabs/hy-tabs.d.ts +1 -1
- package/dist/types/components/icon/allIcons.d.ts +114 -114
- package/dist/types/components/icon/icons.d.ts +130 -130
- package/dist/types/components/image/image.d.ts +1 -1
- package/dist/types/components/link/link.d.ts +1 -1
- package/dist/types/components/link-box/link-box.d.ts +2 -2
- package/dist/types/components/link-box-list/link-box-list.d.ts +2 -2
- package/dist/types/components/navigation/hy-menu-main-group/hy-menu-main-group.d.ts +1 -1
- package/dist/types/components/navigation/menu-language/menu-language.d.ts +2 -2
- package/dist/types/components/pagination/hy-pager-item/hy-pager-item.d.ts +1 -1
- package/dist/types/components/person-profile/person-profile-listing/person-profile.listing.d.ts +1 -1
- package/dist/types/components/process/process.d.ts +1 -1
- package/dist/types/components/process-flow-box/process-flow-box.d.ts +3 -3
- package/dist/types/components/site-header/site-header.d.ts +2 -2
- package/dist/types/components/site-header/site-logo/site-logo.d.ts +1 -1
- package/dist/types/components/site-header/site-search/site-search.d.ts +3 -3
- package/dist/types/components.d.ts +39 -10
- package/dist/types/index.d.ts +1 -1
- package/dist/types/utils/utils.d.ts +4 -4
- package/loader/cdn.js +4 -3
- package/loader/index.cjs.js +4 -3
- package/loader/index.d.ts +13 -3
- package/loader/index.es2017.js +2 -3
- package/loader/index.js +13 -4
- package/loader/package.json +1 -1
- package/package.json +11 -3
- package/dist/cjs/color-box_8.cjs.entry.js +0 -187
- package/dist/cjs/color-box_8.cjs.entry.js.map +0 -1
- package/dist/cjs/globalScript-45ad6d41.js.map +0 -1
- package/dist/cjs/huds-lib.cjs.js.map +0 -1
- package/dist/cjs/hy-accordion-container_83.cjs.entry.js.map +0 -1
- package/dist/cjs/hy-event-item.cjs.entry.js.map +0 -1
- package/dist/cjs/hy-events.cjs.entry.js.map +0 -1
- package/dist/cjs/index-25bd964b.js.map +0 -1
- package/dist/cjs/index.cjs.js.map +0 -1
- package/dist/cjs/loader.cjs.js.map +0 -1
- package/dist/cjs/utils-14d5aa6f.js.map +0 -1
- package/dist/collection/components/accordion-container/accordion-container.js.map +0 -1
- package/dist/collection/components/accordion-item/accordion-item.js.map +0 -1
- package/dist/collection/components/adjacent-image-text/adjacent-image-text.js.map +0 -1
- package/dist/collection/components/baseline/baseline.js.map +0 -1
- package/dist/collection/components/button/button.js.map +0 -1
- package/dist/collection/components/color-box/color-box.js.map +0 -1
- package/dist/collection/components/courses/hy-content-list/hy-content-list.js.map +0 -1
- package/dist/collection/components/courses/hy-content-list-item/hy-content-list-item.js.map +0 -1
- package/dist/collection/components/cta-button/cta-button.js.map +0 -1
- package/dist/collection/components/cta-link/cta-link.js.map +0 -1
- package/dist/collection/components/docs-container/docs-container.js.map +0 -1
- package/dist/collection/components/footer/hy-footer/hy-footer.js.map +0 -1
- package/dist/collection/components/footer/hy-footer-action/hy-footer-action.js.map +0 -1
- package/dist/collection/components/footer/hy-footer-base/hy-footer-base.js.map +0 -1
- package/dist/collection/components/footer/hy-footer-info/hy-footer-info.js.map +0 -1
- package/dist/collection/components/footer/hy-footer-link-item/hy-footer-link-item.js.map +0 -1
- package/dist/collection/components/global-workers/globals.worker.js.map +0 -1
- package/dist/collection/components/grid-container/grid-container.js.map +0 -1
- package/dist/collection/components/grid-item/grid-item.js.map +0 -1
- package/dist/collection/components/grid-row/grid-row.js.map +0 -1
- package/dist/collection/components/heading/heading.js.map +0 -1
- package/dist/collection/components/hy-anchor-link-list/hy-anchor-link-list.js.map +0 -1
- package/dist/collection/components/hy-badge/hy-badge.js.map +0 -1
- package/dist/collection/components/hy-banner/hy-banner.js.map +0 -1
- package/dist/collection/components/hy-box/hy-box.js.map +0 -1
- package/dist/collection/components/hy-box-container/hy-box-container.js.map +0 -1
- package/dist/collection/components/hy-breadcrumbs/hy-breadcrumbs.js.map +0 -1
- package/dist/collection/components/hy-checkbox/hy-checkbox.js.map +0 -1
- package/dist/collection/components/hy-collaboration/hy-collaboration.js.map +0 -1
- package/dist/collection/components/hy-crisis-banner/hy-crisis-banner.js.map +0 -1
- package/dist/collection/components/hy-dropdown/hy-dropdown.js.map +0 -1
- package/dist/collection/components/hy-dropdown/hy-dropdown.panel.item.js.map +0 -1
- package/dist/collection/components/hy-dropdown/hy-dropdown.panel.js.map +0 -1
- package/dist/collection/components/hy-event-item/hy-event-item.js.map +0 -1
- package/dist/collection/components/hy-events/hy-events.js.map +0 -1
- package/dist/collection/components/hy-filter-group/hy-filter-group.item.js.map +0 -1
- package/dist/collection/components/hy-filter-group/hy-filter-group.js.map +0 -1
- package/dist/collection/components/hy-filter-list-type/hy-filter-list-type.js.map +0 -1
- package/dist/collection/components/hy-filter-visibility-tool/hy-filter-visibility-tool.js.map +0 -1
- package/dist/collection/components/hy-filter-visibility-tool/hy-filter-visibility-tool.reset.js.map +0 -1
- package/dist/collection/components/hy-filter-visibility-tool/hy-filter-visibility-tool.reset.toggle.js.map +0 -1
- package/dist/collection/components/hy-general-list/hy-general-list.js.map +0 -1
- package/dist/collection/components/hy-general-list-item/hy-general-list-item.js.map +0 -1
- package/dist/collection/components/hy-hero/hy-hero.js.map +0 -1
- package/dist/collection/components/hy-introduction/hy-introduction.js.map +0 -1
- package/dist/collection/components/hy-key-figure/hy-key-figure.js.map +0 -1
- package/dist/collection/components/hy-key-figure-group/hy-key-figure-group.js.map +0 -1
- package/dist/collection/components/hy-key-highlight/hy-key-highlight.js.map +0 -1
- package/dist/collection/components/hy-key-highlight-group/hy-key-highlight-group.js.map +0 -1
- package/dist/collection/components/hy-large-process-flow/hy-large-process-flow.js.map +0 -1
- package/dist/collection/components/hy-large-process-flow-phase/hy-large-process-flow-phase.js.map +0 -1
- package/dist/collection/components/hy-link-list/hy-link-list.js.map +0 -1
- package/dist/collection/components/hy-list-item/hy-list-item.js.map +0 -1
- package/dist/collection/components/hy-logo-grid/hy-logo-grid.item.js.map +0 -1
- package/dist/collection/components/hy-logo-grid/hy-logo-grid.js.map +0 -1
- package/dist/collection/components/hy-main/hy-main.js.map +0 -1
- package/dist/collection/components/hy-main-content-wrapper/hy-main-content-wrapper.js.map +0 -1
- package/dist/collection/components/hy-opening-hours/hy-opening-hours.js.map +0 -1
- package/dist/collection/components/hy-opening-hours-content/hy-opening-hours-content.js.map +0 -1
- package/dist/collection/components/hy-person-card/hy-person-card.js.map +0 -1
- package/dist/collection/components/hy-prominent-image/hy-prominent-image.js.map +0 -1
- package/dist/collection/components/hy-quote/hy-quote.js.map +0 -1
- package/dist/collection/components/hy-search-field/hy-search-field.js.map +0 -1
- package/dist/collection/components/hy-shortcuts/hy-shortcuts.js.map +0 -1
- package/dist/collection/components/hy-table-container/hy-table-container.js.map +0 -1
- package/dist/collection/components/hy-tabs/hy-tabs.js.map +0 -1
- package/dist/collection/components/hy-tabs-item/hy-tabs-item.js.map +0 -1
- package/dist/collection/components/hy-tag/hy-tag.js.map +0 -1
- package/dist/collection/components/hy-twitter-feed/hy-twitter-feed.js.map +0 -1
- package/dist/collection/components/hy-two-columns/hy-two-columns.js.map +0 -1
- package/dist/collection/components/hy-user-login-form/hy-user-login-form.js.map +0 -1
- package/dist/collection/components/hy-video/hy-video.js.map +0 -1
- package/dist/collection/components/icon/AddToTodoList.js.map +0 -1
- package/dist/collection/components/icon/Alert.js.map +0 -1
- package/dist/collection/components/icon/Archive.js.map +0 -1
- package/dist/collection/components/icon/Arrow.js.map +0 -1
- package/dist/collection/components/icon/ArrowDown.js.map +0 -1
- package/dist/collection/components/icon/ArrowRight.js.map +0 -1
- package/dist/collection/components/icon/ArrowUp.js.map +0 -1
- package/dist/collection/components/icon/Avatar.js.map +0 -1
- package/dist/collection/components/icon/AvatarGroup.js.map +0 -1
- package/dist/collection/components/icon/Bachelor.js.map +0 -1
- package/dist/collection/components/icon/BulletList.js.map +0 -1
- package/dist/collection/components/icon/Camera.js.map +0 -1
- package/dist/collection/components/icon/CaretDown.js.map +0 -1
- package/dist/collection/components/icon/CaretLeft.js.map +0 -1
- package/dist/collection/components/icon/CaretRight.js.map +0 -1
- package/dist/collection/components/icon/CaretUp.js.map +0 -1
- package/dist/collection/components/icon/Chat.js.map +0 -1
- package/dist/collection/components/icon/CodeFork.js.map +0 -1
- package/dist/collection/components/icon/Cogs.js.map +0 -1
- package/dist/collection/components/icon/Contentlink.js.map +0 -1
- package/dist/collection/components/icon/Customlink.js.map +0 -1
- package/dist/collection/components/icon/Date.js.map +0 -1
- package/dist/collection/components/icon/Discover.js.map +0 -1
- package/dist/collection/components/icon/Done.js.map +0 -1
- package/dist/collection/components/icon/Dot.js.map +0 -1
- package/dist/collection/components/icon/DotArrowRight.js.map +0 -1
- package/dist/collection/components/icon/Download.js.map +0 -1
- package/dist/collection/components/icon/Drag.js.map +0 -1
- package/dist/collection/components/icon/Dragbutton.js.map +0 -1
- package/dist/collection/components/icon/DropDown.js.map +0 -1
- package/dist/collection/components/icon/Edit.js.map +0 -1
- package/dist/collection/components/icon/EditEvent.js.map +0 -1
- package/dist/collection/components/icon/Embed.js.map +0 -1
- package/dist/collection/components/icon/Euro.js.map +0 -1
- package/dist/collection/components/icon/Events.js.map +0 -1
- package/dist/collection/components/icon/ExternalLink.js.map +0 -1
- package/dist/collection/components/icon/EyeSlash.js.map +0 -1
- package/dist/collection/components/icon/Facebook.js.map +0 -1
- package/dist/collection/components/icon/Favorites.js.map +0 -1
- package/dist/collection/components/icon/Feed.js.map +0 -1
- package/dist/collection/components/icon/FileText.js.map +0 -1
- package/dist/collection/components/icon/FullScreen.js.map +0 -1
- package/dist/collection/components/icon/Globe.js.map +0 -1
- package/dist/collection/components/icon/GooglePlus.js.map +0 -1
- package/dist/collection/components/icon/Grid.js.map +0 -1
- package/dist/collection/components/icon/Hamburger.js.map +0 -1
- package/dist/collection/components/icon/Heart.js.map +0 -1
- package/dist/collection/components/icon/HeartSupport.js.map +0 -1
- package/dist/collection/components/icon/Helsinginyliopisto.js.map +0 -1
- package/dist/collection/components/icon/Home.js.map +0 -1
- package/dist/collection/components/icon/HorizontalResize.js.map +0 -1
- package/dist/collection/components/icon/HyLogo.js.map +0 -1
- package/dist/collection/components/icon/IdNumber.js.map +0 -1
- package/dist/collection/components/icon/Image.js.map +0 -1
- package/dist/collection/components/icon/ImageGallery.js.map +0 -1
- package/dist/collection/components/icon/Images.js.map +0 -1
- package/dist/collection/components/icon/Info.js.map +0 -1
- package/dist/collection/components/icon/InfoStroke.js.map +0 -1
- package/dist/collection/components/icon/Instagram.js.map +0 -1
- package/dist/collection/components/icon/LeikiList.js.map +0 -1
- package/dist/collection/components/icon/LinkArrow.js.map +0 -1
- package/dist/collection/components/icon/LinkArrow1.js.map +0 -1
- package/dist/collection/components/icon/LinkArrowDown.js.map +0 -1
- package/dist/collection/components/icon/LinkArrowLeft.js.map +0 -1
- package/dist/collection/components/icon/LinkArrowOffsite.js.map +0 -1
- package/dist/collection/components/icon/LinkArrowUp.js.map +0 -1
- package/dist/collection/components/icon/Linkedin.js.map +0 -1
- package/dist/collection/components/icon/List.js.map +0 -1
- package/dist/collection/components/icon/ListAsBlocks.js.map +0 -1
- package/dist/collection/components/icon/ListStyleGrid.js.map +0 -1
- package/dist/collection/components/icon/ListStyleList.js.map +0 -1
- package/dist/collection/components/icon/Listoflinks.js.map +0 -1
- package/dist/collection/components/icon/Location.js.map +0 -1
- package/dist/collection/components/icon/Log.js.map +0 -1
- package/dist/collection/components/icon/Login.js.map +0 -1
- package/dist/collection/components/icon/Logout.js.map +0 -1
- package/dist/collection/components/icon/MagnifyMinus.js.map +0 -1
- package/dist/collection/components/icon/MagnifyPlus.js.map +0 -1
- package/dist/collection/components/icon/Mail.js.map +0 -1
- package/dist/collection/components/icon/Master.js.map +0 -1
- package/dist/collection/components/icon/Minus.js.map +0 -1
- package/dist/collection/components/icon/Mobile.js.map +0 -1
- package/dist/collection/components/icon/Modify.js.map +0 -1
- package/dist/collection/components/icon/NaviTriangle.js.map +0 -1
- package/dist/collection/components/icon/NewGroup.js.map +0 -1
- package/dist/collection/components/icon/NewPerson.js.map +0 -1
- package/dist/collection/components/icon/Notification.js.map +0 -1
- package/dist/collection/components/icon/OpinderLogo.js.map +0 -1
- package/dist/collection/components/icon/OpinderLogoNew.js.map +0 -1
- package/dist/collection/components/icon/Pdf.js.map +0 -1
- package/dist/collection/components/icon/People.js.map +0 -1
- package/dist/collection/components/icon/PermissionAll.js.map +0 -1
- package/dist/collection/components/icon/PermissionGroup.js.map +0 -1
- package/dist/collection/components/icon/PermissionPrivate.js.map +0 -1
- package/dist/collection/components/icon/Person.js.map +0 -1
- package/dist/collection/components/icon/PersonOutline.js.map +0 -1
- package/dist/collection/components/icon/Phone.js.map +0 -1
- package/dist/collection/components/icon/Play.js.map +0 -1
- package/dist/collection/components/icon/Plus.js.map +0 -1
- package/dist/collection/components/icon/Preview.js.map +0 -1
- package/dist/collection/components/icon/Profile.js.map +0 -1
- package/dist/collection/components/icon/Question.js.map +0 -1
- package/dist/collection/components/icon/Remove.js.map +0 -1
- package/dist/collection/components/icon/Retweet.js.map +0 -1
- package/dist/collection/components/icon/RotateLeft.js.map +0 -1
- package/dist/collection/components/icon/RotateRight.js.map +0 -1
- package/dist/collection/components/icon/Search.js.map +0 -1
- package/dist/collection/components/icon/Share.js.map +0 -1
- package/dist/collection/components/icon/SlimHamburgerMenu.js.map +0 -1
- package/dist/collection/components/icon/SocialMedia.js.map +0 -1
- package/dist/collection/components/icon/SomeFacebook.js.map +0 -1
- package/dist/collection/components/icon/SomeInstagram.js.map +0 -1
- package/dist/collection/components/icon/SomeLinkedin.js.map +0 -1
- package/dist/collection/components/icon/SomeTwitter.js.map +0 -1
- package/dist/collection/components/icon/SomeYoutube.js.map +0 -1
- package/dist/collection/components/icon/Spinner.js.map +0 -1
- package/dist/collection/components/icon/Square.js.map +0 -1
- package/dist/collection/components/icon/SquareChecked.js.map +0 -1
- package/dist/collection/components/icon/Time.js.map +0 -1
- package/dist/collection/components/icon/TodoList.js.map +0 -1
- package/dist/collection/components/icon/Tour.js.map +0 -1
- package/dist/collection/components/icon/Twitter.js.map +0 -1
- package/dist/collection/components/icon/TwitterLike.js.map +0 -1
- package/dist/collection/components/icon/UnitsAndFaculties.js.map +0 -1
- package/dist/collection/components/icon/Url.js.map +0 -1
- package/dist/collection/components/icon/Video.js.map +0 -1
- package/dist/collection/components/icon/Warning.js.map +0 -1
- package/dist/collection/components/icon/Wrench.js.map +0 -1
- package/dist/collection/components/icon/Youtube.js.map +0 -1
- package/dist/collection/components/icon/allIcons.js.map +0 -1
- package/dist/collection/components/icon/icon.js.map +0 -1
- package/dist/collection/components/icon/icons.js.map +0 -1
- package/dist/collection/components/image/image.js.map +0 -1
- package/dist/collection/components/ingress/ingress.js.map +0 -1
- package/dist/collection/components/link/link.js.map +0 -1
- package/dist/collection/components/link-box/link-box.js.map +0 -1
- package/dist/collection/components/link-box-list/link-box-list.js.map +0 -1
- package/dist/collection/components/navigation/hy-menu-main-group/hy-menu-main-group.js.map +0 -1
- package/dist/collection/components/navigation/menu-language/menu-language.js.map +0 -1
- package/dist/collection/components/navigation/menu-language-item/menu-language-item.js.map +0 -1
- package/dist/collection/components/pagination/hy-pager/hy-pager.js.map +0 -1
- package/dist/collection/components/pagination/hy-pager-item/hy-pager-item.js.map +0 -1
- package/dist/collection/components/paragraph-text/paragraph-text.js.map +0 -1
- package/dist/collection/components/person-profile/person-profile-listing/person-profile.listing.js.map +0 -1
- package/dist/collection/components/person-profile/person-profile.js.map +0 -1
- package/dist/collection/components/process/process.js.map +0 -1
- package/dist/collection/components/process-flow-box/process-flow-box.js.map +0 -1
- package/dist/collection/components/row/row.js.map +0 -1
- package/dist/collection/components/section-container/section-container.js.map +0 -1
- package/dist/collection/components/site-header/site-header.js.map +0 -1
- package/dist/collection/components/site-header/site-logo/site-logo.js.map +0 -1
- package/dist/collection/components/site-header/site-search/site-search.js.map +0 -1
- package/dist/collection/components/tiny-text/tiny-text.js.map +0 -1
- package/dist/collection/global/colors.js.map +0 -1
- package/dist/collection/global/globalScript.js.map +0 -1
- package/dist/collection/global/typography.js.map +0 -1
- package/dist/collection/index.js.map +0 -1
- package/dist/collection/utils/utils.js.map +0 -1
- package/dist/esm/color-box_8.entry.js +0 -176
- package/dist/esm/color-box_8.entry.js.map +0 -1
- package/dist/esm/globalScript-4ad40215.js.map +0 -1
- package/dist/esm/huds-lib.js.map +0 -1
- package/dist/esm/hy-accordion-container_83.entry.js.map +0 -1
- package/dist/esm/hy-event-item.entry.js.map +0 -1
- package/dist/esm/hy-events.entry.js.map +0 -1
- package/dist/esm/index-3a66d87e.js.map +0 -1
- package/dist/esm/index.js.map +0 -1
- package/dist/esm/loader.js.map +0 -1
- package/dist/esm/utils-43c56d92.js.map +0 -1
- package/dist/huds-lib/huds-lib.esm.js.map +0 -1
- package/dist/huds-lib/index.esm.js.map +0 -1
- package/dist/huds-lib/p-1aeae669.entry.js +0 -2
- package/dist/huds-lib/p-1aeae669.entry.js.map +0 -1
- package/dist/huds-lib/p-30e3190a.entry.js +0 -88
- package/dist/huds-lib/p-30e3190a.entry.js.map +0 -1
- package/dist/huds-lib/p-63584350.js +0 -2
- package/dist/huds-lib/p-63584350.js.map +0 -1
- package/dist/huds-lib/p-7b75f0ea.entry.js +0 -2
- package/dist/huds-lib/p-7b75f0ea.entry.js.map +0 -1
- package/dist/huds-lib/p-b02e49ad.js +0 -2
- package/dist/huds-lib/p-b02e49ad.js.map +0 -1
- package/dist/huds-lib/p-c8ed784d.entry.js +0 -2
- package/dist/huds-lib/p-c8ed784d.entry.js.map +0 -1
- package/dist/huds-lib/p-ff975a68.js +0 -3
- package/dist/huds-lib/p-ff975a68.js.map +0 -1
|
@@ -1,6 +1,18 @@
|
|
|
1
|
-
import { r as registerInstance, h, H as Host, g as getElement, c as createEvent, F as Fragment } from './index-
|
|
2
|
-
import { A as AccordionVariants, C as CtaLinkButtonVariants, B as BreadcrumbVariants,
|
|
3
|
-
import { j as jsonParserWorker } from './globalScript-
|
|
1
|
+
import { r as registerInstance, h, H as Host, g as getElement, c as createEvent, F as Fragment } from './index-9920074a.js';
|
|
2
|
+
import { A as AccordionVariants, C as CtaLinkButtonVariants, B as BreadcrumbVariants, a as CheckboxVariants, b as CourseVariants, c as CourseStateVariants, d as CtaLinkVariants, e as ColorVariant, L as ListStyleVariants, F as FooterLinkItemColor, S as SiteLogoSize, f as FooterVariant, H as HeadingVarians, g as FooterLinkVariants, h as HeadingSectionVariants, G as GeneralListTypes, i as GridColumns, j as GridColumnsSm, k as GridColumnsLg, l as GridAlignVariants, m as HeroTypeVariant, n as HeroGroupTypeVariant, o as HeroColorVariant, p as HeroSizeVariant, K as KeyHighlightVariants, q as LinkVariants, r as LinkBoxVariants, s as ListItemVariants, P as PaginationItemVariants, t as PersonCardVariants, u as ProcessFlowBoxVariants, M as MenuType } from './utils-a4d55421.js';
|
|
3
|
+
import { j as jsonParserWorker } from './globalScript-3c6fab71.js';
|
|
4
|
+
|
|
5
|
+
const colorBoxCss = ":host{display:block}";
|
|
6
|
+
|
|
7
|
+
const ColorBox = class {
|
|
8
|
+
constructor(hostRef) {
|
|
9
|
+
registerInstance(this, hostRef);
|
|
10
|
+
}
|
|
11
|
+
render() {
|
|
12
|
+
return (h(Host, null, h("slot", null)));
|
|
13
|
+
}
|
|
14
|
+
};
|
|
15
|
+
ColorBox.style = colorBoxCss;
|
|
4
16
|
|
|
5
17
|
const accordionContainerCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand-main-bright:#48c5f8;--brand-main-light:#107eab;--brand-main-active:#005379;--brand-main-dark:#003146;--brand-main-nearly-black:#000222;--link-blue:#0479a4;--link-disabled:#767676;--grayscale-white:#fff;--grayscale-slightly-gray:#fefefe;--grayscale-light:#f8f8f8;--grayscale-medium:#d2d2d2;--grayscale-background-box:#f5f5f5;--grayscale-tabs-border:#e6e6e6;--grayscale-background-arrow:#dfdfdf;--grayscale-medium-dark:#979797;--grayscale-dark:#555555;--grayscale-dark-text:#222222;--grayscale-black:#000000;--additional-red-light:#e5053a;--additional-red-dark:#a31621;--additional-purple-light:#420039;--additional-yellow-light:#f9a21a;--additional-yellow:#c47f1b;--additional-skyblue:#48c5f8;--additional-orange:#d14600;--additional-green-light:#96ba3c;--additional-green-dark:#006400;--hover-gray:#eaeaea}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{--gutter-mobile:16px;--gutter-narrow:24px;--gutter-medium:24px;--gutter-wide:24px;--gutter-extrawide:32px}:root{--breakpoint-extrawide:75.0625rem;--breakpoint-max-width:75.0625rem;--breakpoint-medium:48rem;--breakpoint-narrow:30rem;--breakpoint-wide:60rem}:host{display:block}.hy-accordion-container{width:100%}";
|
|
6
18
|
|
|
@@ -18,9 +30,9 @@ const AccordionContainer = class {
|
|
|
18
30
|
Assumes data-allow-toggle otherwise you would not be able to close any of the accordions
|
|
19
31
|
*/
|
|
20
32
|
render() {
|
|
21
|
-
const classAttributes = [
|
|
22
|
-
const id = this.accordionid.toLowerCase().replace(/\W/g,
|
|
23
|
-
return (h(Host, null, h("div", { id: id, class: classAttributes.join(
|
|
33
|
+
const classAttributes = ["hy-accordion-container", "js-hy-accordion"];
|
|
34
|
+
const id = this.accordionid.toLowerCase().replace(/\W/g, "-");
|
|
35
|
+
return (h(Host, null, h("div", { id: id, class: classAttributes.join(" "), "data-allow-multiple": "true", "data-allow-toggle": "true" }, h("slot", null)), h("hy-box", { mb: "1.75, 1.75, 2, 2.5" })));
|
|
24
36
|
}
|
|
25
37
|
};
|
|
26
38
|
AccordionContainer.style = accordionContainerCss;
|
|
@@ -28,30 +40,30 @@ AccordionContainer.style = accordionContainerCss;
|
|
|
28
40
|
const accordionItemCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand-main-bright:#48c5f8;--brand-main-light:#107eab;--brand-main-active:#005379;--brand-main-dark:#003146;--brand-main-nearly-black:#000222;--link-blue:#0479a4;--link-disabled:#767676;--grayscale-white:#fff;--grayscale-slightly-gray:#fefefe;--grayscale-light:#f8f8f8;--grayscale-medium:#d2d2d2;--grayscale-background-box:#f5f5f5;--grayscale-tabs-border:#e6e6e6;--grayscale-background-arrow:#dfdfdf;--grayscale-medium-dark:#979797;--grayscale-dark:#555555;--grayscale-dark-text:#222222;--grayscale-black:#000000;--additional-red-light:#e5053a;--additional-red-dark:#a31621;--additional-purple-light:#420039;--additional-yellow-light:#f9a21a;--additional-yellow:#c47f1b;--additional-skyblue:#48c5f8;--additional-orange:#d14600;--additional-green-light:#96ba3c;--additional-green-dark:#006400;--hover-gray:#eaeaea}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{--gutter-mobile:16px;--gutter-narrow:24px;--gutter-medium:24px;--gutter-wide:24px;--gutter-extrawide:32px}:root{--breakpoint-extrawide:75.0625rem;--breakpoint-max-width:75.0625rem;--breakpoint-medium:48rem;--breakpoint-narrow:30rem;--breakpoint-wide:60rem}:host{display:block}.hy-accordion__item{margin-bottom:12px}.hy-accordion__item__is-open{border:1px solid var(--grayscale-dark)}.hy-accordion__item__is-open .hy-accordion--heading{margin:0 auto}.hy-accordion__item__is-open .hy-accordion--heading .hy-accordion--heading__icon{-webkit-transform:rotateX(180deg);transform:rotateX(180deg)}.hy-accordion__item.mini{margin-bottom:1rem;margin-top:1rem}.hy-accordion__item__is-open.mini{margin-bottom:0;margin-top:0}.hy-accordion__item__is-open.mini .hy-accordion__item--container{border-bottom:1px solid var(--grayscale-medium-dark);border-top:1px solid var(--grayscale-medium-dark);padding-top:16px;padding-bottom:32px;margin-top:-1px;-webkit-transition:padding 0.5s ease-in-out;transition:padding 0.5s ease-in-out}@media (min-width: 30rem){.hy-accordion__item__is-open.mini .hy-accordion__item--container{padding-top:28px;padding-bottom:30px}}@media (min-width: 60rem){.hy-accordion__item__is-open.mini .hy-accordion__item--container{padding-top:32px;padding-bottom:40px}}.hy-accordion__item.hy-accordion__item__is-open.mini{background-color:var(--grayscale-white);border:none;-webkit-box-shadow:0 -10px 10px -10px rgba(0, 49, 70, 0.05);box-shadow:0 -10px 10px -10px rgba(0, 49, 70, 0.05)}.hy-accordion--heading{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;letter-spacing:-0.69px;line-height:28px;margin:0 auto;-webkit-transition:all 0.25s ease-in-out;transition:all 0.25s ease-in-out;width:100%}.hy-accordion--heading .hy-accordion__link{text-decoration:none}.hy-accordion--heading .hy-accordion__link:hover{text-decoration:none}.hy-accordion--heading .hy-accordion__button{font-size:1.125rem;line-height:22px;font-weight:700;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;background-color:var(--grayscale-background-box);border:none;color:var(--brand-main-nearly-black);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;font-family:var(--main-font-family);height:100%;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;letter-spacing:-0.45px;padding:13px 20px 13px 16px;-webkit-transition:all 0.35s ease-in;transition:all 0.35s ease-in;width:100%}.hy-accordion--heading .hy-accordion__button:hover{cursor:pointer}@media (min-width: 30rem){.hy-accordion--heading .hy-accordion__button{padding:1rem 2rem 1rem 1.25rem}}@media (min-width: 1601px){.hy-accordion--heading .hy-accordion__button{font-size:1.25rem;line-height:24px;letter-spacing:-0.5px}}@media (min-width: 75.0625rem){.hy-accordion--heading .hy-accordion__button--large{font-size:1.25rem;line-height:24px;letter-spacing:-0.5px}}@media (min-width: 75.0625rem){.hy-accordion--heading .hy-accordion__button--large .hy-accordion--heading__icon svg{height:20px;width:20px}}.hy-accordion--heading .hy-accordion__button span{text-align:left}.hy-accordion--heading .hy-accordion__button[aria-expanded=true]{background:none;position:relative}.hy-accordion--heading .hy-accordion__button[aria-expanded=true]:after{background-color:var(--grayscale-medium-dark);bottom:0;content:\"\";height:1px;left:16px;position:absolute;right:20px}.hy-accordion--heading .hy-accordion__button *{pointer-events:none}.hy-accordion--heading .hy-accordion--heading__icon{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;height:22px;margin-right:8px;z-index:0}.hy-accordion--heading .hy-accordion--heading__icon svg{fill:var(--brand-main)}@media (min-width: 30rem){.hy-accordion--heading .hy-accordion--heading__icon svg{height:18px;width:18px}}@media (min-width: 1601px){.hy-accordion--heading .hy-accordion--heading__icon svg{height:20px;width:20px}}.hy-accordion--heading.mini .hy-accordion__button{font-size:1.125rem;line-height:22px;background-color:var(--grayscale-white);color:var(--link-blue);letter-spacing:-0.56px;padding:0}@media (min-width: 30rem){.hy-accordion--heading.mini .hy-accordion__button{font-size:1.375rem;line-height:28px;letter-spacing:-0.69px;padding:0}}.hy-accordion--heading.mini .hy-accordion__button[aria-expanded=true]{color:var(--grayscale-black);margin-bottom:20px}@media (min-width: 30rem){.hy-accordion--heading.mini .hy-accordion__button[aria-expanded=true]{margin-bottom:28px}}@media (min-width: 60rem){.hy-accordion--heading.mini .hy-accordion__button[aria-expanded=true]{margin-bottom:32px}}.hy-accordion--heading.mini .hy-accordion--heading__icon{margin-right:0.5rem;z-index:0}@media (min-width: 30rem){.hy-accordion--heading.mini .hy-accordion--heading__icon{margin-right:10px}}.hy-accordion--heading.mini .hy-accordion--heading__icon svg{fill:var(--brand-main-light);height:14px;width:14px}@media (min-width: 30rem){.hy-accordion--heading.mini .hy-accordion--heading__icon svg{height:16px;width:16px}}.hy-accordion__content{display:block;height:0;padding:0;overflow:hidden;-webkit-transition:all 0.25s ease-in-out;transition:all 0.25s ease-in-out}.hy-accordion__content--inner-wrapper{display:block;padding:16px 12px}@media (min-width: 30rem){.hy-accordion__content--inner-wrapper{padding:15px 16px}}@media (min-width: 60rem){.hy-accordion__content--inner-wrapper{padding:16px}}@media (min-width: 75.0625rem){.hy-accordion__content--inner-wrapper--large{padding:24px 20px}}@media (min-width: 1601px){.hy-accordion__content--inner-wrapper{padding:24px 20px}}.hy-accordion__content--inner-wrapper--mini{padding:0}.hy-accordion__content--inner-wrapper--mini .course-heading h4{padding-top:0 !important}";
|
|
29
41
|
|
|
30
42
|
let keys$4 = {
|
|
31
|
-
enter:
|
|
32
|
-
tab:
|
|
33
|
-
pageUp:
|
|
34
|
-
pageDown:
|
|
35
|
-
arrowUp:
|
|
36
|
-
arrowDown:
|
|
37
|
-
home:
|
|
38
|
-
end:
|
|
43
|
+
enter: "Enter",
|
|
44
|
+
tab: "Tab",
|
|
45
|
+
pageUp: "PageUp",
|
|
46
|
+
pageDown: "PageDown",
|
|
47
|
+
arrowUp: "ArrowUp",
|
|
48
|
+
arrowDown: "ArrowDown",
|
|
49
|
+
home: "Home",
|
|
50
|
+
end: "End", //35
|
|
39
51
|
};
|
|
40
52
|
const AccordionItem = class {
|
|
41
53
|
constructor(hostRef) {
|
|
42
54
|
registerInstance(this, hostRef);
|
|
43
55
|
this.accordiontitle = undefined;
|
|
44
56
|
this.variant = AccordionVariants.default;
|
|
45
|
-
this.headerstyle =
|
|
57
|
+
this.headerstyle = "common";
|
|
46
58
|
this.showOpen = false;
|
|
47
59
|
this.ready = false;
|
|
48
60
|
}
|
|
49
61
|
componentDidLoad() {
|
|
50
62
|
this.ready = true;
|
|
51
|
-
let hyMainDiv = this.el.closest(
|
|
63
|
+
let hyMainDiv = this.el.closest(".hy-main");
|
|
52
64
|
if (hyMainDiv) {
|
|
53
|
-
if (!hyMainDiv.classList.contains(
|
|
54
|
-
this.headerstyle =
|
|
65
|
+
if (!hyMainDiv.classList.contains("with-sidebar")) {
|
|
66
|
+
this.headerstyle = "large";
|
|
55
67
|
}
|
|
56
68
|
}
|
|
57
69
|
}
|
|
@@ -59,16 +71,16 @@ const AccordionItem = class {
|
|
|
59
71
|
if (window.location.hash) {
|
|
60
72
|
this.expandPanelByAnchor(window.location.hash);
|
|
61
73
|
}
|
|
62
|
-
document.querySelectorAll(
|
|
63
|
-
let showOpen = accordion.classList.contains(
|
|
74
|
+
document.querySelectorAll(".hy-accordion__content").forEach(function (accordion) {
|
|
75
|
+
let showOpen = accordion.classList.contains("open");
|
|
64
76
|
let element = accordion;
|
|
65
77
|
if (showOpen) {
|
|
66
|
-
element.style.display =
|
|
67
|
-
element.style.height = element.scrollHeight +
|
|
78
|
+
element.style.display = "block";
|
|
79
|
+
element.style.height = element.scrollHeight + "px";
|
|
68
80
|
}
|
|
69
81
|
else {
|
|
70
|
-
element.style.height = 0 +
|
|
71
|
-
element.style.display =
|
|
82
|
+
element.style.height = 0 + "px";
|
|
83
|
+
element.style.display = "none";
|
|
72
84
|
}
|
|
73
85
|
});
|
|
74
86
|
}
|
|
@@ -80,11 +92,11 @@ const AccordionItem = class {
|
|
|
80
92
|
handleKeyDown(event) {
|
|
81
93
|
const containerId = this.el.parentElement.id;
|
|
82
94
|
let accordion = document.querySelectorAll(`#${containerId}`)[0];
|
|
83
|
-
const triggers = Array.prototype.slice.call(accordion.querySelectorAll(
|
|
95
|
+
const triggers = Array.prototype.slice.call(accordion.querySelectorAll(".hy-accordion__button"));
|
|
84
96
|
let target = event.target;
|
|
85
97
|
const key = event.code;
|
|
86
98
|
const ctrlModifier = event.ctrlKey && [keys$4.pageDown, keys$4.pageUp].includes(key); //key.match(/33|34/);
|
|
87
|
-
if (target.classList.contains(
|
|
99
|
+
if (target.classList.contains("hy-accordion__button")) {
|
|
88
100
|
// Up/ Down arrow and Control + Page Up/ Page Down keyboard operations
|
|
89
101
|
if ([keys$4.arrowDown, keys$4.arrowUp].includes(key) || ctrlModifier) {
|
|
90
102
|
const index = triggers.indexOf(target);
|
|
@@ -112,46 +124,46 @@ const AccordionItem = class {
|
|
|
112
124
|
handleClick(event) {
|
|
113
125
|
const target = event.target;
|
|
114
126
|
const accordionContainer = this.el.parentElement;
|
|
115
|
-
const allowMultiple = accordionContainer.hasAttribute(
|
|
116
|
-
const allowToggle = allowMultiple ? allowMultiple : accordionContainer.hasAttribute(
|
|
117
|
-
if (target && target.tagName.toLowerCase() ===
|
|
118
|
-
let targetParent = target.closest(
|
|
119
|
-
let targetContent = targetParent.getElementsByClassName(
|
|
120
|
-
const isExpanded = target.getAttribute(
|
|
127
|
+
const allowMultiple = accordionContainer.hasAttribute("data-allow-multiple");
|
|
128
|
+
const allowToggle = allowMultiple ? allowMultiple : accordionContainer.hasAttribute("data-allow-toggle");
|
|
129
|
+
if (target && target.tagName.toLowerCase() === "button") {
|
|
130
|
+
let targetParent = target.closest(".hy-accordion__item");
|
|
131
|
+
let targetContent = targetParent.getElementsByClassName("hy-accordion__content")[0];
|
|
132
|
+
const isExpanded = target.getAttribute("aria-expanded") === "true";
|
|
121
133
|
const activeButtonElement = accordionContainer.querySelector('[aria-expanded="true"]');
|
|
122
134
|
if (!allowMultiple && activeButtonElement && activeButtonElement !== target) {
|
|
123
|
-
activeButtonElement.setAttribute(
|
|
135
|
+
activeButtonElement.setAttribute("aria-expanded", "false");
|
|
124
136
|
this.collapseSection(targetContent);
|
|
125
|
-
if (targetParent.classList.contains(
|
|
126
|
-
targetParent.classList.remove(
|
|
137
|
+
if (targetParent.classList.contains("hy-accordion__item__is-open")) {
|
|
138
|
+
targetParent.classList.remove("hy-accordion__item__is-open");
|
|
127
139
|
}
|
|
128
140
|
accordionContainer
|
|
129
|
-
.querySelector(`#${activeButtonElement.getAttribute(
|
|
130
|
-
.setAttribute(
|
|
141
|
+
.querySelector(`#${activeButtonElement.getAttribute("aria-controls")}`)
|
|
142
|
+
.setAttribute("aria-hidden", "true");
|
|
131
143
|
if (!allowToggle) {
|
|
132
|
-
activeButtonElement.removeAttribute(
|
|
144
|
+
activeButtonElement.removeAttribute("aria-disabled");
|
|
133
145
|
}
|
|
134
146
|
}
|
|
135
147
|
if (!isExpanded) {
|
|
136
148
|
this.expandSection(targetContent);
|
|
137
|
-
target.setAttribute(
|
|
138
|
-
targetParent.classList.add(
|
|
149
|
+
target.setAttribute("aria-expanded", "true");
|
|
150
|
+
targetParent.classList.add("hy-accordion__item__is-open");
|
|
139
151
|
accordionContainer
|
|
140
|
-
.querySelector(`#${target.getAttribute(
|
|
141
|
-
.setAttribute(
|
|
152
|
+
.querySelector(`#${target.getAttribute("aria-controls")}`)
|
|
153
|
+
.setAttribute("aria-hidden", "false");
|
|
142
154
|
if (!allowToggle) {
|
|
143
|
-
target.setAttribute(
|
|
155
|
+
target.setAttribute("aria-disabled", "true");
|
|
144
156
|
}
|
|
145
157
|
}
|
|
146
158
|
else if (allowToggle && isExpanded) {
|
|
147
|
-
target.setAttribute(
|
|
159
|
+
target.setAttribute("aria-expanded", "false");
|
|
148
160
|
this.collapseSection(targetContent);
|
|
149
|
-
if (targetParent.classList.contains(
|
|
150
|
-
targetParent.classList.remove(
|
|
161
|
+
if (targetParent.classList.contains("hy-accordion__item__is-open")) {
|
|
162
|
+
targetParent.classList.remove("hy-accordion__item__is-open");
|
|
151
163
|
}
|
|
152
164
|
accordionContainer
|
|
153
|
-
.querySelector(`#${target.getAttribute(
|
|
154
|
-
.setAttribute(
|
|
165
|
+
.querySelector(`#${target.getAttribute("aria-controls")}`)
|
|
166
|
+
.setAttribute("aria-hidden", "true");
|
|
155
167
|
}
|
|
156
168
|
event.preventDefault();
|
|
157
169
|
event.stopImmediatePropagation();
|
|
@@ -162,73 +174,73 @@ const AccordionItem = class {
|
|
|
162
174
|
if (anchor.length > 0) {
|
|
163
175
|
anchor = anchor.substr(1);
|
|
164
176
|
let target = document.querySelectorAll(`[id=${anchor}]`)[0];
|
|
165
|
-
if (target && target.classList.contains(
|
|
166
|
-
let targetParent = target.closest(
|
|
167
|
-
let targetContent = targetParent.querySelectorAll(
|
|
177
|
+
if (target && target.classList.contains("hy-accordion__button")) {
|
|
178
|
+
let targetParent = target.closest(".hy-accordion__item");
|
|
179
|
+
let targetContent = targetParent.querySelectorAll(".hy-accordion__content")[0];
|
|
168
180
|
this.expandSection(targetContent);
|
|
169
|
-
target.setAttribute(
|
|
170
|
-
targetParent.classList.add(
|
|
181
|
+
target.setAttribute("aria-expanded", "true");
|
|
182
|
+
targetParent.classList.add("hy-accordion__item__is-open");
|
|
171
183
|
const targetElementRect = target.getBoundingClientRect();
|
|
172
|
-
window.scrollTo({ top: window.scrollY + targetElementRect.top - 200, behavior:
|
|
184
|
+
window.scrollTo({ top: window.scrollY + targetElementRect.top - 200, behavior: "smooth" });
|
|
173
185
|
const containerId = targetParent.parentElement.parentElement.id;
|
|
174
186
|
if (containerId.length > 0) {
|
|
175
187
|
let accordion = document.querySelectorAll(`#${containerId}`)[0];
|
|
176
|
-
accordion.querySelector(`#${target.getAttribute(
|
|
188
|
+
accordion.querySelector(`#${target.getAttribute("aria-controls")}`).setAttribute("aria-hidden", "false");
|
|
177
189
|
}
|
|
178
190
|
}
|
|
179
191
|
}
|
|
180
192
|
}, 200);
|
|
181
193
|
}
|
|
182
194
|
collapseSection(element) {
|
|
183
|
-
element.style.height = 0 +
|
|
184
|
-
element.setAttribute(
|
|
195
|
+
element.style.height = 0 + "px";
|
|
196
|
+
element.setAttribute("data-collapsed", "true");
|
|
185
197
|
setTimeout(() => {
|
|
186
|
-
element.style.display =
|
|
198
|
+
element.style.display = "none";
|
|
187
199
|
}, 250);
|
|
188
200
|
}
|
|
189
201
|
expandSection(element) {
|
|
190
|
-
element.style.display =
|
|
191
|
-
element.style.height = element.scrollHeight +
|
|
192
|
-
element.setAttribute(
|
|
202
|
+
element.style.display = "block";
|
|
203
|
+
element.style.height = element.scrollHeight + "px";
|
|
204
|
+
element.setAttribute("data-collapsed", "false");
|
|
193
205
|
}
|
|
194
206
|
render() {
|
|
195
207
|
const containerId = this.el.parentElement.id;
|
|
196
208
|
if (this.ready && containerId.length > 0) {
|
|
197
209
|
document.querySelectorAll(`#${containerId}`).forEach(function (accordion) {
|
|
198
210
|
if (accordion) {
|
|
199
|
-
accordion.querySelectorAll(
|
|
200
|
-
trigger.addEventListener(
|
|
201
|
-
trigger.classList.add(
|
|
211
|
+
accordion.querySelectorAll(".hy-accordion__button").forEach(function (trigger) {
|
|
212
|
+
trigger.addEventListener("focus", function () {
|
|
213
|
+
trigger.classList.add("focus");
|
|
202
214
|
});
|
|
203
|
-
trigger.addEventListener(
|
|
204
|
-
trigger.classList.remove(
|
|
215
|
+
trigger.addEventListener("blur", function () {
|
|
216
|
+
trigger.classList.remove("focus");
|
|
205
217
|
});
|
|
206
218
|
});
|
|
207
219
|
}
|
|
208
220
|
});
|
|
209
221
|
}
|
|
210
|
-
const classIsOpen = this.showOpen ?
|
|
211
|
-
const classContentIsOpen = this.showOpen ?
|
|
212
|
-
const classAttributes = [
|
|
213
|
-
const classInnerWrapper = [
|
|
214
|
-
const classHeadingAttributes = [
|
|
222
|
+
const classIsOpen = this.showOpen ? "hy-accordion__item__is-open" : "";
|
|
223
|
+
const classContentIsOpen = this.showOpen ? "open" : "";
|
|
224
|
+
const classAttributes = ["hy-accordion__item", this.variant, classIsOpen].join(" ");
|
|
225
|
+
const classInnerWrapper = ["hy-accordion__item--container", this.variant].join(" ");
|
|
226
|
+
const classHeadingAttributes = ["hy-accordion--heading", this.variant].join(" ");
|
|
215
227
|
const classContentAttributes = [
|
|
216
|
-
|
|
228
|
+
"hy-accordion__content",
|
|
217
229
|
`hy-accordion__content--${this.variant}`,
|
|
218
230
|
this.variant,
|
|
219
231
|
classContentIsOpen,
|
|
220
|
-
].join(
|
|
232
|
+
].join(" ");
|
|
221
233
|
const classContentInnerWrapper = [
|
|
222
|
-
|
|
234
|
+
"hy-accordion__content--inner-wrapper",
|
|
223
235
|
`hy-accordion__content--inner-wrapper--${this.headerstyle}`,
|
|
224
236
|
`hy-accordion__content--inner-wrapper--${this.variant}`,
|
|
225
|
-
].join(
|
|
226
|
-
const titleAsId = this.accordiontitle.toLowerCase().replace(/\W/g,
|
|
227
|
-
const accordionItemHref =
|
|
228
|
-
const ariaExpanded = this.showOpen ?
|
|
229
|
-
const ariaHidden = this.showOpen ?
|
|
230
|
-
const dataCollapsed = this.showOpen ?
|
|
231
|
-
return (h("div", { class: classAttributes }, h("div", { class: classInnerWrapper }, h("h3", { class: classHeadingAttributes }, h("a", { href: accordionItemHref, class: "hy-accordion__link", tabindex: "-1" }, h("button", { "aria-expanded": ariaExpanded, "aria-controls": `${titleAsId}--content`, class: `hy-accordion__button hy-accordion__button--${this.headerstyle}`, id: `${titleAsId}--title` }, h("span", { class: "hy-accordion--heading__icon" }, h("hy-icon", { icon:
|
|
237
|
+
].join(" ");
|
|
238
|
+
const titleAsId = this.accordiontitle.toLowerCase().replace(/\W/g, "-");
|
|
239
|
+
const accordionItemHref = "#" + titleAsId + "--title";
|
|
240
|
+
const ariaExpanded = this.showOpen ? "true" : "false";
|
|
241
|
+
const ariaHidden = this.showOpen ? "false" : "true";
|
|
242
|
+
const dataCollapsed = this.showOpen ? "false" : "true";
|
|
243
|
+
return (h("div", { class: classAttributes }, h("div", { class: classInnerWrapper }, h("h3", { class: classHeadingAttributes }, h("a", { href: accordionItemHref, class: "hy-accordion__link", tabindex: "-1" }, h("button", { "aria-expanded": ariaExpanded, "aria-controls": `${titleAsId}--content`, class: `hy-accordion__button hy-accordion__button--${this.headerstyle}`, id: `${titleAsId}--title` }, h("span", { class: "hy-accordion--heading__icon" }, h("hy-icon", { icon: "hy-icon-caret-down", size: 16 })), h("span", null, this.accordiontitle)))), h("div", { "aria-labelledBy": `${titleAsId}--title`, class: classContentAttributes, id: `${titleAsId}--content`, role: "region", "aria-hidden": ariaHidden, "data-collapsed": dataCollapsed, style: { display: "none" } }, h("div", { class: classContentInnerWrapper }, h("slot", null))))));
|
|
232
244
|
}
|
|
233
245
|
get el() { return getElement(this); }
|
|
234
246
|
};
|
|
@@ -239,9 +251,9 @@ const adjacentImageTextCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7
|
|
|
239
251
|
const AdjacentImageText = class {
|
|
240
252
|
constructor(hostRef) {
|
|
241
253
|
registerInstance(this, hostRef);
|
|
242
|
-
this.headerstyle =
|
|
254
|
+
this.headerstyle = "default";
|
|
243
255
|
this.imageUrl = null;
|
|
244
|
-
this.imageAlt =
|
|
256
|
+
this.imageAlt = "";
|
|
245
257
|
this.disableLazy = false;
|
|
246
258
|
this.textTitle = undefined;
|
|
247
259
|
this.textDescription = null;
|
|
@@ -259,27 +271,27 @@ const AdjacentImageText = class {
|
|
|
259
271
|
this._sourceSet = await jsonParserWorker(this.sourceSet);
|
|
260
272
|
}
|
|
261
273
|
componentDidLoad() {
|
|
262
|
-
let hyMainDiv = this.el.closest(
|
|
274
|
+
let hyMainDiv = this.el.closest(".hy-main");
|
|
263
275
|
if (hyMainDiv) {
|
|
264
|
-
if (!hyMainDiv.classList.contains(
|
|
265
|
-
this.headerstyle =
|
|
276
|
+
if (!hyMainDiv.classList.contains("with-sidebar")) {
|
|
277
|
+
this.headerstyle = "large";
|
|
266
278
|
}
|
|
267
279
|
}
|
|
268
280
|
}
|
|
269
281
|
render() {
|
|
270
|
-
const classAttributes = [
|
|
282
|
+
const classAttributes = ["hy-adjacent-image-text", `hy-adjacent-image-text__${this.headerstyle}`].join(" ");
|
|
271
283
|
const contentClassAttributes = [
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
].join(
|
|
275
|
-
const imageLeftClassAttributes = [
|
|
284
|
+
"hy-adjacent-image-text__text-container",
|
|
285
|
+
"hy-adjacent-image-text__text-container--left",
|
|
286
|
+
].join(" ");
|
|
287
|
+
const imageLeftClassAttributes = ["hy-adjacent-image-text__image-container"].join(" ");
|
|
276
288
|
const aspectRatioWidth = 6;
|
|
277
289
|
const aspectRatioHeight = 4;
|
|
278
290
|
const aspect = (aspectRatioHeight / aspectRatioWidth) * 100;
|
|
279
291
|
const aspectRatio = {
|
|
280
|
-
|
|
292
|
+
"--aspectRatio": `${aspect}%`,
|
|
281
293
|
};
|
|
282
|
-
return (h(Host, null, h("div", { class: classAttributes }, h("div", { class: imageLeftClassAttributes, style: aspectRatio }, this._sourceSet ? (h("picture", null, this._sourceSet.map((item) => (h("source", { srcSet: item.src, media: item.media, type: item.type, sizes: item.sizes ? item.sizes :
|
|
294
|
+
return (h(Host, null, h("div", { class: classAttributes }, h("div", { class: imageLeftClassAttributes, style: aspectRatio }, this._sourceSet ? (h("picture", null, this._sourceSet.map((item) => (h("source", { srcSet: item.src, media: item.media, type: item.type, sizes: item.sizes ? item.sizes : "" }))), h("img", { loading: this.disableLazy ? "eager" : "lazy", alt: this.imageAlt, class: "hy-image__image", src: this.imageUrl }))) : (h("img", { loading: this.disableLazy ? "eager" : "lazy", alt: this.imageAlt, class: "hy-image__image", src: this.imageUrl }))), h("div", { class: contentClassAttributes }, h("div", { class: "hy-adjacent-image-text__text-container__info-wrapper" }, h("div", { class: "hy-adjacent-image-text__text-container__title" }, this.textTitle), h("p", { class: `hy-adjacent-image-text__text-container__description hy-adjacent-image-text__text-container__description__${this.headerstyle}` }, this.textDescription)), h("div", { class: "hy-adjacent-image-text__text-container__links-wrapper" }, this.mainUrl && (h("div", { class: "hy-adjacent-image-text__text-container__link" }, h("hy-cta-link", { "link-content": this.mainUrlTitle, "sc-label": this.mainUrlAriaLabel, url: this.mainUrl, "is-external": this.mainUrlIsExternal }))), this.mainUrl2 && (h("div", { class: "hy-adjacent-image-text__text-container__link" }, h("hy-cta-link", { "link-content": this.mainUrlTitle2, "sc-label": this.mainUrlAriaLabel2, url: this.mainUrl2, "is-external": this.mainUrlIsExternal2 })))))), h("hy-box", { mb: "1.75, 1.75, 2, 2.5" })));
|
|
283
295
|
}
|
|
284
296
|
get el() { return getElement(this); }
|
|
285
297
|
};
|
|
@@ -300,30 +312,30 @@ const HyAnchorLinkList = class {
|
|
|
300
312
|
this._anchorItems = await jsonParserWorker(this.anchorItems);
|
|
301
313
|
}
|
|
302
314
|
handleLinkClick(e) {
|
|
303
|
-
const targetId = e.target.getAttribute(
|
|
315
|
+
const targetId = e.target.getAttribute("href");
|
|
304
316
|
if (targetId) {
|
|
305
317
|
const targetElement = document.getElementById(targetId.substring(1));
|
|
306
318
|
const targetRect = targetElement.getBoundingClientRect();
|
|
307
|
-
window.scrollTo({ top: window.scrollY + targetRect.top - 100, behavior:
|
|
308
|
-
targetElement.setAttribute(
|
|
319
|
+
window.scrollTo({ top: window.scrollY + targetRect.top - 100, behavior: "smooth" });
|
|
320
|
+
targetElement.setAttribute("tabIndex", "-1");
|
|
309
321
|
targetElement.focus({ preventScroll: true });
|
|
310
322
|
}
|
|
311
323
|
e.preventDefault();
|
|
312
324
|
e.stopPropagation();
|
|
313
325
|
}
|
|
314
326
|
render() {
|
|
315
|
-
const classAttributes = [
|
|
327
|
+
const classAttributes = ["hy-anchor-link-list"].join(" ");
|
|
316
328
|
const buttonClasses = {
|
|
317
|
-
|
|
318
|
-
|
|
329
|
+
"hy-anchor-link-list__button": true,
|
|
330
|
+
"is-open": this.isOpen,
|
|
319
331
|
};
|
|
320
332
|
const containerClasses = {
|
|
321
|
-
|
|
322
|
-
|
|
333
|
+
"hy-anchor-link-list__container": true,
|
|
334
|
+
"is-open": this.isOpen,
|
|
323
335
|
};
|
|
324
336
|
const items = this._anchorItems;
|
|
325
|
-
return (h(Host, { class: classAttributes }, h("button", { "aria-label": this.listTitle, onClick: () => (this.isOpen = !this.isOpen), class: buttonClasses }, h("span", { class: "hy-anchor-link-list__button--title" }, h("hy-icon", { icon:
|
|
326
|
-
items.map((item) => (h("a", { class: "hy-anchor-link-list__item", href: item.url, onClick: this.handleLinkClick }, h("hy-icon", { icon:
|
|
337
|
+
return (h(Host, { class: classAttributes }, h("button", { "aria-label": this.listTitle, onClick: () => (this.isOpen = !this.isOpen), class: buttonClasses }, h("span", { class: "hy-anchor-link-list__button--title" }, h("hy-icon", { icon: "hy-icon-bullet-list", size: 18, fill: "var(--brand-main)" }), this.listTitle), h("span", { class: "hy-anchor-link-list__button--label" }, this.isOpen ? this.closeLabel : this.openLabel, h("hy-icon", { class: "label-close-icon", icon: "hy-icon-caret-down", size: 16, fill: "var(--brand-main)" }))), h("div", { "aria-hidden": this.isOpen ? "false" : "true", class: containerClasses }, items &&
|
|
338
|
+
items.map((item) => (h("a", { class: "hy-anchor-link-list__item", href: item.url, onClick: this.handleLinkClick }, h("hy-icon", { icon: "hy-icon-arrow-down", size: 12, fill: "var(--brand-main)" }), item.title))))));
|
|
327
339
|
}
|
|
328
340
|
};
|
|
329
341
|
HyAnchorLinkList.style = hyAnchorLinkListCss;
|
|
@@ -333,11 +345,11 @@ const hyBadgeCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand
|
|
|
333
345
|
const HyBadge = class {
|
|
334
346
|
constructor(hostRef) {
|
|
335
347
|
registerInstance(this, hostRef);
|
|
336
|
-
this.variant =
|
|
348
|
+
this.variant = "primary";
|
|
337
349
|
}
|
|
338
350
|
render() {
|
|
339
|
-
const classAttributes = [
|
|
340
|
-
return (h(Host, null, h("span", { class: classAttributes.join(
|
|
351
|
+
const classAttributes = ["hy-badge", this.variant];
|
|
352
|
+
return (h(Host, null, h("span", { class: classAttributes.join(" ") }, h("slot", null))));
|
|
341
353
|
}
|
|
342
354
|
};
|
|
343
355
|
HyBadge.style = hyBadgeCss;
|
|
@@ -352,30 +364,30 @@ const HyBanner = class {
|
|
|
352
364
|
this.url = undefined;
|
|
353
365
|
this.scLabel = undefined;
|
|
354
366
|
this.urlTitle = undefined;
|
|
355
|
-
this.headerstyle =
|
|
367
|
+
this.headerstyle = "common";
|
|
356
368
|
this.isExternal = false;
|
|
357
369
|
}
|
|
358
370
|
componentDidLoad() {
|
|
359
|
-
let hyMainDiv = this.el.closest(
|
|
371
|
+
let hyMainDiv = this.el.closest(".hy-main");
|
|
360
372
|
if (hyMainDiv) {
|
|
361
|
-
if (!hyMainDiv.classList.contains(
|
|
362
|
-
this.headerstyle =
|
|
373
|
+
if (!hyMainDiv.classList.contains("with-sidebar")) {
|
|
374
|
+
this.headerstyle = "large";
|
|
363
375
|
}
|
|
364
376
|
}
|
|
365
377
|
}
|
|
366
378
|
render() {
|
|
367
|
-
const hyBannerClass = [
|
|
368
|
-
const hyBannerWrapperClass = [
|
|
379
|
+
const hyBannerClass = ["hy-banner", `hy-banner__${this.headerstyle}`, this.headerstyle].join(" ");
|
|
380
|
+
const hyBannerWrapperClass = ["hy-banner__info-container"].join(" ");
|
|
369
381
|
const hyBannerTitle = [
|
|
370
|
-
|
|
382
|
+
"hy-banner__info-container__title",
|
|
371
383
|
`hy-banner__info-container__title__${this.headerstyle}`,
|
|
372
384
|
this.headerstyle,
|
|
373
|
-
].join(
|
|
385
|
+
].join(" ");
|
|
374
386
|
const hyBannerDescription = [
|
|
375
|
-
|
|
387
|
+
"hy-banner__info-container__description",
|
|
376
388
|
`hy-banner__info-container__description__${this.headerstyle}`,
|
|
377
389
|
this.headerstyle,
|
|
378
|
-
].join(
|
|
390
|
+
].join(" ");
|
|
379
391
|
const variant = CtaLinkButtonVariants.onBlueBkgd;
|
|
380
392
|
return (h(Host, null, h("hy-box", { pt: "1.25, 1.25, 1.5, 2.5" }), h("div", { class: hyBannerClass }, h("hy-main-content-wrapper", null, h("div", { class: hyBannerWrapperClass }, h("div", { class: hyBannerTitle }, this.textTitle), h("div", { class: hyBannerDescription }, this.textDescription), this.url && (h("div", { class: "hy-banner__info-container__link" }, h("hy-cta-button", { "link-content": this.urlTitle, "sc-label": this.scLabel, url: this.url, "is-external": this.isExternal, variant: variant })))))), h("hy-box", { mb: "1.75, 1.75, 2, 2.5" })));
|
|
381
393
|
}
|
|
@@ -1810,9 +1822,9 @@ wide, 60rem to 75rem or 60rem to 100.0625rem (depending on hasSidebar) (mb[2])
|
|
|
1810
1822
|
xlarge, > 100.0625: 2.5rem (mb[3])
|
|
1811
1823
|
* */
|
|
1812
1824
|
const toRemValue = (val) => {
|
|
1813
|
-
return typeof val ===
|
|
1825
|
+
return typeof val === "number" ? `${val}rem` : undefined;
|
|
1814
1826
|
};
|
|
1815
|
-
const breakpoints = [
|
|
1827
|
+
const breakpoints = ["30rem", "60rem", "75.0625rem", "100.0625rem"];
|
|
1816
1828
|
/*
|
|
1817
1829
|
Default - mobile
|
|
1818
1830
|
mq[0] - tablet
|
|
@@ -1833,12 +1845,12 @@ const createCssClass = ({ hasSidebar, pt, pb, pl, pr, mt, mb, ml, mr, h, bg, wid
|
|
|
1833
1845
|
margin-bottom: ${toRemValue(mb[0])};
|
|
1834
1846
|
margin-left: ${toRemValue(ml[0])};
|
|
1835
1847
|
height: ${toRemValue(h)};
|
|
1836
|
-
background-color: ${!!bg ? `var(--${bg})` :
|
|
1848
|
+
background-color: ${!!bg ? `var(--${bg})` : "transparent"};
|
|
1837
1849
|
width: ${width[0]};
|
|
1838
1850
|
display: flex;
|
|
1839
|
-
flex-flow: ${direction ||
|
|
1840
|
-
justify-content: ${justify ||
|
|
1841
|
-
align-items: ${align ||
|
|
1851
|
+
flex-flow: ${direction || "row"};
|
|
1852
|
+
justify-content: ${justify || "flex-start"};
|
|
1853
|
+
align-items: ${align || "flex-start"};
|
|
1842
1854
|
|
|
1843
1855
|
${mq[0]} {
|
|
1844
1856
|
width: ${width[1]};
|
|
@@ -1894,11 +1906,11 @@ const createCssClass = ({ hasSidebar, pt, pb, pl, pr, mt, mb, ml, mr, h, bg, wid
|
|
|
1894
1906
|
}
|
|
1895
1907
|
`;
|
|
1896
1908
|
};
|
|
1897
|
-
const toNumArray = (value) => value === null || value === void 0 ? void 0 : value.split(
|
|
1909
|
+
const toNumArray = (value) => value === null || value === void 0 ? void 0 : value.split(",").map((v) => `${v.trim()}`).map((v) => parseFloat(v));
|
|
1898
1910
|
const HyBox = class {
|
|
1899
1911
|
constructor(hostRef) {
|
|
1900
1912
|
registerInstance(this, hostRef);
|
|
1901
|
-
this.headerstyle =
|
|
1913
|
+
this.headerstyle = "common";
|
|
1902
1914
|
this.p = undefined;
|
|
1903
1915
|
this.pl = undefined;
|
|
1904
1916
|
this.pr = undefined;
|
|
@@ -1909,18 +1921,18 @@ const HyBox = class {
|
|
|
1909
1921
|
this.mr = undefined;
|
|
1910
1922
|
this.mb = undefined;
|
|
1911
1923
|
this.mt = undefined;
|
|
1912
|
-
this.justify =
|
|
1913
|
-
this.align =
|
|
1924
|
+
this.justify = "flex-start";
|
|
1925
|
+
this.align = "baseline";
|
|
1914
1926
|
this.h = undefined;
|
|
1915
|
-
this.bg =
|
|
1916
|
-
this.width =
|
|
1917
|
-
this.direction =
|
|
1927
|
+
this.bg = "transparent";
|
|
1928
|
+
this.width = "100";
|
|
1929
|
+
this.direction = "row";
|
|
1918
1930
|
}
|
|
1919
1931
|
componentWillLoad() {
|
|
1920
|
-
let hyMainDiv = this.el.closest(
|
|
1932
|
+
let hyMainDiv = this.el.closest(".hy-main");
|
|
1921
1933
|
if (hyMainDiv) {
|
|
1922
|
-
if (!hyMainDiv.classList.contains(
|
|
1923
|
-
this.headerstyle =
|
|
1934
|
+
if (!hyMainDiv.classList.contains("with-sidebar")) {
|
|
1935
|
+
this.headerstyle = "large";
|
|
1924
1936
|
}
|
|
1925
1937
|
}
|
|
1926
1938
|
}
|
|
@@ -1934,7 +1946,7 @@ const HyBox = class {
|
|
|
1934
1946
|
const mb = (_m = (_l = toNumArray(this.mb)) !== null && _l !== void 0 ? _l : toNumArray(this.m)) !== null && _m !== void 0 ? _m : [0];
|
|
1935
1947
|
const mr = (_p = (_o = toNumArray(this.mr)) !== null && _o !== void 0 ? _o : toNumArray(this.m)) !== null && _p !== void 0 ? _p : [0];
|
|
1936
1948
|
const ml = (_r = (_q = toNumArray(this.ml)) !== null && _q !== void 0 ? _q : toNumArray(this.m)) !== null && _r !== void 0 ? _r : [0];
|
|
1937
|
-
const hasSidebar = this.headerstyle ==
|
|
1949
|
+
const hasSidebar = this.headerstyle == "common";
|
|
1938
1950
|
return (h(Host, { class: createCssClass({
|
|
1939
1951
|
hasSidebar,
|
|
1940
1952
|
pt,
|
|
@@ -1947,7 +1959,7 @@ const HyBox = class {
|
|
|
1947
1959
|
mb,
|
|
1948
1960
|
h: this.h,
|
|
1949
1961
|
bg: this.bg,
|
|
1950
|
-
width: this.width.split(
|
|
1962
|
+
width: this.width.split(",").map((v) => `${v.trim()}%`),
|
|
1951
1963
|
justify: this.justify,
|
|
1952
1964
|
align: this.align,
|
|
1953
1965
|
direction: this.direction,
|
|
@@ -1966,11 +1978,11 @@ const HyBoxContainer = class {
|
|
|
1966
1978
|
this.maxWidth = true;
|
|
1967
1979
|
}
|
|
1968
1980
|
render() {
|
|
1969
|
-
return (h(Host, { style: { width:
|
|
1981
|
+
return (h(Host, { style: { width: "100%", display: "flex", flex: "1", justifyContent: "center" } }, h("div", { class: css `
|
|
1970
1982
|
display: flex;
|
|
1971
1983
|
width: 100%;
|
|
1972
|
-
flex-wrap: ${this.wrap ?
|
|
1973
|
-
max-width: ${this.maxWidth ?
|
|
1984
|
+
flex-wrap: ${this.wrap ? "wrap" : "no-wrap"};
|
|
1985
|
+
max-width: ${this.maxWidth ? "90rem" : "100%"};
|
|
1974
1986
|
` }, h("slot", null))));
|
|
1975
1987
|
}
|
|
1976
1988
|
};
|
|
@@ -1983,22 +1995,22 @@ const HyBreadcrumbs = class {
|
|
|
1983
1995
|
registerInstance(this, hostRef);
|
|
1984
1996
|
this.dataItems = undefined;
|
|
1985
1997
|
this.variant = BreadcrumbVariants.default;
|
|
1986
|
-
this.headerstyle =
|
|
1998
|
+
this.headerstyle = "with-sidebar";
|
|
1987
1999
|
this.menuOpen = false;
|
|
1988
2000
|
}
|
|
1989
2001
|
async componentWillLoad() {
|
|
1990
2002
|
this._dataItems = await jsonParserWorker(this.dataItems);
|
|
1991
2003
|
}
|
|
1992
2004
|
componentDidLoad() {
|
|
1993
|
-
let hyMainDiv = this.el.closest(
|
|
2005
|
+
let hyMainDiv = this.el.closest(".hy-main");
|
|
1994
2006
|
if (hyMainDiv) {
|
|
1995
|
-
if (!hyMainDiv.classList.contains(
|
|
1996
|
-
this.headerstyle =
|
|
2007
|
+
if (!hyMainDiv.classList.contains("with-sidebar")) {
|
|
2008
|
+
this.headerstyle = "without-sidebar";
|
|
1997
2009
|
}
|
|
1998
2010
|
}
|
|
1999
2011
|
}
|
|
2000
2012
|
render() {
|
|
2001
|
-
const breadcrumbsClass = [
|
|
2013
|
+
const breadcrumbsClass = ["hy-breadcrumbs", this.variant, this.headerstyle].join(" ");
|
|
2002
2014
|
return (h("nav", { "aria-label": "Breadcrumb", role: "navigation", "aria-labelledby": "system-breadcrumb", class: breadcrumbsClass }, h("ol", { class: "breadcrumb-container" }, this._dataItems.map((item) => {
|
|
2003
2015
|
if (item.url.length > 0) {
|
|
2004
2016
|
return (h("li", { class: "breadcrumb-item" }, h("a", { class: "breadcrumb-item__link", href: item.url }, item.text), h("hy-icon", { class: "breadcrumb-item__icon", icon: "hy-icon-caret-right", size: 12 })));
|
|
@@ -2012,6 +2024,78 @@ const HyBreadcrumbs = class {
|
|
|
2012
2024
|
};
|
|
2013
2025
|
HyBreadcrumbs.style = hyBreadcrumbsCss;
|
|
2014
2026
|
|
|
2027
|
+
const colors = {
|
|
2028
|
+
brandMain: "#0e688b",
|
|
2029
|
+
brandMainLight: "#107eab",
|
|
2030
|
+
brandMainActive: "#005379",
|
|
2031
|
+
brandMainDark: "#003146",
|
|
2032
|
+
brandMainNearlyBlack: "#000222",
|
|
2033
|
+
grayscaleWhite: "#fff",
|
|
2034
|
+
grayscaleLight: "#f8f8f8",
|
|
2035
|
+
grayscaleMedium: "#d2d2d2",
|
|
2036
|
+
grayscaleBackgroundBox: "#f5f5f5",
|
|
2037
|
+
grayscaleBackgroundArrow: "#dfdfdf",
|
|
2038
|
+
grayscaleMediumDark: "#979797",
|
|
2039
|
+
grayscaleDark: "#555555",
|
|
2040
|
+
grayscaleBlack: "#000000",
|
|
2041
|
+
additionalRedLight: "#E5053A",
|
|
2042
|
+
additionalRedDark: "#A31621",
|
|
2043
|
+
additionalPurpleLight: "#420039",
|
|
2044
|
+
additionalYellow: "#F9A21A",
|
|
2045
|
+
additionalSkyblue: "#48C5F8",
|
|
2046
|
+
additionalOrange: "#D14600",
|
|
2047
|
+
additionalGreenLight: "#96BA3C",
|
|
2048
|
+
additionalGreenDark: "#006400",
|
|
2049
|
+
};
|
|
2050
|
+
|
|
2051
|
+
const buttonCss = "@charset \"UTF-8\";:root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand-main-bright:#48c5f8;--brand-main-light:#107eab;--brand-main-active:#005379;--brand-main-dark:#003146;--brand-main-nearly-black:#000222;--link-blue:#0479a4;--link-disabled:#767676;--grayscale-white:#fff;--grayscale-slightly-gray:#fefefe;--grayscale-light:#f8f8f8;--grayscale-medium:#d2d2d2;--grayscale-background-box:#f5f5f5;--grayscale-tabs-border:#e6e6e6;--grayscale-background-arrow:#dfdfdf;--grayscale-medium-dark:#979797;--grayscale-dark:#555555;--grayscale-dark-text:#222222;--grayscale-black:#000000;--additional-red-light:#e5053a;--additional-red-dark:#a31621;--additional-purple-light:#420039;--additional-yellow-light:#f9a21a;--additional-yellow:#c47f1b;--additional-skyblue:#48c5f8;--additional-orange:#d14600;--additional-green-light:#96ba3c;--additional-green-dark:#006400;--hover-gray:#eaeaea}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{--gutter-mobile:16px;--gutter-narrow:24px;--gutter-medium:24px;--gutter-wide:24px;--gutter-extrawide:32px}:root{--breakpoint-extrawide:75.0625rem;--breakpoint-max-width:75.0625rem;--breakpoint-medium:48rem;--breakpoint-narrow:30rem;--breakpoint-wide:60rem}:host{display:block;-webkit-box-sizing:border-box;box-sizing:border-box}.hy-button__icon{-ms-flex-line-pack:center;align-content:center;display:-webkit-box;display:-ms-flexbox;display:flex}.hy-button{display:block;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--brand-main);color:var(--grayscale-white);font-family:var(--main-font-family);border:none;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;font-size:0.9375rem;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;line-height:0.9375rem;margin:0;padding:0;-webkit-transition-duration:0.1s;transition-duration:0.1s;-webkit-transition-property:all;transition-property:all;min-height:44px;position:relative;text-decoration:none}.hy-button.size-large{min-height:48px}.hy-button.primary{background-color:var(--brand-main);color:var(--grayscale-white)}.hy-button.primary .hy-button__icon{padding:8px 13px}.hy-button.primary svg{fill:var(--grayscale-white)}.hy-button.primary:hover{background-color:var(--brand-main-active)}.hy-button.primary:active{background-color:var(--brand-main-dark)}.hy-button.primary:disabled{background-color:var(--grayscale-medium);color:var(--grayscale-dark)}.hy-button.primary:disabled svg{fill:var(--grayscale-dark)}.hy-button.primary:focus{outline:solid 2px var(--additional-yellow);outline-offset:2px}.hy-button.secondary{background-color:transparent;border:solid 2px var(--brand-main);color:var(--brand-main)}.hy-button.secondary svg{fill:var(--brand-main)}.hy-button.secondary:hover{border:solid 2px var(--brand-main-active);color:var(--brand-main-active)}.hy-button.secondary:hover svg{fill:var(--brand-main-active)}.hy-button.secondary:active{border:solid 2px var(--brand-main-dark);color:var(--brand-main-dark)}.hy-button.secondary:active svg{fill:var(--brand-main-dark)}.hy-button.secondary:disabled{border:solid 2px var(--grayscale-medium-dark);color:var(--grayscale-medium-dark)}.hy-button.secondary:disabled svg{fill:var(--grayscale-medium-dark)}.hy-button::after{content:\"\";display:block;border-bottom:2px solid var(--additional-skyblue);position:absolute;bottom:-3.5px;left:3px;right:3px;z-index:0}.hy-button.primary::after{bottom:-2px}.hy-button:disabled{cursor:not-allowed}.hy-button:disabled::after{border-bottom:2px solid var(--grayscale-medium-dark);bottom:-3.5px}.hy-button:disabled.primary::after{bottom:-2px}.hy-button .hy-button__text{margin:12px 24px}.hy-button .hy-button__icon-right{padding-right:12px}hy-button[icon-right=hy-icon-arrow-right] .primary .hy-button__text{margin:12px 0 12px 16px;padding-right:16px}hy-button[icon-right=hy-icon-arrow-right] .primary:not(disabled) .hy-button__text{border-right:solid 1px var(--additional-skyblue)}hy-button[icon-right=hy-icon-arrow-right] .primary:disabled .hy-button__text{border-right:solid 1px var(--grayscale-dark)}hy-button[icon-right=hy-icon-arrow-right] .secondary .hy-button__text{margin:12px 16px}hy-button[icon-right=hy-icon-arrow-right] .secondary .hy-button__icon{padding-right:1rem;padding-left:0}hy-button[icon=hy-icon-arrow-left] .primary .hy-button__text{margin:12px 16px 12px 0;padding-left:16px}hy-button[icon=hy-icon-arrow-left] .primary:not(disabled) .hy-button__text{border-left:solid 1px var(--additional-skyblue)}hy-button[icon=hy-icon-arrow-left] .primary:disabled .hy-button__text{border-left:solid 1px var(--grayscale-dark)}hy-button[icon=hy-icon-arrow-left] .secondary .hy-button__text{margin:12px 16px}hy-button[icon=hy-icon-arrow-left] .secondary .hy-button__icon{padding-left:1rem;padding-right:0}";
|
|
2052
|
+
|
|
2053
|
+
const fillcolors = {
|
|
2054
|
+
primary: colors.brandMain,
|
|
2055
|
+
secondary: "white",
|
|
2056
|
+
};
|
|
2057
|
+
const Button = class {
|
|
2058
|
+
constructor(hostRef) {
|
|
2059
|
+
registerInstance(this, hostRef);
|
|
2060
|
+
this.buttonType = "submit";
|
|
2061
|
+
this.buttonClasses = "";
|
|
2062
|
+
this.variant = "primary";
|
|
2063
|
+
this.state = "enabled";
|
|
2064
|
+
this.size = "normal";
|
|
2065
|
+
this.disabled = false;
|
|
2066
|
+
this.url = "";
|
|
2067
|
+
this.ariaLabel = "";
|
|
2068
|
+
this.isExternal = false;
|
|
2069
|
+
this.icon = undefined;
|
|
2070
|
+
this.iconRight = undefined;
|
|
2071
|
+
this.attrs = "";
|
|
2072
|
+
}
|
|
2073
|
+
render() {
|
|
2074
|
+
const classAttributes = ["hy-button", this.variant, this.state, "size-" + this.size, this.buttonClasses];
|
|
2075
|
+
const iconFillColor = fillcolors[this.variant];
|
|
2076
|
+
const target = this.isExternal ? "_blank" : "_self";
|
|
2077
|
+
let props = {};
|
|
2078
|
+
if (this.attrs && this.attrs.length > 2) {
|
|
2079
|
+
let attrString = JSON.parse(this.attrs);
|
|
2080
|
+
let attrArray = attrString.split('" ');
|
|
2081
|
+
attrArray.map((item) => {
|
|
2082
|
+
let parts = item.split("=");
|
|
2083
|
+
let key = parts[0];
|
|
2084
|
+
let value = parts[1];
|
|
2085
|
+
key = key.replaceAll('"', " ");
|
|
2086
|
+
key = key.trim();
|
|
2087
|
+
if (key !== "class") {
|
|
2088
|
+
value = value.replaceAll('"', " ");
|
|
2089
|
+
value = value.trim();
|
|
2090
|
+
props[key] = value;
|
|
2091
|
+
}
|
|
2092
|
+
});
|
|
2093
|
+
}
|
|
2094
|
+
return this.url ? (h(Host, { "icon-right": "hy-icon-arrow-right", "aria-label": this.ariaLabel }, h("div", { style: { display: "flex" } }, h("a", { class: classAttributes.join(" "), href: this.url, target: target }, h("span", { class: "hy-button__text" }, h("slot", null)), h("span", { class: "hy-button__icon" }, h("hy-icon", { icon: "hy-icon-arrow-right", fill: iconFillColor, size: 13 })))))) : (h(Host, { "aria-label": this.ariaLabel }, h("button", Object.assign({ type: this.buttonType, class: classAttributes.join(" "), disabled: this.disabled }, props), !!this.icon && (h("span", { class: "hy-button__icon hy-button__icon--left" }, h("hy-icon", { icon: this.icon, fill: iconFillColor, size: 13 }))), h("span", { class: "hy-button__text" }, h("slot", null)), !!this.iconRight && (h("span", { class: "hy-button__icon hy-button__icon--right" }, h("hy-icon", { icon: this.iconRight, fill: iconFillColor, size: 13 }))))));
|
|
2095
|
+
}
|
|
2096
|
+
};
|
|
2097
|
+
Button.style = buttonCss;
|
|
2098
|
+
|
|
2015
2099
|
const hyCheckboxCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand-main-bright:#48c5f8;--brand-main-light:#107eab;--brand-main-active:#005379;--brand-main-dark:#003146;--brand-main-nearly-black:#000222;--link-blue:#0479a4;--link-disabled:#767676;--grayscale-white:#fff;--grayscale-slightly-gray:#fefefe;--grayscale-light:#f8f8f8;--grayscale-medium:#d2d2d2;--grayscale-background-box:#f5f5f5;--grayscale-tabs-border:#e6e6e6;--grayscale-background-arrow:#dfdfdf;--grayscale-medium-dark:#979797;--grayscale-dark:#555555;--grayscale-dark-text:#222222;--grayscale-black:#000000;--additional-red-light:#e5053a;--additional-red-dark:#a31621;--additional-purple-light:#420039;--additional-yellow-light:#f9a21a;--additional-yellow:#c47f1b;--additional-skyblue:#48c5f8;--additional-orange:#d14600;--additional-green-light:#96ba3c;--additional-green-dark:#006400;--hover-gray:#eaeaea}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{--gutter-mobile:16px;--gutter-narrow:24px;--gutter-medium:24px;--gutter-wide:24px;--gutter-extrawide:32px}:root{--breakpoint-extrawide:75.0625rem;--breakpoint-max-width:75.0625rem;--breakpoint-medium:48rem;--breakpoint-narrow:30rem;--breakpoint-wide:60rem}.hy-checkbox{display:inline-block;position:relative;margin-right:1rem}.hy-checkbox__checkmark{border-color:var(--link-blue);border-style:solid inset solid solid;border-width:2px;height:20px;margin-right:6px;min-width:20px;min-height:20px;position:relative;width:20px}.hy-checkbox__checkmark svg{bottom:0;left:0;position:absolute;visibility:hidden}.hy-checkbox__checkmark::before{background-color:var(--grayscale-white);content:\"\";height:10px;position:absolute;right:0;-webkit-transform:rotate(40deg) translate(6%, -55%);transform:rotate(40deg) translate(6%, -55%);visibility:hidden;width:8px}.hy-checkbox__label{font-size:0.875rem;line-height:20px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--grayscale-black);display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font-family:var(--main-font-family);letter-spacing:-0.4px;text-align:left}@media (min-width: 30rem){.hy-checkbox__label{font-size:1rem;line-height:20px}}.hy-checkbox__checkbox{height:100%;margin:0;opacity:0;position:absolute;width:100%;z-index:10}.hy-checkbox__checkbox:checked+label{color:var(--grayscale-black)}.hy-checkbox__checkbox:checked+label .hy-checkbox__checkmark svg,.hy-checkbox__checkbox:checked+label .hy-checkbox__checkmark::before{visibility:visible}.hy-checkbox__checkbox:hover{cursor:pointer}.hy-checkbox__checkbox:hover+label{color:var(--brand-main)}.hy-checkbox__checkbox:focus+label{outline-offset:1px;outline:2px solid var(--link-blue)}.hy-checkbox--button{display:inline-block;margin-right:4px;position:relative}.hy-checkbox--button__label{font-size:0.75rem;line-height:14px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border:0.5px solid var(--grayscale-medium-dark);color:var(--link-blue);display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font-family:var(--main-font-family);font-weight:600;letter-spacing:-0.3px;padding:12px 15px 12px 13px;z-index:1}@media (min-width: 60rem){.hy-checkbox--button__label{font-size:0.875rem;line-height:18px;letter-spacing:-0.4px;padding:9px 8px 9px 8px}}.hy-checkbox--button__checkmark{position:absolute;right:12px;top:0;bottom:0}@media (min-width: 60rem){.hy-checkbox--button__checkmark{right:10px;bottom:calc(50% + 10px)}}.hy-checkbox--button__checkmark svg{bottom:0;left:0;position:absolute;visibility:hidden}.hy-checkbox--button__label-icon{height:13px;position:absolute;width:12px}@media (min-width: 60rem){.hy-checkbox--button__label-icon{padding:10px;right:-6px;top:calc(50% + 5px)}}.hy-checkbox--button__label-icon svg{background:var(--grayscale-white);height:12px;left:50%;top:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:12px}.hy-checkbox--button__checkbox{height:100%;margin:0;opacity:0;position:absolute;width:100%;z-index:10}.hy-checkbox--button__checkbox:checked+label{border:1px solid var(--grayscale-black);color:var(--grayscale-black);padding:12px 15px 12px 13px}@media (min-width: 60rem){.hy-checkbox--button__checkbox:checked+label{border:2px solid var(--grayscale-black);padding:8px 26px 8px 7px}}.hy-checkbox--button__checkbox:checked+label .hy-checkbox--button__checkmark .hy-checkbox--button__label-icon{background:var(--grayscale-white)}.hy-checkbox--button__checkbox:checked+label .hy-checkbox--button__checkmark svg{visibility:visible}.hy-checkbox--button__checkbox:hover{cursor:pointer}.hy-checkbox--button__checkbox:focus+label{outline-offset:1px;outline:1px solid var(--link-blue)}";
|
|
2016
2100
|
|
|
2017
2101
|
const HyCheckbox = class {
|
|
@@ -2025,10 +2109,10 @@ const HyCheckbox = class {
|
|
|
2025
2109
|
}
|
|
2026
2110
|
render() {
|
|
2027
2111
|
switch (this.variant) {
|
|
2028
|
-
case
|
|
2029
|
-
return (h(Host, { class: "hy-checkbox--button" }, h("input", { type: "checkbox", class: "hy-checkbox--button__checkbox", checked: this.checkboxChecked, id: `${this.checkboxId}`, value: `${this.checkboxValue}` }), h("label", { class: "hy-checkbox--button__label", htmlFor: `${this.checkboxId}` }, this.checkboxLabel, h("span", { class: "hy-checkbox--button__checkmark" }, h("hy-icon", { class: "hy-checkbox--button__label-icon", icon:
|
|
2112
|
+
case "button":
|
|
2113
|
+
return (h(Host, { class: "hy-checkbox--button" }, h("input", { type: "checkbox", class: "hy-checkbox--button__checkbox", checked: this.checkboxChecked, id: `${this.checkboxId}`, value: `${this.checkboxValue}` }), h("label", { class: "hy-checkbox--button__label", htmlFor: `${this.checkboxId}` }, this.checkboxLabel, h("span", { class: "hy-checkbox--button__checkmark" }, h("hy-icon", { class: "hy-checkbox--button__label-icon", icon: "hy-icon-done", size: 14, "aria-hidden": "true" })))));
|
|
2030
2114
|
default:
|
|
2031
|
-
return (h(Host, { class: "hy-checkbox" }, h("input", { type: "checkbox", class: "hy-checkbox__checkbox", checked: this.checkboxChecked, id: `${this.checkboxId}`, value: `${this.checkboxValue}` }), h("label", { class: "hy-checkbox__label", htmlFor: `${this.checkboxId}` }, h("span", { class: "hy-checkbox__checkmark" }, h("hy-icon", { class: "hy-checkbox__label-icon", icon:
|
|
2115
|
+
return (h(Host, { class: "hy-checkbox" }, h("input", { type: "checkbox", class: "hy-checkbox__checkbox", checked: this.checkboxChecked, id: `${this.checkboxId}`, value: `${this.checkboxValue}` }), h("label", { class: "hy-checkbox__label", htmlFor: `${this.checkboxId}` }, h("span", { class: "hy-checkbox__checkmark" }, h("hy-icon", { class: "hy-checkbox__label-icon", icon: "hy-icon-done", size: 23, "aria-hidden": "true" })), this.checkboxLabel)));
|
|
2032
2116
|
}
|
|
2033
2117
|
}
|
|
2034
2118
|
};
|
|
@@ -2046,7 +2130,7 @@ const HyCollaboration = class {
|
|
|
2046
2130
|
this.imageAltText = undefined;
|
|
2047
2131
|
}
|
|
2048
2132
|
render() {
|
|
2049
|
-
return (h("div", { class: "hy-collaboration" }, h("figure", { class: "hy-collaboration__logo", role: "complementary" }, h("img", { src: this.imageUrl, alt: this.imageAltText })), h("div", { class: "hy-collaboration__content" }, h("p", { class: "hy-collaboration__description" }, this.textDescription), this.linkUrl && (h("a", { href: this.linkUrl, class: "hy-collaboration__link" }, this.linkTitle, h("span", { "aria-hidden": "true" }, h("hy-icon", { icon:
|
|
2133
|
+
return (h("div", { class: "hy-collaboration" }, h("figure", { class: "hy-collaboration__logo", role: "complementary" }, h("img", { src: this.imageUrl, alt: this.imageAltText })), h("div", { class: "hy-collaboration__content" }, h("p", { class: "hy-collaboration__description" }, this.textDescription), this.linkUrl && (h("a", { href: this.linkUrl, class: "hy-collaboration__link" }, this.linkTitle, h("span", { "aria-hidden": "true" }, h("hy-icon", { icon: "hy-icon-arrow-right", size: 10 })))))));
|
|
2050
2134
|
}
|
|
2051
2135
|
};
|
|
2052
2136
|
HyCollaboration.style = hyCollaborationCss;
|
|
@@ -2057,12 +2141,12 @@ const HyContentList = class {
|
|
|
2057
2141
|
constructor(hostRef) {
|
|
2058
2142
|
registerInstance(this, hostRef);
|
|
2059
2143
|
this.variant = CourseVariants.default;
|
|
2060
|
-
this.linkLabel =
|
|
2061
|
-
this.noResultLabel =
|
|
2062
|
-
this.creditsLabel =
|
|
2063
|
-
this.cancelledLabel =
|
|
2144
|
+
this.linkLabel = "Go to course page";
|
|
2145
|
+
this.noResultLabel = "No courses scheduled at the moment";
|
|
2146
|
+
this.creditsLabel = "cr";
|
|
2147
|
+
this.cancelledLabel = "Cancelled";
|
|
2064
2148
|
this.dataItems = undefined;
|
|
2065
|
-
this.headerstyle =
|
|
2149
|
+
this.headerstyle = "common";
|
|
2066
2150
|
this.courseStateVariant = CourseStateVariants.default;
|
|
2067
2151
|
this.courseRealisations = [];
|
|
2068
2152
|
}
|
|
@@ -2070,7 +2154,7 @@ const HyContentList = class {
|
|
|
2070
2154
|
* Data for links to be displayed.
|
|
2071
2155
|
*/
|
|
2072
2156
|
dataWatcher(data) {
|
|
2073
|
-
this._dataItems = typeof data ===
|
|
2157
|
+
this._dataItems = typeof data === "string" ? JSON.parse(data) : data;
|
|
2074
2158
|
}
|
|
2075
2159
|
componentWillLoad() {
|
|
2076
2160
|
this.dataWatcher(this.dataItems);
|
|
@@ -2079,14 +2163,14 @@ const HyContentList = class {
|
|
|
2079
2163
|
e.preventDefault();
|
|
2080
2164
|
let card = this.el.querySelector(`#${id}`);
|
|
2081
2165
|
if (card) {
|
|
2082
|
-
window.open(card.dataset.location,
|
|
2166
|
+
window.open(card.dataset.location, "_blank");
|
|
2083
2167
|
}
|
|
2084
2168
|
}
|
|
2085
2169
|
async componentDidLoad() {
|
|
2086
|
-
let hyMainDiv = this.el.closest(
|
|
2170
|
+
let hyMainDiv = this.el.closest(".hy-main");
|
|
2087
2171
|
if (hyMainDiv) {
|
|
2088
|
-
if (!hyMainDiv.classList.contains(
|
|
2089
|
-
this.headerstyle =
|
|
2172
|
+
if (!hyMainDiv.classList.contains("with-sidebar")) {
|
|
2173
|
+
this.headerstyle = "large";
|
|
2090
2174
|
}
|
|
2091
2175
|
}
|
|
2092
2176
|
}
|
|
@@ -2095,39 +2179,39 @@ const HyContentList = class {
|
|
|
2095
2179
|
if (this._dataItems && this._dataItems.length > 0) {
|
|
2096
2180
|
this._dataItems.forEach((item) => {
|
|
2097
2181
|
const courseObject = JSON.parse(JSON.stringify(item));
|
|
2098
|
-
const courseListType = courseObject[
|
|
2099
|
-
this.variant = courseListType ==
|
|
2182
|
+
const courseListType = courseObject["courseListType"];
|
|
2183
|
+
this.variant = courseListType == "list" ? CourseVariants.row : CourseVariants.grid;
|
|
2100
2184
|
for (const courseProperty in courseObject) {
|
|
2101
|
-
if (courseProperty ==
|
|
2185
|
+
if (courseProperty == "courseListType")
|
|
2102
2186
|
continue;
|
|
2103
2187
|
const courseItem = courseObject[courseProperty];
|
|
2104
|
-
const courseCode = courseItem[
|
|
2105
|
-
const courseCredits = courseItem[
|
|
2188
|
+
const courseCode = courseItem["code"];
|
|
2189
|
+
const courseCredits = courseItem["credits"];
|
|
2106
2190
|
// Course realisations.
|
|
2107
|
-
if (courseItem[
|
|
2108
|
-
const realisations = JSON.parse(JSON.stringify(courseItem[
|
|
2191
|
+
if (courseItem["realisations"]) {
|
|
2192
|
+
const realisations = JSON.parse(JSON.stringify(courseItem["realisations"]));
|
|
2109
2193
|
for (const realisationProperty in realisations) {
|
|
2110
2194
|
const realizationItem = realisations[realisationProperty];
|
|
2111
|
-
const courseRealisationName = realizationItem[
|
|
2112
|
-
const courseRealisationFullName = courseRealisationName +
|
|
2113
|
-
const courseStudyFormat = realizationItem[
|
|
2114
|
-
const courseCancelled = realizationItem[
|
|
2115
|
-
const courseStartDate = realizationItem[
|
|
2116
|
-
const courseEndDate = realizationItem[
|
|
2117
|
-
const formattedTimeRange = realizationItem[
|
|
2118
|
-
const courseEnrollmentLink = realizationItem[
|
|
2119
|
-
const courseTeachingLanguage = realizationItem[
|
|
2120
|
-
const courseOrganisation = realizationItem[
|
|
2195
|
+
const courseRealisationName = realizationItem["name"];
|
|
2196
|
+
const courseRealisationFullName = courseRealisationName + ", " + courseCredits + " " + this.creditsLabel;
|
|
2197
|
+
const courseStudyFormat = realizationItem["studyFormat"];
|
|
2198
|
+
const courseCancelled = realizationItem["cancelled"];
|
|
2199
|
+
const courseStartDate = realizationItem["startDate"];
|
|
2200
|
+
const courseEndDate = realizationItem["endDate"];
|
|
2201
|
+
const formattedTimeRange = realizationItem["formattedTimeRange"];
|
|
2202
|
+
const courseEnrollmentLink = realizationItem["enrolmentLink"];
|
|
2203
|
+
const courseTeachingLanguage = realizationItem["teachingLanguage"];
|
|
2204
|
+
const courseOrganisation = realizationItem["organisation"];
|
|
2121
2205
|
let courseTags = [];
|
|
2122
|
-
if (realizationItem[
|
|
2123
|
-
let tags = JSON.parse(JSON.stringify(realizationItem[
|
|
2206
|
+
if (realizationItem["tags"]) {
|
|
2207
|
+
let tags = JSON.parse(JSON.stringify(realizationItem["tags"]));
|
|
2124
2208
|
for (let z in tags) {
|
|
2125
2209
|
let tagItem = { name: tags[z] };
|
|
2126
2210
|
courseTags.push(tagItem);
|
|
2127
2211
|
}
|
|
2128
2212
|
}
|
|
2129
2213
|
const courseTagsJSON = JSON.stringify(courseTags);
|
|
2130
|
-
const contentListItemClassAttributes = [
|
|
2214
|
+
const contentListItemClassAttributes = ["item", this.variant].join(" ");
|
|
2131
2215
|
courseRealisations.push(h("hy-content-list-item", { id: realisationProperty, class: contentListItemClassAttributes, variant: this.variant, "state-variant": this.courseStateVariant, "course-code": courseCode, "course-name": courseRealisationFullName, "is-cancelled": courseCancelled, "cancelled-label": this.cancelledLabel, "course-credits": courseCredits, "course-tags": courseTagsJSON, "course-start-date": courseStartDate, "course-end-date": courseEndDate, "formatted-time-range": formattedTimeRange, "course-study-format": courseStudyFormat, "course-organisation": courseOrganisation, "course-enrollment-link": courseEnrollmentLink, "course-teaching-language": courseTeachingLanguage, "course-link-label": this.linkLabel, "data-location": courseEnrollmentLink, onClick: (e) => this.handleCardClick(e, realisationProperty) }));
|
|
2132
2216
|
}
|
|
2133
2217
|
}
|
|
@@ -2137,18 +2221,18 @@ const HyContentList = class {
|
|
|
2137
2221
|
return courseRealisations;
|
|
2138
2222
|
}
|
|
2139
2223
|
render() {
|
|
2140
|
-
const classAttributes = [this.variant,
|
|
2141
|
-
const classAlertAttributes = [
|
|
2224
|
+
const classAttributes = [this.variant, "hy-content-list"].join(" ");
|
|
2225
|
+
const classAlertAttributes = ["hy-content-list--alert", `hy-content-list--alert--${this.headerstyle}`].join(" ");
|
|
2142
2226
|
const classAlertLabelAttributes = [
|
|
2143
|
-
|
|
2227
|
+
"hy-content-list--alert-label",
|
|
2144
2228
|
`hy-content-list--alert-label--${this.headerstyle}`,
|
|
2145
|
-
].join(
|
|
2229
|
+
].join(" ");
|
|
2146
2230
|
this.courseRealisations = this.renderItems();
|
|
2147
2231
|
if (this.courseRealisations && this.courseRealisations.length > 0) {
|
|
2148
2232
|
return (h(Host, null, h("div", { class: classAttributes }, this.courseRealisations)));
|
|
2149
2233
|
}
|
|
2150
2234
|
else {
|
|
2151
|
-
return (h(Host, null, h("div", { class: classAttributes }, h("div", { class: "hy-content-list--no-result" }, h("span", { class: classAlertAttributes }, h("hy-icon", { icon:
|
|
2235
|
+
return (h(Host, null, h("div", { class: classAttributes }, h("div", { class: "hy-content-list--no-result" }, h("span", { class: classAlertAttributes }, h("hy-icon", { icon: "hy-icon-info", size: 16 })), h("span", { class: classAlertLabelAttributes }, this.noResultLabel)))));
|
|
2152
2236
|
}
|
|
2153
2237
|
}
|
|
2154
2238
|
get el() { return getElement(this); }
|
|
@@ -2161,7 +2245,7 @@ HyContentList.style = hyContentListCss;
|
|
|
2161
2245
|
const hyContentListItemCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand-main-bright:#48c5f8;--brand-main-light:#107eab;--brand-main-active:#005379;--brand-main-dark:#003146;--brand-main-nearly-black:#000222;--link-blue:#0479a4;--link-disabled:#767676;--grayscale-white:#fff;--grayscale-slightly-gray:#fefefe;--grayscale-light:#f8f8f8;--grayscale-medium:#d2d2d2;--grayscale-background-box:#f5f5f5;--grayscale-tabs-border:#e6e6e6;--grayscale-background-arrow:#dfdfdf;--grayscale-medium-dark:#979797;--grayscale-dark:#555555;--grayscale-dark-text:#222222;--grayscale-black:#000000;--additional-red-light:#e5053a;--additional-red-dark:#a31621;--additional-purple-light:#420039;--additional-yellow-light:#f9a21a;--additional-yellow:#c47f1b;--additional-skyblue:#48c5f8;--additional-orange:#d14600;--additional-green-light:#96ba3c;--additional-green-dark:#006400;--hover-gray:#eaeaea}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{--gutter-mobile:16px;--gutter-narrow:24px;--gutter-medium:24px;--gutter-wide:24px;--gutter-extrawide:32px}:root{--breakpoint-extrawide:75.0625rem;--breakpoint-max-width:75.0625rem;--breakpoint-medium:48rem;--breakpoint-narrow:30rem;--breakpoint-wide:60rem}hy-content-list-item{background:radial-gradient(circle, #f8f8f8 0%, #f5f5f5 100%);cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;margin-bottom:16px;position:relative}@media (min-width: 30rem){hy-content-list-item{margin-bottom:24px}}hy-content-list-item[variant=row],hy-content-list-item.row{max-width:100%;padding:21px 0 60px 12px;width:100%}@media (min-width: 30rem){hy-content-list-item[variant=row],hy-content-list-item.row{padding:21px 0 12px 24px}}@media (min-width: 60rem){hy-content-list-item[variant=row],hy-content-list-item.row{margin-bottom:16px}}hy-content-list-item.grid{max-width:100%;padding:21px 0 60px 12px;width:100%}@media (min-width: 30rem){hy-content-list-item.grid{margin-right:var(--gutter-medium);max-width:calc(((100% - var(--gutter-medium) * 11) / 12) * 6 + var(--gutter-medium) * 5);padding:21px 0 60px 12px;width:calc(((100% - var(--gutter-medium) * 11) / 12) * 6 + var(--gutter-medium) * 5)}}@media (min-width: 60rem){hy-content-list-item.grid{margin-bottom:27px;margin-right:var(--gutter-wide);max-width:calc(((100% - var(--gutter-wide) * 11) / 12) * 4 + var(--gutter-wide) * 3);width:calc(((100% - var(--gutter-wide) * 11) / 12) * 4 + var(--gutter-wide) * 3)}}@media (min-width: 75.0625rem){hy-content-list-item.grid{margin-bottom:32px;margin-right:var(--gutter-extrawide);max-width:calc(((100% - var(--gutter-extrawide) * 11) / 12) * 4 + var(--gutter-extrawide) * 3);width:calc(((100% - var(--gutter-extrawide) * 11) / 12) * 4 + var(--gutter-extrawide) * 3)}}@media (min-width: 30rem){hy-content-list-item.grid:nth-of-type(2n+0){margin-right:0}}@media (min-width: 60rem){hy-content-list-item.grid:nth-of-type(2n+0){margin-right:var(--gutter-wide)}}@media (min-width: 75.0625rem){hy-content-list-item.grid:nth-of-type(2n+0){margin-right:var(--gutter-extrawide)}}@media (min-width: 60rem){hy-content-list-item.grid:nth-of-type(3n+0){margin-right:0}}.hy-content-list-item{font-family:var(--main-font-family);position:relative;width:100%}.hy-content-list-item a{text-decoration:none}.hy-content-list-item--container{cursor:pointer}.hy-content-list-item--item-name{color:var(--link-blue);font-size:1.25rem;line-height:24px;font-weight:700;letter-spacing:-0.6px;margin-bottom:16px;word-break:break-word}.hy-content-list-item--item-name--past-courses{color:var(--grayscale-dark)}.hy-content-list-item--metadata{font-size:0.875rem;line-height:16px;font-weight:600;color:var(--grayscale-black);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;letter-spacing:-0.44px;line-height:16px;margin-bottom:19px;padding-bottom:0}.hy-content-list-item--metadata--item{padding-bottom:6px}@media (min-width: 30rem){.hy-content-list-item--metadata{padding-bottom:1rem}}@media (min-width: 75.0625rem){.hy-content-list-item--metadata{padding-bottom:0}}.hy-content-list-item--metadata--item:after{content:\"|\";padding:0 8px}.hy-content-list-item--metadata--item--last:after{content:\" \"}.hy-content-list-item .cancelled span{font-size:0.75rem;line-height:12px;font-weight:700;background-color:var(--additional-red-light);color:var(--grayscale-white);letter-spacing:-0.5px;padding:6px 8px;text-transform:uppercase}.hy-content-list-item .cancelled--past-courses span{background-color:var(--grayscale-dark)}.hy-content-list-item .cancelled:not(.mobile){display:none}.hy-content-list-item .cancelled.mobile{bottom:-50px;display:block;margin:0;padding-bottom:12px;position:absolute}@media (min-width: 30rem){.hy-content-list-item .cancelled{margin-right:8px}.hy-content-list-item .cancelled.mobile{display:none}.hy-content-list-item .cancelled:not(.mobile){display:block}}.hy-content-list-item--link{position:absolute;right:-6px}.hy-content-list-item--link a{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;text-decoration:none}.hy-content-list-item--link a .label{font-size:1rem;line-height:16px;font-weight:700;color:var(--link-blue);letter-spacing:-0.5px;line-height:16px;margin-right:8px;text-align:right}.hy-content-list-item--link a .icon-wrapper{background-color:var(--brand-main-light);z-index:10}.hy-content-list-item--link a .icon-wrapper .icon{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);position:relative;overflow:hidden}.hy-content-list-item--link a .icon-wrapper .icon svg{background-color:transparent;-webkit-box-shadow:0 2px 8px 0 rgba(0, 0, 0, 0.1);box-shadow:0 2px 8px 0 rgba(0, 0, 0, 0.1);fill:var(--grayscale-white);padding:10.29px}.hy-content-list-item.row .hy-content-list-item--link{bottom:-60px;padding-bottom:12px}@media (min-width: 30rem){.hy-content-list-item.row .hy-content-list-item--link{bottom:0;padding-bottom:0}}.hy-content-list-item.row .hy-content-list-item--tags{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:wrap;flex-wrap:wrap}@media (min-width: 60rem){.hy-content-list-item.row .hy-content-list-item--tags{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;padding-right:200px}}.hy-content-list-item.grid .hy-content-list-item--link{bottom:-60px;padding-bottom:12px}.hy-content-list-item.grid .hy-content-list-item--tags{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:wrap;flex-wrap:wrap}";
|
|
2162
2246
|
|
|
2163
2247
|
let keys$3 = {
|
|
2164
|
-
enter:
|
|
2248
|
+
enter: "Enter",
|
|
2165
2249
|
};
|
|
2166
2250
|
const HyContentLstItem = class {
|
|
2167
2251
|
constructor(hostRef) {
|
|
@@ -2171,7 +2255,7 @@ const HyContentLstItem = class {
|
|
|
2171
2255
|
this.courseCode = undefined;
|
|
2172
2256
|
this.courseName = undefined;
|
|
2173
2257
|
this.isCancelled = undefined;
|
|
2174
|
-
this.cancelledLabel =
|
|
2258
|
+
this.cancelledLabel = "Cancelled";
|
|
2175
2259
|
this.courseCredits = undefined;
|
|
2176
2260
|
this.courseTags = undefined;
|
|
2177
2261
|
this.courseStartDate = undefined;
|
|
@@ -2190,18 +2274,18 @@ const HyContentLstItem = class {
|
|
|
2190
2274
|
const key = event.code;
|
|
2191
2275
|
if (key == keys$3.enter) {
|
|
2192
2276
|
let card = this.el;
|
|
2193
|
-
window.open(card.dataset.location,
|
|
2277
|
+
window.open(card.dataset.location, "_blank", "noopener");
|
|
2194
2278
|
}
|
|
2195
2279
|
}
|
|
2196
2280
|
render() {
|
|
2197
|
-
const classAttributes = [this.variant,
|
|
2198
|
-
const target =
|
|
2199
|
-
const ariaLabel =
|
|
2281
|
+
const classAttributes = [this.variant, "hy-content-list-item"].join(" ");
|
|
2282
|
+
const target = "_blank";
|
|
2283
|
+
const ariaLabel = "Link points outside the current website.";
|
|
2200
2284
|
const classItemName = [
|
|
2201
|
-
|
|
2285
|
+
"hy-content-list-item--item-name",
|
|
2202
2286
|
`hy-content-list-item--item-name--${this.stateVariant}`,
|
|
2203
|
-
].join(
|
|
2204
|
-
const classItemCancelled = [
|
|
2287
|
+
].join(" ");
|
|
2288
|
+
const classItemCancelled = ["cancelled", `cancelled--${this.stateVariant}`].join(" ");
|
|
2205
2289
|
return [
|
|
2206
2290
|
h("div", { class: classAttributes, tabindex: "0" }, h("div", { class: classItemName }, this.courseName), h("div", { class: "hy-content-list-item--metadata" }, this.isCancelled && (h("div", { class: classItemCancelled }, h("span", null, this.cancelledLabel))), h("div", { class: "hy-content-list-item--metadata--item hy-content-list-item--metadata--item--first" }, h("span", null, this.formattedTimeRange)), this.courseOrganisation
|
|
2207
2291
|
? [
|
|
@@ -2212,7 +2296,7 @@ const HyContentLstItem = class {
|
|
|
2212
2296
|
h("div", { class: "hy-content-list-item--metadata--item hy-content-list-item--metadata--item--last" }, h("span", null, this.courseStudyFormat)),
|
|
2213
2297
|
]), this._courseTags && this._courseTags.length > 0 && (h("div", { class: "hy-content-list-item--tags" }, this._courseTags.map((x) => {
|
|
2214
2298
|
return h("hy-tag", null, x.name);
|
|
2215
|
-
}))), this.isCancelled && (h("div", { class: "cancelled mobile" }, h("span", null, this.cancelledLabel))), h("div", { class: "hy-content-list-item--link" }, h("a", { href: this.courseEnrollmentLink, target: target, "aria-label": ariaLabel, class: "hy-content-list-item--link--link", tabindex: "-1" }, h("span", { class: "label" }, this.courseLinkLabel), h("span", { class: "icon-wrapper" }, h("div", { class: "icon" }, h("hy-icon", { icon:
|
|
2299
|
+
}))), this.isCancelled && (h("div", { class: "cancelled mobile" }, h("span", null, this.cancelledLabel))), h("div", { class: "hy-content-list-item--link" }, h("a", { href: this.courseEnrollmentLink, target: target, "aria-label": ariaLabel, class: "hy-content-list-item--link--link", tabindex: "-1" }, h("span", { class: "label" }, this.courseLinkLabel), h("span", { class: "icon-wrapper" }, h("div", { class: "icon" }, h("hy-icon", { icon: "hy-icon-arrow-to-right", size: 40 })))))),
|
|
2216
2300
|
];
|
|
2217
2301
|
}
|
|
2218
2302
|
get el() { return getElement(this); }
|
|
@@ -2230,7 +2314,7 @@ const HyCrisisBanner = class {
|
|
|
2230
2314
|
this.linkUrl = undefined;
|
|
2231
2315
|
}
|
|
2232
2316
|
render() {
|
|
2233
|
-
return (h(Host, { class: "hy-crisis-banner", role: "alert" }, h("div", { class: "hy-crisis-banner__container" }, h("div", { class: "hy-crisis-banner__indicator" }, h("hy-icon", { class:
|
|
2317
|
+
return (h(Host, { class: "hy-crisis-banner", role: "alert" }, h("div", { class: "hy-crisis-banner__container" }, h("div", { class: "hy-crisis-banner__indicator" }, h("hy-icon", { class: "hy-crisis-banner__indicator-icon", icon: "hy-icon-alert" })), h("div", { class: "hy-crisis-banner__content-wrapper" }, h("div", { class: "hy-crisis-banner__content" }, h("h3", { class: "hy-crisis-banner__title" }, this.bannerTitle), this.bannerDescription && (h("div", { class: "hy-crisis-banner__description", innerHTML: this.bannerDescription }))), this.linkUrl && (h("a", { class: "hy-crisis-banner__link", href: this.linkUrl }, this.linkTitle, h("hy-icon", { class: "hy-crisis-banner__link-icon", icon: "hy-icon-arrow-to-right" })))))));
|
|
2234
2318
|
}
|
|
2235
2319
|
};
|
|
2236
2320
|
HyCrisisBanner.style = hyCrisisBannerCss;
|
|
@@ -2241,20 +2325,20 @@ const CtaButton = class {
|
|
|
2241
2325
|
constructor(hostRef) {
|
|
2242
2326
|
registerInstance(this, hostRef);
|
|
2243
2327
|
this.variant = CtaLinkButtonVariants.onBlueBkgd;
|
|
2244
|
-
this.linkContent =
|
|
2328
|
+
this.linkContent = "";
|
|
2245
2329
|
this.typeButton = false;
|
|
2246
2330
|
this.url = undefined;
|
|
2247
2331
|
this.scLabel = undefined;
|
|
2248
2332
|
this.isExternal = false;
|
|
2249
|
-
this.headerstyle =
|
|
2333
|
+
this.headerstyle = "common";
|
|
2250
2334
|
}
|
|
2251
2335
|
render() {
|
|
2252
|
-
const classAttributes = [
|
|
2253
|
-
const containerClassAttributes = [
|
|
2254
|
-
const textClassAttributes = [
|
|
2255
|
-
const iconClassAttributes = [
|
|
2256
|
-
const target = this.isExternal ?
|
|
2257
|
-
return (h("span", { class: containerClassAttributes }, !this.typeButton ? (h("a", { "aria-label": this.scLabel, class: classAttributes, href: this.url, target: target }, h("span", { class: textClassAttributes }, this.linkContent.length === 0 ? h("slot", null) : this.linkContent), h("span", { class: iconClassAttributes }, h("hy-icon", { icon:
|
|
2336
|
+
const classAttributes = ["hy-cta-button", this.variant, this.headerstyle].join(" ");
|
|
2337
|
+
const containerClassAttributes = ["hy-cta-button-container"].join(" ");
|
|
2338
|
+
const textClassAttributes = ["text"].join(" ");
|
|
2339
|
+
const iconClassAttributes = ["link-icon"].join(" ");
|
|
2340
|
+
const target = this.isExternal ? "_blank" : "_self";
|
|
2341
|
+
return (h("span", { class: containerClassAttributes }, !this.typeButton ? (h("a", { "aria-label": this.scLabel, class: classAttributes, href: this.url, target: target }, h("span", { class: textClassAttributes }, this.linkContent.length === 0 ? h("slot", null) : this.linkContent), h("span", { class: iconClassAttributes }, h("hy-icon", { icon: "hy-icon-arrow-right", size: 48 })))) : (h("button", { "aria-label": this.scLabel, class: classAttributes }, h("span", { class: textClassAttributes }, this.linkContent.length === 0 ? h("slot", null) : this.linkContent), h("span", { class: iconClassAttributes }, h("hy-icon", { icon: "hy-icon-arrow-right", size: 48 }))))));
|
|
2258
2342
|
}
|
|
2259
2343
|
get el() { return getElement(this); }
|
|
2260
2344
|
};
|
|
@@ -2266,20 +2350,32 @@ const CtaLink = class {
|
|
|
2266
2350
|
constructor(hostRef) {
|
|
2267
2351
|
registerInstance(this, hostRef);
|
|
2268
2352
|
this.variant = CtaLinkVariants.default;
|
|
2269
|
-
this.linkContent =
|
|
2353
|
+
this.linkContent = "";
|
|
2270
2354
|
this.url = undefined;
|
|
2271
2355
|
this.scLabel = undefined;
|
|
2272
2356
|
this.isExternal = false;
|
|
2273
2357
|
}
|
|
2274
2358
|
render() {
|
|
2275
|
-
const iconClassAttributes = [
|
|
2276
|
-
const target = this.isExternal ?
|
|
2277
|
-
return (h("a", { "aria-label": this.scLabel, href: this.url, target: target, class: `hy-cta-link hy-cta-link--${this.variant}` }, this.variant == CtaLinkVariants.linkList && (h("span", { class: iconClassAttributes }, h("hy-icon", { icon:
|
|
2359
|
+
const iconClassAttributes = ["hy-cta-link__icon", this.isExternal && "hy-cta-link__icon--external"].join(" ");
|
|
2360
|
+
const target = this.isExternal ? "_blank" : "_self";
|
|
2361
|
+
return (h("a", { "aria-label": this.scLabel, href: this.url, target: target, class: `hy-cta-link hy-cta-link--${this.variant}` }, this.variant == CtaLinkVariants.linkList && (h("span", { class: iconClassAttributes }, h("hy-icon", { icon: "hy-icon-arrow-to-right", size: 24 }))), h("span", null, this.linkContent), this.variant == CtaLinkVariants.default && (h("span", { class: iconClassAttributes }, h("hy-icon", { icon: "hy-icon-arrow-to-right", size: 24 })))));
|
|
2278
2362
|
}
|
|
2279
2363
|
get el() { return getElement(this); }
|
|
2280
2364
|
};
|
|
2281
2365
|
CtaLink.style = ctaLinkCss;
|
|
2282
2366
|
|
|
2367
|
+
const docsContainerCss = "div.hy-docs-container{display:block;margin:2rem 0}";
|
|
2368
|
+
|
|
2369
|
+
const DocsContainer = class {
|
|
2370
|
+
constructor(hostRef) {
|
|
2371
|
+
registerInstance(this, hostRef);
|
|
2372
|
+
}
|
|
2373
|
+
render() {
|
|
2374
|
+
return (h("div", { class: "hy-docs-container" }, h("slot", null)));
|
|
2375
|
+
}
|
|
2376
|
+
};
|
|
2377
|
+
DocsContainer.style = docsContainerCss;
|
|
2378
|
+
|
|
2283
2379
|
const hyDropdownCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand-main-bright:#48c5f8;--brand-main-light:#107eab;--brand-main-active:#005379;--brand-main-dark:#003146;--brand-main-nearly-black:#000222;--link-blue:#0479a4;--link-disabled:#767676;--grayscale-white:#fff;--grayscale-slightly-gray:#fefefe;--grayscale-light:#f8f8f8;--grayscale-medium:#d2d2d2;--grayscale-background-box:#f5f5f5;--grayscale-tabs-border:#e6e6e6;--grayscale-background-arrow:#dfdfdf;--grayscale-medium-dark:#979797;--grayscale-dark:#555555;--grayscale-dark-text:#222222;--grayscale-black:#000000;--additional-red-light:#e5053a;--additional-red-dark:#a31621;--additional-purple-light:#420039;--additional-yellow-light:#f9a21a;--additional-yellow:#c47f1b;--additional-skyblue:#48c5f8;--additional-orange:#d14600;--additional-green-light:#96ba3c;--additional-green-dark:#006400;--hover-gray:#eaeaea}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{--gutter-mobile:16px;--gutter-narrow:24px;--gutter-medium:24px;--gutter-wide:24px;--gutter-extrawide:32px}:root{--breakpoint-extrawide:75.0625rem;--breakpoint-max-width:75.0625rem;--breakpoint-medium:48rem;--breakpoint-narrow:30rem;--breakpoint-wide:60rem}.hy-dropdown{display:inline-block;min-width:100%;position:relative}@media (min-width: 30rem){.hy-dropdown{min-width:48.3%}}@media (min-width: 75.0625rem){.hy-dropdown{min-width:23.03%}}.hy-dropdown label.hy-dropdown__button-label{font-size:1rem;line-height:20px;font-weight:700;display:block;font-family:var(--main-font-family);letter-spacing:-0.32px;margin-bottom:8px}.hy-dropdown--single .hy-dropdown__panel{width:-webkit-max-content;width:-moz-max-content;width:max-content;max-width:330px;min-width:100%}.hy-dropdown__toggle{font-size:0.875rem;line-height:24px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--grayscale-white);border-radius:0;border:1px solid var(--grayscale-medium-dark);color:var(--link-blue);display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font-family:var(--main-font-family);font-weight:600;min-height:40px;height:auto;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;letter-spacing:normal;padding:0 0 0 16px;text-align:left;max-width:280px;width:100%}@media (min-width: 30rem){.hy-dropdown__toggle{font-size:1rem;line-height:24px;min-height:44px}}@media (min-width: 75.0625rem){.hy-dropdown__toggle{min-height:48px}}.hy-dropdown__toggle:hover{border-color:var(--brand-main-light);cursor:pointer}.hy-dropdown__toggle:focus{border-color:var(--brand-main-light);border-style:solid inset solid solid;border-width:2px;outline:0;text-indent:-1px}.hy-dropdown__toggle svg{pointer-events:none}.hy-dropdown__toggle.is-open .hy-dropdown__icon{background-color:var(--brand-main-light);-webkit-transform:rotate(180deg);transform:rotate(180deg)}.hy-dropdown__toggle.is-open .hy-dropdown__icon::before{display:none}.hy-dropdown__toggle.is-open .hy-dropdown__icon svg{fill:var(--grayscale-white)}.hy-dropdown__icon{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-negative:0;flex-shrink:0;height:40px;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;margin:0 0 0 16px;position:relative;width:40px}.hy-dropdown__icon::before{border-left:0.5px solid var(--grayscale-medium-dark);content:\"\";display:inline-block;height:65%;left:0;position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}@media (min-width: 30rem){.hy-dropdown__icon{height:44px;width:44px}}@media (min-width: 75.0625rem){.hy-dropdown__icon{height:48px;width:48px}}.hy-dropdown__icon svg{fill:var(--link-blue)}@media (min-width: 30rem){.hy-dropdown__icon svg{height:16px;width:16px}}.hy-dropdown__panel{background-color:var(--grayscale-white);-webkit-box-shadow:0 10px 20px 0 rgba(0, 49, 70, 0.2);box-shadow:0 10px 20px 0 rgba(0, 49, 70, 0.2);list-style:none;margin:0;padding:6px;position:absolute;width:100%;z-index:11}.hy-dropdown__panel.is-hidden{display:none;visibility:hidden}.hy-dropdown__panel-item{position:relative}.hy-dropdown__panel-item:not(.is-last){margin-bottom:6px}.hy-dropdown__label{font-size:0.875rem;line-height:24px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--grayscale-white);border-radius:0;border:1px solid var(--grayscale-medium-dark);color:var(--link-blue);display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font-family:var(--main-font-family);font-weight:600;min-height:40px;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;letter-spacing:normal;padding:0 16px;text-align:left;width:100%}@media (min-width: 30rem){.hy-dropdown__label{font-size:1rem;line-height:24px}}.hy-dropdown__label-icon{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:none !important;-ms-flex-negative:0;flex-shrink:0;height:40px;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:relative;visibility:hidden;width:40px}.hy-dropdown__checkbox{height:100%;margin:0;opacity:0;position:absolute;width:100%;z-index:10}.hy-dropdown__checkbox:checked+label{border-color:var(--grayscale-black);border-style:solid inset solid solid;border-width:2px;color:var(--grayscale-black);outline:0;text-indent:-1px}.hy-dropdown__checkbox:checked+label .hy-dropdown__label-icon{display:-webkit-inline-box !important;display:-ms-inline-flexbox !important;display:inline-flex !important;visibility:visible}.hy-dropdown__checkbox:hover{cursor:pointer}.hy-dropdown__checkbox:hover+label{border-color:var(--brand-main-light)}.hy-dropdown__checkbox:focus+label{border-color:var(--brand-main-light);border-style:solid inset solid solid;border-width:2px;outline:0;text-indent:-1px}";
|
|
2284
2380
|
|
|
2285
2381
|
const HyDropdown = class {
|
|
@@ -2287,9 +2383,9 @@ const HyDropdown = class {
|
|
|
2287
2383
|
registerInstance(this, hostRef);
|
|
2288
2384
|
this.single = false;
|
|
2289
2385
|
this.dropdownLabel = null;
|
|
2290
|
-
this.dropdownId =
|
|
2386
|
+
this.dropdownId = "dropdownToggle";
|
|
2291
2387
|
this.dropdownOptions = undefined;
|
|
2292
|
-
this.defaultLabel =
|
|
2388
|
+
this.defaultLabel = "All";
|
|
2293
2389
|
this.defaultOption = null;
|
|
2294
2390
|
this.isPanelOpen = false;
|
|
2295
2391
|
this.isChecked = false;
|
|
@@ -2299,7 +2395,7 @@ const HyDropdown = class {
|
|
|
2299
2395
|
this._dropdownOptions = await jsonParserWorker(this.dropdownOptions);
|
|
2300
2396
|
}
|
|
2301
2397
|
componentWillUpdate() {
|
|
2302
|
-
const items = this.el.querySelectorAll(
|
|
2398
|
+
const items = this.el.querySelectorAll(".hy-dropdown__checkbox");
|
|
2303
2399
|
if (items) {
|
|
2304
2400
|
if ([...items].some((item) => item.checked == true)) {
|
|
2305
2401
|
this.isChecked = true;
|
|
@@ -2313,7 +2409,7 @@ const HyDropdown = class {
|
|
|
2313
2409
|
if (!this.single)
|
|
2314
2410
|
return;
|
|
2315
2411
|
if (newValue !== oldValue) {
|
|
2316
|
-
const dropdownPanelCheckboxElements = this.el.getElementsByClassName(
|
|
2412
|
+
const dropdownPanelCheckboxElements = this.el.getElementsByClassName("hy-dropdown__checkbox");
|
|
2317
2413
|
Array.from(dropdownPanelCheckboxElements).filter((item) => {
|
|
2318
2414
|
if (item.id == newValue) {
|
|
2319
2415
|
item.checked = true;
|
|
@@ -2329,9 +2425,9 @@ const HyDropdown = class {
|
|
|
2329
2425
|
}
|
|
2330
2426
|
handleClick(event) {
|
|
2331
2427
|
const dropdownToggleButtonElement = this.el.querySelector(`#${this.dropdownId}`);
|
|
2332
|
-
const dropdownPanelElement = this.el.querySelector(
|
|
2333
|
-
const dropdownPanelCheckboxElements = this.el.querySelectorAll(
|
|
2334
|
-
const dropdownToggleButtonIconElement = this.el.querySelector(
|
|
2428
|
+
const dropdownPanelElement = this.el.querySelector(".hy-dropdown__panel");
|
|
2429
|
+
const dropdownPanelCheckboxElements = this.el.querySelectorAll(".hy-dropdown__checkbox");
|
|
2430
|
+
const dropdownToggleButtonIconElement = this.el.querySelector(".hy-dropdown__icon");
|
|
2335
2431
|
const { target } = event;
|
|
2336
2432
|
const allowedElements = [
|
|
2337
2433
|
dropdownToggleButtonElement,
|
|
@@ -2347,7 +2443,7 @@ const HyDropdown = class {
|
|
|
2347
2443
|
handleSingleClick(event) {
|
|
2348
2444
|
if (!this.single || !this.isPanelOpen)
|
|
2349
2445
|
return;
|
|
2350
|
-
const dropdownPanelCheckboxElements = this.el.getElementsByClassName(
|
|
2446
|
+
const dropdownPanelCheckboxElements = this.el.getElementsByClassName("hy-dropdown__checkbox");
|
|
2351
2447
|
const allowedElements = [...dropdownPanelCheckboxElements];
|
|
2352
2448
|
const { target } = event;
|
|
2353
2449
|
if (!allowedElements.includes(target))
|
|
@@ -2371,12 +2467,12 @@ const HyDropdown = class {
|
|
|
2371
2467
|
}
|
|
2372
2468
|
render() {
|
|
2373
2469
|
const { label: currentLabel, id: currentId, value: currentValue } = this.currentSingle[0];
|
|
2374
|
-
const classAttributes = [
|
|
2470
|
+
const classAttributes = ["hy-dropdown", this.single ? "hy-dropdown--single" : ""].join(" ");
|
|
2375
2471
|
if (this.single) {
|
|
2376
|
-
return (h(Host, { class: classAttributes }, this.dropdownLabel && (h("label", { class: "hy-dropdown__button-label", htmlFor: this.dropdownId }, this.dropdownLabel)), h("button", { id: this.dropdownId, class: `hy-dropdown__toggle ${this.isPanelOpen ?
|
|
2472
|
+
return (h(Host, { class: classAttributes }, this.dropdownLabel && (h("label", { class: "hy-dropdown__button-label", htmlFor: this.dropdownId }, this.dropdownLabel)), h("button", { id: this.dropdownId, class: `hy-dropdown__toggle ${this.isPanelOpen ? "is-open" : ""}`, "aria-expanded": `${this.isPanelOpen || false}`, "aria-haspopup": "true", "aria-controls": "dropdownPanel", onClick: () => this.handlePanelToggle(), "aria-label": `${!this.isPanelOpen ? "Open" : "Close"} dropdown`, "data-current-id": currentId, "data-current-value": currentValue, value: currentId, type: "button" }, currentLabel, h("hy-icon", { class: "hy-dropdown__icon", icon: "hy-icon-caret-down", size: 14, "aria-hidden": "true" })), h("hy-dropdown-panel", { "checkbox-checked": this.isChecked ? "true" : "false", "is-hidden": !this.isPanelOpen }, this._dropdownOptions.map(({ id, label, value }, index) => (h("hy-dropdown-panel-item", { "dropdown-item-id": id, "dropdown-item-label": label, "dropdown-item-value": value, "is-last": this._dropdownOptions.length - 1 === index }))))));
|
|
2377
2473
|
}
|
|
2378
2474
|
else {
|
|
2379
|
-
return (h(Host, { class: classAttributes }, h("button", { id: this.dropdownId, class: `hy-dropdown__toggle ${this.isPanelOpen ?
|
|
2475
|
+
return (h(Host, { class: classAttributes }, h("button", { id: this.dropdownId, class: `hy-dropdown__toggle ${this.isPanelOpen ? "is-open" : ""}`, "aria-expanded": `${this.isPanelOpen || false}`, "aria-haspopup": "true", "aria-controls": "dropdownPanel", onClick: () => this.handlePanelToggle(), "aria-label": `${!this.isPanelOpen ? "Open" : "Close"} dropdown`, type: "button" }, this.dropdownLabel && this.dropdownLabel, h("hy-icon", { class: "hy-dropdown__icon", icon: "hy-icon-caret-down", size: 14, "aria-hidden": "true" })), h("hy-dropdown-panel", { "checkbox-checked": this.isChecked ? "true" : "false", "is-hidden": !this.isPanelOpen }, this._dropdownOptions.map(({ id, label, value }, index) => (h("hy-dropdown-panel-item", { "dropdown-item-id": id, "dropdown-item-label": label, "dropdown-item-value": value, "is-last": this._dropdownOptions.length - 1 === index }))))));
|
|
2380
2476
|
}
|
|
2381
2477
|
}
|
|
2382
2478
|
get el() { return getElement(this); }
|
|
@@ -2392,7 +2488,7 @@ const HyDropdownPanel = class {
|
|
|
2392
2488
|
this.isHidden = undefined;
|
|
2393
2489
|
}
|
|
2394
2490
|
render() {
|
|
2395
|
-
return (h("ul", { id: "dropdownPanel", class: `hy-dropdown__panel ${this.isHidden ?
|
|
2491
|
+
return (h("ul", { id: "dropdownPanel", class: `hy-dropdown__panel ${this.isHidden ? "is-hidden" : ""}`, "aria-hidden": `${this.isHidden || false}`, role: "region", "aria-labelledby": "dropdownToggle" }, h("slot", null)));
|
|
2396
2492
|
}
|
|
2397
2493
|
};
|
|
2398
2494
|
|
|
@@ -2405,7 +2501,7 @@ const HyDropdownPanelItem = class {
|
|
|
2405
2501
|
this.dropdownItemLabel = undefined;
|
|
2406
2502
|
}
|
|
2407
2503
|
render() {
|
|
2408
|
-
return (h("li", { class: `hy-dropdown__panel-item ${this.isLast ?
|
|
2504
|
+
return (h("li", { class: `hy-dropdown__panel-item ${this.isLast ? "is-last" : ""}` }, h("input", { type: "checkbox", class: "hy-dropdown__checkbox", id: `${this.dropdownItemId}`, value: `${this.dropdownItemValue}` }), h("label", { class: "hy-dropdown__label", htmlFor: `${this.dropdownItemId}` }, this.dropdownItemLabel, h("hy-icon", { class: "hy-dropdown__label-icon", icon: "hy-icon-done", size: 14, "aria-hidden": "true" }))));
|
|
2409
2505
|
}
|
|
2410
2506
|
};
|
|
2411
2507
|
|
|
@@ -2418,7 +2514,7 @@ const HyFilterGroup = class {
|
|
|
2418
2514
|
this.filterGroupFilters = undefined;
|
|
2419
2515
|
}
|
|
2420
2516
|
arrayDataWatcher(newValue) {
|
|
2421
|
-
if (typeof newValue ===
|
|
2517
|
+
if (typeof newValue === "string") {
|
|
2422
2518
|
this._filterGroupFilters = JSON.parse(newValue);
|
|
2423
2519
|
}
|
|
2424
2520
|
else {
|
|
@@ -2448,7 +2544,7 @@ const HyFilterGroupItem = class {
|
|
|
2448
2544
|
this.filterGroupItemLabel = undefined;
|
|
2449
2545
|
}
|
|
2450
2546
|
render() {
|
|
2451
|
-
return (h("li", { class: "hy-filter-group__filter" }, h("button", { type: "button", class: "hy-filter-group__button", "aria-label": `Deselect ${this.filterGroupItemLabel}` }, this.filterGroupItemLabel, h("hy-icon", { class: "hy-filter-group__button-icon", icon:
|
|
2547
|
+
return (h("li", { class: "hy-filter-group__filter" }, h("button", { type: "button", class: "hy-filter-group__button", "aria-label": `Deselect ${this.filterGroupItemLabel}` }, this.filterGroupItemLabel, h("hy-icon", { class: "hy-filter-group__button-icon", icon: "hy-icon-remove", size: 10, "aria-hidden": "true", fill: ColorVariant.grey_dark })), h("slot", null)));
|
|
2452
2548
|
}
|
|
2453
2549
|
};
|
|
2454
2550
|
|
|
@@ -2462,14 +2558,14 @@ const HyFilterListType = class {
|
|
|
2462
2558
|
}
|
|
2463
2559
|
render() {
|
|
2464
2560
|
return (h("div", { class: "hy-filter__list-type" }, h("span", null, this.filterLabel), h("button", { type: "button", class: {
|
|
2465
|
-
|
|
2466
|
-
|
|
2467
|
-
|
|
2468
|
-
}, "aria-label": `${this.filterLabel}--list` }, h("hy-icon", { class: "hy-filter-group__button-icon", icon:
|
|
2469
|
-
|
|
2470
|
-
|
|
2471
|
-
|
|
2472
|
-
}, "aria-label": `${this.filterLabel}--grid` }, h("hy-icon", { class: "hy-filter-group__button-icon", icon:
|
|
2561
|
+
"hy-filter-item": true,
|
|
2562
|
+
"hy-filter__list-type__list": true,
|
|
2563
|
+
"is-active": this.filterValue == ListStyleVariants.list,
|
|
2564
|
+
}, "aria-label": `${this.filterLabel}--list` }, h("hy-icon", { class: "hy-filter-group__button-icon", icon: "hy-icon-list-style-list", size: 16, "aria-hidden": "true" })), h("button", { type: "button", class: {
|
|
2565
|
+
"hy-filter-item": true,
|
|
2566
|
+
"hy-filter__list-type__grid": true,
|
|
2567
|
+
"is-active": this.filterValue == ListStyleVariants.grid,
|
|
2568
|
+
}, "aria-label": `${this.filterLabel}--grid` }, h("hy-icon", { class: "hy-filter-group__button-icon", icon: "hy-icon-list-style-grid", size: 16, "aria-hidden": "true" }))));
|
|
2473
2569
|
}
|
|
2474
2570
|
};
|
|
2475
2571
|
HyFilterListType.style = hyFilterListTypeCss;
|
|
@@ -2483,9 +2579,9 @@ const HyFilterVisibilityTool = class {
|
|
|
2483
2579
|
}
|
|
2484
2580
|
render() {
|
|
2485
2581
|
switch (this.filterVisibilityToolType) {
|
|
2486
|
-
case
|
|
2582
|
+
case "toggle":
|
|
2487
2583
|
return (h(Host, null, h("hy-filter-visibility-tool-toggle", null)));
|
|
2488
|
-
case
|
|
2584
|
+
case "reset":
|
|
2489
2585
|
return (h(Host, null, h("hy-filter-visibility-tool-reset", null)));
|
|
2490
2586
|
}
|
|
2491
2587
|
}
|
|
@@ -2497,7 +2593,7 @@ const HyFilterVisibilityToolReset = class {
|
|
|
2497
2593
|
registerInstance(this, hostRef);
|
|
2498
2594
|
}
|
|
2499
2595
|
render() {
|
|
2500
|
-
return (h("button", { class: "hy-filter-visibility-tool hy-filter-visibility-tool--reset", type: "button" }, h("hy-icon", { class: "hy-filter-visibility-tool__icon", icon:
|
|
2596
|
+
return (h("button", { class: "hy-filter-visibility-tool hy-filter-visibility-tool--reset", type: "button" }, h("hy-icon", { class: "hy-filter-visibility-tool__icon", icon: "hy-icon-remove", size: 14, "aria-hidden": "true" }), "Reset filters"));
|
|
2501
2597
|
}
|
|
2502
2598
|
};
|
|
2503
2599
|
|
|
@@ -2506,7 +2602,7 @@ const HyFilterVisibilityToolToggle = class {
|
|
|
2506
2602
|
registerInstance(this, hostRef);
|
|
2507
2603
|
}
|
|
2508
2604
|
render() {
|
|
2509
|
-
return (h(Host, null, h("button", { class: "hy-filter-visibility-tool hy-filter-visibility-tool--show-more", type: "button" }, h("hy-icon", { class: "hy-filter-visibility-tool__icon", icon:
|
|
2605
|
+
return (h(Host, null, h("button", { class: "hy-filter-visibility-tool hy-filter-visibility-tool--show-more", type: "button" }, h("hy-icon", { class: "hy-filter-visibility-tool__icon", icon: "hy-icon-plus", size: 12, "aria-hidden": "true" }), "Show more filters"), h("button", { class: "hy-filter-visibility-tool hy-filter-visibility-tool--show-less", type: "button" }, h("hy-icon", { class: "hy-filter-visibility-tool__icon", icon: "hy-icon-minus", size: 12, "aria-hidden": "true" }), "Show less filters")));
|
|
2510
2606
|
}
|
|
2511
2607
|
};
|
|
2512
2608
|
|
|
@@ -2517,8 +2613,8 @@ const HyFooter = class {
|
|
|
2517
2613
|
registerInstance(this, hostRef);
|
|
2518
2614
|
}
|
|
2519
2615
|
render() {
|
|
2520
|
-
const classAttributes = [
|
|
2521
|
-
return (h("footer", { class: classAttributes.join(
|
|
2616
|
+
const classAttributes = ["hy-footer"];
|
|
2617
|
+
return (h("footer", { class: classAttributes.join(" ") }, h("slot", null)));
|
|
2522
2618
|
}
|
|
2523
2619
|
};
|
|
2524
2620
|
HyFooter.style = hyFooterCss;
|
|
@@ -2536,15 +2632,15 @@ const HyFooterAction = class {
|
|
|
2536
2632
|
clearTimeout(scrollTimeout$1);
|
|
2537
2633
|
}
|
|
2538
2634
|
scrollTop() {
|
|
2539
|
-
const hyLogo = document.querySelector(
|
|
2540
|
-
window.scrollTo({ top: 0, behavior:
|
|
2635
|
+
const hyLogo = document.querySelector(".hy-site-logo a");
|
|
2636
|
+
window.scrollTo({ top: 0, behavior: "smooth" });
|
|
2541
2637
|
scrollTimeout$1 = window.setTimeout(() => {
|
|
2542
2638
|
hyLogo.focus();
|
|
2543
2639
|
}, 500);
|
|
2544
2640
|
}
|
|
2545
2641
|
render() {
|
|
2546
|
-
const classAttributes = [
|
|
2547
|
-
return (h(Host, { class: classAttributes }, h("span", { class:
|
|
2642
|
+
const classAttributes = ["hy-footer-action"].join(" ");
|
|
2643
|
+
return (h(Host, { class: classAttributes }, h("span", { class: "hy-footer-action__updated-text" }, this.updatedText), this.upButtonLabel && (h("span", { class: "hy-footer-action__scroll-up" }, h("label", { id: "up-label", htmlFor: "scroll-up" }, this.upButtonLabel), h("button", { name: "scroll-up", "aria-labelledby": "up-label", onClick: () => this.scrollTop(), class: "hy-footer-action__up-button", type: "button" }, h("hy-icon", { class: "hy-footer-action__up-icon", icon: "hy-icon-arrow-up", size: 26 }))))));
|
|
2548
2644
|
}
|
|
2549
2645
|
};
|
|
2550
2646
|
HyFooterAction.style = hyFooterActionCss;
|
|
@@ -2569,7 +2665,7 @@ const HyFooterBase = class {
|
|
|
2569
2665
|
}
|
|
2570
2666
|
render() {
|
|
2571
2667
|
const logoColor = ColorVariant.white;
|
|
2572
|
-
const classAttributes = [
|
|
2668
|
+
const classAttributes = ["hy-footer-base--content-container"].join(" ");
|
|
2573
2669
|
const links = this._dataFooterBaseLinks;
|
|
2574
2670
|
const some = this._dataFooterBaseSome;
|
|
2575
2671
|
return (h(Host, { class: classAttributes }, h("div", { class: "hy-footer-base" }, h("div", { class: "hy-footer-base__left" }, h("div", { class: "hy-footer-base__logo" }, h("hy-site-logo", { type: FooterVariant.footer, size: 56, color: logoColor, url: this.logoUrl, label: this.logoLabel })), h("div", { class: "hy-footer-base__content" }, h("slot", { name: "content" })), h("div", { class: "hy-footer-base__some" }, h("span", { class: "hy-footer-base__some__label" }, this.someLabel), h("div", { class: "hy-footer-base__some__items" }, some &&
|
|
@@ -3590,37 +3686,37 @@ const HyFooterInfo = class {
|
|
|
3590
3686
|
const luomusFooterContentItems = this._dataLuomusFooterContent;
|
|
3591
3687
|
const variant = this.isGroup ? FooterLinkVariants.group : FooterLinkVariants.campus;
|
|
3592
3688
|
const section = this.isGroup ? HeadingSectionVariants.groupFooterInfo : HeadingSectionVariants.defaultFooterInfo;
|
|
3593
|
-
const footerLinkItemClass = this.isGroup ?
|
|
3689
|
+
const footerLinkItemClass = this.isGroup ? "group" : "campus";
|
|
3594
3690
|
const scLabel = this.linkScLabel && this.linkScLabel.length > 0 ? this.linkScLabel : this.linkText;
|
|
3595
3691
|
const logoColor = ColorVariant.white;
|
|
3596
3692
|
const linksColor = this.isLuomusGroup ? FooterLinkItemColor.white : FooterLinkItemColor.black;
|
|
3597
3693
|
return (h(Host, { class: {
|
|
3598
|
-
|
|
3694
|
+
"hy-footer-info": true,
|
|
3599
3695
|
luomus: this.isLuomusGroup,
|
|
3600
3696
|
} }, h("div", { class: {
|
|
3601
|
-
|
|
3602
|
-
|
|
3603
|
-
} }, !this.isLuomusGroup && (h("hy-heading", { heading: HeadingVarians.h2, section: section }, this.textTitle)), this.isLuomusGroup && (h("div", { class: "hy-footer-info__logo" }, h("hy-site-logo", { type: FooterVariant.footer, isGroup: this.isGroup, size: 56, color: logoColor, url: this.logoUrl, label: this.logoLabel }))), this.isLuomusGroup && (h("div", { class:
|
|
3604
|
-
|
|
3605
|
-
|
|
3697
|
+
"hy-footer-info__content": true,
|
|
3698
|
+
"is-group": this.isGroup,
|
|
3699
|
+
} }, !this.isLuomusGroup && (h("hy-heading", { heading: HeadingVarians.h2, section: section }, this.textTitle)), this.isLuomusGroup && (h("div", { class: "hy-footer-info__logo" }, h("hy-site-logo", { type: FooterVariant.footer, isGroup: this.isGroup, size: 56, color: logoColor, url: this.logoUrl, label: this.logoLabel }))), this.isLuomusGroup && (h("div", { class: "hy-footer-info__branding" }, h("a", { href: this.groupLogoUrl }, h("img", { src: this.groupLogoUrl, alt: "Luomus logo" })))), !this.isLuomusGroup && (h("div", { class: {
|
|
3700
|
+
"hy-footer-info__ingress": true,
|
|
3701
|
+
"is-group": this.isGroup,
|
|
3606
3702
|
}, innerHTML: this.textDescription })), !this.isLuomusGroup && this.linkUrl && (h("hy-cta-button", { "link-content": this.linkText, "sc-label": scLabel, "is-external": this.linkIsExternal, url: this.linkUrl, variant: CtaLinkButtonVariants.onWhiteBkgd })), this.isLuomusGroup &&
|
|
3607
3703
|
luomusFooterContentItems &&
|
|
3608
3704
|
luomusFooterContentItems.map((item) => {
|
|
3609
3705
|
return (h("div", { class: "luomus-footer-content" }, h("a", { href: item.url, class: "luomus-footer-content__link" }, item.heading), item.content && h("div", { class: "luomus-footer-content__description", innerHTML: item.content })));
|
|
3610
3706
|
})), this.isMobile && this.isGroup === false ? (h("div", { class: {
|
|
3611
|
-
|
|
3612
|
-
|
|
3707
|
+
"hy-footer-info__links": true,
|
|
3708
|
+
"is-group": this.isGroup,
|
|
3613
3709
|
luomus: this.isLuomusGroup,
|
|
3614
|
-
} }, h("hy-accordion-container", { accordionid:
|
|
3710
|
+
} }, h("hy-accordion-container", { accordionid: "test" }, links &&
|
|
3615
3711
|
links.map((link) => {
|
|
3616
3712
|
return (h("hy-accordion-item", { accordiontitle: link.label }, h("hy-footer-link-item", { class: footerLinkItemClass, variant: variant, color: linksColor, label: link.label, url: link.url, "main-link": link.mainlink, items: link.items, isMobile: this.isMobile })));
|
|
3617
3713
|
})))) : (h("div", { class: {
|
|
3618
|
-
|
|
3619
|
-
|
|
3714
|
+
"hy-footer-info__links": true,
|
|
3715
|
+
"is-group": this.isGroup,
|
|
3620
3716
|
luomus: this.isLuomusGroup,
|
|
3621
3717
|
} }, links &&
|
|
3622
3718
|
links.map((link) => {
|
|
3623
|
-
const external_link = link.isExternal ===
|
|
3719
|
+
const external_link = link.isExternal === "external";
|
|
3624
3720
|
return (h("hy-footer-link-item", { "is-luomus-group": this.isLuomusGroup, class: footerLinkItemClass, variant: variant, color: linksColor, label: link.label, url: link.url, "is-external": external_link, "main-link": link.mainlink, items: link.items, isMobile: this.isMobile }));
|
|
3625
3721
|
})))));
|
|
3626
3722
|
}
|
|
@@ -3645,43 +3741,43 @@ const HyFooterLinkItem = class {
|
|
|
3645
3741
|
}
|
|
3646
3742
|
render() {
|
|
3647
3743
|
const containerClassAttributes = [
|
|
3648
|
-
|
|
3744
|
+
"hy-footer-link-item--container",
|
|
3649
3745
|
`hy-footer-link-item__${this.variant}`,
|
|
3650
|
-
this.items &&
|
|
3651
|
-
].join(
|
|
3746
|
+
this.items && "hy-footer-link-item__has-children",
|
|
3747
|
+
].join(" ");
|
|
3652
3748
|
const classAttributes = [
|
|
3653
|
-
|
|
3654
|
-
this.mainLink &&
|
|
3749
|
+
"hy-footer-link-item",
|
|
3750
|
+
this.mainLink && "hy-footer-link-item__main",
|
|
3655
3751
|
`hy-footer-link-item__color-${this.color}`,
|
|
3656
|
-
].join(
|
|
3752
|
+
].join(" ");
|
|
3657
3753
|
const headingClassAttributes = [
|
|
3658
|
-
|
|
3659
|
-
|
|
3660
|
-
this.mainLink &&
|
|
3754
|
+
"hy-footer-link-item",
|
|
3755
|
+
"hy-footer-link-item__heading",
|
|
3756
|
+
this.mainLink && "hy-footer-link-item__main",
|
|
3661
3757
|
`hy-footer-link-item__heading__color-${this.color}`,
|
|
3662
|
-
].join(
|
|
3758
|
+
].join(" ");
|
|
3663
3759
|
const linkClassAttributes = [
|
|
3664
|
-
|
|
3760
|
+
"hy-footer-link-item",
|
|
3665
3761
|
`hy-footer-link-item__color-${this.color}`,
|
|
3666
|
-
this.isLuomusGroup ? `luomus` :
|
|
3667
|
-
].join(
|
|
3762
|
+
this.isLuomusGroup ? `luomus` : "",
|
|
3763
|
+
].join(" ");
|
|
3668
3764
|
if (this.items) {
|
|
3669
3765
|
if (this.isMobile && this.variant !== FooterLinkVariants.group) {
|
|
3670
3766
|
return (h("div", { class: containerClassAttributes }, this.items.map((item) => {
|
|
3671
|
-
const target = item.isExternal ===
|
|
3672
|
-
return (h("a", { class: linkClassAttributes, href: item.url, target: target, style: { color: this.color } }, item.label, h("hy-icon", { class:
|
|
3767
|
+
const target = item.isExternal === "external" ? "_blank" : "_self";
|
|
3768
|
+
return (h("a", { class: linkClassAttributes, href: item.url, target: target, style: { color: this.color } }, item.label, h("hy-icon", { class: "hy-footer-link-item__icon", icon: "hy-icon-arrow-right", size: 16 })));
|
|
3673
3769
|
})));
|
|
3674
3770
|
}
|
|
3675
3771
|
else {
|
|
3676
|
-
return (h("div", { class: containerClassAttributes }, h("hy-heading", { class: headingClassAttributes, heading: HeadingVarians.h3 }, this.url.length > 0 && (h("a", { class:
|
|
3677
|
-
const target = item.isExternal ===
|
|
3678
|
-
return (h("a", { class: linkClassAttributes, href: item.url, target: target, style: { color: this.color } }, item.label, h("hy-icon", { class:
|
|
3772
|
+
return (h("div", { class: containerClassAttributes }, h("hy-heading", { class: headingClassAttributes, heading: HeadingVarians.h3 }, this.url.length > 0 && (h("a", { class: "hy-footer-link-item__link", href: this.url, style: { color: this.color } }, this.label)), this.url.length == 0 && h("div", { class: "hy-footer-link-item__link" }, this.label)), this.items.map((item) => {
|
|
3773
|
+
const target = item.isExternal === "external" ? "_blank" : "_self";
|
|
3774
|
+
return (h("a", { class: linkClassAttributes, href: item.url, target: target, style: { color: this.color } }, item.label, h("hy-icon", { class: "hy-footer-link-item__icon", icon: "hy-icon-arrow-right", size: 16 })));
|
|
3679
3775
|
})));
|
|
3680
3776
|
}
|
|
3681
3777
|
}
|
|
3682
3778
|
else {
|
|
3683
|
-
const target = this.isExternal ?
|
|
3684
|
-
return (h("a", { class: classAttributes, href: this.url, style: { color: this.color }, target: target }, this.label, h("hy-icon", { class:
|
|
3779
|
+
const target = this.isExternal ? "_blank" : "_self";
|
|
3780
|
+
return (h("a", { class: classAttributes, href: this.url, style: { color: this.color }, target: target }, this.label, h("hy-icon", { class: "hy-footer-link-item__icon", icon: "hy-icon-arrow-right", size: 16 })));
|
|
3685
3781
|
}
|
|
3686
3782
|
}
|
|
3687
3783
|
};
|
|
@@ -3701,9 +3797,9 @@ const HyGeneralList = class {
|
|
|
3701
3797
|
}
|
|
3702
3798
|
async componentWillLoad() {
|
|
3703
3799
|
this._dataItems = await jsonParserWorker(this.dataItems);
|
|
3704
|
-
const hyMainDiv = this.el.closest(
|
|
3800
|
+
const hyMainDiv = this.el.closest(".hy-main");
|
|
3705
3801
|
if (hyMainDiv) {
|
|
3706
|
-
if (hyMainDiv.classList.contains(
|
|
3802
|
+
if (hyMainDiv.classList.contains("with-sidebar")) {
|
|
3707
3803
|
this.hasSidebar = true;
|
|
3708
3804
|
}
|
|
3709
3805
|
}
|
|
@@ -3715,16 +3811,16 @@ const HyGeneralList = class {
|
|
|
3715
3811
|
}
|
|
3716
3812
|
render() {
|
|
3717
3813
|
const classAttributes = [
|
|
3718
|
-
|
|
3719
|
-
this.hasSidebar ?
|
|
3814
|
+
"hy-general-list",
|
|
3815
|
+
this.hasSidebar ? "hy-general-list--with-sidebar" : "",
|
|
3720
3816
|
`hy-general-list--style-${this.type}`,
|
|
3721
|
-
].join(
|
|
3817
|
+
].join(" ");
|
|
3722
3818
|
let listData = this._dataItems;
|
|
3723
|
-
if (typeof this._dataItems ===
|
|
3819
|
+
if (typeof this._dataItems === "object") {
|
|
3724
3820
|
listData = Object.values(this._dataItems);
|
|
3725
3821
|
}
|
|
3726
3822
|
function truncate(str, n) {
|
|
3727
|
-
return str.length > n ? str.substr(0, n - 1) +
|
|
3823
|
+
return str.length > n ? str.substr(0, n - 1) + "..." : str;
|
|
3728
3824
|
}
|
|
3729
3825
|
return (h(Host, null, h("ul", { class: classAttributes }, listData &&
|
|
3730
3826
|
listData.map((item) => (h("li", null, h("hy-general-list-item", { "has-sidebar": this.hasSidebar, target: this.blank, "data-location": item.url, description: this.truncateDescription ? truncate(item.description, this.truncateLimit) : item.description, id: item.id, imageAlt: item.imageAlt, imageUrl: item.imageUrl, "item-title": item.title, label: item.label, "sub-label": item.subLabel, tag: item.tag, date: item.date, type: item.type, url: item.url, "list-style": this.type }))))), h("hy-box", { mb: "1.75, 1.75, 2, 2.5" })));
|
|
@@ -3743,41 +3839,90 @@ const HyGeneralListItem = class {
|
|
|
3743
3839
|
registerInstance(this, hostRef);
|
|
3744
3840
|
this.hasSidebar = true;
|
|
3745
3841
|
this.description = undefined;
|
|
3746
|
-
this.imageAlt =
|
|
3842
|
+
this.imageAlt = "";
|
|
3747
3843
|
this.imageUrl = null;
|
|
3748
3844
|
this.disableLazy = false;
|
|
3749
3845
|
this.itemTitle = undefined;
|
|
3750
3846
|
this.label = undefined;
|
|
3751
|
-
this.subLabel =
|
|
3752
|
-
this.date =
|
|
3753
|
-
this.tag =
|
|
3847
|
+
this.subLabel = "";
|
|
3848
|
+
this.date = "";
|
|
3849
|
+
this.tag = "";
|
|
3754
3850
|
this.type = undefined;
|
|
3755
3851
|
this.url = undefined;
|
|
3756
3852
|
this.listStyle = undefined;
|
|
3757
3853
|
this.target = true;
|
|
3758
3854
|
}
|
|
3759
3855
|
render() {
|
|
3760
|
-
const classAttributes = [
|
|
3761
|
-
const contentClassAttributes = [
|
|
3762
|
-
const imageClassAttributes = [
|
|
3763
|
-
const sidebarClass = this.hasSidebar ?
|
|
3764
|
-
const titleClassAttributes = [
|
|
3856
|
+
const classAttributes = ["hy-general-list-item", `hy-general-list-item--style-${this.listStyle}`].join(" ");
|
|
3857
|
+
const contentClassAttributes = ["hy-general-list-item__text-container"].join(" ");
|
|
3858
|
+
const imageClassAttributes = ["hy-general-list-item__image-container"].join(" ");
|
|
3859
|
+
const sidebarClass = this.hasSidebar ? "common" : "large";
|
|
3860
|
+
const titleClassAttributes = ["hy-general-list-item__title", `hy-general-list-item__title__${sidebarClass}`].join(" ");
|
|
3765
3861
|
const descriptionClassAttributes = [
|
|
3766
|
-
|
|
3862
|
+
"hy-general-list-item__description",
|
|
3767
3863
|
`hy-general-list-item__description__${sidebarClass}`,
|
|
3768
|
-
].join(
|
|
3864
|
+
].join(" ");
|
|
3769
3865
|
const aspectRatioWidth = 16;
|
|
3770
3866
|
const aspectRatioHeight = 10;
|
|
3771
3867
|
const aspect = (aspectRatioHeight / aspectRatioWidth) * 100;
|
|
3772
3868
|
const aspectRatio = {
|
|
3773
|
-
|
|
3869
|
+
"--aspectRatio": `${aspect}%`,
|
|
3774
3870
|
};
|
|
3775
|
-
return (h("article", { class: classAttributes }, h("a", { class: "hy-general-list-item__link", href: this.url, target: this.target ?
|
|
3871
|
+
return (h("article", { class: classAttributes }, h("a", { class: "hy-general-list-item__link", href: this.url, target: this.target ? "_blank" : "_self" }, this.type && (h("div", { class: "hy-general-list-item__type" }, h("span", { class: "hy-general-list-item__type__major" }, this.label), h("span", { class: "hy-general-list-item__type__sub" }, this.subLabel))), this.imageUrl && (h("figure", { class: imageClassAttributes, style: aspectRatio }, h("img", { loading: this.disableLazy ? "eager" : "lazy", alt: this.imageAlt, class: "hy-general-list-item__image", src: this.imageUrl }))), h("div", { class: contentClassAttributes }, (this.tag || this.date) && (h("span", { class: "hy-genenral-list-item__meta" }, this.tag, h("span", { class: "hy-genenral-list-item__meta__date" }, this.tag && "|", " ", this.date))), h("h3", { class: titleClassAttributes }, this.itemTitle), h("p", { class: descriptionClassAttributes }, this.description)))));
|
|
3776
3872
|
}
|
|
3777
3873
|
get el() { return getElement(this); }
|
|
3778
3874
|
};
|
|
3779
3875
|
HyGeneralListItem.style = hyGeneralListItemCss;
|
|
3780
3876
|
|
|
3877
|
+
const gridContainerCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand-main-bright:#48c5f8;--brand-main-light:#107eab;--brand-main-active:#005379;--brand-main-dark:#003146;--brand-main-nearly-black:#000222;--link-blue:#0479a4;--link-disabled:#767676;--grayscale-white:#fff;--grayscale-slightly-gray:#fefefe;--grayscale-light:#f8f8f8;--grayscale-medium:#d2d2d2;--grayscale-background-box:#f5f5f5;--grayscale-tabs-border:#e6e6e6;--grayscale-background-arrow:#dfdfdf;--grayscale-medium-dark:#979797;--grayscale-dark:#555555;--grayscale-dark-text:#222222;--grayscale-black:#000000;--additional-red-light:#e5053a;--additional-red-dark:#a31621;--additional-purple-light:#420039;--additional-yellow-light:#f9a21a;--additional-yellow:#c47f1b;--additional-skyblue:#48c5f8;--additional-orange:#d14600;--additional-green-light:#96ba3c;--additional-green-dark:#006400;--hover-gray:#eaeaea}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{--gutter-mobile:16px;--gutter-narrow:24px;--gutter-medium:24px;--gutter-wide:24px;--gutter-extrawide:32px}:root{--breakpoint-extrawide:75.0625rem;--breakpoint-max-width:75.0625rem;--breakpoint-medium:48rem;--breakpoint-narrow:30rem;--breakpoint-wide:60rem}:host{display:block}.hy-grid--container{display:block;width:100%;margin-left:auto;margin-right:auto}@media only screen and (min-width: 30rem){.hy-grid--container{width:100%}}@media only screen and (min-width: 60rem){.hy-grid--container{width:100%;max-width:60rem}}@media only screen and (min-width: 75.0625rem){.hy-grid--container{width:100%;max-width:75rem}}@media only screen and (min-width: 1601px){.hy-grid--container{width:100%;max-width:90rem}}";
|
|
3878
|
+
|
|
3879
|
+
const GridContainer = class {
|
|
3880
|
+
constructor(hostRef) {
|
|
3881
|
+
registerInstance(this, hostRef);
|
|
3882
|
+
}
|
|
3883
|
+
render() {
|
|
3884
|
+
const classAttributes = ["hy-grid--container"];
|
|
3885
|
+
return (h("div", { class: classAttributes.join(" ") }, h("slot", null)));
|
|
3886
|
+
}
|
|
3887
|
+
};
|
|
3888
|
+
GridContainer.style = gridContainerCss;
|
|
3889
|
+
|
|
3890
|
+
const gridItemCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand-main-bright:#48c5f8;--brand-main-light:#107eab;--brand-main-active:#005379;--brand-main-dark:#003146;--brand-main-nearly-black:#000222;--link-blue:#0479a4;--link-disabled:#767676;--grayscale-white:#fff;--grayscale-slightly-gray:#fefefe;--grayscale-light:#f8f8f8;--grayscale-medium:#d2d2d2;--grayscale-background-box:#f5f5f5;--grayscale-tabs-border:#e6e6e6;--grayscale-background-arrow:#dfdfdf;--grayscale-medium-dark:#979797;--grayscale-dark:#555555;--grayscale-dark-text:#222222;--grayscale-black:#000000;--additional-red-light:#e5053a;--additional-red-dark:#a31621;--additional-purple-light:#420039;--additional-yellow-light:#f9a21a;--additional-yellow:#c47f1b;--additional-skyblue:#48c5f8;--additional-orange:#d14600;--additional-green-light:#96ba3c;--additional-green-dark:#006400;--hover-gray:#eaeaea}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{--gutter-mobile:16px;--gutter-narrow:24px;--gutter-medium:24px;--gutter-wide:24px;--gutter-extrawide:32px}:root{--breakpoint-extrawide:75.0625rem;--breakpoint-max-width:75.0625rem;--breakpoint-medium:48rem;--breakpoint-narrow:30rem;--breakpoint-wide:60rem}:host{display:block}.hy-grid-align__left{text-align:left}.hy-grid-align__right{text-align:right}.hy-grid-align__center{text-align:center;margin-left:auto;margin-right:auto}.hy-grid-justify{text-align:justify}.hy-grid-hidden-sm{display:none}.hy-grid__col-1,.hy-grid__col-2,.hy-grid__col-3,.hy-grid__col-4,.hy-grid__col-5,.hy-grid__col-6,.hy-grid__col-7,.hy-grid__col-8,.hy-grid__col-9,.hy-grid__col-10,.hy-grid__col-11,.hy-grid__col-12{width:98%}.hy-grid__col-1-sm{width:6.3333333333%}.hy-grid__col-2-sm{width:14.6666666667%}.hy-grid__col-3-sm{width:23%}.hy-grid__col-4-sm{width:31.3333333333%}.hy-grid__col-5-sm{width:39.6666666667%}.hy-grid__col-6-sm{width:48%}.hy-grid__col-7-sm{width:56.3333333333%}.hy-grid__col-8-sm{width:64.6666666667%}.hy-grid__col-9-sm{width:73%}.hy-grid__col-10-sm{width:81.3333333333%}.hy-grid__col-11-sm{width:89.6666666667%}.hy-grid__col-12-sm{width:98%}@media only screen and (min-width: 48em){.hy-grid__col-1{width:6.3333333333%}.hy-grid__col-2{width:14.6666666667%}.hy-grid__col-3{width:23%}.hy-grid__col-4{width:31.3333333333%}.hy-grid__col-5{width:39.6666666667%}.hy-grid__col-6{width:48%}.hy-grid__col-7{width:56.3333333333%}.hy-grid__col-8{width:64.6666666667%}.hy-grid__col-9{width:73%}.hy-grid__col-10{width:81.3333333333%}.hy-grid__col-11{width:89.6666666667%}.hy-grid__col-12{width:98%}.hidden-sm{display:block}}@media only screen and (min-width: 60em){.hy-grid__col-1-lg{width:6.3333333333%}.hy-grid__col-2-lg{width:14.6666666667%}.hy-grid__col-3-lg{width:23%}.hy-grid__col-4-lg{width:31.3333333333%}.hy-grid__col-5-lg{width:39.6666666667%}.hy-grid__col-6-lg{width:48%}.hy-grid__col-7-lg{width:56.3333333333%}.hy-grid__col-8-lg{width:64.6666666667%}.hy-grid__col-9-lg{width:73%}.hy-grid__col-10-lg{width:81.3333333333%}.hy-grid__col-11-lg{width:89.6666666667%}.hy-grid__col-12-lg{width:98%}}";
|
|
3891
|
+
|
|
3892
|
+
const GridItem = class {
|
|
3893
|
+
constructor(hostRef) {
|
|
3894
|
+
registerInstance(this, hostRef);
|
|
3895
|
+
this.columns = GridColumns.default;
|
|
3896
|
+
this.columnssm = GridColumnsSm.default;
|
|
3897
|
+
this.columnslg = GridColumnsLg.default;
|
|
3898
|
+
this.contentalign = GridAlignVariants.default;
|
|
3899
|
+
}
|
|
3900
|
+
render() {
|
|
3901
|
+
const classAttributes = [
|
|
3902
|
+
"hy-grid-item",
|
|
3903
|
+
`hy-grid__col-${this.columnssm}-sm`,
|
|
3904
|
+
`hy-grid__col-${this.columns}`,
|
|
3905
|
+
`hy-grid__col-${this.columnslg}-lg`,
|
|
3906
|
+
`hy-grid-align__${this.contentalign}`,
|
|
3907
|
+
];
|
|
3908
|
+
return (h(Host, { class: classAttributes.join(" ") }, h("slot", null)));
|
|
3909
|
+
}
|
|
3910
|
+
};
|
|
3911
|
+
GridItem.style = gridItemCss;
|
|
3912
|
+
|
|
3913
|
+
const gridRowCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand-main-bright:#48c5f8;--brand-main-light:#107eab;--brand-main-active:#005379;--brand-main-dark:#003146;--brand-main-nearly-black:#000222;--link-blue:#0479a4;--link-disabled:#767676;--grayscale-white:#fff;--grayscale-slightly-gray:#fefefe;--grayscale-light:#f8f8f8;--grayscale-medium:#d2d2d2;--grayscale-background-box:#f5f5f5;--grayscale-tabs-border:#e6e6e6;--grayscale-background-arrow:#dfdfdf;--grayscale-medium-dark:#979797;--grayscale-dark:#555555;--grayscale-dark-text:#222222;--grayscale-black:#000000;--additional-red-light:#e5053a;--additional-red-dark:#a31621;--additional-purple-light:#420039;--additional-yellow-light:#f9a21a;--additional-yellow:#c47f1b;--additional-skyblue:#48c5f8;--additional-orange:#d14600;--additional-green-light:#96ba3c;--additional-green-dark:#006400;--hover-gray:#eaeaea}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{--gutter-mobile:16px;--gutter-narrow:24px;--gutter-medium:24px;--gutter-wide:24px;--gutter-extrawide:32px}:root{--breakpoint-extrawide:75.0625rem;--breakpoint-max-width:75.0625rem;--breakpoint-medium:48rem;--breakpoint-narrow:30rem;--breakpoint-wide:60rem}:host{display:block}.hy-grid__row{-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;position:relative;width:100%}.hy-grid__row>[class^=hy-grid-item]{float:left;margin:0.5rem 1%;min-height:0.125rem}@media (min-width: 30rem){.hy-grid__row>[class^=hy-grid-item]{margin:1%}}.hy-grid__row::after{content:\"\";display:table;clear:both}";
|
|
3914
|
+
|
|
3915
|
+
const GridRow = class {
|
|
3916
|
+
constructor(hostRef) {
|
|
3917
|
+
registerInstance(this, hostRef);
|
|
3918
|
+
}
|
|
3919
|
+
render() {
|
|
3920
|
+
const classAttributes = ["hy-grid__row"];
|
|
3921
|
+
return (h(Host, { class: classAttributes.join(" ") }, h("slot", null)));
|
|
3922
|
+
}
|
|
3923
|
+
};
|
|
3924
|
+
GridRow.style = gridRowCss;
|
|
3925
|
+
|
|
3781
3926
|
const defaultHeadingCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand-main-bright:#48c5f8;--brand-main-light:#107eab;--brand-main-active:#005379;--brand-main-dark:#003146;--brand-main-nearly-black:#000222;--link-blue:#0479a4;--link-disabled:#767676;--grayscale-white:#fff;--grayscale-slightly-gray:#fefefe;--grayscale-light:#f8f8f8;--grayscale-medium:#d2d2d2;--grayscale-background-box:#f5f5f5;--grayscale-tabs-border:#e6e6e6;--grayscale-background-arrow:#dfdfdf;--grayscale-medium-dark:#979797;--grayscale-dark:#555555;--grayscale-dark-text:#222222;--grayscale-black:#000000;--additional-red-light:#e5053a;--additional-red-dark:#a31621;--additional-purple-light:#420039;--additional-yellow-light:#f9a21a;--additional-yellow:#c47f1b;--additional-skyblue:#48c5f8;--additional-orange:#d14600;--additional-green-light:#96ba3c;--additional-green-dark:#006400;--hover-gray:#eaeaea}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{--gutter-mobile:16px;--gutter-narrow:24px;--gutter-medium:24px;--gutter-wide:24px;--gutter-extrawide:32px}:root{--breakpoint-extrawide:75.0625rem;--breakpoint-max-width:75.0625rem;--breakpoint-medium:48rem;--breakpoint-narrow:30rem;--breakpoint-wide:60rem}:host{display:block}.hy-heading__container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse;width:100%}@media (min-width: 30rem){.hy-heading__container{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}}.hy-heading__container__subsection{padding:2.5rem 0 1.375rem}@media (min-width: 30rem){.hy-heading__container__subsection{padding:4rem 0 2.375rem}}.hy-heading__container h1.hy-heading__default{margin-bottom:12px}@media (min-width: 1601px){.hy-heading__container h1.hy-heading__default{margin-bottom:16px}}@media (min-width: 75.0625rem){.hy-heading__container h1.hy-heading__default__large{margin-bottom:16px}}.hy-heading__container h1.hy-heading__search{margin-bottom:0;padding:16px 0 0}@media (min-width: 30rem){.hy-heading__container h1.hy-heading__search{padding:28px 0 0}}@media (min-width: 60rem){.hy-heading__container h1.hy-heading__search{padding:32px 0 0}}@media (min-width: 75.0625rem){.hy-heading__container h1.hy-heading__search__large{padding:40px 0 0}}.hy-heading__container h2,.hy-heading__container h3,.hy-heading__container h4,.hy-heading__container h5,.hy-heading__container h6{padding:1.5rem 0 1rem}@media (min-width: 30rem){.hy-heading__container h2,.hy-heading__container h3,.hy-heading__container h4,.hy-heading__container h5,.hy-heading__container h6{padding:2rem 0 1rem}}.hy-heading__container.hy-heading__introduction{padding-top:0}.hy-heading__container .hy-heading__courses{padding-top:0}.hy-heading{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-negative:0;flex-shrink:0;max-width:100%;width:auto}.hy-heading__subsection--divider,.hy-heading__contentsection--divider{-ms-flex-negative:2;flex-shrink:2;overflow:hidden;width:100%}.hy-heading__subsection--divider:after,.hy-heading__contentsection--divider:after{background-color:transparent;border-bottom:6px solid var(--grayscale-dark);content:\" \";display:-webkit-box;display:-ms-flexbox;display:flex;height:2px;width:100%;margin-left:0;margin-bottom:0.5rem;position:relative;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}@media (min-width: 30rem){.hy-heading__subsection--divider:after,.hy-heading__contentsection--divider:after{margin-left:2rem;border-bottom:1px solid var(--grayscale-dark);margin-bottom:1rem}}h2.hy-heading__introduction,h2.hy-heading__landingsection{font-size:1.75rem;line-height:32px;font-weight:700;letter-spacing:-0.7px;text-transform:uppercase}h1.hy-heading__hero{font-size:2rem;line-height:38px;font-weight:700;color:var(--grayscale-black);font-family:var(--main-font-family);letter-spacing:-0.8px;margin-bottom:0}@media (min-width: 1024px){h1.hy-heading__hero{font-size:2.875rem;line-height:54px;letter-spacing:-1.15px}}@media (min-width: 1601px){h1.hy-heading__hero{font-size:3.25rem;line-height:60px;letter-spacing:-1.3px}}@media (min-width: 30rem){.hy-heading__container__common h2.hy-heading__introduction,.hy-heading__container__common h2.hy-heading__landingsection{font-size:2.125rem;line-height:40px;letter-spacing:-0.85px}}@media (min-width: 1601px){.hy-heading__container__common h2.hy-heading__introduction,.hy-heading__container__common h2.hy-heading__landingsection{font-size:2.625rem;line-height:48px;letter-spacing:-1.05px}}.hy-heading__container__common h2.hy-heading__introduction{padding:0 0 12px}@media (min-width: 30rem){.hy-heading__container__common h2.hy-heading__introduction{padding:0 0 1rem}}.hy-heading__container__common h2.hy-heading__landingsection,.hy-heading__container__common h2.hy-heading__contentsection{padding-bottom:24px}@media (min-width: 30rem){.hy-heading__container__common h2.hy-heading__landingsection,.hy-heading__container__common h2.hy-heading__contentsection{padding-bottom:28px}}@media (min-width: 60rem){.hy-heading__container__common h2.hy-heading__landingsection,.hy-heading__container__common h2.hy-heading__contentsection{padding-bottom:32px}}@media (min-width: 75.0625rem){.hy-heading__container__common h2.hy-heading__landingsection,.hy-heading__container__common h2.hy-heading__contentsection{padding-bottom:32px}}@media (min-width: 1601px){.hy-heading__container__common h2.hy-heading__landingsection,.hy-heading__container__common h2.hy-heading__contentsection{padding-bottom:40px}}.hy-heading__container__common h2.hy-heading__group_footer_info{font-size:1.5rem;line-height:28px;font-weight:700;letter-spacing:-0.6px;text-transform:uppercase}@media (min-width: 30rem){.hy-heading__container__common h2.hy-heading__group_footer_info{letter-spacing:-0.8px}}@media (min-width: 1601px){.hy-heading__container__common h2.hy-heading__group_footer_info{font-size:1.625rem;line-height:30px}}.hy-heading__container__common h2.hy-heading__footer_info{font-size:1.75rem;line-height:32px;font-weight:700;letter-spacing:-0.7px;text-transform:uppercase}@media (min-width: 30rem){.hy-heading__container__common h2.hy-heading__footer_info{font-size:2.125rem;line-height:40px;letter-spacing:-0.85px}}@media (min-width: 1601px){.hy-heading__container__common h2.hy-heading__footer_info{font-size:2.625rem;line-height:48px;letter-spacing:-1.05px}}@media (min-width: 30rem){.hy-heading__container__large h2.hy-heading__introduction,.hy-heading__container__large h2.hy-heading__landingsection{font-size:2.125rem;line-height:40px;letter-spacing:-0.85px}}@media (min-width: 75.0625rem){.hy-heading__container__large h2.hy-heading__introduction,.hy-heading__container__large h2.hy-heading__landingsection{font-size:2.625rem;line-height:48px;letter-spacing:-1.05px}}@media (min-width: 75.0625rem){.hy-heading__container__large h2.hy-heading__introduction{padding:0 0 1rem}}@media (min-width: 1601px){.hy-heading__container__large h2.hy-heading__introduction{padding:0 0 20px}}.hy-heading__container__large h2.hy-heading__landingsection,.hy-heading__container__large h2.hy-heading__contentsection{padding-bottom:24px}@media (min-width: 30rem){.hy-heading__container__large h2.hy-heading__landingsection,.hy-heading__container__large h2.hy-heading__contentsection{padding-bottom:28px}}@media (min-width: 60rem){.hy-heading__container__large h2.hy-heading__landingsection,.hy-heading__container__large h2.hy-heading__contentsection{padding-bottom:32px}}@media (min-width: 75.0625rem){.hy-heading__container__large h2.hy-heading__landingsection,.hy-heading__container__large h2.hy-heading__contentsection{padding-bottom:40px}}@media (min-width: 75.0625rem){.hy-heading__container__large h1.hy-heading__landing_minor{font-size:3.25rem;line-height:60px;letter-spacing:-1.3px}}@media (min-width: 75.0625rem){.hy-heading__container__large h1.hy-heading__frontpage,.hy-heading__container__large h1.hy-heading__landing_major{font-size:3.5rem;line-height:64px;letter-spacing:-1.4px}}.hy-heading__container__large h2.hy-heading__group_footer_info{font-size:1.5rem;line-height:28px;font-weight:700;letter-spacing:-0.6px;text-transform:uppercase}@media (min-width: 30rem){.hy-heading__container__large h2.hy-heading__group_footer_info{letter-spacing:-0.8px}}@media (min-width: 75.0625rem){.hy-heading__container__large h2.hy-heading__group_footer_info{font-size:1.625rem;line-height:30px}}.hy-heading__container__large h2.hy-heading__footer_info{font-size:1.75rem;line-height:32px;font-weight:700;letter-spacing:-0.7px;text-transform:uppercase}@media (min-width: 30rem){.hy-heading__container__large h2.hy-heading__footer_info{font-size:2.125rem;line-height:40px;letter-spacing:-0.85px}}@media (min-width: 75.0625rem){.hy-heading__container__large h2.hy-heading__footer_info{font-size:2.625rem;line-height:48px;letter-spacing:-1.05px}}h3.hy-heading__landingsection{font-size:1.625rem;line-height:32px;letter-spacing:-0.8px}@media (min-width: 30rem){h3.hy-heading__landingsection{font-size:2rem;line-height:32px;letter-spacing:-1px}}@media (min-width: 75.0625rem){h3.hy-heading__landingsection{font-size:2.5rem;line-height:48px;letter-spacing:-1.2px}}@media (min-width: 1601px){h3.hy-heading__landingsection{font-size:2.5rem;line-height:48px;letter-spacing:-1.2px}}h1,h2,h3,h4,h5,h6{color:var(--brand-main-nearly-black);font-family:var(--main-font-family);font-weight:700;padding:0;margin:0;width:100%}h1.negative,h2.negative,h3.negative,h4.negative,h5.negative,h6.negative{color:var(--grayscale-white)}h1{font-size:2rem;line-height:38px;letter-spacing:-0.8px;text-transform:uppercase}@media (min-width: 30rem){h1{font-size:2.875rem;line-height:54px;letter-spacing:-1.15px}}@media (min-width: 1601px){h1{font-size:3.25rem;line-height:60px;letter-spacing:-1.3px}}@media (min-width: 75.0625rem){.hy-heading__container__large h1{font-size:3.25rem;line-height:60px;letter-spacing:-1.3px}}h2{font-size:1.625rem;line-height:32px;font-weight:700;letter-spacing:-0.52px}@media (min-width: 30rem){h2{font-size:1.875rem;line-height:36px;letter-spacing:-0.6px}}@media (min-width: 1601px){.hy-heading__container__common h2{font-size:2.125rem;line-height:40px;letter-spacing:-0.68px}}@media (min-width: 75.0625rem){.hy-heading__container__large h2{font-size:2.125rem;line-height:40px;letter-spacing:-0.68px}}h3{font-size:1.375rem;line-height:28px;letter-spacing:-0.7px}@media (min-width: 30rem){h3{font-size:1.625rem;line-height:32px;letter-spacing:-0.8px}}h4{font-size:1.125rem;line-height:24px;letter-spacing:-0.56px}@media (min-width: 30rem){h4{font-size:1.375rem;line-height:28px;letter-spacing:-0.69px}}h5{font-size:1rem;line-height:20px;letter-spacing:-0.5px}@media (min-width: 30rem){h5{font-size:1.125rem;line-height:24px;letter-spacing:-0.56px}}h6{font-size:0.875rem;line-height:16px;letter-spacing:-0.44px}@media (min-width: 30rem){h6{font-size:1rem;line-height:20px;letter-spacing:-0.5px}}";
|
|
3782
3927
|
|
|
3783
3928
|
const wideHeadingFwCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand-main-bright:#48c5f8;--brand-main-light:#107eab;--brand-main-active:#005379;--brand-main-dark:#003146;--brand-main-nearly-black:#000222;--link-blue:#0479a4;--link-disabled:#767676;--grayscale-white:#fff;--grayscale-slightly-gray:#fefefe;--grayscale-light:#f8f8f8;--grayscale-medium:#d2d2d2;--grayscale-background-box:#f5f5f5;--grayscale-tabs-border:#e6e6e6;--grayscale-background-arrow:#dfdfdf;--grayscale-medium-dark:#979797;--grayscale-dark:#555555;--grayscale-dark-text:#222222;--grayscale-black:#000000;--additional-red-light:#e5053a;--additional-red-dark:#a31621;--additional-purple-light:#420039;--additional-yellow-light:#f9a21a;--additional-yellow:#c47f1b;--additional-skyblue:#48c5f8;--additional-orange:#d14600;--additional-green-light:#96ba3c;--additional-green-dark:#006400;--hover-gray:#eaeaea}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{--gutter-mobile:16px;--gutter-narrow:24px;--gutter-medium:24px;--gutter-wide:24px;--gutter-extrawide:32px}:root{--breakpoint-extrawide:75.0625rem;--breakpoint-max-width:75.0625rem;--breakpoint-medium:48rem;--breakpoint-narrow:30rem;--breakpoint-wide:60rem}:host{display:block}.hy-heading__container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse;width:100%}@media (min-width: 30rem){.hy-heading__container{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}}.hy-heading__container__subsection{padding:2.5rem 0 1.375rem}@media (min-width: 30rem){.hy-heading__container__subsection{padding:4rem 0 2.375rem}}.hy-heading__container h1.hy-heading__default{margin-bottom:12px}@media (min-width: 1601px){.hy-heading__container h1.hy-heading__default{margin-bottom:16px}}@media (min-width: 75.0625rem){.hy-heading__container h1.hy-heading__default__large{margin-bottom:16px}}.hy-heading__container h1.hy-heading__search{margin-bottom:0;padding:16px 0 0}@media (min-width: 30rem){.hy-heading__container h1.hy-heading__search{padding:28px 0 0}}@media (min-width: 60rem){.hy-heading__container h1.hy-heading__search{padding:32px 0 0}}@media (min-width: 75.0625rem){.hy-heading__container h1.hy-heading__search__large{padding:40px 0 0}}.hy-heading__container h2,.hy-heading__container h3,.hy-heading__container h4,.hy-heading__container h5,.hy-heading__container h6{padding:1.5rem 0 1rem}@media (min-width: 30rem){.hy-heading__container h2,.hy-heading__container h3,.hy-heading__container h4,.hy-heading__container h5,.hy-heading__container h6{padding:2rem 0 1rem}}.hy-heading__container.hy-heading__introduction{padding-top:0}.hy-heading__container .hy-heading__courses{padding-top:0}.hy-heading{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-negative:0;flex-shrink:0;max-width:100%;width:auto}.hy-heading__subsection--divider,.hy-heading__contentsection--divider{-ms-flex-negative:2;flex-shrink:2;overflow:hidden;width:100%}.hy-heading__subsection--divider:after,.hy-heading__contentsection--divider:after{background-color:transparent;border-bottom:6px solid var(--grayscale-dark);content:\" \";display:-webkit-box;display:-ms-flexbox;display:flex;height:2px;width:100%;margin-left:0;margin-bottom:0.5rem;position:relative;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}@media (min-width: 30rem){.hy-heading__subsection--divider:after,.hy-heading__contentsection--divider:after{margin-left:2rem;border-bottom:1px solid var(--grayscale-dark);margin-bottom:1rem}}h2.hy-heading__introduction,h2.hy-heading__landingsection{font-size:1.75rem;line-height:32px;font-weight:700;letter-spacing:-0.7px;text-transform:uppercase}h1.hy-heading__hero{font-size:2rem;line-height:38px;font-weight:700;color:var(--grayscale-black);font-family:var(--main-font-family);letter-spacing:-0.8px;margin-bottom:0}@media (min-width: 1024px){h1.hy-heading__hero{font-size:2.875rem;line-height:54px;letter-spacing:-1.15px}}@media (min-width: 1601px){h1.hy-heading__hero{font-size:3.25rem;line-height:60px;letter-spacing:-1.3px}}@media (min-width: 30rem){.hy-heading__container__common h2.hy-heading__introduction,.hy-heading__container__common h2.hy-heading__landingsection{font-size:2.125rem;line-height:40px;letter-spacing:-0.85px}}@media (min-width: 1601px){.hy-heading__container__common h2.hy-heading__introduction,.hy-heading__container__common h2.hy-heading__landingsection{font-size:2.625rem;line-height:48px;letter-spacing:-1.05px}}.hy-heading__container__common h2.hy-heading__introduction{padding:0 0 12px}@media (min-width: 30rem){.hy-heading__container__common h2.hy-heading__introduction{padding:0 0 1rem}}.hy-heading__container__common h2.hy-heading__landingsection,.hy-heading__container__common h2.hy-heading__contentsection{padding-bottom:24px}@media (min-width: 30rem){.hy-heading__container__common h2.hy-heading__landingsection,.hy-heading__container__common h2.hy-heading__contentsection{padding-bottom:28px}}@media (min-width: 60rem){.hy-heading__container__common h2.hy-heading__landingsection,.hy-heading__container__common h2.hy-heading__contentsection{padding-bottom:32px}}@media (min-width: 75.0625rem){.hy-heading__container__common h2.hy-heading__landingsection,.hy-heading__container__common h2.hy-heading__contentsection{padding-bottom:32px}}@media (min-width: 1601px){.hy-heading__container__common h2.hy-heading__landingsection,.hy-heading__container__common h2.hy-heading__contentsection{padding-bottom:40px}}.hy-heading__container__common h2.hy-heading__group_footer_info{font-size:1.5rem;line-height:28px;font-weight:700;letter-spacing:-0.6px;text-transform:uppercase}@media (min-width: 30rem){.hy-heading__container__common h2.hy-heading__group_footer_info{letter-spacing:-0.8px}}@media (min-width: 1601px){.hy-heading__container__common h2.hy-heading__group_footer_info{font-size:1.625rem;line-height:30px}}.hy-heading__container__common h2.hy-heading__footer_info{font-size:1.75rem;line-height:32px;font-weight:700;letter-spacing:-0.7px;text-transform:uppercase}@media (min-width: 30rem){.hy-heading__container__common h2.hy-heading__footer_info{font-size:2.125rem;line-height:40px;letter-spacing:-0.85px}}@media (min-width: 1601px){.hy-heading__container__common h2.hy-heading__footer_info{font-size:2.625rem;line-height:48px;letter-spacing:-1.05px}}@media (min-width: 30rem){.hy-heading__container__large h2.hy-heading__introduction,.hy-heading__container__large h2.hy-heading__landingsection{font-size:2.125rem;line-height:40px;letter-spacing:-0.85px}}@media (min-width: 75.0625rem){.hy-heading__container__large h2.hy-heading__introduction,.hy-heading__container__large h2.hy-heading__landingsection{font-size:2.625rem;line-height:48px;letter-spacing:-1.05px}}@media (min-width: 75.0625rem){.hy-heading__container__large h2.hy-heading__introduction{padding:0 0 1rem}}@media (min-width: 1601px){.hy-heading__container__large h2.hy-heading__introduction{padding:0 0 20px}}.hy-heading__container__large h2.hy-heading__landingsection,.hy-heading__container__large h2.hy-heading__contentsection{padding-bottom:24px}@media (min-width: 30rem){.hy-heading__container__large h2.hy-heading__landingsection,.hy-heading__container__large h2.hy-heading__contentsection{padding-bottom:28px}}@media (min-width: 60rem){.hy-heading__container__large h2.hy-heading__landingsection,.hy-heading__container__large h2.hy-heading__contentsection{padding-bottom:32px}}@media (min-width: 75.0625rem){.hy-heading__container__large h2.hy-heading__landingsection,.hy-heading__container__large h2.hy-heading__contentsection{padding-bottom:40px}}@media (min-width: 75.0625rem){.hy-heading__container__large h1.hy-heading__landing_minor{font-size:3.25rem;line-height:60px;letter-spacing:-1.3px}}@media (min-width: 75.0625rem){.hy-heading__container__large h1.hy-heading__frontpage,.hy-heading__container__large h1.hy-heading__landing_major{font-size:3.5rem;line-height:64px;letter-spacing:-1.4px}}.hy-heading__container__large h2.hy-heading__group_footer_info{font-size:1.5rem;line-height:28px;font-weight:700;letter-spacing:-0.6px;text-transform:uppercase}@media (min-width: 30rem){.hy-heading__container__large h2.hy-heading__group_footer_info{letter-spacing:-0.8px}}@media (min-width: 75.0625rem){.hy-heading__container__large h2.hy-heading__group_footer_info{font-size:1.625rem;line-height:30px}}.hy-heading__container__large h2.hy-heading__footer_info{font-size:1.75rem;line-height:32px;font-weight:700;letter-spacing:-0.7px;text-transform:uppercase}@media (min-width: 30rem){.hy-heading__container__large h2.hy-heading__footer_info{font-size:2.125rem;line-height:40px;letter-spacing:-0.85px}}@media (min-width: 75.0625rem){.hy-heading__container__large h2.hy-heading__footer_info{font-size:2.625rem;line-height:48px;letter-spacing:-1.05px}}h3.hy-heading__landingsection{font-size:1.625rem;line-height:32px;letter-spacing:-0.8px}@media (min-width: 30rem){h3.hy-heading__landingsection{font-size:2rem;line-height:32px;letter-spacing:-1px}}@media (min-width: 75.0625rem){h3.hy-heading__landingsection{font-size:2.5rem;line-height:48px;letter-spacing:-1.2px}}@media (min-width: 1601px){h3.hy-heading__landingsection{font-size:2.5rem;line-height:48px;letter-spacing:-1.2px}}h1,h2,h3,h4,h5,h6{color:var(--brand-main-nearly-black);font-family:var(--main-font-family);font-weight:700;padding:0;margin:0;width:100%}h1.negative,h2.negative,h3.negative,h4.negative,h5.negative,h6.negative{color:var(--grayscale-white)}h1{font-size:2rem;line-height:38px;letter-spacing:-0.8px;text-transform:uppercase}@media (min-width: 30rem){h1{font-size:2.875rem;line-height:54px;letter-spacing:-1.15px}}@media (min-width: 1601px){h1{font-size:3.25rem;line-height:60px;letter-spacing:-1.3px}}@media (min-width: 75.0625rem){.hy-heading__container__large h1{font-size:3.25rem;line-height:60px;letter-spacing:-1.3px}}h2{font-size:1.625rem;line-height:32px;font-weight:700;letter-spacing:-0.52px}@media (min-width: 30rem){h2{font-size:1.875rem;line-height:36px;letter-spacing:-0.6px}}@media (min-width: 1601px){.hy-heading__container__common h2{font-size:2.125rem;line-height:40px;letter-spacing:-0.68px}}@media (min-width: 75.0625rem){.hy-heading__container__large h2{font-size:2.125rem;line-height:40px;letter-spacing:-0.68px}}h3{font-size:1.375rem;line-height:28px;letter-spacing:-0.7px}@media (min-width: 30rem){h3{font-size:1.625rem;line-height:32px;letter-spacing:-0.8px}}h4{font-size:1.125rem;line-height:24px;letter-spacing:-0.56px}@media (min-width: 30rem){h4{font-size:1.375rem;line-height:28px;letter-spacing:-0.69px}}h5{font-size:1rem;line-height:20px;letter-spacing:-0.5px}@media (min-width: 30rem){h5{font-size:1.125rem;line-height:24px;letter-spacing:-0.56px}}h6{font-size:0.875rem;line-height:16px;letter-spacing:-0.44px}@media (min-width: 30rem){h6{font-size:1rem;line-height:20px;letter-spacing:-0.5px}}h1{font-size:80px;font-weight:bold;text-transform:uppercase;line-height:1.2}";
|
|
@@ -3789,41 +3934,41 @@ const Heading = class {
|
|
|
3789
3934
|
this.isSearch = false;
|
|
3790
3935
|
this.section = HeadingSectionVariants.default;
|
|
3791
3936
|
this.negative = false;
|
|
3792
|
-
this.headerstyle =
|
|
3937
|
+
this.headerstyle = "common";
|
|
3793
3938
|
this.hyphenatedText = undefined;
|
|
3794
3939
|
this.hasChildren = true;
|
|
3795
3940
|
}
|
|
3796
3941
|
componentDidLoad() {
|
|
3797
|
-
let hyMainDiv = this.el.closest(
|
|
3942
|
+
let hyMainDiv = this.el.closest(".hy-main");
|
|
3798
3943
|
if (hyMainDiv) {
|
|
3799
|
-
if (!hyMainDiv.classList.contains(
|
|
3800
|
-
this.headerstyle =
|
|
3944
|
+
if (!hyMainDiv.classList.contains("with-sidebar")) {
|
|
3945
|
+
this.headerstyle = "large";
|
|
3801
3946
|
}
|
|
3802
3947
|
}
|
|
3803
|
-
if (this.el.parentElement.classList.contains(
|
|
3948
|
+
if (this.el.parentElement.classList.contains("hy-hero__title-container")) {
|
|
3804
3949
|
this.hasChildren = false;
|
|
3805
3950
|
}
|
|
3806
3951
|
}
|
|
3807
3952
|
render() {
|
|
3808
3953
|
const headingInVariants = this.heading in HeadingVarians;
|
|
3809
3954
|
const classAttributes = [
|
|
3810
|
-
|
|
3811
|
-
this.negative ?
|
|
3812
|
-
this.isSearch ?
|
|
3813
|
-
this.isSearch ? `hy-heading__search__${this.headerstyle}` :
|
|
3955
|
+
"hy-heading",
|
|
3956
|
+
this.negative ? "negative" : "",
|
|
3957
|
+
this.isSearch ? "hy-heading__search" : "",
|
|
3958
|
+
this.isSearch ? `hy-heading__search__${this.headerstyle}` : "",
|
|
3814
3959
|
`hy-heading__${this.section}`,
|
|
3815
3960
|
`hy-heading__${this.headerstyle}`,
|
|
3816
3961
|
`hy-heading__${this.section}__${this.headerstyle}`,
|
|
3817
3962
|
];
|
|
3818
|
-
const sectionClassAttributes = [`hy-heading__${this.section}--divider`].join(
|
|
3963
|
+
const sectionClassAttributes = [`hy-heading__${this.section}--divider`].join(" ");
|
|
3819
3964
|
const containerSectionClass = [
|
|
3820
|
-
|
|
3965
|
+
"hy-heading__container",
|
|
3821
3966
|
`hy-heading__container__${this.section}`,
|
|
3822
3967
|
`hy-heading__container__${this.headerstyle}`,
|
|
3823
|
-
].join(
|
|
3968
|
+
].join(" ");
|
|
3824
3969
|
return (h(Host, null, headingInVariants ? ([
|
|
3825
|
-
h("div", { class: containerSectionClass }, this.hyphenatedText && !this.hasChildren ? (h(this.heading, { class: classAttributes.join(
|
|
3826
|
-
]) : (h("div", { class: containerSectionClass }, this.hyphenatedText && !this.hasChildren ? (h(HeadingVarians.default, { class: classAttributes.join(
|
|
3970
|
+
h("div", { class: containerSectionClass }, this.hyphenatedText && !this.hasChildren ? (h(this.heading, { class: classAttributes.join(" "), innerHTML: this.hyphenatedText })) : (h(this.heading, { class: classAttributes.join(" ") }, h("slot", null))), h("span", { class: sectionClassAttributes })),
|
|
3971
|
+
]) : (h("div", { class: containerSectionClass }, this.hyphenatedText && !this.hasChildren ? (h(HeadingVarians.default, { class: classAttributes.join(" ") }, h("span", { innerHTML: this.hyphenatedText }))) : (h(HeadingVarians.default, { class: classAttributes.join(" ") }, h("span", null, h("slot", null)))), h("span", { class: sectionClassAttributes })))));
|
|
3827
3972
|
}
|
|
3828
3973
|
get el() { return getElement(this); }
|
|
3829
3974
|
};
|
|
@@ -3844,7 +3989,7 @@ const HyHero = class {
|
|
|
3844
3989
|
this.colorVariant = HeroColorVariant.blue;
|
|
3845
3990
|
this.sizeVariant = HeroSizeVariant.large;
|
|
3846
3991
|
this.image = undefined;
|
|
3847
|
-
this.imageAltText =
|
|
3992
|
+
this.imageAltText = "";
|
|
3848
3993
|
this.disableLazy = false;
|
|
3849
3994
|
this.hasShortcuts = false;
|
|
3850
3995
|
this.heading = undefined;
|
|
@@ -3859,21 +4004,21 @@ const HyHero = class {
|
|
|
3859
4004
|
this._sourceSet = await jsonParserWorker(this.sourceSet);
|
|
3860
4005
|
}
|
|
3861
4006
|
handleHeroImageObjectFitValue(heroSizeVariant, heroElement) {
|
|
3862
|
-
const heroContentContainerElement = heroElement.getElementsByClassName(
|
|
3863
|
-
if (heroSizeVariant ===
|
|
4007
|
+
const heroContentContainerElement = heroElement.getElementsByClassName("hy-hero__content-container")[0];
|
|
4008
|
+
if (heroSizeVariant === "small") {
|
|
3864
4009
|
if (heroContentContainerElement.offsetHeight >= 300) {
|
|
3865
|
-
heroElement.classList.add(
|
|
4010
|
+
heroElement.classList.add("has-cover");
|
|
3866
4011
|
}
|
|
3867
4012
|
else {
|
|
3868
|
-
heroElement.classList.remove(
|
|
4013
|
+
heroElement.classList.remove("has-cover");
|
|
3869
4014
|
}
|
|
3870
4015
|
}
|
|
3871
|
-
if (heroSizeVariant ===
|
|
4016
|
+
if (heroSizeVariant === "large") {
|
|
3872
4017
|
if (heroContentContainerElement.offsetHeight >= 344) {
|
|
3873
|
-
heroElement.classList.add(
|
|
4018
|
+
heroElement.classList.add("has-cover");
|
|
3874
4019
|
}
|
|
3875
4020
|
else {
|
|
3876
|
-
heroElement.classList.remove(
|
|
4021
|
+
heroElement.classList.remove("has-cover");
|
|
3877
4022
|
}
|
|
3878
4023
|
}
|
|
3879
4024
|
}
|
|
@@ -3881,7 +4026,7 @@ const HyHero = class {
|
|
|
3881
4026
|
let variant = CtaLinkButtonVariants.heroWhite;
|
|
3882
4027
|
let colorVariantValue = this.colorVariant;
|
|
3883
4028
|
let heroTypeValue = this.heroType;
|
|
3884
|
-
if (this.heroType ===
|
|
4029
|
+
if (this.heroType === "minor_landing") {
|
|
3885
4030
|
colorVariantValue = HeroColorVariant.white;
|
|
3886
4031
|
heroTypeValue = HeroTypeVariant.landing;
|
|
3887
4032
|
}
|
|
@@ -3891,41 +4036,41 @@ const HyHero = class {
|
|
|
3891
4036
|
if (colorVariantValue === HeroColorVariant.black) {
|
|
3892
4037
|
variant = CtaLinkButtonVariants.heroBlack;
|
|
3893
4038
|
}
|
|
3894
|
-
if (!colorVariantValue || colorVariantValue ===
|
|
4039
|
+
if (!colorVariantValue || colorVariantValue === "fp_white") {
|
|
3895
4040
|
colorVariantValue = HeroColorVariant.white;
|
|
3896
4041
|
}
|
|
3897
4042
|
const hyHeroClasses = [
|
|
3898
|
-
|
|
4043
|
+
"hy-hero",
|
|
3899
4044
|
`hy-hero--${heroTypeValue}`,
|
|
3900
4045
|
`hy-hero--${this.heroGroupType}`,
|
|
3901
4046
|
`hy-hero--${colorVariantValue}`,
|
|
3902
4047
|
`hy-hero--${this.sizeVariant}`,
|
|
3903
4048
|
];
|
|
3904
|
-
const heroTitleClasses = [
|
|
4049
|
+
const heroTitleClasses = ["hy-hero__title", "hy-heading__hero"].join(" ");
|
|
3905
4050
|
// If there is a Shortcuts block after hero, add the class 'shortcuts' to remove underline.
|
|
3906
4051
|
if (this.hasShortcuts) {
|
|
3907
|
-
hyHeroClasses.push(
|
|
4052
|
+
hyHeroClasses.push("has-shortcuts");
|
|
3908
4053
|
}
|
|
3909
4054
|
const aspectRatioWidth = 16;
|
|
3910
4055
|
const aspectRatioHeight = 10;
|
|
3911
4056
|
const aspect = (aspectRatioHeight / aspectRatioWidth) * 100;
|
|
3912
4057
|
const aspectRatio = {
|
|
3913
|
-
|
|
4058
|
+
"--aspectRatio": `${aspect}%`,
|
|
3914
4059
|
};
|
|
3915
4060
|
window.onload = () => {
|
|
3916
|
-
const heroElement = document.getElementsByClassName(
|
|
4061
|
+
const heroElement = document.getElementsByClassName("hy-hero")[0];
|
|
3917
4062
|
this.handleHeroImageObjectFitValue(this.sizeVariant, heroElement);
|
|
3918
|
-
window.addEventListener(
|
|
4063
|
+
window.addEventListener("resize", () => {
|
|
3919
4064
|
clearTimeout(timeout);
|
|
3920
4065
|
timeout = setTimeout(() => this.handleHeroImageObjectFitValue(this.sizeVariant, heroElement), delay);
|
|
3921
4066
|
});
|
|
3922
4067
|
};
|
|
3923
|
-
if (heroTypeValue ===
|
|
3924
|
-
return (h(Host, null, h("div", { class: hyHeroClasses.join(
|
|
3925
|
-
(this._sourceSet ? (h("picture", null, this._sourceSet.map((item) => (h("source", { srcSet: item.src, media: item.media, type: item.type, sizes: item.sizes ? item.sizes :
|
|
4068
|
+
if (heroTypeValue === "front_page") {
|
|
4069
|
+
return (h(Host, null, h("div", { class: hyHeroClasses.join(" ") }, h("div", { class: `hy-hero__container` }, h("div", { class: `hy-hero__image-container`, style: aspectRatio }, this.image &&
|
|
4070
|
+
(this._sourceSet ? (h("picture", null, this._sourceSet.map((item) => (h("source", { srcSet: item.src, media: item.media, type: item.type, sizes: item.sizes ? item.sizes : "" }))), h("img", { loading: this.disableLazy ? "eager" : "lazy", alt: this.imageAltText, class: `hy-image__image`, src: this.image }))) : (h("img", { loading: this.disableLazy ? "eager" : "lazy", alt: this.imageAltText, class: `hy-image__image`, src: this.image })))), h("div", { class: `hy-hero__spacer-box` }), h("div", { class: `hy-hero__content-container` }, h("div", { class: `hy-hero__content` }, h("div", { class: `hy-hero__title-container` }, h("h2", { innerHTML: this.heading, class: heroTitleClasses })), this.description && h("p", { class: `hy-hero__description` }, this.description), this.url && (h("div", { class: `hy-hero__actions` }, h("hy-cta-button", { "link-content": this.urlTitle, "sc-label": this.scLabel, url: this.url, "is-external": this.isExternal, variant: variant }))))))), h("hy-box", { mb: "2, 2, 1, 1" })));
|
|
3926
4071
|
}
|
|
3927
|
-
return (h(Host, null, h("div", { class: hyHeroClasses.join(
|
|
3928
|
-
(this._sourceSet ? (h("picture", null, this._sourceSet.map((item) => (h("source", { srcSet: item.src, media: item.media, type: item.type, sizes: item.sizes ? item.sizes :
|
|
4072
|
+
return (h(Host, null, h("div", { class: hyHeroClasses.join(" ") }, h("div", { class: `hy-hero__container` }, h("div", { class: `hy-hero__image-container`, style: aspectRatio }, this.image &&
|
|
4073
|
+
(this._sourceSet ? (h("picture", null, this._sourceSet.map((item) => (h("source", { srcSet: item.src, media: item.media, type: item.type, sizes: item.sizes ? item.sizes : "" }))), h("img", { loading: this.disableLazy ? "eager" : "lazy", alt: this.imageAltText, class: `hy-image__image`, src: this.image }))) : (h("img", { loading: this.disableLazy ? "eager" : "lazy", alt: this.imageAltText, class: `hy-image__image`, src: this.image })))), h("div", { class: `hy-hero__content-container` }, h("div", { class: `hy-hero__content` }, h("div", { class: `hy-hero__title-container` }, h("h2", { innerHTML: this.heading, class: heroTitleClasses })), this.description && h("p", { class: `hy-hero__description` }, this.description), this.url && (h("div", { class: `hy-hero__actions` }, h("hy-cta-button", { "link-content": this.urlTitle, "sc-label": this.scLabel, url: this.url, "is-external": this.isExternal, variant: variant }))))))), h("hy-box", { mb: "2, 2, 1, 1" })));
|
|
3929
4074
|
}
|
|
3930
4075
|
get el() { return getElement(this); }
|
|
3931
4076
|
};
|
|
@@ -4573,11 +4718,11 @@ function SvgYoutube(props) {
|
|
|
4573
4718
|
}
|
|
4574
4719
|
|
|
4575
4720
|
const IconArrowLeft = (props) => {
|
|
4576
|
-
return (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: props.width || 30, height: props.height || 29, viewBox: "0 0 30 29", fill: props.fill ||
|
|
4721
|
+
return (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: props.width || 30, height: props.height || 29, viewBox: "0 0 30 29", fill: props.fill || "black" },
|
|
4577
4722
|
h("polygon", { points: "29.207 13.783 14.756 .717 14.055 0 11.402 3.118 10.732 3.835 19.665 11.974 0 11.974 0 17.026 19.756 17.026 11.494 24.447 10.823 25.071 11.402 25.882 13.476 28.189 14.055 29 30 14.594", transform: "rotate(-180 15 14.5)" })));
|
|
4578
4723
|
};
|
|
4579
4724
|
const IconArrowRight = (props) => {
|
|
4580
|
-
return (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: props.width || 30, height: props.height || 29, viewBox: "0 0 30 29", fill: props.fill ||
|
|
4725
|
+
return (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: props.width || 30, height: props.height || 29, viewBox: "0 0 30 29", fill: props.fill || "black" },
|
|
4581
4726
|
h("polygon", { points: "29.207 13.783 14.756 .717 14.055 0 11.402 3.118 10.732 3.835 19.665 11.974 0 11.974 0 17.026 19.756 17.026 11.494 24.447 10.823 25.071 11.402 25.882 13.476 28.189 14.055 29 30 14.594" })));
|
|
4582
4727
|
};
|
|
4583
4728
|
const IconArrowToRight = (props) => {
|
|
@@ -4593,145 +4738,145 @@ const iconCss = ":host{display:block}";
|
|
|
4593
4738
|
|
|
4594
4739
|
// TODO: add all icons
|
|
4595
4740
|
const iconNames = {
|
|
4596
|
-
|
|
4597
|
-
|
|
4598
|
-
|
|
4599
|
-
|
|
4600
|
-
|
|
4601
|
-
|
|
4602
|
-
|
|
4603
|
-
|
|
4604
|
-
|
|
4605
|
-
|
|
4606
|
-
|
|
4607
|
-
|
|
4608
|
-
|
|
4609
|
-
|
|
4610
|
-
|
|
4611
|
-
|
|
4612
|
-
|
|
4613
|
-
|
|
4614
|
-
|
|
4615
|
-
|
|
4616
|
-
|
|
4617
|
-
|
|
4618
|
-
|
|
4619
|
-
|
|
4620
|
-
|
|
4621
|
-
|
|
4622
|
-
|
|
4623
|
-
|
|
4624
|
-
|
|
4625
|
-
|
|
4626
|
-
|
|
4627
|
-
|
|
4628
|
-
|
|
4629
|
-
|
|
4630
|
-
|
|
4631
|
-
|
|
4632
|
-
|
|
4633
|
-
|
|
4634
|
-
|
|
4635
|
-
|
|
4636
|
-
|
|
4637
|
-
|
|
4638
|
-
|
|
4639
|
-
|
|
4640
|
-
|
|
4641
|
-
|
|
4642
|
-
|
|
4643
|
-
|
|
4644
|
-
|
|
4645
|
-
|
|
4646
|
-
|
|
4647
|
-
|
|
4648
|
-
|
|
4649
|
-
|
|
4650
|
-
|
|
4651
|
-
|
|
4652
|
-
|
|
4653
|
-
|
|
4654
|
-
|
|
4655
|
-
|
|
4656
|
-
|
|
4657
|
-
|
|
4658
|
-
|
|
4659
|
-
|
|
4660
|
-
|
|
4661
|
-
|
|
4662
|
-
|
|
4663
|
-
|
|
4664
|
-
|
|
4665
|
-
|
|
4666
|
-
|
|
4667
|
-
|
|
4668
|
-
|
|
4669
|
-
|
|
4670
|
-
|
|
4671
|
-
|
|
4672
|
-
|
|
4673
|
-
|
|
4674
|
-
|
|
4675
|
-
|
|
4676
|
-
|
|
4677
|
-
|
|
4678
|
-
|
|
4679
|
-
|
|
4680
|
-
|
|
4681
|
-
|
|
4682
|
-
|
|
4683
|
-
|
|
4684
|
-
|
|
4685
|
-
|
|
4686
|
-
|
|
4687
|
-
|
|
4688
|
-
|
|
4689
|
-
|
|
4690
|
-
|
|
4691
|
-
|
|
4692
|
-
|
|
4693
|
-
|
|
4694
|
-
|
|
4695
|
-
|
|
4696
|
-
|
|
4697
|
-
|
|
4698
|
-
|
|
4699
|
-
|
|
4700
|
-
|
|
4701
|
-
|
|
4702
|
-
|
|
4703
|
-
|
|
4704
|
-
|
|
4705
|
-
|
|
4706
|
-
|
|
4707
|
-
|
|
4708
|
-
|
|
4709
|
-
|
|
4710
|
-
|
|
4711
|
-
|
|
4712
|
-
|
|
4713
|
-
|
|
4714
|
-
|
|
4715
|
-
|
|
4716
|
-
|
|
4717
|
-
|
|
4718
|
-
|
|
4719
|
-
|
|
4720
|
-
|
|
4721
|
-
|
|
4722
|
-
|
|
4723
|
-
|
|
4724
|
-
|
|
4741
|
+
"hy-icon-add-todo": (p) => h(SvgAddToTodoList, Object.assign({}, p)),
|
|
4742
|
+
"hy-icon-alert": (p) => h(SvgAlert, Object.assign({}, p)),
|
|
4743
|
+
"hy-icon-archive": (p) => h(SvgArchive, Object.assign({}, p)),
|
|
4744
|
+
"hy-icon-arrow-down": (p) => h(SvgArrowDown$1, Object.assign({}, p)),
|
|
4745
|
+
"hy-icon-arrow-left": (p) => h(IconArrowLeft, Object.assign({}, p)),
|
|
4746
|
+
"hy-icon-arrow-right": (p) => h(IconArrowRight, Object.assign({}, p)),
|
|
4747
|
+
"hy-icon-arrow-to-right": (p) => h(IconArrowToRight, Object.assign({}, p)),
|
|
4748
|
+
"hy-icon-arrow-up": (p) => h(SvgArrowUp, Object.assign({}, p)),
|
|
4749
|
+
"hy-icon-avatar-group": (p) => h(SvgAvatarGroup, Object.assign({}, p)),
|
|
4750
|
+
"hy-icon-avatar": (p) => h(SvgAvatar, Object.assign({}, p)),
|
|
4751
|
+
"hy-icon-bachelor": (p) => h(SvgBachelor, Object.assign({}, p)),
|
|
4752
|
+
"hy-icon-bullet-list": (p) => h(SvgBulletList, Object.assign({}, p)),
|
|
4753
|
+
"hy-icon-camera": (p) => h(SvgCamera, Object.assign({}, p)),
|
|
4754
|
+
"hy-icon-caret-down": (p) => h(SvgCaretDown, Object.assign({}, p)),
|
|
4755
|
+
"hy-icon-caret-left": (p) => h(SvgCaretLeft, Object.assign({}, p)),
|
|
4756
|
+
"hy-icon-caret-right": (p) => h(SvgCaretRight, Object.assign({}, p)),
|
|
4757
|
+
"hy-icon-caret-up": (p) => h(SvgCaretUp, Object.assign({}, p)),
|
|
4758
|
+
"hy-icon-chat": (p) => h(SvgChat, Object.assign({}, p)),
|
|
4759
|
+
"hy-icon-code-fork": (p) => h(SvgCodeFork, Object.assign({}, p)),
|
|
4760
|
+
"hy-icon-cogs": (p) => h(SvgCogs, Object.assign({}, p)),
|
|
4761
|
+
"hy-icon-content-link": (p) => h(SvgContentlink, Object.assign({}, p)),
|
|
4762
|
+
"hy-icon-custom-link": (p) => h(SvgCustomlink, Object.assign({}, p)),
|
|
4763
|
+
"hy-icon-date": (p) => h(SvgDate, Object.assign({}, p)),
|
|
4764
|
+
"hy-icon-discover": (p) => h(SvgDiscover, Object.assign({}, p)),
|
|
4765
|
+
"hy-icon-done": (p) => h(SvgDone, Object.assign({}, p)),
|
|
4766
|
+
"hy-icon-dot": (p) => h(SvgDot, Object.assign({}, p)),
|
|
4767
|
+
"hy-icon-dot-arrow-right": (p) => h(SvgArrowDown, Object.assign({}, p)),
|
|
4768
|
+
"hy-icon-download": (p) => h(SvgDownload, Object.assign({}, p)),
|
|
4769
|
+
"hy-icon-drag": (p) => h(SvgDrag, Object.assign({}, p)),
|
|
4770
|
+
"hy-icon-drag-button": (p) => h(SvgDragbutton, Object.assign({}, p)),
|
|
4771
|
+
"hy-icon-drop-down": (p) => h(SvgDropDown, Object.assign({}, p)),
|
|
4772
|
+
"hy-icon-edit": (p) => h(SvgEdit, Object.assign({}, p)),
|
|
4773
|
+
"hy-icon-edit-event": (p) => h(SvgEditEvent, Object.assign({}, p)),
|
|
4774
|
+
"hy-icon-embed": (p) => h(SvgEmbed, Object.assign({}, p)),
|
|
4775
|
+
"hy-icon-euro": (p) => h(SvgEuro, Object.assign({}, p)),
|
|
4776
|
+
"hy-icon-events": (p) => h(SvgEvents, Object.assign({}, p)),
|
|
4777
|
+
"hy-icon-external-link": (p) => h(SvgExternalLink, Object.assign({}, p)),
|
|
4778
|
+
"hy-icon-eyelash": (p) => h(SvgEyeSlash, Object.assign({}, p)),
|
|
4779
|
+
"hy-icon-facebook": (p) => h(SvgFacebook, Object.assign({}, p)),
|
|
4780
|
+
"hy-icon-favorites": (p) => h(SvgFavorites, Object.assign({}, p)),
|
|
4781
|
+
"hy-icon-feed": (p) => h(SvgFeed, Object.assign({}, p)),
|
|
4782
|
+
"hy-icon-file-text": (p) => h(SvgFileText, Object.assign({}, p)),
|
|
4783
|
+
"hy-icon-fullscreen": (p) => h(SvgFullScreen, Object.assign({}, p)),
|
|
4784
|
+
"hy-icon-globe": (p) => h(SvgGlobe, Object.assign({}, p)),
|
|
4785
|
+
"hy-icon-googleplus": (p) => h(SvgGooglePlus, Object.assign({}, p)),
|
|
4786
|
+
"hy-icon-grid": (p) => h(SvgGrid, Object.assign({}, p)),
|
|
4787
|
+
"hy-icon-hamburger": (p) => h(SvgHamburger, Object.assign({}, p)),
|
|
4788
|
+
"hy-icon-heart": (p) => h(SvgHeart, Object.assign({}, p)),
|
|
4789
|
+
"hy-icon-heart-support": (p) => h(SvgHeartSupport, Object.assign({}, p)),
|
|
4790
|
+
"hy-icon-helsingin-yliopisto": (p) => h(SvgHelsinginyliopisto, Object.assign({}, p)),
|
|
4791
|
+
"hy-icon-home": (p) => h(SvgHome, Object.assign({}, p)),
|
|
4792
|
+
"hy-icon-horizontal-resize": (p) => h(SvgHorizontalResize, Object.assign({}, p)),
|
|
4793
|
+
"hy-icon-hy-logo": (p) => h(SvgHyLogo, Object.assign({}, p)),
|
|
4794
|
+
"hy-icon-id-number": (p) => h(SvgIdNumber, Object.assign({}, p)),
|
|
4795
|
+
"hy-icon-image": (p) => h(SvgImage, Object.assign({}, p)),
|
|
4796
|
+
"hy-icon-image-gallery": (p) => h(SvgImageGallery, Object.assign({}, p)),
|
|
4797
|
+
"hy-icon-images": (p) => h(SvgImages, Object.assign({}, p)),
|
|
4798
|
+
"hy-icon-info": (p) => h(SvgInfo, Object.assign({}, p)),
|
|
4799
|
+
"hy-icon-info-stroke": (p) => h(SvgInfoStroke, Object.assign({}, p)),
|
|
4800
|
+
"hy-icon-instagram": (p) => h(SvgInstagram, Object.assign({}, p)),
|
|
4801
|
+
"hy-icon-leiki-list": (p) => h(SvgLeikiList, Object.assign({}, p)),
|
|
4802
|
+
"hy-icon-link-arrow": (p) => h(SvgLinkArrow, Object.assign({}, p)),
|
|
4803
|
+
"hy-icon-link-arrow-down": (p) => h(SvgLinkArrowDown, Object.assign({}, p)),
|
|
4804
|
+
"hy-icon-link-arrow-left": (p) => h(SvgLinkArrowLeft, Object.assign({}, p)),
|
|
4805
|
+
"hy-icon-link-arrow-offsite": (p) => h(SvgLinkArrowOffsite, Object.assign({}, p)),
|
|
4806
|
+
"hy-icon-link-arrow-up": (p) => h(SvgLinkArrowUp, Object.assign({}, p)),
|
|
4807
|
+
"hy-icon-linkedin": (p) => h(SvgLinkedin, Object.assign({}, p)),
|
|
4808
|
+
"hy-icon-list": (p) => h(SvgList, Object.assign({}, p)),
|
|
4809
|
+
"hy-icon-list-of-links": (p) => h(SvgListoflinks, Object.assign({}, p)),
|
|
4810
|
+
"hy-icon-list-as-blocks": (p) => h(SvgListAsBlocks, Object.assign({}, p)),
|
|
4811
|
+
"hy-icon-list-style-grid": (p) => h(SvgListStyleGrid, Object.assign({}, p)),
|
|
4812
|
+
"hy-icon-list-style-list": (p) => h(SvgListStyleList, Object.assign({}, p)),
|
|
4813
|
+
"hy-icon-link": (p) => h(SvgUrl, Object.assign({}, p)),
|
|
4814
|
+
"hy-icon-location": (p) => h(SvgLocation, Object.assign({}, p)),
|
|
4815
|
+
"hy-icon-log": (p) => h(SvgLog, Object.assign({}, p)),
|
|
4816
|
+
"hy-icon-log-in": (p) => h(SvgLogin, Object.assign({}, p)),
|
|
4817
|
+
"hy-icon-log-out": (p) => h(SvgLogout, Object.assign({}, p)),
|
|
4818
|
+
"hy-icon-magnify-minus": (p) => h(SvgMagnifyMinus, Object.assign({}, p)),
|
|
4819
|
+
"hy-icon-magnify-plus": (p) => h(SvgMagnifyPlus, Object.assign({}, p)),
|
|
4820
|
+
"hy-icon-email": (p) => h(SvgMail, Object.assign({}, p)),
|
|
4821
|
+
"hy-icon-master": (p) => h(SvgMaster, Object.assign({}, p)),
|
|
4822
|
+
"hy-icon-minus": (p) => h(SvgMinus, Object.assign({}, p)),
|
|
4823
|
+
"hy-icon-modify": (p) => h(SvgModify, Object.assign({}, p)),
|
|
4824
|
+
"hy-icon-navi-triangle": (p) => h(SvgNaviTriangle, Object.assign({}, p)),
|
|
4825
|
+
"hy-icon-new-group": (p) => h(SvgNewGroup, Object.assign({}, p)),
|
|
4826
|
+
"hy-icon-new-person": (p) => h(SvgNewPerson, Object.assign({}, p)),
|
|
4827
|
+
"hy-icon-notification": (p) => h(SvgNotification, Object.assign({}, p)),
|
|
4828
|
+
"hy-icon-opinder-logo": (p) => h(SvgOpinderLogoNew, Object.assign({}, p)),
|
|
4829
|
+
"hy-icon-pdf": (p) => h(SvgPdf, Object.assign({}, p)),
|
|
4830
|
+
"hy-icon-people": (p) => h(SvgPeople, Object.assign({}, p)),
|
|
4831
|
+
"hy-icon-permission-all": (p) => h(SvgPermissionAll, Object.assign({}, p)),
|
|
4832
|
+
"hy-icon-permission-group": (p) => h(SvgPermissionGroup, Object.assign({}, p)),
|
|
4833
|
+
"hy-icon-permission-private": (p) => h(SvgPermissionPrivate, Object.assign({}, p)),
|
|
4834
|
+
"hy-icon-person": (p) => h(SvgPerson, Object.assign({}, p)),
|
|
4835
|
+
"hy-icon-person-outline": (p) => h(SvgPersonOutline, Object.assign({}, p)),
|
|
4836
|
+
"hy-icon-phone": (p) => h(SvgPhone, Object.assign({}, p)),
|
|
4837
|
+
"hy-icon-play": (p) => h(SvgPlay, Object.assign({}, p)),
|
|
4838
|
+
"hy-icon-plus": (p) => h(SvgPlus, Object.assign({}, p)),
|
|
4839
|
+
"hy-icon-preview": (p) => h(SvgPreview, Object.assign({}, p)),
|
|
4840
|
+
"hy-icon-profile": (p) => h(SvgProfile, Object.assign({}, p)),
|
|
4841
|
+
"hy-icon-question": (p) => h(SvgQuestion, Object.assign({}, p)),
|
|
4842
|
+
"hy-icon-remove": (p) => h(SvgRemove, Object.assign({}, p)),
|
|
4843
|
+
"hy-icon-retweet": (p) => h(SvgRetweet, Object.assign({}, p)),
|
|
4844
|
+
"hy-icon-rotate-left": (p) => h(SvgRotateLeft, Object.assign({}, p)),
|
|
4845
|
+
"hy-icon-rotate-right": (p) => h(SvgRotateRight, Object.assign({}, p)),
|
|
4846
|
+
"hy-icon-search": (p) => h(SvgSearch, Object.assign({}, p)),
|
|
4847
|
+
"hy-icon-share": (p) => h(SvgShare, Object.assign({}, p)),
|
|
4848
|
+
"hy-icon-slim-hamburger-menu": (p) => h(SvgSlimHamburgerMenu, Object.assign({}, p)),
|
|
4849
|
+
"hy-icon-social-media": (p) => h(SvgSocialMedia, Object.assign({}, p)),
|
|
4850
|
+
"hy-icon-some-facebook": (p) => h(SomeFacebook, Object.assign({}, p)),
|
|
4851
|
+
"hy-icon-some-instagram": (p) => h(SomeInstagram, Object.assign({}, p)),
|
|
4852
|
+
"hy-icon-some-linkedin": (p) => h(SomeLinkedin, Object.assign({}, p)),
|
|
4853
|
+
"hy-icon-some-twitter": (p) => h(SomeTwitter, Object.assign({}, p)),
|
|
4854
|
+
"hy-icon-some-twitter-retweet": (p) => h(SvgRetweet, Object.assign({}, p)),
|
|
4855
|
+
"hy-icon-some-twitter-like": (p) => h(SvgTwitterLike, Object.assign({}, p)),
|
|
4856
|
+
"hy-icon-some-youtube": (p) => h(SomeYoutube, Object.assign({}, p)),
|
|
4857
|
+
"hy-icon-spinner": (p) => h(SvgSpinner, Object.assign({}, p)),
|
|
4858
|
+
"hy-icon-square": (p) => h(SvgSquare, Object.assign({}, p)),
|
|
4859
|
+
"hy-icon-square-checked": (p) => h(SvgSquareChecked, Object.assign({}, p)),
|
|
4860
|
+
"hy-icon-time": (p) => h(SvgTime, Object.assign({}, p)),
|
|
4861
|
+
"hy-icon-todolist": (p) => h(SvgTodoList, Object.assign({}, p)),
|
|
4862
|
+
"hy-icon-tour": (p) => h(SvgTour, Object.assign({}, p)),
|
|
4863
|
+
"hy-icon-twitter": (p) => h(SvgTwitter, Object.assign({}, p)),
|
|
4864
|
+
"hy-icon-units-and-faculties": (p) => h(SvgUnitsAndFaculties, Object.assign({}, p)),
|
|
4865
|
+
"hy-icon-video": (p) => h(SvgVideo, Object.assign({}, p)),
|
|
4866
|
+
"hy-icon-warning": (p) => h(SvgWarning, Object.assign({}, p)),
|
|
4867
|
+
"hy-icon-wrench": (p) => h(SvgWrench, Object.assign({}, p)),
|
|
4868
|
+
"hy-icon-quote": (p) => h(IconQuote, Object.assign({}, p)),
|
|
4869
|
+
"hy-icon-youtube": (p) => h(SvgYoutube, Object.assign({}, p)),
|
|
4725
4870
|
};
|
|
4726
4871
|
const Icon = class {
|
|
4727
4872
|
constructor(hostRef) {
|
|
4728
4873
|
registerInstance(this, hostRef);
|
|
4729
4874
|
this.icon = undefined;
|
|
4730
|
-
this.fill =
|
|
4875
|
+
this.fill = "black";
|
|
4731
4876
|
this.size = 20;
|
|
4732
4877
|
}
|
|
4733
4878
|
render() {
|
|
4734
|
-
return (h(Host, { "aria-hidden": "true", style: { display:
|
|
4879
|
+
return (h(Host, { "aria-hidden": "true", style: { display: "flex" } }, iconNames[this.icon]({
|
|
4735
4880
|
height: this.size,
|
|
4736
4881
|
width: this.size,
|
|
4737
4882
|
fill: this.fill,
|
|
@@ -4754,7 +4899,7 @@ const Image = class {
|
|
|
4754
4899
|
this.sourceSet = undefined;
|
|
4755
4900
|
}
|
|
4756
4901
|
srcSetWatcher(data) {
|
|
4757
|
-
this._sourceSet = typeof data ===
|
|
4902
|
+
this._sourceSet = typeof data === "string" ? JSON.parse(data) : data;
|
|
4758
4903
|
}
|
|
4759
4904
|
componentWillLoad() {
|
|
4760
4905
|
this.srcSetWatcher(this.sourceSet);
|
|
@@ -4764,17 +4909,17 @@ const Image = class {
|
|
|
4764
4909
|
if (this.aspectRatioWidth !== 0 && this.aspectRatioWidth !== 0) {
|
|
4765
4910
|
const aspect = (this.aspectRatioHeight / this.aspectRatioWidth) * 100;
|
|
4766
4911
|
aspectRatio = {
|
|
4767
|
-
|
|
4912
|
+
"--aspectRatio": `${aspect}%`,
|
|
4768
4913
|
};
|
|
4769
4914
|
}
|
|
4770
|
-
const classAttributes = [
|
|
4915
|
+
const classAttributes = ["hy-image", this.caption ? "hy-image--with-caption" : null].join(" ");
|
|
4771
4916
|
const containerClasses = [
|
|
4772
|
-
|
|
4773
|
-
aspectRatio !== null ?
|
|
4774
|
-
].join(
|
|
4917
|
+
"hy-image__image-container",
|
|
4918
|
+
aspectRatio !== null ? "hy-image--with-aspect" : "hy-image--no-aspect",
|
|
4919
|
+
].join(" ");
|
|
4775
4920
|
return [
|
|
4776
|
-
h("div", { class: classAttributes }, h("div", { class: containerClasses, style: aspectRatio !== null ? aspectRatio :
|
|
4777
|
-
(this._sourceSet ? (h("picture", null, this._sourceSet.map(({ src, media, type, sizes }) => (h("source", { srcSet: src, media: media, type: type, sizes: sizes ||
|
|
4921
|
+
h("div", { class: classAttributes }, h("div", { class: containerClasses, style: aspectRatio !== null ? aspectRatio : "" }, this.imageUrl &&
|
|
4922
|
+
(this._sourceSet ? (h("picture", null, this._sourceSet.map(({ src, media, type, sizes }) => (h("source", { srcSet: src, media: media, type: type, sizes: sizes || "" }))), h("img", { loading: this.disableLazy ? "eager" : "lazy", alt: this.imageAlt, class: "hy-image__image", src: this.imageUrl }))) : (h("img", { loading: this.disableLazy ? "eager" : "lazy", alt: this.imageAlt, class: "hy-image__image", src: this.imageUrl })))), this.caption && h("div", { class: "hy-image__caption" }, this.caption)),
|
|
4778
4923
|
h("hy-box", { mb: "1.75, 1.75, 2, 2.5" }),
|
|
4779
4924
|
];
|
|
4780
4925
|
}
|
|
@@ -4789,18 +4934,18 @@ const ingressCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand
|
|
|
4789
4934
|
const Ingress = class {
|
|
4790
4935
|
constructor(hostRef) {
|
|
4791
4936
|
registerInstance(this, hostRef);
|
|
4792
|
-
this.headerstyle =
|
|
4937
|
+
this.headerstyle = "common";
|
|
4793
4938
|
}
|
|
4794
4939
|
componentDidLoad() {
|
|
4795
|
-
let hyMainDiv = this.el.closest(
|
|
4940
|
+
let hyMainDiv = this.el.closest(".hy-main");
|
|
4796
4941
|
if (hyMainDiv) {
|
|
4797
|
-
if (!hyMainDiv.classList.contains(
|
|
4798
|
-
this.headerstyle =
|
|
4942
|
+
if (!hyMainDiv.classList.contains("with-sidebar")) {
|
|
4943
|
+
this.headerstyle = "large";
|
|
4799
4944
|
}
|
|
4800
4945
|
}
|
|
4801
4946
|
}
|
|
4802
4947
|
render() {
|
|
4803
|
-
const classAttributes = [
|
|
4948
|
+
const classAttributes = ["hy-ingress", `hy-ingress__${this.headerstyle}`].join(" ");
|
|
4804
4949
|
return (h(Host, null, h("p", { class: classAttributes }, h("slot", null))));
|
|
4805
4950
|
}
|
|
4806
4951
|
get el() { return getElement(this); }
|
|
@@ -4821,39 +4966,39 @@ const HyIntroduction = class {
|
|
|
4821
4966
|
this.scLabel = undefined;
|
|
4822
4967
|
this.urlTitle = undefined;
|
|
4823
4968
|
this.imageUrl = undefined;
|
|
4824
|
-
this.imageAlt =
|
|
4969
|
+
this.imageAlt = "";
|
|
4825
4970
|
this.isExternal = false;
|
|
4826
|
-
this.headerstyle =
|
|
4971
|
+
this.headerstyle = "common";
|
|
4827
4972
|
this.sourceSet = undefined;
|
|
4828
4973
|
}
|
|
4829
4974
|
componentDidLoad() {
|
|
4830
|
-
let hyMainDiv = this.el.closest(
|
|
4975
|
+
let hyMainDiv = this.el.closest(".hy-main");
|
|
4831
4976
|
if (hyMainDiv) {
|
|
4832
|
-
if (!hyMainDiv.classList.contains(
|
|
4833
|
-
this.headerstyle =
|
|
4977
|
+
if (!hyMainDiv.classList.contains("with-sidebar")) {
|
|
4978
|
+
this.headerstyle = "large";
|
|
4834
4979
|
}
|
|
4835
4980
|
}
|
|
4836
4981
|
}
|
|
4837
4982
|
render() {
|
|
4838
4983
|
const classAttributes = [
|
|
4839
|
-
|
|
4984
|
+
"hy-introduction",
|
|
4840
4985
|
`hy-introduction__${this.headerstyle}`,
|
|
4841
4986
|
this.headerstyle,
|
|
4842
|
-
this.reversed ?
|
|
4987
|
+
this.reversed ? "hy-introduction--reversed" : "",
|
|
4843
4988
|
this.variant
|
|
4844
4989
|
? `hy-introduction--with-bg hy-introduction--with-bg__${this.variant}`
|
|
4845
|
-
:
|
|
4846
|
-
].join(
|
|
4847
|
-
const classTitle = [
|
|
4848
|
-
const classDescription = [
|
|
4990
|
+
: "hy-introduction--without-bg",
|
|
4991
|
+
].join(" ");
|
|
4992
|
+
const classTitle = ["hy-introduction__title", `hy-introduction__title__${this.headerstyle}`].join(" ");
|
|
4993
|
+
const classDescription = ["hy-introduction__description", `hy-introduction__description__${this.headerstyle}`].join(" ");
|
|
4849
4994
|
const contentWrapperClasses = [
|
|
4850
|
-
|
|
4851
|
-
this.reversed ?
|
|
4852
|
-
this.imageUrl ?
|
|
4853
|
-
this.limitContentWidth ?
|
|
4854
|
-
].join(
|
|
4855
|
-
const target = this.isExternal ?
|
|
4856
|
-
return (h(Host, null, h("hy-box", { pt: "1.25, 1.25, 1.5, 2.5" }), h("div", { class: classAttributes }, h("hy-main-content-wrapper", null, h("div", { class: "hy-introduction__outer-content" }, h("div", { class: contentWrapperClasses }, h("hy-heading", { class: classTitle, heading: HeadingVarians.h2, section: HeadingSectionVariants.introduction }, this.textTitle), h("p", { class: classDescription }, this.textDescription), this.url && (h("div", { class: "hy-introduction__link__container" }, h("a", { class: "hy-introduction__link", href: this.url, "aria-label": this.scLabel, target: target }, this.urlTitle, h("span", { class: "hy-introduction__link__icon" }, h("hy-icon", { icon:
|
|
4995
|
+
"hy-introduction__content",
|
|
4996
|
+
this.reversed ? "hy-introduction__content--reversed" : "",
|
|
4997
|
+
this.imageUrl ? "hy-introduction__content--with-image" : "hy-introduction__content--without-image",
|
|
4998
|
+
this.limitContentWidth ? "hy-introduction__content--limit-width" : "",
|
|
4999
|
+
].join(" ");
|
|
5000
|
+
const target = this.isExternal ? "_blank" : "_self";
|
|
5001
|
+
return (h(Host, null, h("hy-box", { pt: "1.25, 1.25, 1.5, 2.5" }), h("div", { class: classAttributes }, h("hy-main-content-wrapper", null, h("div", { class: "hy-introduction__outer-content" }, h("div", { class: contentWrapperClasses }, h("hy-heading", { class: classTitle, heading: HeadingVarians.h2, section: HeadingSectionVariants.introduction }, this.textTitle), h("p", { class: classDescription }, this.textDescription), this.url && (h("div", { class: "hy-introduction__link__container" }, h("a", { class: "hy-introduction__link", href: this.url, "aria-label": this.scLabel, target: target }, this.urlTitle, h("span", { class: "hy-introduction__link__icon" }, h("hy-icon", { icon: "hy-icon-arrow-right", size: 24 })))))), this.imageUrl &&
|
|
4857
5002
|
(this.sourceSet ? (h("div", { class: "hy-introduction__image" }, h("hy-image", { "source-set": this.sourceSet, "image-url": this.imageUrl, aspectRatioWidth: 16, aspectRatioHeight: 10, "image-alt": this.imageAlt }))) : (h("div", { class: "hy-introduction__image" }, h("hy-image", { "image-url": this.imageUrl, aspectRatioWidth: 16, aspectRatioHeight: 10, "image-alt": this.imageAlt }))))))), h("hy-box", { mb: "1.75, 1.75, 2, 2.5" })));
|
|
4858
5003
|
}
|
|
4859
5004
|
get el() { return getElement(this); }
|
|
@@ -4870,7 +5015,7 @@ const HyKeyFigure = class {
|
|
|
4870
5015
|
this.description = undefined;
|
|
4871
5016
|
}
|
|
4872
5017
|
render() {
|
|
4873
|
-
const classVariant = [this.variant,
|
|
5018
|
+
const classVariant = [this.variant, "hy-key-figure"].join(" ");
|
|
4874
5019
|
return (h("div", { class: classVariant }, h("div", { class: "hy-key-figure__title" }, this.heading), h("div", { class: "hy-key-figure__description" }, this.description)));
|
|
4875
5020
|
}
|
|
4876
5021
|
};
|
|
@@ -4882,29 +5027,29 @@ const HyKeyFigureGroup = class {
|
|
|
4882
5027
|
constructor(hostRef) {
|
|
4883
5028
|
registerInstance(this, hostRef);
|
|
4884
5029
|
this.dataItems = undefined;
|
|
4885
|
-
this.headerstyle =
|
|
5030
|
+
this.headerstyle = "common";
|
|
4886
5031
|
}
|
|
4887
5032
|
async componentWillLoad() {
|
|
4888
5033
|
this._dataItems = await jsonParserWorker(this.dataItems);
|
|
4889
5034
|
}
|
|
4890
5035
|
componentDidLoad() {
|
|
4891
|
-
let hyMainDiv = this.el.closest(
|
|
5036
|
+
let hyMainDiv = this.el.closest(".hy-main");
|
|
4892
5037
|
if (hyMainDiv) {
|
|
4893
|
-
if (!hyMainDiv.classList.contains(
|
|
4894
|
-
this.headerstyle =
|
|
5038
|
+
if (!hyMainDiv.classList.contains("with-sidebar")) {
|
|
5039
|
+
this.headerstyle = "large";
|
|
4895
5040
|
}
|
|
4896
5041
|
}
|
|
4897
5042
|
}
|
|
4898
5043
|
getBoxClassName(count) {
|
|
4899
|
-
let className =
|
|
5044
|
+
let className = "box";
|
|
4900
5045
|
if (count % 3 == 0) {
|
|
4901
|
-
className =
|
|
5046
|
+
className = "box-3";
|
|
4902
5047
|
}
|
|
4903
5048
|
else if (count % 4 == 0) {
|
|
4904
|
-
className =
|
|
5049
|
+
className = "box-4";
|
|
4905
5050
|
}
|
|
4906
5051
|
else if (count % 5 == 0) {
|
|
4907
|
-
className =
|
|
5052
|
+
className = "box-5";
|
|
4908
5053
|
}
|
|
4909
5054
|
return className;
|
|
4910
5055
|
}
|
|
@@ -4919,11 +5064,11 @@ const HyKeyFigureGroup = class {
|
|
|
4919
5064
|
const keyFiguresVariant = this._dataItems.length == 4 ? KeyHighlightVariants.small : KeyHighlightVariants.default;
|
|
4920
5065
|
const classAttributes = [
|
|
4921
5066
|
keyFiguresVariant,
|
|
4922
|
-
|
|
5067
|
+
"hy-key-figure-group-container",
|
|
4923
5068
|
`hy-key-figure-group-container__${this.headerstyle}`,
|
|
4924
|
-
].join(
|
|
4925
|
-
const classRowAttributes = [
|
|
4926
|
-
const classRowCenteredAttributes = [
|
|
5069
|
+
].join(" ");
|
|
5070
|
+
const classRowAttributes = ["hy-key-figure-group"].join(" ");
|
|
5071
|
+
const classRowCenteredAttributes = ["hy-key-figure-group", "hy-key-figure-group-centered"].join(" ");
|
|
4927
5072
|
if (this._dataItems.length % 5 == 0) {
|
|
4928
5073
|
return (h(Host, null, h("div", { class: classAttributes }, h("div", { class: classRowAttributes }, this._dataItems.map((x, index) => {
|
|
4929
5074
|
if (index < 3) {
|
|
@@ -4955,7 +5100,7 @@ const HyKeyHighlight = class {
|
|
|
4955
5100
|
this.description = undefined;
|
|
4956
5101
|
}
|
|
4957
5102
|
render() {
|
|
4958
|
-
const classVariant = [this.variant,
|
|
5103
|
+
const classVariant = [this.variant, "hy-key-highlight"].join(" ");
|
|
4959
5104
|
return (h("div", { class: classVariant }, h("div", { class: "hy-key-highlight__title__container" }, h("div", { class: "hy-key-highlight__title", innerHTML: this.heading })), h("div", { class: "hy-key-highlight__description" }, this.description)));
|
|
4960
5105
|
}
|
|
4961
5106
|
};
|
|
@@ -4968,27 +5113,27 @@ const HyKeyHighlightGroup = class {
|
|
|
4968
5113
|
registerInstance(this, hostRef);
|
|
4969
5114
|
this.variant = KeyHighlightVariants.default;
|
|
4970
5115
|
this.dataItems = undefined;
|
|
4971
|
-
this.headerstyle =
|
|
5116
|
+
this.headerstyle = "common";
|
|
4972
5117
|
}
|
|
4973
5118
|
async componentWillLoad() {
|
|
4974
5119
|
this._dataItems = await jsonParserWorker(this.dataItems);
|
|
4975
5120
|
}
|
|
4976
5121
|
componentDidLoad() {
|
|
4977
|
-
let hyMainDiv = this.el.closest(
|
|
5122
|
+
let hyMainDiv = this.el.closest(".hy-main");
|
|
4978
5123
|
if (hyMainDiv) {
|
|
4979
|
-
if (!hyMainDiv.classList.contains(
|
|
4980
|
-
this.headerstyle =
|
|
5124
|
+
if (!hyMainDiv.classList.contains("with-sidebar")) {
|
|
5125
|
+
this.headerstyle = "large";
|
|
4981
5126
|
}
|
|
4982
5127
|
}
|
|
4983
5128
|
}
|
|
4984
5129
|
render() {
|
|
4985
5130
|
const classAttributes = [
|
|
4986
5131
|
this.variant,
|
|
4987
|
-
|
|
5132
|
+
"hy-key-highlight-group",
|
|
4988
5133
|
`hy-key-highlight-group__${this.headerstyle}`,
|
|
4989
|
-
].join(
|
|
5134
|
+
].join(" ");
|
|
4990
5135
|
const dataItemCount = this._dataItems.length;
|
|
4991
|
-
const classItem = dataItemCount % 4 == 0 ?
|
|
5136
|
+
const classItem = dataItemCount % 4 == 0 ? "box-4" : "box";
|
|
4992
5137
|
return (h(Host, null, h("div", { class: classAttributes }, this._dataItems.map((x) => {
|
|
4993
5138
|
return (h("hy-key-highlight", { class: classItem, variant: this.variant, heading: x.heading, description: x.description }));
|
|
4994
5139
|
}))));
|
|
@@ -5002,26 +5147,26 @@ const hyLargeProcessFlowCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e
|
|
|
5002
5147
|
const HyLargeProcessFlow = class {
|
|
5003
5148
|
constructor(hostRef) {
|
|
5004
5149
|
registerInstance(this, hostRef);
|
|
5005
|
-
this.headerstyle =
|
|
5150
|
+
this.headerstyle = "common";
|
|
5006
5151
|
this.dataItems = undefined;
|
|
5007
5152
|
}
|
|
5008
5153
|
async componentWillLoad() {
|
|
5009
5154
|
this._dataItems = await jsonParserWorker(this.dataItems);
|
|
5010
5155
|
}
|
|
5011
5156
|
componentDidLoad() {
|
|
5012
|
-
let hyMainDiv = this.el.closest(
|
|
5157
|
+
let hyMainDiv = this.el.closest(".hy-main");
|
|
5013
5158
|
if (hyMainDiv) {
|
|
5014
|
-
if (!hyMainDiv.classList.contains(
|
|
5015
|
-
this.headerstyle =
|
|
5159
|
+
if (!hyMainDiv.classList.contains("with-sidebar")) {
|
|
5160
|
+
this.headerstyle = "large";
|
|
5016
5161
|
}
|
|
5017
5162
|
}
|
|
5018
5163
|
}
|
|
5019
5164
|
render() {
|
|
5020
|
-
const classAttributes = [
|
|
5165
|
+
const classAttributes = ["hy-large-process-flow", `hy-large-process-flow__${this.headerstyle}`].join(" ");
|
|
5021
5166
|
return [
|
|
5022
5167
|
h("div", { class: classAttributes }, this._dataItems.map((x, index) => {
|
|
5023
5168
|
let phases = JSON.stringify(x.boxes);
|
|
5024
|
-
const headingClasses = index !== 0 ?
|
|
5169
|
+
const headingClasses = index !== 0 ? "hy-large-process-flow__multi-phase-title" : "hy-large-process-flow__first-phase";
|
|
5025
5170
|
return [
|
|
5026
5171
|
h("hy-heading", { class: headingClasses, heading: HeadingVarians.h3 }, x.phaseTitle),
|
|
5027
5172
|
h("hy-large-process-flow-phase", { "data-items": phases }),
|
|
@@ -5044,14 +5189,14 @@ const HyLargeProcessFlowPhase = class {
|
|
|
5044
5189
|
this._dataItems = await jsonParserWorker(this.dataItems);
|
|
5045
5190
|
}
|
|
5046
5191
|
render() {
|
|
5047
|
-
const classAttributes = [
|
|
5192
|
+
const classAttributes = ["hy-large-process-flow__phase-container"].join(" ");
|
|
5048
5193
|
return (h("div", { class: classAttributes }, this._dataItems.map((x, index) => {
|
|
5049
5194
|
var items;
|
|
5050
5195
|
if (x.links && x.links.length > 0) {
|
|
5051
5196
|
let linkItems = x.links;
|
|
5052
5197
|
let linkItemsCount = x.links.length;
|
|
5053
5198
|
items = linkItems.map((item, index) => {
|
|
5054
|
-
let classLinks = index == linkItemsCount - 1 ?
|
|
5199
|
+
let classLinks = index == linkItemsCount - 1 ? "phase-link last" : "phase-link";
|
|
5055
5200
|
return item ? (h("hy-cta-link", { class: classLinks, "link-content": item.label, "sc-label": item.ariaLabel, "is-external": item.isExternal, url: item.url })) : null;
|
|
5056
5201
|
});
|
|
5057
5202
|
}
|
|
@@ -5069,15 +5214,15 @@ const Link = class {
|
|
|
5069
5214
|
constructor(hostRef) {
|
|
5070
5215
|
registerInstance(this, hostRef);
|
|
5071
5216
|
this.variant = LinkVariants.default;
|
|
5072
|
-
this.linkContent =
|
|
5217
|
+
this.linkContent = "";
|
|
5073
5218
|
this.url = undefined;
|
|
5074
5219
|
this.scLabel = undefined;
|
|
5075
5220
|
this.isExternal = false;
|
|
5076
5221
|
}
|
|
5077
5222
|
render() {
|
|
5078
|
-
const classAttributes = [
|
|
5079
|
-
const target = this.isExternal ?
|
|
5080
|
-
return (h(Host, null, h("a", { "aria-label": this.scLabel, class: classAttributes.join(
|
|
5223
|
+
const classAttributes = ["hy-link", this.variant];
|
|
5224
|
+
const target = this.isExternal ? "_blank" : "_self";
|
|
5225
|
+
return (h(Host, null, h("a", { "aria-label": this.scLabel, class: classAttributes.join(" "), href: this.url, target: target }, this.linkContent)));
|
|
5081
5226
|
}
|
|
5082
5227
|
};
|
|
5083
5228
|
Link.style = linkCss;
|
|
@@ -5099,56 +5244,56 @@ const LinkBox = class {
|
|
|
5099
5244
|
this.isExternal = false;
|
|
5100
5245
|
this.scLabel = undefined;
|
|
5101
5246
|
this.readMoreLabel = undefined;
|
|
5102
|
-
this.headerstyle =
|
|
5247
|
+
this.headerstyle = "common";
|
|
5103
5248
|
this.sourceSet = undefined;
|
|
5104
5249
|
}
|
|
5105
5250
|
srcSetWatcher(data) {
|
|
5106
|
-
this._sourceSet = typeof data ===
|
|
5251
|
+
this._sourceSet = typeof data === "string" ? JSON.parse(data) : data;
|
|
5107
5252
|
}
|
|
5108
5253
|
componentWillLoad() {
|
|
5109
5254
|
this.srcSetWatcher(this.sourceSet);
|
|
5110
5255
|
}
|
|
5111
5256
|
componentDidLoad() {
|
|
5112
|
-
let hyMainDiv = this.el.closest(
|
|
5257
|
+
let hyMainDiv = this.el.closest(".hy-main");
|
|
5113
5258
|
if (hyMainDiv) {
|
|
5114
|
-
if (!hyMainDiv.classList.contains(
|
|
5115
|
-
this.headerstyle =
|
|
5259
|
+
if (!hyMainDiv.classList.contains("with-sidebar")) {
|
|
5260
|
+
this.headerstyle = "large";
|
|
5116
5261
|
}
|
|
5117
5262
|
}
|
|
5118
5263
|
}
|
|
5119
5264
|
render() {
|
|
5120
|
-
const classContainerAttributes = [
|
|
5265
|
+
const classContainerAttributes = ["hy-link-box-container"].join(" ");
|
|
5121
5266
|
const classAttributes = [
|
|
5122
|
-
|
|
5267
|
+
"hy-link-box",
|
|
5123
5268
|
this.variant,
|
|
5124
5269
|
`hy-link-box__${this.variant}`,
|
|
5125
5270
|
this.headerstyle,
|
|
5126
5271
|
`hy-link-box__${this.headerstyle}`,
|
|
5127
|
-
this.imageUrl ?
|
|
5128
|
-
].join(
|
|
5129
|
-
const classTextContainer = [
|
|
5272
|
+
this.imageUrl ? "hy-link-box--with-image" : null,
|
|
5273
|
+
].join(" ");
|
|
5274
|
+
const classTextContainer = ["hy-link-box__text-container", this.imageUrl ? "hy-link-box--with-image" : null].join(" ");
|
|
5130
5275
|
const classTitle = [
|
|
5131
|
-
|
|
5276
|
+
"hy-link-box__text-container__title",
|
|
5132
5277
|
`hy-link-box__text-container__title__${this.variant}`,
|
|
5133
5278
|
`hy-link-box__text-container__title__${this.headerstyle}`,
|
|
5134
|
-
this.imageUrl ?
|
|
5135
|
-
this.imageUrl ?
|
|
5136
|
-
].join(
|
|
5279
|
+
this.imageUrl ? "hy-link-box__text-container__title__image" : "",
|
|
5280
|
+
this.imageUrl ? "image" : "",
|
|
5281
|
+
].join(" ");
|
|
5137
5282
|
const classDescription = [
|
|
5138
|
-
|
|
5283
|
+
"hy-link-box__text-container__description",
|
|
5139
5284
|
`hy-link-box__text-container__description__${this.variant}`,
|
|
5140
5285
|
`hy-link-box__text-container__description__${this.headerstyle}`,
|
|
5141
|
-
].join(
|
|
5142
|
-
const target = this.isExternal ?
|
|
5286
|
+
].join(" ");
|
|
5287
|
+
const target = this.isExternal ? "_blank" : "_self";
|
|
5143
5288
|
const aspectRatioWidth = 16;
|
|
5144
5289
|
const aspectRatioHeight = 10;
|
|
5145
5290
|
const aspect = (aspectRatioHeight / aspectRatioWidth) * 100;
|
|
5146
5291
|
const aspectRatio = {
|
|
5147
|
-
|
|
5292
|
+
"--aspectRatio": `${aspect}%`,
|
|
5148
5293
|
};
|
|
5149
5294
|
return [
|
|
5150
5295
|
h("article", { class: classContainerAttributes }, h("div", { class: classAttributes }, this.imageUrl &&
|
|
5151
|
-
(this._sourceSet ? (h("figure", { class: "hy-link-box__image-container", style: aspectRatio }, h("picture", null, this._sourceSet.map((item) => (h("source", { srcSet: item.src, media: item.media, type: item.type, sizes: item.sizes ? item.sizes :
|
|
5296
|
+
(this._sourceSet ? (h("figure", { class: "hy-link-box__image-container", style: aspectRatio }, h("picture", null, this._sourceSet.map((item) => (h("source", { srcSet: item.src, media: item.media, type: item.type, sizes: item.sizes ? item.sizes : "" }))), h("img", { loading: this.disableLazy ? "eager" : "lazy", "aria-hidden": "true", src: this.imageUrl, alt: this.imageAlt })))) : (h("figure", { class: "hy-link-box__image-container", style: aspectRatio }, h("img", { loading: this.disableLazy ? "eager" : "lazy", "aria-hidden": "true", src: this.imageUrl, alt: this.imageAlt })))), !this.imageUrl && this.showLogo && (h("div", { "aria-hidden": "true", class: "hy-link-box__image-container is-image-missing" }, h("hy-icon", { class: { "hy-site-logo__icon": true }, icon: "hy-icon-hy-logo" }))), h("div", { class: classTextContainer }, h("h3", { class: classTitle }, this.textTitle), this.textDescription && (h("p", { class: classDescription }, this.textDescription.length >= 141 ? this.textDescription.slice(0, 140) + "..." : this.textDescription)))), h("a", { "aria-label": this.scLabel || `${this.readMoreLabel} - ${this.textTitle}`, title: this.scLabel || `${this.readMoreLabel} - ${this.textTitle}`, href: this.url, target: target, class: `hy-cta-link hy-cta-link--default` }, h("span", { "aria-hidden": "true" }), h("span", null, this.readMoreLabel), h("span", { class: `hy-cta-link__icon ${this.isExternal ? "hy-cta-link__icon--external" : ""}` }, h("hy-icon", { icon: "hy-icon-arrow-to-right", size: 24 })))),
|
|
5152
5297
|
];
|
|
5153
5298
|
}
|
|
5154
5299
|
get el() { return getElement(this); }
|
|
@@ -5163,7 +5308,7 @@ const linkBoxListCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--b
|
|
|
5163
5308
|
const LinkBoxList = class {
|
|
5164
5309
|
constructor(hostRef) {
|
|
5165
5310
|
registerInstance(this, hostRef);
|
|
5166
|
-
this.headerstyle =
|
|
5311
|
+
this.headerstyle = "common";
|
|
5167
5312
|
this.variant = LinkBoxVariants.default;
|
|
5168
5313
|
this.readMoreLabel = undefined;
|
|
5169
5314
|
this.dataItems = undefined;
|
|
@@ -5172,20 +5317,20 @@ const LinkBoxList = class {
|
|
|
5172
5317
|
this._dataItems = await jsonParserWorker(this.dataItems);
|
|
5173
5318
|
}
|
|
5174
5319
|
componentDidLoad() {
|
|
5175
|
-
let hyMainDiv = this.el.closest(
|
|
5320
|
+
let hyMainDiv = this.el.closest(".hy-main");
|
|
5176
5321
|
if (hyMainDiv) {
|
|
5177
|
-
if (!hyMainDiv.classList.contains(
|
|
5178
|
-
this.headerstyle =
|
|
5322
|
+
if (!hyMainDiv.classList.contains("with-sidebar")) {
|
|
5323
|
+
this.headerstyle = "large";
|
|
5179
5324
|
}
|
|
5180
5325
|
}
|
|
5181
5326
|
}
|
|
5182
5327
|
render() {
|
|
5183
5328
|
const classAttributes = [
|
|
5184
|
-
|
|
5329
|
+
"hy-link-box-list",
|
|
5185
5330
|
this.variant,
|
|
5186
5331
|
`hy-link-box-list__${this.variant}`,
|
|
5187
5332
|
`hy-link-box-list__${this.headerstyle}`,
|
|
5188
|
-
].join(
|
|
5333
|
+
].join(" ");
|
|
5189
5334
|
/*
|
|
5190
5335
|
- Logic:
|
|
5191
5336
|
- 3 items: big
|
|
@@ -5196,7 +5341,7 @@ const LinkBoxList = class {
|
|
|
5196
5341
|
- 8 items: small
|
|
5197
5342
|
- 9 items: big
|
|
5198
5343
|
* */
|
|
5199
|
-
const classItemAttributes = [this.variant, `hy-link-box__${this.variant}`].join(
|
|
5344
|
+
const classItemAttributes = [this.variant, `hy-link-box__${this.variant}`].join(" ");
|
|
5200
5345
|
return (h(Host, null, h("ul", { class: classAttributes }, this._dataItems.map((x) => {
|
|
5201
5346
|
return (h("li", null, h("hy-link-box", { class: classItemAttributes, variant: this.variant, "source-set": x.imageSets, "image-url": x.imageUrl, "image-alt": x.imageAlt, "text-title": x.heading, "text-description": x.description, "show-logo": x.showLogo, url: x.boxUrl, "is-external": x.isExternal, "sc-label": x.ariaLabel, "read-more-label": this.readMoreLabel })));
|
|
5202
5347
|
})), h("hy-box", { mb: "1.75, 1.75, 2, 2.5" })));
|
|
@@ -5210,32 +5355,32 @@ const hyLinkListCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--br
|
|
|
5210
5355
|
const HyLinkList = class {
|
|
5211
5356
|
constructor(hostRef) {
|
|
5212
5357
|
registerInstance(this, hostRef);
|
|
5213
|
-
this.headerstyle =
|
|
5358
|
+
this.headerstyle = "default";
|
|
5214
5359
|
this.dataItems = undefined;
|
|
5215
|
-
this.listHeading =
|
|
5360
|
+
this.listHeading = "";
|
|
5216
5361
|
this.variation = undefined;
|
|
5217
|
-
this.headingVariant =
|
|
5362
|
+
this.headingVariant = "h2";
|
|
5218
5363
|
}
|
|
5219
5364
|
async componentWillLoad() {
|
|
5220
5365
|
this._dataItems = await jsonParserWorker(this.dataItems);
|
|
5221
5366
|
}
|
|
5222
5367
|
componentDidLoad() {
|
|
5223
|
-
let hyMainDiv = this.el.closest(
|
|
5368
|
+
let hyMainDiv = this.el.closest(".hy-main");
|
|
5224
5369
|
if (hyMainDiv) {
|
|
5225
|
-
if (!hyMainDiv.classList.contains(
|
|
5226
|
-
this.headerstyle =
|
|
5370
|
+
if (!hyMainDiv.classList.contains("with-sidebar")) {
|
|
5371
|
+
this.headerstyle = "large";
|
|
5227
5372
|
}
|
|
5228
5373
|
}
|
|
5229
5374
|
}
|
|
5230
5375
|
render() {
|
|
5231
5376
|
const linkVariant = CtaLinkVariants.linkList;
|
|
5232
5377
|
const HeadingVariant = this.headingVariant.toLowerCase();
|
|
5233
|
-
let columnType =
|
|
5378
|
+
let columnType = "col-3";
|
|
5234
5379
|
if (this._dataItems.length === 7 || this._dataItems.length % 4 === 0) {
|
|
5235
|
-
columnType =
|
|
5380
|
+
columnType = "col-4";
|
|
5236
5381
|
}
|
|
5237
5382
|
return [
|
|
5238
|
-
h("section", { class: `hy-link-list hy-link-list__${this.headerstyle}` }, this.listHeading.length > 0 && (h(HeadingVariant, { class:
|
|
5383
|
+
h("section", { class: `hy-link-list hy-link-list__${this.headerstyle}` }, this.listHeading.length > 0 && (h(HeadingVariant, { class: "hy-link-list__title" }, this.listHeading)), h("ul", { class: `hy-link-list__links hy-link-list__links--${this.variation} ${this.variation === "grid" ? columnType : ""}` }, this._dataItems.map(({ heading, ariaLabel, url, isExternal }) => (h("li", { class: "hy-link-list__links-item" }, h("hy-cta-link", { variant: linkVariant, "link-content": heading, "sc-label": ariaLabel, url: url, "is-external": isExternal })))))),
|
|
5239
5384
|
];
|
|
5240
5385
|
}
|
|
5241
5386
|
get el() { return getElement(this); }
|
|
@@ -5245,8 +5390,8 @@ HyLinkList.style = hyLinkListCss;
|
|
|
5245
5390
|
const hyListItemCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand-main-bright:#48c5f8;--brand-main-light:#107eab;--brand-main-active:#005379;--brand-main-dark:#003146;--brand-main-nearly-black:#000222;--link-blue:#0479a4;--link-disabled:#767676;--grayscale-white:#fff;--grayscale-slightly-gray:#fefefe;--grayscale-light:#f8f8f8;--grayscale-medium:#d2d2d2;--grayscale-background-box:#f5f5f5;--grayscale-tabs-border:#e6e6e6;--grayscale-background-arrow:#dfdfdf;--grayscale-medium-dark:#979797;--grayscale-dark:#555555;--grayscale-dark-text:#222222;--grayscale-black:#000000;--additional-red-light:#e5053a;--additional-red-dark:#a31621;--additional-purple-light:#420039;--additional-yellow-light:#f9a21a;--additional-yellow:#c47f1b;--additional-skyblue:#48c5f8;--additional-orange:#d14600;--additional-green-light:#96ba3c;--additional-green-dark:#006400;--hover-gray:#eaeaea}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{--gutter-mobile:16px;--gutter-narrow:24px;--gutter-medium:24px;--gutter-wide:24px;--gutter-extrawide:32px}:root{--breakpoint-extrawide:75.0625rem;--breakpoint-max-width:75.0625rem;--breakpoint-medium:48rem;--breakpoint-narrow:30rem;--breakpoint-wide:60rem}:host{display:block}.hy-list-item{display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--main-font-family);text-decoration:none}.hy-list-item__default{margin-bottom:28px}@media (min-width: 60rem){.hy-list-item__default{margin-bottom:32px}}.hy-list-item__default__info-container__header{font-size:0.75rem;line-height:14px;color:var(--grayscale-dark);letter-spacing:0;margin-bottom:4px}@media (min-width: 30rem){.hy-list-item__default__info-container__header{font-size:0.875rem;line-height:18px;margin-bottom:2px}}.hy-list-item__default__info-container__title{font-size:1.125rem;line-height:22px;font-weight:700;color:var(--brand-main-light);letter-spacing:-0.56px;margin-bottom:6px}@media (min-width: 30rem){.hy-list-item__default__info-container__title{font-size:1.375rem;line-height:28px;letter-spacing:-0.69px;margin-bottom:10px}}@media (min-width: 1601px){.hy-list-item__default__info-container__title{font-size:1.625rem;line-height:32px;letter-spacing:-0.8px;margin-bottom:8px}}@media (min-width: 75.0625rem){.hy-list-item__default__info-container__title__large{font-size:1.625rem;line-height:32px;letter-spacing:-0.8px;margin-bottom:8px}}.hy-list-item__default__info-container__link-container{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;margin-bottom:6px}@media (min-width: 30rem){.hy-list-item__default__info-container__link-container{margin-bottom:8px}}.hy-list-item__default__info-container__link{font-size:0.75rem;line-height:16px;color:var(--grayscale-dark);letter-spacing:-0.07px;margin-left:4px}@media (min-width: 30rem){.hy-list-item__default__info-container__link{margin-left:5px}}.hy-list-item__default__info-container__link__icon svg{fill:var(--grayscale-dark)}.hy-list-item__default__info-container__description{font-size:0.875rem;line-height:20px;color:var(--grayscale-black);letter-spacing:0}@media (min-width: 30rem){.hy-list-item__default__info-container__description{font-size:1rem;line-height:24px}}.hy-list-item__position{background:radial-gradient(circle, var(--grayscale-light) 0%, var(--grayscale-background-box) 100%);-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}@media (min-width: 30rem){.hy-list-item__position{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}}.hy-list-item__position__info-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;margin:0;padding:12px;position:relative}@media (min-width: 60rem){.hy-list-item__position__info-container{padding:12px 16px}}@media (min-width: 1601px){.hy-list-item__position__info-container{padding:20px 24px}}.hy-list-item__position__info-container__header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;color:var(--brand-main);font-family:var(--main-font-family);font-size:14px;font-weight:600;letter-spacing:-0.2px;line-height:14px;margin-bottom:14px}.hy-list-item__position__info-container__header .icon{margin-right:0.75rem}.hy-list-item__position__info-container__header .icon svg{fill:var(--brand-main)}@media (min-width: 75.0625rem){.hy-list-item__position__info-container__large{padding:20px 24px}}.hy-list-item__position__info-container__data{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.hy-list-item__position__info-container__title{font-size:1.125rem;line-height:20px;font-weight:700;font-family:var(--main-font-family);color:var(--grayscale-black);margin-bottom:12px;letter-spacing:-0.45px;line-height:22px}@media (min-width: 30rem){.hy-list-item__position__info-container__title{letter-spacing:-0.5px}}.hy-list-item__position__info-container__description{font-size:0.875rem;color:var(--grayscale-dark-text);display:none;font-family:var(--main-font-family);letter-spacing:0.8px;margin-bottom:14px;line-height:20px}@media (min-width: 30rem){.hy-list-item__position__info-container__description{display:block}}.hy-list-item__position__info-container__outgoing-link{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;position:relative;padding:0 24px 24px 12px}@media (min-width: 30rem){.hy-list-item__position__info-container__outgoing-link{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;padding:0 24px 24px 0}}.hy-list-item__position__info-container__outgoing-link .label{color:var(--link-blue);font-family:var(--main-font-family);font-size:16px;font-weight:600;letter-spacing:-0.3px;line-height:20px}.hy-list-item__position__info-container__outgoing-link .icon{margin-right:4px;margin-bottom:2px}.hy-list-item__position__info-container__outgoing-link .icon svg{fill:var(--link-blue)}.hy-list-item__degree{background:radial-gradient(circle, var(--grayscale-light) 0%, var(--grayscale-background-box) 100%);-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}@media (min-width: 30rem){.hy-list-item__degree{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}}.hy-list-item__degree__image-container{display:block;position:relative;-webkit-box-flex:1;-ms-flex:1;flex:1}@media (min-width: 30rem){.hy-list-item__degree__image-container{-webkit-box-flex:0;-ms-flex:0 0 24%;flex:0 0 24%}}.hy-list-item__degree__image-container__image{vertical-align:bottom;max-width:100%;height:100%}.hy-list-item__degree__image-container__image img{-o-object-fit:cover;object-fit:cover;width:100%;height:100%}.hy-list-item__degree__image-container span{font-weight:600;font-size:0.75rem;line-height:14px;background-color:var(--additional-yellow);-webkit-box-shadow:0 2px 8px 0 rgba(0, 0, 0, 0.05);box-shadow:0 2px 8px 0 rgba(0, 0, 0, 0.05);color:var(--grayscale-black);left:-4px;letter-spacing:-0.07px;padding:5px 8px;position:absolute;top:16px;text-transform:uppercase}@media (min-width: 30rem){.hy-list-item__degree__image-container span{left:-8px}}@media (min-width: 60rem){.hy-list-item__degree__image-container span{top:22px}}.hy-list-item__degree__info-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;margin:0;padding:12px;position:relative}@media (min-width: 60rem){.hy-list-item__degree__info-container{padding:12px 16px}}@media (min-width: 1601px){.hy-list-item__degree__info-container{padding:20px 24px}}@media (min-width: 75.0625rem){.hy-list-item__degree__info-container__large{padding:20px 24px}}.hy-list-item__degree__info-container__data{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.hy-list-item__degree__info-container__title{font-size:1.125rem;line-height:22px;font-weight:700;color:var(--link-blue);letter-spacing:-0.54px;margin-bottom:8px}@media (min-width: 60rem){.hy-list-item__degree__info-container__title{font-size:1.125rem;line-height:24px;letter-spacing:-0.5px}}@media (min-width: 1601px){.hy-list-item__degree__info-container__title{font-size:1.25rem;line-height:26px;letter-spacing:-0.6px}}@media (min-width: 75.0625rem){.hy-list-item__degree__info-container__title__large{font-size:1.25rem;line-height:26px;letter-spacing:-0.6px}}.hy-list-item__degree__info-container__description{font-size:0.875rem;line-height:18px;color:var(--grayscale-dark);letter-spacing:0;margin-bottom:16px}@media (min-width: 60rem){.hy-list-item__degree__info-container__description{letter-spacing:-0.2}}@media (min-width: 1601px){.hy-list-item__degree__info-container__description{font-size:1rem;line-height:20px;letter-spacing:-0.25px}}@media (min-width: 75.0625rem){.hy-list-item__degree__info-container__description__large{font-size:1rem;line-height:20px;letter-spacing:-0.25px}}.hy-list-item__degree__info-container__metadata-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;margin-top:16px;width:100%}@media (min-width: 30rem){.hy-list-item__degree__info-container__metadata-wrapper{-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}}.hy-list-item__degree__info-container__metadata-wrapper.link-only{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.hy-list-item__degree__info-container__additional-info{width:100%}.hy-list-item__degree__info-container__additional-info__item{font-size:0.75rem;line-height:16px;font-weight:300;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--grayscale-black);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;letter-spacing:-0.2px}@media (min-width: 1601px){.hy-list-item__degree__info-container__additional-info__item{font-size:0.875rem;line-height:16px}}@media (min-width: 75.0625rem){.hy-list-item__degree__info-container__additional-info__item__large{font-size:0.875rem;line-height:16px}}.hy-list-item__degree__info-container__additional-info__item.active::before{content:\" \";-webkit-box-sizing:border-box;box-sizing:border-box;height:14px;width:14px;border:3px solid #ffffff;border-radius:50%;background-color:#f9a21a;left:-7px;position:absolute}@media (min-width: 30rem){.hy-list-item__degree__info-container__additional-info__item.active::before{border:none;height:8px;margin-right:6px;width:8px;left:0;position:relative}}.hy-list-item__degree__info-container__outgoing-link{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;position:relative;width:100%}.hy-list-item__degree__info-container__outgoing-link a{-webkit-box-align:center;-ms-flex-align:center;align-items:center;bottom:0;top:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;position:relative;right:-18px;text-decoration:none}@media (min-width: 60rem){.hy-list-item__degree__info-container__outgoing-link a{right:-22px}}@media (min-width: 1601px){.hy-list-item__degree__info-container__outgoing-link a{right:-30px}}.hy-list-item__degree__info-container__outgoing-link a .label{font-size:0.875rem;line-height:16px;font-weight:700;color:var(--link-blue);letter-spacing:-0.5px;margin-right:8px;text-align:right}.hy-list-item__degree__info-container__outgoing-link a .icon-wrapper{background-color:var(--brand-main-light);z-index:10}.hy-list-item__degree__info-container__outgoing-link a .icon-wrapper .icon{position:relative;overflow:hidden}.hy-list-item__degree__info-container__outgoing-link a .icon-wrapper .icon svg{background-color:transparent;-webkit-box-shadow:0 2px 8px 0 rgba(0, 0, 0, 0.1);box-shadow:0 2px 8px 0 rgba(0, 0, 0, 0.1);fill:var(--grayscale-white);padding:6.4px}@media (min-width: 1601px){.hy-list-item__degree__info-container__outgoing-link a .icon-wrapper .icon svg{height:36px;width:36px;padding:7.2px}}@media (min-width: 75.0625rem){.hy-list-item__degree__info-container__outgoing-link__large svg{height:36px;width:36px;padding:7.2px}}.hy-list-item-wrapper{font-family:var(--main-font-family)}.hy-list-item-wrapper__degree{margin-bottom:16px}@media (min-width: 30rem){.hy-list-item-wrapper__degree{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;margin-bottom:24px}}@media (min-width: 60rem){.hy-list-item-wrapper__degree{margin-bottom:28px}}@media (min-width: 1601px){.hy-list-item-wrapper__degree{margin-bottom:32px}}@media (min-width: 75.0625rem){.hy-list-item-wrapper__degree__large{margin-bottom:32px}}.hy-list-item-wrapper__degree__related-info{background:radial-gradient(circle, #f8f8f8 0%, #f5f5f5 100%);margin-top:4px;padding:0 12px 0 16px}@media (min-width: 30rem){.hy-list-item-wrapper__degree__related-info{padding:0 24px 0 16px}}@media (min-width: 60rem){.hy-list-item-wrapper__degree__related-info{margin-top:6px;padding:0 24px 0 24px}}@media (min-width: 1601px){.hy-list-item-wrapper__degree__related-info{margin-top:8px}}@media (min-width: 75.0625rem){.hy-list-item-wrapper__degree__related-info__large{margin-top:8px}}.hy-list-item-wrapper__degree__related-info__heading__link{text-decoration:none}.hy-list-item-wrapper__degree__related-info__heading__button{font-size:0.75rem;line-height:16px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:radial-gradient(circle, #f8f8f8 0%, #f5f5f5 100%);border:none;color:var(--grayscale-black);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;font-family:var(--main-font-family);letter-spacing:-0.2px;height:100%;padding:8px 0;text-align:left;width:100%}@media (min-width: 30rem){.hy-list-item-wrapper__degree__related-info__heading__button{font-size:0.75rem;line-height:20px;padding:14px 0}}@media (min-width: 60rem){.hy-list-item-wrapper__degree__related-info__heading__button{font-size:0.875rem;line-height:20px;letter-spacing:-0.4px;padding:18px 0}}.hy-list-item-wrapper__degree__related-info__heading__button:hover{cursor:pointer}.hy-list-item-wrapper__degree__related-info__heading__button__is-open svg{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.hy-list-item-wrapper__degree__related-info__heading__icon{margin-right:0.5rem;z-index:0}@media (min-width: 60rem){.hy-list-item-wrapper__degree__related-info__heading__icon{margin-right:12px}}.hy-list-item-wrapper__degree__related-info__heading__icon svg{fill:var(--brand-main);height:14px;width:14px}@media (min-width: 60rem){.hy-list-item-wrapper__degree__related-info__heading__icon svg{height:18px;width:18px}}.hy-list-item-wrapper__degree__related-info__content{display:none}.hy-list-item-wrapper__degree__related-info__content__is-open{border-top:1px solid #d2d2d2;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;padding:20px 8px 5px 8px}@media (min-width: 60rem){.hy-list-item-wrapper__degree__related-info__content__is-open{padding:20px 0 14px 0}}.hy-list-item-wrapper__degree__related-info__link{font-size:0.875rem;line-height:16px;font-weight:700;color:var(--link-blue);letter-spacing:-0.4px;margin-bottom:16px;text-decoration:none}";
|
|
5246
5391
|
|
|
5247
5392
|
let keys$2 = {
|
|
5248
|
-
enter:
|
|
5249
|
-
space:
|
|
5393
|
+
enter: "Enter",
|
|
5394
|
+
space: "Space",
|
|
5250
5395
|
};
|
|
5251
5396
|
const HyListItem = class {
|
|
5252
5397
|
constructor(hostRef) {
|
|
@@ -5265,9 +5410,9 @@ const HyListItem = class {
|
|
|
5265
5410
|
this.relatedLinksBlockTitle = undefined;
|
|
5266
5411
|
this.relatedLinks = undefined;
|
|
5267
5412
|
this.imageLabel = undefined;
|
|
5268
|
-
this.outGoingUrlLabel =
|
|
5413
|
+
this.outGoingUrlLabel = "Go to programme page";
|
|
5269
5414
|
this.additionalInfo = undefined;
|
|
5270
|
-
this.headerstyle =
|
|
5415
|
+
this.headerstyle = "common";
|
|
5271
5416
|
this.sourceSet = undefined;
|
|
5272
5417
|
this.truncateDescription = false;
|
|
5273
5418
|
this.truncateLimit = 140;
|
|
@@ -5275,7 +5420,7 @@ const HyListItem = class {
|
|
|
5275
5420
|
this._imageMinWidth = 0;
|
|
5276
5421
|
}
|
|
5277
5422
|
relatedLinksWatcher(newValue) {
|
|
5278
|
-
if (typeof newValue ===
|
|
5423
|
+
if (typeof newValue === "string") {
|
|
5279
5424
|
this._relatedLinks = JSON.parse(newValue);
|
|
5280
5425
|
}
|
|
5281
5426
|
else {
|
|
@@ -5283,7 +5428,7 @@ const HyListItem = class {
|
|
|
5283
5428
|
}
|
|
5284
5429
|
}
|
|
5285
5430
|
additionalInfoWatcher(newValue) {
|
|
5286
|
-
if (typeof newValue ===
|
|
5431
|
+
if (typeof newValue === "string") {
|
|
5287
5432
|
this._additionalInfo = JSON.parse(newValue);
|
|
5288
5433
|
}
|
|
5289
5434
|
else {
|
|
@@ -5291,11 +5436,11 @@ const HyListItem = class {
|
|
|
5291
5436
|
}
|
|
5292
5437
|
}
|
|
5293
5438
|
srcSetWatcher(data) {
|
|
5294
|
-
this._sourceSet = typeof data ===
|
|
5439
|
+
this._sourceSet = typeof data === "string" ? JSON.parse(data) : data;
|
|
5295
5440
|
}
|
|
5296
5441
|
expandRelatedInfoPanel(target) {
|
|
5297
5442
|
let contentSelector = `hy-list-item-wrapper__${this.variant}__related-info__content`;
|
|
5298
|
-
let targetButtonClass =
|
|
5443
|
+
let targetButtonClass = "hy-list-item-wrapper__degree__related-info__heading__button";
|
|
5299
5444
|
let contentSection = document.querySelectorAll(`[aria-labelledBy="${target.id}"]`)[0];
|
|
5300
5445
|
if (contentSection) {
|
|
5301
5446
|
if (!this.isExpandedRelatedContent) {
|
|
@@ -5313,12 +5458,12 @@ const HyListItem = class {
|
|
|
5313
5458
|
const key = event.code;
|
|
5314
5459
|
let target = event.target;
|
|
5315
5460
|
const targetElement = target.tagName.toLowerCase();
|
|
5316
|
-
const possibleTags = [targetElement].some((r) => [
|
|
5461
|
+
const possibleTags = [targetElement].some((r) => ["svg", "path", "button", "a"].indexOf(r) >= 0);
|
|
5317
5462
|
if (target &&
|
|
5318
5463
|
possibleTags &&
|
|
5319
|
-
!target.classList.contains(
|
|
5464
|
+
!target.classList.contains("hy-list-item-wrapper__degree__related-info__link") &&
|
|
5320
5465
|
[keys$2.enter, keys$2.space].includes(key)) {
|
|
5321
|
-
if (targetElement !==
|
|
5466
|
+
if (targetElement !== "button") {
|
|
5322
5467
|
target = target.closest(`.hy-list-item-wrapper__${this.variant}__related-info__heading__button`);
|
|
5323
5468
|
}
|
|
5324
5469
|
this.expandRelatedInfoPanel(target);
|
|
@@ -5328,9 +5473,9 @@ const HyListItem = class {
|
|
|
5328
5473
|
handleClick(event) {
|
|
5329
5474
|
let target = event.target;
|
|
5330
5475
|
const targetElement = target.tagName.toLowerCase();
|
|
5331
|
-
const possibleTags = [targetElement].some((r) => [
|
|
5332
|
-
if (target && possibleTags && !target.classList.contains(
|
|
5333
|
-
if (targetElement !==
|
|
5476
|
+
const possibleTags = [targetElement].some((r) => ["svg", "path", "button", "a"].indexOf(r) >= 0);
|
|
5477
|
+
if (target && possibleTags && !target.classList.contains("hy-list-item-wrapper__degree__related-info__link")) {
|
|
5478
|
+
if (targetElement !== "button") {
|
|
5334
5479
|
target = target.closest(`.hy-list-item-wrapper__${this.variant}__related-info__heading__button`);
|
|
5335
5480
|
}
|
|
5336
5481
|
this.expandRelatedInfoPanel(target);
|
|
@@ -5344,16 +5489,16 @@ const HyListItem = class {
|
|
|
5344
5489
|
this.srcSetWatcher(this.sourceSet);
|
|
5345
5490
|
}
|
|
5346
5491
|
componentDidLoad() {
|
|
5347
|
-
let hyMainDiv = this.el.closest(
|
|
5492
|
+
let hyMainDiv = this.el.closest(".hy-main");
|
|
5348
5493
|
if (hyMainDiv) {
|
|
5349
|
-
if (!hyMainDiv.classList.contains(
|
|
5350
|
-
this.headerstyle =
|
|
5494
|
+
if (!hyMainDiv.classList.contains("with-sidebar")) {
|
|
5495
|
+
this.headerstyle = "large";
|
|
5351
5496
|
}
|
|
5352
5497
|
}
|
|
5353
5498
|
if (this.variant == ListItemVariants.degreeProgramme) {
|
|
5354
|
-
const image = document.querySelector(
|
|
5499
|
+
const image = document.querySelector(".hy-list-item__degree__image-container__image img");
|
|
5355
5500
|
if (image) {
|
|
5356
|
-
image.addEventListener(
|
|
5501
|
+
image.addEventListener("load", function () {
|
|
5357
5502
|
const outputImageAspectRatio = 1;
|
|
5358
5503
|
const imageHeight = image.naturalHeight;
|
|
5359
5504
|
const imageWidth = image.naturalWidth;
|
|
@@ -5372,15 +5517,15 @@ const HyListItem = class {
|
|
|
5372
5517
|
}
|
|
5373
5518
|
render() {
|
|
5374
5519
|
const classWrapperAttributes = [
|
|
5375
|
-
|
|
5520
|
+
"hy-list-item-wrapper",
|
|
5376
5521
|
`hy-list-item-wrapper__${this.variant}`,
|
|
5377
5522
|
`hy-list-item-wrapper__${this.variant}__${this.headerstyle}`,
|
|
5378
|
-
].join(
|
|
5379
|
-
const classAttributes = [
|
|
5523
|
+
].join(" ");
|
|
5524
|
+
const classAttributes = ["hy-list-item", `hy-list-item__${this.variant}`].join(" ");
|
|
5380
5525
|
const classInfoContainerAttributes = [
|
|
5381
5526
|
`hy-list-item__${this.variant}__info-container`,
|
|
5382
5527
|
`hy-list-item__${this.variant}__info-container__${this.headerstyle}`,
|
|
5383
|
-
].join(
|
|
5528
|
+
].join(" ");
|
|
5384
5529
|
/*const classInfoContainerDataAttributes = [
|
|
5385
5530
|
`hy-list-item__${this.variant}__info-container__data`,
|
|
5386
5531
|
`hy-list-item__${this.variant}__info-container__data__${this.headerstyle}`,
|
|
@@ -5388,91 +5533,91 @@ const HyListItem = class {
|
|
|
5388
5533
|
const classInfoContainerHeader = [
|
|
5389
5534
|
`hy-list-item__${this.variant}__info-container__header`,
|
|
5390
5535
|
`hy-list-item__${this.variant}__info-container__header__${this.headerstyle}`,
|
|
5391
|
-
].join(
|
|
5536
|
+
].join(" ");
|
|
5392
5537
|
const classInfoContainerTitle = [
|
|
5393
5538
|
`hy-list-item__${this.variant}__info-container__title`,
|
|
5394
5539
|
`hy-list-item__${this.variant}__info-container__title__${this.headerstyle}`,
|
|
5395
|
-
].join(
|
|
5540
|
+
].join(" ");
|
|
5396
5541
|
const classInfoContainerDescription = [
|
|
5397
5542
|
`hy-list-item__${this.variant}__info-container__description`,
|
|
5398
5543
|
`hy-list-item__${this.variant}__info-container__description__${this.headerstyle}`,
|
|
5399
|
-
].join(
|
|
5400
|
-
const classInfoContainerLinkContainer = [`hy-list-item__${this.variant}__info-container__link-container`].join(
|
|
5401
|
-
const classInfoContainerLinkIcon = [`hy-list-item__${this.variant}__info-container__link__icon`].join(
|
|
5402
|
-
const classInfoContainerLink = [`hy-list-item__${this.variant}__info-container__link`].join(
|
|
5403
|
-
const target = this.isExternal ?
|
|
5544
|
+
].join(" ");
|
|
5545
|
+
const classInfoContainerLinkContainer = [`hy-list-item__${this.variant}__info-container__link-container`].join(" ");
|
|
5546
|
+
const classInfoContainerLinkIcon = [`hy-list-item__${this.variant}__info-container__link__icon`].join(" ");
|
|
5547
|
+
const classInfoContainerLink = [`hy-list-item__${this.variant}__info-container__link`].join(" ");
|
|
5548
|
+
const target = this.isExternal ? "_blank" : "_self";
|
|
5404
5549
|
function truncate(str, n) {
|
|
5405
|
-
return str.length > n ? str.substr(0, n - 1) +
|
|
5550
|
+
return str.length > n ? str.substr(0, n - 1) + "..." : str;
|
|
5406
5551
|
}
|
|
5407
5552
|
switch (this.variant) {
|
|
5408
5553
|
case ListItemVariants.position: {
|
|
5409
5554
|
const classInfoContainerOutgoingLink = [
|
|
5410
5555
|
`hy-list-item__${this.variant}__info-container__outgoing-link`,
|
|
5411
5556
|
`hy-list-item__${this.variant}__info-container__outgoing-link__${this.headerstyle}`,
|
|
5412
|
-
].join(
|
|
5413
|
-
return (h("article", null, h("a", { class: classAttributes, href: this.url, target: target, "aria-label": this.scLabel }, h("div", { class: classInfoContainerAttributes }, h("div", { class: classInfoContainerHeader }, h("div", { class: "icon" }, h("hy-icon", { icon:
|
|
5557
|
+
].join(" ");
|
|
5558
|
+
return (h("article", null, h("a", { class: classAttributes, href: this.url, target: target, "aria-label": this.scLabel }, h("div", { class: classInfoContainerAttributes }, h("div", { class: classInfoContainerHeader }, h("div", { class: "icon" }, h("hy-icon", { icon: "hy-icon-units-and-faculties", size: 18 })), this.itemType), h("div", { class: classInfoContainerTitle }, this.itemTitle), this.itemDescription && (h("div", { class: classInfoContainerDescription, innerHTML: this.truncateDescription
|
|
5414
5559
|
? truncate(this.itemDescription, this.truncateLimit)
|
|
5415
|
-
: this.itemDescription }))), h("div", { class: classInfoContainerOutgoingLink }, h("span", { class: "icon" }, h("hy-icon", { icon:
|
|
5560
|
+
: this.itemDescription }))), h("div", { class: classInfoContainerOutgoingLink }, h("span", { class: "icon" }, h("hy-icon", { icon: "hy-icon-done", size: 14 })), h("span", { class: "label" }, this.outGoingUrlLabel)))));
|
|
5416
5561
|
}
|
|
5417
5562
|
case ListItemVariants.degreeProgramme: {
|
|
5418
|
-
const classImageContainerAttributes = [`hy-list-item__${this.variant}__image-container`].join(
|
|
5419
|
-
const classImageContainerImage = [`hy-list-item__${this.variant}__image-container__image`].join(
|
|
5563
|
+
const classImageContainerAttributes = [`hy-list-item__${this.variant}__image-container`].join(" ");
|
|
5564
|
+
const classImageContainerImage = [`hy-list-item__${this.variant}__image-container__image`].join(" ");
|
|
5420
5565
|
const classInfoContainerAdditionalInfoAttributes = [
|
|
5421
5566
|
`hy-list-item__${this.variant}__info-container__additional-info`,
|
|
5422
5567
|
`hy-list-item__${this.variant}__info-container__additional-info__${this.headerstyle}`,
|
|
5423
|
-
].join(
|
|
5424
|
-
const withAdditionalInfo = this._additionalInfo && this._additionalInfo.length > 0 ?
|
|
5568
|
+
].join(" ");
|
|
5569
|
+
const withAdditionalInfo = this._additionalInfo && this._additionalInfo.length > 0 ? "" : "link-only";
|
|
5425
5570
|
const classMetadataWrapper = [
|
|
5426
5571
|
`hy-list-item__${this.variant}__info-container__metadata-wrapper`,
|
|
5427
5572
|
withAdditionalInfo,
|
|
5428
|
-
].join(
|
|
5429
|
-
const classContentWrapper = [`hy-list-item__${this.variant}__info-container__content-wrapper`].join(
|
|
5573
|
+
].join(" ");
|
|
5574
|
+
const classContentWrapper = [`hy-list-item__${this.variant}__info-container__content-wrapper`].join(" ");
|
|
5430
5575
|
const classInfoContainerOutgoingLink = [
|
|
5431
5576
|
`hy-list-item__${this.variant}__info-container__outgoing-link`,
|
|
5432
5577
|
`hy-list-item__${this.variant}__info-container__outgoing-link__${this.headerstyle}`,
|
|
5433
|
-
].join(
|
|
5578
|
+
].join(" ");
|
|
5434
5579
|
const classInfoContainerOutgoingLinkUrl = [
|
|
5435
5580
|
`hy-list-item__${this.variant}__info-container__outgoing-link__link`,
|
|
5436
|
-
].join(
|
|
5581
|
+
].join(" ");
|
|
5437
5582
|
const classRelatedInfoContainer = [
|
|
5438
5583
|
`hy-list-item-wrapper__${this.variant}__related-info`,
|
|
5439
5584
|
`hy-list-item-wrapper__${this.variant}__related-info__${this.headerstyle}`,
|
|
5440
|
-
].join(
|
|
5441
|
-
const classRelatedInfoHeading = [`hy-list-item-wrapper__${this.variant}__related-info__heading`].join(
|
|
5442
|
-
const classRelatedInfoHeadingLink = [`hy-list-item-wrapper__${this.variant}__related-info__heading__link`].join(
|
|
5585
|
+
].join(" ");
|
|
5586
|
+
const classRelatedInfoHeading = [`hy-list-item-wrapper__${this.variant}__related-info__heading`].join(" ");
|
|
5587
|
+
const classRelatedInfoHeadingLink = [`hy-list-item-wrapper__${this.variant}__related-info__heading__link`].join(" ");
|
|
5443
5588
|
const classRelatedInfoHeadingButton = [
|
|
5444
5589
|
`hy-list-item-wrapper__${this.variant}__related-info__heading__button`,
|
|
5445
|
-
].join(
|
|
5446
|
-
const classRelatedInfoHeadingIcon = [`hy-list-item-wrapper__${this.variant}__related-info__heading__icon`].join(
|
|
5447
|
-
const classRelatedInfoContent = [`hy-list-item-wrapper__${this.variant}__related-info__content`].join(
|
|
5448
|
-
const classRelatedInfoLink = [`hy-list-item-wrapper__${this.variant}__related-info__link`].join(
|
|
5590
|
+
].join(" ");
|
|
5591
|
+
const classRelatedInfoHeadingIcon = [`hy-list-item-wrapper__${this.variant}__related-info__heading__icon`].join(" ");
|
|
5592
|
+
const classRelatedInfoContent = [`hy-list-item-wrapper__${this.variant}__related-info__content`].join(" ");
|
|
5593
|
+
const classRelatedInfoLink = [`hy-list-item-wrapper__${this.variant}__related-info__link`].join(" ");
|
|
5449
5594
|
const titleAsId = this.relatedLinksBlockTitle && this.relatedLinksBlockTitle.length > 0
|
|
5450
|
-
? `${this.itemTitle}-${this.relatedLinksBlockTitle}`.toLowerCase().replace(/\W/g,
|
|
5451
|
-
:
|
|
5452
|
-
const accordionItemHref =
|
|
5453
|
-
const relatedLinksCount = this.relatedLinksBlockTitle && this.relatedLinksBlockTitle.length > 0 ? this._relatedLinks.length :
|
|
5595
|
+
? `${this.itemTitle}-${this.relatedLinksBlockTitle}`.toLowerCase().replace(/\W/g, "-")
|
|
5596
|
+
: "";
|
|
5597
|
+
const accordionItemHref = "#" + titleAsId + "--title";
|
|
5598
|
+
const relatedLinksCount = this.relatedLinksBlockTitle && this.relatedLinksBlockTitle.length > 0 ? this._relatedLinks.length : "";
|
|
5454
5599
|
return [
|
|
5455
|
-
h("article", { class: classWrapperAttributes }, h("a", { class: classAttributes, href: this.url, target: target, "aria-label": this.scLabel }, h("div", { class: classImageContainerAttributes }, h("div", { class: classImageContainerImage }, this._sourceSet ? (h("picture", null, this._sourceSet.map((item) => (h("source", { srcSet: item.src, media: item.media, type: item.type, sizes: item.sizes ? item.sizes :
|
|
5456
|
-
|
|
5457
|
-
|
|
5458
|
-
} }))) : (h("img", { loading: this.disableLazy ?
|
|
5459
|
-
|
|
5460
|
-
|
|
5600
|
+
h("article", { class: classWrapperAttributes }, h("a", { class: classAttributes, href: this.url, target: target, "aria-label": this.scLabel }, h("div", { class: classImageContainerAttributes }, h("div", { class: classImageContainerImage }, this._sourceSet ? (h("picture", null, this._sourceSet.map((item) => (h("source", { srcSet: item.src, media: item.media, type: item.type, sizes: item.sizes ? item.sizes : "" }))), h("img", { loading: this.disableLazy ? "eager" : "lazy", "aria-hidden": "true", src: this.itemImageUrl, alt: this.itemImageAlt, style: {
|
|
5601
|
+
"--minheight": `${this._imageMinHeight}px`,
|
|
5602
|
+
"--minwidth": `${this._imageMinWidth}px`,
|
|
5603
|
+
} }))) : (h("img", { loading: this.disableLazy ? "eager" : "lazy", "aria-hidden": "true", src: this.itemImageUrl, alt: this.itemImageAlt, style: {
|
|
5604
|
+
"--minheight": `${this._imageMinHeight}px`,
|
|
5605
|
+
"--minwidth": `${this._imageMinWidth}px`,
|
|
5461
5606
|
} }))), this.imageLabel && h("span", null, this.imageLabel)), h("div", { class: classInfoContainerAttributes }, h("div", { class: classContentWrapper }, h("div", { class: classInfoContainerTitle }, this.itemTitle), this.itemDescription && (h("div", { class: classInfoContainerDescription, innerHTML: this.itemDescription }))), h("div", { class: classMetadataWrapper }, this._additionalInfo && (h("div", { class: classInfoContainerAdditionalInfoAttributes }, this._additionalInfo.map((x) => {
|
|
5462
5607
|
let classInfoContainerAdditionalInfoItem = [
|
|
5463
5608
|
`hy-list-item__${this.variant}__info-container__additional-info__item`,
|
|
5464
5609
|
`hy-list-item__${this.variant}__info-container__additional-info__item__${this.headerstyle}`,
|
|
5465
|
-
`${x.isActive.toString() ==
|
|
5466
|
-
].join(
|
|
5610
|
+
`${x.isActive.toString() == "true" ? "active" : ""}`,
|
|
5611
|
+
].join(" ");
|
|
5467
5612
|
return h("div", { class: classInfoContainerAdditionalInfoItem }, x.text);
|
|
5468
|
-
}))), h("div", { class: classInfoContainerOutgoingLink }, h("a", { href: this.url, target: target, "aria-label": this.scLabel, class: classInfoContainerOutgoingLinkUrl, tabindex: "-1" }, h("span", { class: "label" }, this.outGoingUrlLabel), h("span", { class: "icon-wrapper" }, h("div", { class: "icon" }, h("hy-icon", { icon:
|
|
5469
|
-
let relatedLinkTarget = x.isExternal ?
|
|
5613
|
+
}))), h("div", { class: classInfoContainerOutgoingLink }, h("a", { href: this.url, target: target, "aria-label": this.scLabel, class: classInfoContainerOutgoingLinkUrl, tabindex: "-1" }, h("span", { class: "label" }, this.outGoingUrlLabel), h("span", { class: "icon-wrapper" }, h("div", { class: "icon" }, h("hy-icon", { icon: "hy-icon-arrow-to-right", size: 32 })))))))), this.relatedLinksBlockTitle && (h("div", { class: classRelatedInfoContainer }, h("div", { class: classRelatedInfoHeading }, h("a", { href: accordionItemHref, class: classRelatedInfoHeadingLink, tabindex: "-1" }, h("button", { "aria-expanded": "false", "aria-controls": `${titleAsId}--content`, class: classRelatedInfoHeadingButton, id: `${titleAsId}--title` }, h("span", { class: classRelatedInfoHeadingIcon }, h("hy-icon", { icon: "hy-icon-caret-down", size: 14 })), this.relatedLinksBlockTitle, " (", relatedLinksCount, ")"))), h("div", { class: classRelatedInfoContent, "aria-labelledBy": `${titleAsId}--title`, id: `${titleAsId}--content`, role: "region", "aria-hidden": "true" }, this._relatedLinks.map((x) => {
|
|
5614
|
+
let relatedLinkTarget = x.isExternal ? "_blank" : "_self";
|
|
5470
5615
|
return (h("a", { class: classRelatedInfoLink, href: x.url, target: target, "aria-label": relatedLinkTarget }, x.label));
|
|
5471
5616
|
}))))),
|
|
5472
5617
|
];
|
|
5473
5618
|
}
|
|
5474
5619
|
default: {
|
|
5475
|
-
return (h("article", null, h("a", { class: classAttributes, href: this.url, target: target, "aria-label": this.scLabel }, h("div", { class: classInfoContainerAttributes }, h("div", { class: classInfoContainerHeader }, this.itemType), h("div", { class: classInfoContainerTitle }, this.itemTitle), h("div", { class: classInfoContainerLinkContainer }, h("span", { class: classInfoContainerLinkIcon }, h("hy-icon", { icon:
|
|
5620
|
+
return (h("article", null, h("a", { class: classAttributes, href: this.url, target: target, "aria-label": this.scLabel }, h("div", { class: classInfoContainerAttributes }, h("div", { class: classInfoContainerHeader }, this.itemType), h("div", { class: classInfoContainerTitle }, this.itemTitle), h("div", { class: classInfoContainerLinkContainer }, h("span", { class: classInfoContainerLinkIcon }, h("hy-icon", { icon: "hy-icon-link", size: 15 })), h("div", { class: classInfoContainerLink }, this.url)), this.itemDescription && (h("div", { class: classInfoContainerDescription, innerHTML: this.itemDescription }))))));
|
|
5476
5621
|
}
|
|
5477
5622
|
}
|
|
5478
5623
|
}
|
|
@@ -5513,10 +5658,10 @@ const HyLogoGridItem = class {
|
|
|
5513
5658
|
const parsedLink = this.link ? JSON.parse(this.link) : null;
|
|
5514
5659
|
return parsedImage.map(({ image_sources: sources, image_url: fallback_url, image_alt: alt }) => {
|
|
5515
5660
|
const parsedSources = JSON.parse(sources);
|
|
5516
|
-
const elementContent = (h("figure", { class: "hy-logo-grid__figure" }, parsedSources && (h("picture", null, parsedSources.map(({ src, media, type, sizes }) => (h("source", { srcSet: src, media: media, type: type, sizes: sizes ? sizes :
|
|
5661
|
+
const elementContent = (h("figure", { class: "hy-logo-grid__figure" }, parsedSources && (h("picture", null, parsedSources.map(({ src, media, type, sizes }) => (h("source", { srcSet: src, media: media, type: type, sizes: sizes ? sizes : "" }))), h("img", { alt: alt, src: fallback_url }))), !parsedSources && h("img", { alt: alt, src: fallback_url })));
|
|
5517
5662
|
if (parsedLink) {
|
|
5518
5663
|
const { url, target } = parsedLink;
|
|
5519
|
-
const targetValue = target ===
|
|
5664
|
+
const targetValue = target === "_blank" ? target : "_self";
|
|
5520
5665
|
return (h("a", { href: url, target: targetValue, class: "hy-logo-grid__link" }, elementContent));
|
|
5521
5666
|
}
|
|
5522
5667
|
return elementContent;
|
|
@@ -5534,10 +5679,10 @@ const HyMain = class {
|
|
|
5534
5679
|
}
|
|
5535
5680
|
render() {
|
|
5536
5681
|
const classAttributes = [
|
|
5537
|
-
|
|
5538
|
-
this.hasSidebar ?
|
|
5539
|
-
this.hasSidebar ?
|
|
5540
|
-
].join(
|
|
5682
|
+
"hy-main",
|
|
5683
|
+
this.hasSidebar ? "with-sidebar" : "without-sidebar",
|
|
5684
|
+
this.hasSidebar ? "hy-main__common" : "hy-main__large",
|
|
5685
|
+
].join(" ");
|
|
5541
5686
|
return (h("div", { class: classAttributes }, h("slot", null)));
|
|
5542
5687
|
}
|
|
5543
5688
|
};
|
|
@@ -5550,7 +5695,7 @@ const HyMainContentWrapper = class {
|
|
|
5550
5695
|
registerInstance(this, hostRef);
|
|
5551
5696
|
}
|
|
5552
5697
|
render() {
|
|
5553
|
-
const classAttributes = [
|
|
5698
|
+
const classAttributes = ["hy-main-content-wrapper"].join(" ");
|
|
5554
5699
|
return (h(Host, null, h("div", { class: classAttributes }, h("slot", null))));
|
|
5555
5700
|
}
|
|
5556
5701
|
};
|
|
@@ -5601,10 +5746,10 @@ const MenuLanguage = class {
|
|
|
5601
5746
|
}
|
|
5602
5747
|
adjustPosition(languageMenuSelector, target) {
|
|
5603
5748
|
const languagePanel = languageMenuSelector.shadowRoot.querySelectorAll(`.menu-language__dropdown`)[0];
|
|
5604
|
-
let headerHeight =
|
|
5749
|
+
let headerHeight = "0";
|
|
5605
5750
|
let hyHeader = this.isGroup
|
|
5606
|
-
? target.closest(
|
|
5607
|
-
: target.closest(
|
|
5751
|
+
? target.closest(".hy-site-header__content-top")
|
|
5752
|
+
: target.closest(".hy-site-header");
|
|
5608
5753
|
if (hyHeader) {
|
|
5609
5754
|
let rectHeader = hyHeader.getBoundingClientRect();
|
|
5610
5755
|
let rectLangMenu = languageMenuSelector.getBoundingClientRect();
|
|
@@ -5617,22 +5762,22 @@ const MenuLanguage = class {
|
|
|
5617
5762
|
this._labels = await jsonParserWorker(this.labels);
|
|
5618
5763
|
}
|
|
5619
5764
|
render() {
|
|
5620
|
-
const black =
|
|
5621
|
-
const white =
|
|
5765
|
+
const black = "var(--brand-main-nearly-black)";
|
|
5766
|
+
const white = "var(--grayscale-white)";
|
|
5622
5767
|
const svgColor = this.isGroup ? white : black;
|
|
5623
5768
|
const globeIconSize = this.isGroup ? 16 : 14;
|
|
5624
5769
|
return (h("div", { class: {
|
|
5625
|
-
|
|
5626
|
-
|
|
5627
|
-
|
|
5770
|
+
"menu-language": true,
|
|
5771
|
+
"is-open": this.isMenuOpen,
|
|
5772
|
+
"is-group": this.isGroup,
|
|
5628
5773
|
} }, h("button", { class: {
|
|
5629
|
-
|
|
5630
|
-
}, "aria-label": this.isMenuOpen ? this._labels[
|
|
5774
|
+
"menu-language__toggle": true,
|
|
5775
|
+
}, "aria-label": this.isMenuOpen ? this._labels["close"] : this._labels["open"] }, h("hy-icon", { icon: "hy-icon-globe", size: globeIconSize, fill: svgColor }), h("span", null, this._dataMenuLanguage.map(({ isActive, langCode }) => {
|
|
5631
5776
|
if (isActive) {
|
|
5632
5777
|
return langCode;
|
|
5633
5778
|
}
|
|
5634
|
-
})), h("hy-icon", { icon:
|
|
5635
|
-
|
|
5779
|
+
})), h("hy-icon", { icon: "hy-icon-caret-down", size: 8, fill: svgColor })), h("div", { class: {
|
|
5780
|
+
"menu-language__dropdown": true,
|
|
5636
5781
|
}, "aria-hidden": `${!this.isMenuOpen}` }, h("ul", { class: "menu-language__links" }, this._dataMenuLanguage.map((item) => {
|
|
5637
5782
|
return (h("hy-menu-language-item", { "lang-code": item.langCode, url: item.url, label: item.label, abbr: item.abbr, "is-active": item.isActive, "is-disabled": item.isDisabled }));
|
|
5638
5783
|
})))));
|
|
@@ -5655,9 +5800,9 @@ const SiteLanguage = class {
|
|
|
5655
5800
|
}
|
|
5656
5801
|
render() {
|
|
5657
5802
|
return (h("li", { class: `menu-language__links-item` }, h("a", { href: this.url, lang: this.langCode, class: {
|
|
5658
|
-
|
|
5659
|
-
|
|
5660
|
-
|
|
5803
|
+
"is-active": this.isActive,
|
|
5804
|
+
"is-disabled": this.isDisabled,
|
|
5805
|
+
"menu-language__link": true,
|
|
5661
5806
|
} }, this.label)));
|
|
5662
5807
|
}
|
|
5663
5808
|
};
|
|
@@ -5666,15 +5811,15 @@ SiteLanguage.style = menuLanguageItemCss;
|
|
|
5666
5811
|
const hyMenuMainGroupCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand-main-bright:#48c5f8;--brand-main-light:#107eab;--brand-main-active:#005379;--brand-main-dark:#003146;--brand-main-nearly-black:#000222;--link-blue:#0479a4;--link-disabled:#767676;--grayscale-white:#fff;--grayscale-slightly-gray:#fefefe;--grayscale-light:#f8f8f8;--grayscale-medium:#d2d2d2;--grayscale-background-box:#f5f5f5;--grayscale-tabs-border:#e6e6e6;--grayscale-background-arrow:#dfdfdf;--grayscale-medium-dark:#979797;--grayscale-dark:#555555;--grayscale-dark-text:#222222;--grayscale-black:#000000;--additional-red-light:#e5053a;--additional-red-dark:#a31621;--additional-purple-light:#420039;--additional-yellow-light:#f9a21a;--additional-yellow:#c47f1b;--additional-skyblue:#48c5f8;--additional-orange:#d14600;--additional-green-light:#96ba3c;--additional-green-dark:#006400;--hover-gray:#eaeaea}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{--gutter-mobile:16px;--gutter-narrow:24px;--gutter-medium:24px;--gutter-wide:24px;--gutter-extrawide:32px}:root{--breakpoint-extrawide:75.0625rem;--breakpoint-max-width:75.0625rem;--breakpoint-medium:48rem;--breakpoint-narrow:30rem;--breakpoint-wide:60rem}:host{display:block}:host(.menu--main-group){-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row;flex-flow:row;margin-left:28px}@media (min-width: 75.0625rem){:host(.menu--main-group){margin-right:auto}}.menu--main-group__toggle{font-size:0.875rem;line-height:16px;font-weight:600;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:var(--grayscale-black);border:0 none;color:var(--grayscale-white);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row;flex-flow:row;font-family:var(--main-font-family);letter-spacing:-0.44px;margin:0 -4px;padding:0;position:relative}.menu--main-group__toggle:focus{outline:none}.menu--main-group__toggle:hover{cursor:pointer}.menu--main-group__toggle:hover span{color:var(--grayscale-medium)}.menu--main-group__toggle:hover svg{fill:var(--grayscale-medium)}@media (min-width: 60rem){.menu--main-group__toggle .toggle__caret svg{height:15.27px;width:3px}}@media (min-width: 75.0625rem){.menu--main-group__toggle .toggle__caret svg{height:14px;width:3px}}@media (min-width: 60rem){.menu--main-group__toggle span{margin-left:17px}}.menu--main-group__toggle.is-open:after{border-bottom:3px solid white;bottom:-10px;content:\" \";position:absolute;width:100%}@media (min-width: 60rem){.menu--main-group__toggle.is-open .toggle__close{height:15px;width:15px}.menu--main-group__toggle.is-open .toggle__close svg{height:15px;width:15px}}@media (min-width: 60rem){.menu--main-group__toggle.is-open span{margin-left:10px}}.menu--main-group__dropdown{display:none;visibility:hidden}.menu--main-group__dropdown.is-open{background-color:var(--grayscale-black);border-radius:0 0 5px 5px;-webkit-box-shadow:0 10px 10px rgba(0, 0, 0, 0.2);box-shadow:0 10px 10px rgba(0, 0, 0, 0.2);color:var(--grayscale-white);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--main-font-family);left:0;margin:0;padding:6px 0 20px;position:absolute;top:0;visibility:visible;width:100%;z-index:511}.menu--main-group__dropdown.is-open .list{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-flow:column;flex-flow:column;justify-items:center;padding-top:14px;position:relative}.menu--main-group__dropdown.is-open .panel-toggle{background-color:transparent;border:none;position:absolute;right:0;top:0}@media (min-width: 60rem){.menu--main-group__dropdown.is-open .panel-toggle{padding:26px 32px}}.menu--main-group__dropdown.is-open .panel-toggle__label{font-size:1rem;line-height:20px;font-weight:700;color:var(--grayscale-white);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--main-font-family);letter-spacing:-0.5px;text-transform:uppercase}.menu--main-group__dropdown.is-open .panel-toggle__label__title{padding-right:12px}.menu--main-group__dropdown.is-open .panel-toggle__label:hover{cursor:pointer}.menu--main-group__dropdown.is-open .panel-toggle__label:hover span{color:var(--grayscale-medium)}.menu--main-group__dropdown.is-open .panel-toggle__label:hover svg{fill:var(--grayscale-medium)}.menu--main-group__dropdown.is-open .menu-main-link{font-size:1rem;line-height:20px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--main-font-family);-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;margin-bottom:20px;text-decoration:none}@media (min-width: 75.0625rem){.menu--main-group__dropdown.is-open .menu-main-link{font-size:0.875rem;line-height:18px}}.menu--main-group__dropdown.is-open .menu-main-link:hover span{color:var(--grayscale-medium)}.menu--main-group__dropdown.is-open .menu-main-link:hover svg{fill:var(--grayscale-medium)}.menu--main-group__dropdown.is-open .menu--main-group__label{color:var(--grayscale-white);margin-left:12px}:host(.menu--main-group--mobile){-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row;flex-flow:row;position:relative}.menu--main-group__mobile-toggle{border:none;background:transparent;padding:15px 12px}.menu--main-group__mobile-toggle:hover{cursor:pointer}.menu--main-group__dropdown__top{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;margin-bottom:23px}.menu--main-group__dropdown__close{border:none;background-color:transparent;padding:0;margin:0}.menu--main-group__dropdown__close:hover{cursor:pointer}.menu--main-group__logo-container .hy-site-logo__label.group{max-width:250px}.menu--main-group__dropdown__items{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.menu--main-group__dropdown__items .menu-main-link{font-size:0.9375rem;line-height:20px;background-color:var(--grayscale-dark-text);color:var(--grayscale-white);font-family:var(--main-font-family);letter-spacing:-0.5px;margin-bottom:8px;padding:14px 20px;text-decoration:none;width:100%}.menu--main-group__dropdown__items .menu-main-link:hover{text-decoration:underline}.menu--main-group__dropdown__donate{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background-color:var(--grayscale-dark-text);position:fixed;bottom:0;margin-left:-20px;width:100%}.menu--main-group__dropdown__donate .hy-link__donate.group{font-size:1rem;line-height:16px;font-weight:600;display:-webkit-box;display:-ms-flexbox;display:flex;color:var(--grayscale-white);font-family:var(--main-font-family);margin:20px auto 16px auto;text-decoration:none}.menu--main-group__dropdown__donate .hy-link__donate.group .hy-link__donate__label{margin-left:6px}.menu--main-group__dropdown--mobile{-webkit-box-direction:normal;-webkit-box-orient:vertical;background-color:var(--grayscale-black);bottom:0px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;justify-items:space-between;max-width:400px;overflow:hidden;padding:0px;place-items:stretch;position:fixed;right:0px;top:0px;-webkit-transform:translateX(100%);transform:translateX(100%);-webkit-transition:all 0.3s ease 0s;transition:all 0.3s ease 0s;visibility:hidden;width:0px}.menu--main-group__dropdown--mobile.is-open{padding:50px 20px 20px;-webkit-transform:translateX(0px);transform:translateX(0px);-webkit-transition:-webkit-transform 0.3s cubic-bezier(0, 0, 0.3, 1);transition:-webkit-transform 0.3s cubic-bezier(0, 0, 0.3, 1);transition:transform 0.3s cubic-bezier(0, 0, 0.3, 1);transition:transform 0.3s cubic-bezier(0, 0, 0.3, 1), -webkit-transform 0.3s cubic-bezier(0, 0, 0.3, 1);visibility:visible;width:90%;z-index:101}.menu--main-group__dropdown--mobile.is-open::after{opacity:1;visibility:visible}";
|
|
5667
5812
|
|
|
5668
5813
|
let keys$1 = {
|
|
5669
|
-
enter:
|
|
5814
|
+
enter: "Enter",
|
|
5670
5815
|
};
|
|
5671
5816
|
const HyMenuMainGroup = class {
|
|
5672
5817
|
constructor(hostRef) {
|
|
5673
5818
|
registerInstance(this, hostRef);
|
|
5674
5819
|
this.universityMainMenuToggled = createEvent(this, "universityMainMenuToggled", 7);
|
|
5675
5820
|
this.mobileMenuTopToggle = createEvent(this, "mobileMenuTopToggle", 7);
|
|
5676
|
-
this.menuLabel =
|
|
5677
|
-
this.menuLabelClose =
|
|
5821
|
+
this.menuLabel = "University main menu";
|
|
5822
|
+
this.menuLabelClose = "Close";
|
|
5678
5823
|
this.dataMainMenu = undefined;
|
|
5679
5824
|
this.isMobile = false;
|
|
5680
5825
|
this.logoUrl = undefined;
|
|
@@ -5696,7 +5841,7 @@ const HyMenuMainGroup = class {
|
|
|
5696
5841
|
event.stopPropagation();
|
|
5697
5842
|
const key = event.code;
|
|
5698
5843
|
let target = event.target;
|
|
5699
|
-
if (key ===
|
|
5844
|
+
if (key === "Escape" && this.isMenuOpen) {
|
|
5700
5845
|
this.isMenuOpen = false;
|
|
5701
5846
|
this.emitEvent();
|
|
5702
5847
|
}
|
|
@@ -5714,11 +5859,11 @@ const HyMenuMainGroup = class {
|
|
|
5714
5859
|
this.mobileMenuTopToggle.emit();
|
|
5715
5860
|
}
|
|
5716
5861
|
adjustMainMenuPosition(target) {
|
|
5717
|
-
let hyTopHeader = this.el.closest(
|
|
5718
|
-
if (hyTopHeader && !hyTopHeader.hasAttribute(
|
|
5719
|
-
let mainMenuToggle = target.shadowRoot.querySelector(
|
|
5720
|
-
let mainMenuDropdown = target.shadowRoot.querySelector(
|
|
5721
|
-
let mainMenuList = target.shadowRoot.querySelector(
|
|
5862
|
+
let hyTopHeader = this.el.closest(".hy-site-header__content-top");
|
|
5863
|
+
if (hyTopHeader && !hyTopHeader.hasAttribute("is-mobile")) {
|
|
5864
|
+
let mainMenuToggle = target.shadowRoot.querySelector(".menu--main-group__toggle");
|
|
5865
|
+
let mainMenuDropdown = target.shadowRoot.querySelector(".menu--main-group__dropdown");
|
|
5866
|
+
let mainMenuList = target.shadowRoot.querySelector(".list");
|
|
5722
5867
|
if (mainMenuDropdown && mainMenuList && mainMenuToggle) {
|
|
5723
5868
|
let rectHeader = hyTopHeader.getBoundingClientRect();
|
|
5724
5869
|
let rectMenuToggle = mainMenuToggle.getBoundingClientRect();
|
|
@@ -5726,23 +5871,23 @@ const HyMenuMainGroup = class {
|
|
|
5726
5871
|
mainMenuList.style.left = `${rectMenuToggle.left}px`;
|
|
5727
5872
|
}
|
|
5728
5873
|
let headerHeight = hyTopHeader.offsetHeight + 270;
|
|
5729
|
-
this.showBackdropShadow(
|
|
5874
|
+
this.showBackdropShadow("open", headerHeight);
|
|
5730
5875
|
}
|
|
5731
5876
|
}
|
|
5732
|
-
showBackdropShadow(state =
|
|
5733
|
-
let hyHeader = this.el.closest(
|
|
5877
|
+
showBackdropShadow(state = "close", top = 0) {
|
|
5878
|
+
let hyHeader = this.el.closest(".hy-site-header");
|
|
5734
5879
|
let hyBackdropDiv = hyHeader.children[0];
|
|
5735
5880
|
if (hyBackdropDiv) {
|
|
5736
|
-
if (state ===
|
|
5881
|
+
if (state === "open") {
|
|
5737
5882
|
let me = window.outerHeight - top;
|
|
5738
5883
|
hyBackdropDiv.style.height = `${me}px`;
|
|
5739
5884
|
hyBackdropDiv.style.top = `${top}px`;
|
|
5740
|
-
hyBackdropDiv.style.position =
|
|
5741
|
-
hyBackdropDiv.classList.add(
|
|
5885
|
+
hyBackdropDiv.style.position = "absolute";
|
|
5886
|
+
hyBackdropDiv.classList.add("is-active");
|
|
5742
5887
|
}
|
|
5743
5888
|
else {
|
|
5744
|
-
hyBackdropDiv.removeAttribute(
|
|
5745
|
-
hyBackdropDiv.classList.remove(
|
|
5889
|
+
hyBackdropDiv.removeAttribute("style");
|
|
5890
|
+
hyBackdropDiv.classList.remove("is-active");
|
|
5746
5891
|
}
|
|
5747
5892
|
}
|
|
5748
5893
|
}
|
|
@@ -5776,37 +5921,37 @@ const HyMenuMainGroup = class {
|
|
|
5776
5921
|
this.isMenuOpen = false;
|
|
5777
5922
|
}
|
|
5778
5923
|
render() {
|
|
5779
|
-
const white =
|
|
5924
|
+
const white = "var(--grayscale-white)";
|
|
5780
5925
|
const logoSizeGroup = this.isMobile ? SiteLogoSize.small : SiteLogoSize.small;
|
|
5781
5926
|
const logoColorGroup = ColorVariant.white;
|
|
5782
5927
|
return this.isMobile ? (h(Host, { class: {
|
|
5783
|
-
|
|
5784
|
-
|
|
5928
|
+
"menu--main-group--mobile": true,
|
|
5929
|
+
"menu--main-group--mobile__is-open": this.isMenuOpen,
|
|
5785
5930
|
} }, h("button", { "aria-label": this.menuLabel, class: {
|
|
5786
|
-
|
|
5787
|
-
|
|
5788
|
-
} }, h("hy-icon", { icon:
|
|
5789
|
-
|
|
5790
|
-
|
|
5791
|
-
} }, h("div", { class: "menu--main-group__dropdown__top" }, h("div", { class:
|
|
5792
|
-
return (h("a", { href: item.url, class: {
|
|
5931
|
+
"menu--main-group__mobile-toggle": true,
|
|
5932
|
+
"is-open": this.isMenuOpen,
|
|
5933
|
+
} }, h("hy-icon", { icon: "hy-icon-slim-hamburger-menu", size: 20, fill: white })), h("nav", { role: "navigation", "aria-hidden": this.isMenuOpen ? "false" : "true", class: {
|
|
5934
|
+
"menu--main-group__dropdown--mobile": true,
|
|
5935
|
+
"is-open": this.isMenuOpen,
|
|
5936
|
+
} }, h("div", { class: "menu--main-group__dropdown__top" }, h("div", { class: "menu--main-group__logo-container", id: "menu-logo" }, h("hy-site-logo", { "is-group": true, size: logoSizeGroup, color: logoColorGroup, url: this.siteUrl, label: this.siteLabel })), h("button", { "aria-label": `Close ${this.menuLabel}`, class: "menu--main-group__dropdown__close", onClick: (e) => this.handleTopMenuClose(e) }, h("hy-icon", { icon: "hy-icon-remove", size: 20, fill: white }))), h("div", { class: "menu--main-group__dropdown__items" }, this._dataMainMenu.map((item) => {
|
|
5937
|
+
return (h("a", { href: item.url, class: { "menu-main-link": true } }, h("span", { class: "menu--main-group__label" }, item.label)));
|
|
5793
5938
|
})), h("div", { class: "menu--main-group__dropdown__donate" }, this.donate &&
|
|
5794
5939
|
this.donate.map((i) => {
|
|
5795
|
-
return (h("a", { class:
|
|
5940
|
+
return (h("a", { class: "menu--secondary__item hy-link__donate group", href: i.url }, h("hy-icon", { icon: "hy-icon-heart-support", size: 14, fill: logoColorGroup }), h("span", { class: "hy-link__donate__label group" }, i.label)));
|
|
5796
5941
|
}))))) : (h(Host, { class: {
|
|
5797
|
-
|
|
5798
|
-
|
|
5942
|
+
"menu--main-group": true,
|
|
5943
|
+
"menu--main-group__is-open": this.isMenuOpen,
|
|
5799
5944
|
} }, h("button", { class: {
|
|
5800
|
-
|
|
5801
|
-
|
|
5802
|
-
}, "aria-expanded": this.isMenuOpen ?
|
|
5803
|
-
|
|
5804
|
-
|
|
5945
|
+
"menu--main-group__toggle": true,
|
|
5946
|
+
"is-open": this.isMenuOpen,
|
|
5947
|
+
}, "aria-expanded": this.isMenuOpen ? "true" : "false", "aria-haspopup": "menu" }, this.isMenuOpen ? (h("hy-icon", { class: "toggle__close", icon: "hy-icon-remove", size: 8, fill: white })) : (h("hy-icon", { class: "toggle__caret", icon: "hy-icon-slim-hamburger-menu", size: 8, fill: white })), h("span", null, this.menuLabel)), h("div", { class: {
|
|
5948
|
+
"menu--main-group__dropdown": true,
|
|
5949
|
+
"is-open": this.isMenuOpen,
|
|
5805
5950
|
} }, h("div", { class: "list" }, this._dataMainMenu.map((item) => {
|
|
5806
|
-
return (h("a", { href: item.url, class: {
|
|
5951
|
+
return (h("a", { href: item.url, class: { "menu-main-link": true } }, h("span", { class: "heading-icon" }, h("hy-icon", { icon: "hy-icon-caret-right", size: 10, fill: white })), h("span", { class: "menu--main-group__label" }, item.label)));
|
|
5807
5952
|
})), h("button", { onClick: (e) => this.handleComponentClick(e), class: {
|
|
5808
|
-
|
|
5809
|
-
}, "aria-label": "Close menu" }, h("span", { class: "panel-toggle__label" }, h("span", { class: "panel-toggle__label__title" }, this.menuLabelClose), h("hy-icon", { icon:
|
|
5953
|
+
"panel-toggle": true,
|
|
5954
|
+
}, "aria-label": "Close menu" }, h("span", { class: "panel-toggle__label" }, h("span", { class: "panel-toggle__label__title" }, this.menuLabelClose), h("hy-icon", { icon: "hy-icon-remove", size: 20, fill: ColorVariant.white }))))));
|
|
5810
5955
|
}
|
|
5811
5956
|
get el() { return getElement(this); }
|
|
5812
5957
|
};
|
|
@@ -5819,7 +5964,7 @@ const HyOpeningHours = class {
|
|
|
5819
5964
|
registerInstance(this, hostRef);
|
|
5820
5965
|
this.blockTitle = null;
|
|
5821
5966
|
this.language = undefined;
|
|
5822
|
-
this.venueType =
|
|
5967
|
+
this.venueType = "libraries";
|
|
5823
5968
|
this.blockId = undefined;
|
|
5824
5969
|
this.nextLabel = undefined;
|
|
5825
5970
|
this.prevLabel = undefined;
|
|
@@ -5828,7 +5973,7 @@ const HyOpeningHours = class {
|
|
|
5828
5973
|
this.customerServiceLabel = undefined;
|
|
5829
5974
|
this.date = null;
|
|
5830
5975
|
this.dateTitle = null;
|
|
5831
|
-
this.dateType =
|
|
5976
|
+
this.dateType = "day";
|
|
5832
5977
|
this.multiple = false;
|
|
5833
5978
|
this.customLinkTitle = null;
|
|
5834
5979
|
this.customLink = null;
|
|
@@ -5836,12 +5981,12 @@ const HyOpeningHours = class {
|
|
|
5836
5981
|
}
|
|
5837
5982
|
render() {
|
|
5838
5983
|
const containerClasses = [
|
|
5839
|
-
|
|
5840
|
-
this.exceptional ?
|
|
5841
|
-
].join(
|
|
5842
|
-
const listClasses = [
|
|
5843
|
-
const buildingClasses = [
|
|
5844
|
-
return (h(Host, null, h("div", { class: containerClasses, "data-lang": this.language, "data-id": this.blockId, "data-date": this.date, "data-type": this.dateType, "data-multiple": this.multiple }, this.blockTitle && h("h3", { class: "open-hours__title" }, this.blockTitle), !this.exceptional && (h("div", { class: "open-hours__date-change" }, h("button", { "aria-label": this.prevLabel, class: "icon--arrow-left open-hours__prev-date" }, h("hy-icon", { icon:
|
|
5984
|
+
"hy-open-hours--container",
|
|
5985
|
+
this.exceptional ? "hy-open-hours--container--exceptional" : "",
|
|
5986
|
+
].join(" ");
|
|
5987
|
+
const listClasses = ["open-hours__content__top-label", this.venueType].join(" ");
|
|
5988
|
+
const buildingClasses = ["open-hours__content__top-label building", this.venueType].join(" ");
|
|
5989
|
+
return (h(Host, null, h("div", { class: containerClasses, "data-lang": this.language, "data-id": this.blockId, "data-date": this.date, "data-type": this.dateType, "data-multiple": this.multiple }, this.blockTitle && h("h3", { class: "open-hours__title" }, this.blockTitle), !this.exceptional && (h("div", { class: "open-hours__date-change" }, h("button", { "aria-label": this.prevLabel, class: "icon--arrow-left open-hours__prev-date" }, h("hy-icon", { icon: "hy-icon-caret-left", size: 18 })), h("span", { class: "open-hours__date-change--title" }, this.dateTitle), h("button", { "aria-label": this.nextLabel, class: "icon--arrow-right open-hours__next-date" }, h("hy-icon", { icon: "hy-icon-caret-right", size: 18 })))), h("div", { class: "open-hours__content__top" }, h("span", { class: listClasses }, this.listLabel), h("span", { class: buildingClasses }, this.buildingLabel), this.customerServiceLabel && h("span", { class: listClasses }, this.customerServiceLabel)), h("div", { class: "open-hours__content" }, h("slot", null)), this.customLink && (h("div", { class: "open-hours__links" }, h("hy-cta-link", { "full-width": true, "link-content": this.customLinkTitle, "sc-label": this.customLinkTitle, url: this.customLink, variant: CtaLinkVariants.linkList }, this.customLinkTitle)))), h("hy-box", { mb: "1.75, 1.75, 2, 2.5" })));
|
|
5845
5990
|
}
|
|
5846
5991
|
};
|
|
5847
5992
|
HyOpeningHours.style = hyOpeningHoursCss;
|
|
@@ -5853,11 +5998,11 @@ const HyOpeningHoursContent = class {
|
|
|
5853
5998
|
registerInstance(this, hostRef);
|
|
5854
5999
|
this.multiple = false;
|
|
5855
6000
|
this.selfServiceLabel = null;
|
|
5856
|
-
this.venueType =
|
|
6001
|
+
this.venueType = "libraries";
|
|
5857
6002
|
this.dataItems = undefined;
|
|
5858
6003
|
}
|
|
5859
6004
|
dataItemsWatcher(data) {
|
|
5860
|
-
this._dataItems = typeof data ===
|
|
6005
|
+
this._dataItems = typeof data === "string" ? JSON.parse(data) : data;
|
|
5861
6006
|
}
|
|
5862
6007
|
componentWillLoad() {
|
|
5863
6008
|
this.dataItemsWatcher(this.dataItems);
|
|
@@ -5866,15 +6011,15 @@ const HyOpeningHoursContent = class {
|
|
|
5866
6011
|
return (h(Host, null, this._dataItems.map((item) => {
|
|
5867
6012
|
if (!item.service)
|
|
5868
6013
|
return;
|
|
5869
|
-
const itemClasses = [
|
|
6014
|
+
const itemClasses = ["open-hours__list-item", item.today ? "open-hours__list-item--today" : ""].join(" ");
|
|
5870
6015
|
return (h("div", { class: itemClasses }, h("span", { class: "open-hours__list-item--office" }, item.today ? item.today : item.dateLibrary), h("span", { class: "open-hours__list-item--hours" }, item.building), h("span", { class: "open-hours__list-item--service" }, item.service)));
|
|
5871
6016
|
}), this.selfServiceLabel && (h("div", { class: "open-hours__content__top" }, h("span", { class: "open-hours__content__top-label" }, this.selfServiceLabel))), this._dataItems.map((item) => {
|
|
5872
6017
|
if (item.service)
|
|
5873
6018
|
return;
|
|
5874
|
-
const itemClasses = [
|
|
5875
|
-
const hoursClasses = [
|
|
5876
|
-
const officeClasses = [
|
|
5877
|
-
return (h("div", { class: itemClasses }, h("span", { class: officeClasses }, item.today ? item.today : item.dateLibrary), h("span", { class: hoursClasses }, item.building), this.venueType !==
|
|
6019
|
+
const itemClasses = ["open-hours__list-item", item.today ? "open-hours__list-item--today" : ""].join(" ");
|
|
6020
|
+
const hoursClasses = ["open-hours__list-item--hours", this.venueType].join(" ");
|
|
6021
|
+
const officeClasses = ["open-hours__list-item--office", this.venueType].join(" ");
|
|
6022
|
+
return (h("div", { class: itemClasses }, h("span", { class: officeClasses }, item.today ? item.today : item.dateLibrary), h("span", { class: hoursClasses }, item.building), this.venueType !== "luomus" && h("span", { class: "open-hours__list-item--service" }, "-")));
|
|
5878
6023
|
})));
|
|
5879
6024
|
}
|
|
5880
6025
|
static get watchers() { return {
|
|
@@ -5890,7 +6035,7 @@ const HyPager = class {
|
|
|
5890
6035
|
registerInstance(this, hostRef);
|
|
5891
6036
|
}
|
|
5892
6037
|
render() {
|
|
5893
|
-
const classAttributes = [
|
|
6038
|
+
const classAttributes = ["hy-pager"].join(" ");
|
|
5894
6039
|
return (h("ul", { class: classAttributes }, h("slot", null)));
|
|
5895
6040
|
}
|
|
5896
6041
|
};
|
|
@@ -5907,28 +6052,28 @@ const HyPagerItem = class {
|
|
|
5907
6052
|
this.scAriaLabel = undefined;
|
|
5908
6053
|
}
|
|
5909
6054
|
render() {
|
|
5910
|
-
let classAttributes = [
|
|
6055
|
+
let classAttributes = ["hy-pager__item"].join(" ");
|
|
5911
6056
|
switch (this.variant) {
|
|
5912
6057
|
case PaginationItemVariants.current: {
|
|
5913
|
-
classAttributes = [
|
|
6058
|
+
classAttributes = ["hy-pager__item", "hy-pager__item__current"].join(" ");
|
|
5914
6059
|
return (h("li", { class: classAttributes }, h("a", { href: this.itemUrl, "aria-current": "true" }, this.itemLabel)));
|
|
5915
6060
|
}
|
|
5916
6061
|
case PaginationItemVariants.next: {
|
|
5917
|
-
classAttributes = [
|
|
5918
|
-
const iconClassAttributes = [
|
|
5919
|
-
return (h("li", { class: classAttributes }, h("a", { href: this.itemUrl, "aria-label": this.scAriaLabel }, this.itemLabel, h("span", { class:
|
|
6062
|
+
classAttributes = ["hy-pager__item", "hy-pager__item__next"].join(" ");
|
|
6063
|
+
const iconClassAttributes = ["link-icon"].join(" ");
|
|
6064
|
+
return (h("li", { class: classAttributes }, h("a", { href: this.itemUrl, "aria-label": this.scAriaLabel }, this.itemLabel, h("span", { class: "hy-icon-wrapper" }, h("div", { class: iconClassAttributes }, h("hy-icon", { icon: "hy-icon-arrow-to-right", size: 12 }))))));
|
|
5920
6065
|
}
|
|
5921
6066
|
case PaginationItemVariants.previous: {
|
|
5922
|
-
classAttributes = [
|
|
5923
|
-
const iconClassAttributes = [
|
|
5924
|
-
return (h("li", { class: classAttributes }, h("a", { href: this.itemUrl, "aria-label": this.scAriaLabel }, h("span", { class:
|
|
6067
|
+
classAttributes = ["hy-pager__item", "hy-pager__item__previous"].join(" ");
|
|
6068
|
+
const iconClassAttributes = ["link-icon"].join(" ");
|
|
6069
|
+
return (h("li", { class: classAttributes }, h("a", { href: this.itemUrl, "aria-label": this.scAriaLabel }, h("span", { class: "hy-icon-wrapper" }, h("div", { class: iconClassAttributes }, h("hy-icon", { icon: "hy-icon-arrow-left", size: 12 }))), this.itemLabel)));
|
|
5925
6070
|
}
|
|
5926
6071
|
case PaginationItemVariants.ellipsis: {
|
|
5927
|
-
classAttributes = [
|
|
6072
|
+
classAttributes = ["hy-pager__item", "hy-pager__item__ellipsis"].join(" ");
|
|
5928
6073
|
return h("li", { class: classAttributes }, "...");
|
|
5929
6074
|
}
|
|
5930
6075
|
default: {
|
|
5931
|
-
classAttributes = [
|
|
6076
|
+
classAttributes = ["hy-pager__item"].join(" ");
|
|
5932
6077
|
return (h("li", { class: classAttributes }, h("a", { href: this.itemUrl, "aria-label": this.scAriaLabel }, this.itemLabel)));
|
|
5933
6078
|
}
|
|
5934
6079
|
}
|
|
@@ -5946,25 +6091,25 @@ const ParagraphText = class {
|
|
|
5946
6091
|
constructor(hostRef) {
|
|
5947
6092
|
registerInstance(this, hostRef);
|
|
5948
6093
|
this.variant = undefined;
|
|
5949
|
-
this.placement =
|
|
5950
|
-
this.headerstyle =
|
|
6094
|
+
this.placement = "internal";
|
|
6095
|
+
this.headerstyle = "default";
|
|
5951
6096
|
}
|
|
5952
6097
|
componentDidLoad() {
|
|
5953
|
-
let hyMainDiv = this.el.closest(
|
|
6098
|
+
let hyMainDiv = this.el.closest(".hy-main");
|
|
5954
6099
|
if (hyMainDiv) {
|
|
5955
|
-
if (!hyMainDiv.classList.contains(
|
|
5956
|
-
this.headerstyle =
|
|
6100
|
+
if (!hyMainDiv.classList.contains("with-sidebar")) {
|
|
6101
|
+
this.headerstyle = "large";
|
|
5957
6102
|
}
|
|
5958
6103
|
}
|
|
5959
6104
|
}
|
|
5960
6105
|
render() {
|
|
5961
6106
|
const classAttributes = [
|
|
5962
|
-
|
|
6107
|
+
"hy-paragraph-text",
|
|
5963
6108
|
`hy-paragraph-text__${this.headerstyle}`,
|
|
5964
6109
|
`${this.variant}`,
|
|
5965
6110
|
`${this.placement}`,
|
|
5966
6111
|
`${this.headerstyle}`,
|
|
5967
|
-
].join(
|
|
6112
|
+
].join(" ");
|
|
5968
6113
|
return (h(Host, null, h("div", { class: classAttributes }, h("slot", null))));
|
|
5969
6114
|
}
|
|
5970
6115
|
get el() { return getElement(this); }
|
|
@@ -6018,44 +6163,44 @@ const HyPersonCard = class {
|
|
|
6018
6163
|
this.isMobile = size <= 479 ? true : false;
|
|
6019
6164
|
}
|
|
6020
6165
|
componentWillRender() {
|
|
6021
|
-
this._fullName = this.firstName && this.lastName ? `${this.firstName} ${this.lastName}` :
|
|
6166
|
+
this._fullName = this.firstName && this.lastName ? `${this.firstName} ${this.lastName}` : "";
|
|
6022
6167
|
this._initials =
|
|
6023
|
-
this.imageUrl && this.firstName && this.lastName ?
|
|
6168
|
+
this.imageUrl && this.firstName && this.lastName ? "" : `${this.firstName.charAt(0)}${this.lastName.charAt(0)}`;
|
|
6024
6169
|
if (!this.imageAlt) {
|
|
6025
6170
|
this.imageAlt = this._fullName;
|
|
6026
6171
|
}
|
|
6027
6172
|
if (!this.scLabel) {
|
|
6028
|
-
this.scLabel =
|
|
6173
|
+
this.scLabel = "Link to the person profile";
|
|
6029
6174
|
}
|
|
6030
6175
|
}
|
|
6031
6176
|
render() {
|
|
6032
|
-
let classLinkAttributes = [
|
|
6033
|
-
let classIsActive = this.url && this.url.length > 0 ?
|
|
6177
|
+
let classLinkAttributes = ["hy-person-card-container__link", this.variant].join(" ");
|
|
6178
|
+
let classIsActive = this.url && this.url.length > 0 ? "" : " inactive";
|
|
6034
6179
|
classLinkAttributes = classLinkAttributes.concat(classIsActive);
|
|
6035
|
-
const classAttributes = [
|
|
6180
|
+
const classAttributes = ["hy-person-card", this.variant].join(" ");
|
|
6036
6181
|
const classPositionTitle = [
|
|
6037
|
-
|
|
6182
|
+
"hy-person-card__info-container__position-title",
|
|
6038
6183
|
`hy-person-card__info-container__position-title__${this.variant}`,
|
|
6039
|
-
].join(
|
|
6040
|
-
const target = this.isExternal ?
|
|
6041
|
-
return (h("article", { class: "hy-person-card-container" }, h("div", { class: classLinkAttributes }, this.categoryTitle && this.variant == PersonCardVariants.default && (h("div", { class: "hy-person-card-container__category-title" }, this.categoryTitle)), h("div", { class: classAttributes }, h("div", { class: "hy-person-card__image-container" }, this.imageUrl ? (h("a", { class: "hy-person-card__image-container__image", href: this.url, target: target }, h("img", { loading: this.disableLazy ?
|
|
6184
|
+
].join(" ");
|
|
6185
|
+
const target = this.isExternal ? "_blank" : "_self";
|
|
6186
|
+
return (h("article", { class: "hy-person-card-container" }, h("div", { class: classLinkAttributes }, this.categoryTitle && this.variant == PersonCardVariants.default && (h("div", { class: "hy-person-card-container__category-title" }, this.categoryTitle)), h("div", { class: classAttributes }, h("div", { class: "hy-person-card__image-container" }, this.imageUrl ? (h("a", { class: "hy-person-card__image-container__image", href: this.url, target: target }, h("img", { loading: this.disableLazy ? "eager" : "lazy", "aria-hidden": "true", src: this.imageUrl, alt: this.imageAlt }))) : (h("div", { class: "hy-person-card__image-container__no-image" }, h("div", { class: "hy-person-card__image-container__no-image__initials", "aria-hidden": "true" }, this._initials)))), h("div", { class: "hy-person-card__info-container" }, h("a", { class: "hy-person-card__info-container__full-name", href: this.url, target: target }, this._fullName), this.positionTitle && h("div", { class: classPositionTitle }, this.positionTitle), this.department &&
|
|
6042
6187
|
(this.variant == PersonCardVariants.default ||
|
|
6043
6188
|
(this.variant == PersonCardVariants.extended && !this.isMobile)) && (h("div", { class: "hy-person-card__info-container__department" }, this.department)), this.field &&
|
|
6044
6189
|
(this.variant == PersonCardVariants.default ||
|
|
6045
6190
|
(this.variant == PersonCardVariants.extended && !this.isMobile)) && (h("div", { class: "hy-person-card__info-container__field" }, this.field)), this.email &&
|
|
6046
6191
|
(this.variant == PersonCardVariants.default ||
|
|
6047
6192
|
(this.variant == PersonCardVariants.extended && !this.isMobile)) && [
|
|
6048
|
-
h("div", { class: "hy-person-card__info-container__email-container" }, h("span", { class: "hy-person-card__info-container__email__icon" }, h("hy-icon", { icon:
|
|
6193
|
+
h("div", { class: "hy-person-card__info-container__email-container" }, h("span", { class: "hy-person-card__info-container__email__icon" }, h("hy-icon", { icon: "hy-icon-email", size: 16 })), h("span", { class: "hy-person-card__info-container__email" }, this.email)),
|
|
6049
6194
|
], this.phone &&
|
|
6050
6195
|
(this.variant == PersonCardVariants.default ||
|
|
6051
6196
|
(this.variant == PersonCardVariants.extended && !this.isMobile)) && [
|
|
6052
|
-
h("div", { class: "hy-person-card__info-container__phone-container" }, h("span", { class: "hy-person-card__info-container__phone__icon" }, h("hy-icon", { icon:
|
|
6197
|
+
h("div", { class: "hy-person-card__info-container__phone-container" }, h("span", { class: "hy-person-card__info-container__phone__icon" }, h("hy-icon", { icon: "hy-icon-phone", size: 14 })), h("span", { class: "hy-person-card__info-container__phone" }, this.phone)),
|
|
6053
6198
|
])), this.variant == PersonCardVariants.extended && (h("div", { class: "hy-person-card hy-person-card__extended-info-container" }, this.department && this.isMobile && (h("div", { class: "hy-person-card__info-container__department" }, this.department)), this.field && this.isMobile && h("div", { class: "hy-person-card__info-container__field" }, this.field), this.email &&
|
|
6054
6199
|
this.isMobile && [
|
|
6055
|
-
h("div", { class: "hy-person-card__info-container__email-container" }, h("span", { class: "hy-person-card__info-container__email__icon" }, h("hy-icon", { icon:
|
|
6200
|
+
h("div", { class: "hy-person-card__info-container__email-container" }, h("span", { class: "hy-person-card__info-container__email__icon" }, h("hy-icon", { icon: "hy-icon-email", size: 16 })), h("span", { class: "hy-person-card__info-container__email" }, this.email)),
|
|
6056
6201
|
], this.phone &&
|
|
6057
6202
|
this.isMobile && [
|
|
6058
|
-
h("div", { class: "hy-person-card__info-container__phone-container" }, h("span", { class: "hy-person-card__info-container__phone__icon" }, h("hy-icon", { icon:
|
|
6203
|
+
h("div", { class: "hy-person-card__info-container__phone-container" }, h("span", { class: "hy-person-card__info-container__phone__icon" }, h("hy-icon", { icon: "hy-icon-phone", size: 14 })), h("span", { class: "hy-person-card__info-container__phone" }, this.phone)),
|
|
6059
6204
|
], this.aboutInfo && (h("div", { class: "hy-person-card__extended-info-container__about" }, h("span", { class: "label" }, this.aboutInfoLabel, ":"), h("span", null, this.aboutInfo))))))));
|
|
6060
6205
|
}
|
|
6061
6206
|
};
|
|
@@ -6090,37 +6235,37 @@ const PersonProfile$1 = class {
|
|
|
6090
6235
|
const { organizations, research_organizations } = organization_units.items;
|
|
6091
6236
|
const aboutDescriptionTextDestructured = about.description;
|
|
6092
6237
|
const aboutDescriptionLength = aboutDescriptionTextDestructured.length;
|
|
6093
|
-
let trimmedAboutDescription =
|
|
6238
|
+
let trimmedAboutDescription = "";
|
|
6094
6239
|
if (aboutDescriptionLength > 650) {
|
|
6095
6240
|
if (this.isFullAboutTextHidden) {
|
|
6096
|
-
const ellipsisTextArray = aboutDescriptionTextDestructured +
|
|
6241
|
+
const ellipsisTextArray = aboutDescriptionTextDestructured + "...";
|
|
6097
6242
|
trimmedAboutDescription = ellipsisTextArray;
|
|
6098
6243
|
}
|
|
6099
6244
|
else {
|
|
6100
|
-
const ellipsisTextArray = aboutDescriptionTextDestructured.substring(0, 650) +
|
|
6245
|
+
const ellipsisTextArray = aboutDescriptionTextDestructured.substring(0, 650) + "...";
|
|
6101
6246
|
trimmedAboutDescription = ellipsisTextArray;
|
|
6102
6247
|
}
|
|
6103
6248
|
}
|
|
6104
|
-
window.addEventListener(
|
|
6249
|
+
window.addEventListener("resize", () => {
|
|
6105
6250
|
clearTimeout(timer);
|
|
6106
6251
|
timer = setTimeout(() => {
|
|
6107
6252
|
this.viewportSize = window.innerWidth;
|
|
6108
6253
|
}, 250);
|
|
6109
6254
|
});
|
|
6110
6255
|
const research_portal_title = `${research.research_portal_label}: ${name}`;
|
|
6111
|
-
return (h(Host, null, h("section", { class: "hy-profile-page" }, h("a", { href: this.peopleFinderReturnLink, class: "hy-profile-page__back-button" }, h("hy-icon", { icon:
|
|
6112
|
-
return (h("span", null, index > 1 && h("hy-icon", { icon:
|
|
6113
|
-
|
|
6114
|
-
item.id, target:
|
|
6256
|
+
return (h(Host, null, h("section", { class: "hy-profile-page" }, h("a", { href: this.peopleFinderReturnLink, class: "hy-profile-page__back-button" }, h("hy-icon", { icon: "hy-icon-arrow-left", size: 24 }), h("span", null, this.peopleFinderReturnLabel)), h("section", { class: "hy-profile-page__section" }, h("div", { class: "hy-profile-page__person-information" }, h("div", null, h("h1", { class: "hy-profile-page__name" }, name), job_title && h("p", { class: "hy-profile-page__job-title" }, job_title), additional_information && (h("p", { class: "hy-profile-page__additional-information" }, additional_information))), image_url ? (h("img", { src: image_url, alt: "", class: "hy-profile-page__image" })) : (h("div", { class: "hy-profile-page__image", "aria-hidden": "true" }))), contact_information && (h("div", { class: "hy-profile-page__contact-information" }, contact_information.label && h("h2", null, contact_information.label), contact_information.items && (h("hy-person-profile-listing", { items: contact_information.items, col: "col-4", withoutIcons: true, textSpacingTight: true }))))), (organizations.items.length > 0 || Object.keys(research_organizations.items).length > 0) && (h("section", { class: "hy-profile-page__section" }, organization_units.label && h("h2", null, organization_units.label), organizations.items.length > 0 && (h("section", { class: "hy-profile-page__organization-units-section" }, h("h3", null, organizations.label), h("ul", { class: "hy-profile-page__organizations" }, h("li", null, organizations.items.map((item, index) => {
|
|
6257
|
+
return (h("span", null, index > 1 && h("hy-icon", { icon: "hy-icon-caret-right", size: 10 }), index !== 0 && (h("span", null, h("a", { href: organization_units.people_finder_path[organization_units.lang] +
|
|
6258
|
+
"?researchOrganizations.id[]=" +
|
|
6259
|
+
item.id, target: "_blank" }, item.name[organization_units.lang])))));
|
|
6115
6260
|
}))))), Object.keys(research_organizations.items).length > 0 && (h("section", { class: "hy-profile-page__organization-units-section" }, h("h3", null, research_organizations.label), h("ul", { class: "hy-profile-page__research-organizations" }, Object.values(research_organizations.items).map(([...item]) => (h("li", null, item.map((item, index) => {
|
|
6116
|
-
return (h(Fragment, null, index > 1 && (h("ul", null, h("li", null, h("span", null, h("hy-icon", { icon:
|
|
6117
|
-
|
|
6118
|
-
item.id, target:
|
|
6119
|
-
|
|
6120
|
-
item.id, target:
|
|
6261
|
+
return (h(Fragment, null, index > 1 && (h("ul", null, h("li", null, h("span", null, h("hy-icon", { icon: "hy-icon-caret-right", size: 10 }), h("span", null, h("a", { href: organization_units.people_finder_path[organization_units.lang] +
|
|
6262
|
+
"?researchOrganizations.id[]=" +
|
|
6263
|
+
item.id, target: "_blank" }, item.name[organization_units.lang])))))), index == 1 && (h("span", null, h("a", { href: organization_units.people_finder_path[organization_units.lang] +
|
|
6264
|
+
"?researchOrganizations.id[]=" +
|
|
6265
|
+
item.id, target: "_blank" }, item.name[organization_units.lang])))));
|
|
6121
6266
|
}))))))))), about && aboutDescriptionLength !== 0 && (h("section", { class: "hy-profile-page__section" }, about.description && (h(Fragment, null, h("h2", null, about.label), h("div", { class: "hy-profile-page__person-about-text", innerHTML: !this.isFullAboutTextHidden && aboutDescriptionLength > 650
|
|
6122
6267
|
? trimmedAboutDescription
|
|
6123
|
-
: about.description }))), aboutDescriptionLength > 650 && (h("button", { class: "hy-profile-page__person-about-text-toggle", onClick: () => this.toggleShowFullAboutText(), "aria-expanded": `${this.isFullAboutTextHidden ?
|
|
6268
|
+
: about.description }))), aboutDescriptionLength > 650 && (h("button", { class: "hy-profile-page__person-about-text-toggle", onClick: () => this.toggleShowFullAboutText(), "aria-expanded": `${this.isFullAboutTextHidden ? "true" : "false"}` }, this.isFullAboutTextHidden ? this.hideFullAboutText : this.showFullAboutText)))), ((research && research.items.length > 0) || (person_content && person_content.research_url.length > 0)) && (h("section", { class: "hy-profile-page__section" }, h("div", { class: "hy-profile-page__section__research_title" }, research.label && h("h2", null, research.label), research.label && person_content.research_url.length > 0 && (h("hy-cta-button", { "link-content": research_portal_title, "sc-label": research_portal_title, url: person_content.research_url, "is-external": "true", variant: CtaLinkButtonVariants.onWhiteBkgd }))), research.items && (h("hy-person-profile-listing", { items: research.items, col: "col-1", textSpacingTight: true, "is-research": true, inline: true })), person_content.research_url.length > 0 && (h("div", { class: "hy-profile-page__loader", role: "presentation" }, h("div", null), h("div", null), h("div", null), h("div", null))), person_content.research_url.length > 0 && this.viewportSize < 768 && (h("div", { class: "hy-profile-page__person-content-container" }, h("hy-accordion-container", { accordionid: "accordion-container-person-content" }, person_content.publications && (h("hy-accordion-item", { "data-accordion-id": "publications", accordiontitle: person_content.publications.label })), person_content.projects && (h("hy-accordion-item", { "data-accordion-id": "projects", accordiontitle: person_content.projects.label })), person_content.activities && (h("hy-accordion-item", { "data-accordion-id": "activities", accordiontitle: person_content.activities.label }))))), person_content.research_url.length > 0 && this.viewportSize >= 768 && (h("div", { class: "hy-profile-page__person-content-container" }, h("hy-tabs", { "tab-id": "tabs-container-person-content" }, person_content.publications && (h("hy-tabs-item", { "data-tab-id": "publications", "tab-title": person_content.publications.label })), person_content.projects && (h("hy-tabs-item", { "data-tab-id": "projects", "tab-title": person_content.projects.label })), person_content.activities && (h("hy-tabs-item", { "data-tab-id": "activities", "tab-title": person_content.activities.label }))))))))));
|
|
6124
6269
|
}
|
|
6125
6270
|
};
|
|
6126
6271
|
PersonProfile$1.style = personProfileCss;
|
|
@@ -6131,20 +6276,20 @@ const PersonProfile = class {
|
|
|
6131
6276
|
constructor(hostRef) {
|
|
6132
6277
|
registerInstance(this, hostRef);
|
|
6133
6278
|
this.items = undefined;
|
|
6134
|
-
this.col =
|
|
6279
|
+
this.col = "col-2";
|
|
6135
6280
|
this.inline = undefined;
|
|
6136
6281
|
this.withoutIcons = undefined;
|
|
6137
6282
|
this.textSpacingTight = undefined;
|
|
6138
6283
|
this.isResearch = false;
|
|
6139
6284
|
}
|
|
6140
6285
|
render() {
|
|
6141
|
-
return (h(Host, null, h("ul", { class: `hy-person-profile-listing ${this.col} ${this.inline ?
|
|
6142
|
-
if (items.filter(({ label }) => label !==
|
|
6286
|
+
return (h(Host, null, h("ul", { class: `hy-person-profile-listing ${this.col} ${this.inline ? "is-inline" : ""} ${this.withoutIcons ? "without-icons" : ""} ${this.textSpacingTight ? "text-tight" : ""}` }, this.isResearch && h("h3", { class: "hy-person-profile-listing__label" }, this.items[0].label), this.items.map(({ label, items }) => {
|
|
6287
|
+
if (items.filter(({ label }) => label !== "").length > 0) {
|
|
6143
6288
|
return (h("li", null, !this.isResearch && h("h3", { class: "hy-person-profile-listing__label" }, label), h("ul", { class: "hy-person-profile-listing__items" }, items.map(({ label, url }, index) => {
|
|
6144
6289
|
if (url) {
|
|
6145
|
-
return (h("li", { class: "hy-person-profile-listing__item" }, h("a", { href: url }, index !== 0 && h("hy-icon", { icon:
|
|
6290
|
+
return (h("li", { class: "hy-person-profile-listing__item" }, h("a", { href: url }, index !== 0 && h("hy-icon", { icon: "hy-icon-caret-right", size: 10 }), h("span", null, label))));
|
|
6146
6291
|
}
|
|
6147
|
-
return (h("li", { class: "hy-person-profile-listing__item" }, index !== 0 && h("hy-icon", { icon:
|
|
6292
|
+
return (h("li", { class: "hy-person-profile-listing__item" }, index !== 0 && h("hy-icon", { icon: "hy-icon-caret-right", size: 10 }), h("span", null, label)));
|
|
6148
6293
|
}))));
|
|
6149
6294
|
}
|
|
6150
6295
|
}))));
|
|
@@ -6157,7 +6302,7 @@ const processCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand
|
|
|
6157
6302
|
const Process = class {
|
|
6158
6303
|
constructor(hostRef) {
|
|
6159
6304
|
registerInstance(this, hostRef);
|
|
6160
|
-
this.headerstyle =
|
|
6305
|
+
this.headerstyle = "common";
|
|
6161
6306
|
this.numberTerm = undefined;
|
|
6162
6307
|
this.dataItems = undefined;
|
|
6163
6308
|
}
|
|
@@ -6165,10 +6310,10 @@ const Process = class {
|
|
|
6165
6310
|
this._dataItems = await jsonParserWorker(this.dataItems);
|
|
6166
6311
|
}
|
|
6167
6312
|
componentDidLoad() {
|
|
6168
|
-
let hyMainDiv = this.el.closest(
|
|
6313
|
+
let hyMainDiv = this.el.closest(".hy-main");
|
|
6169
6314
|
if (hyMainDiv) {
|
|
6170
|
-
if (!hyMainDiv.classList.contains(
|
|
6171
|
-
this.headerstyle =
|
|
6315
|
+
if (!hyMainDiv.classList.contains("with-sidebar")) {
|
|
6316
|
+
this.headerstyle = "large";
|
|
6172
6317
|
}
|
|
6173
6318
|
}
|
|
6174
6319
|
}
|
|
@@ -6188,12 +6333,12 @@ const Process = class {
|
|
|
6188
6333
|
? ProcessFlowBoxVariants.default
|
|
6189
6334
|
: ProcessFlowBoxVariants.small;
|
|
6190
6335
|
const itemsPerRow = processVariant == ProcessFlowBoxVariants.small ? 4 : 3;
|
|
6191
|
-
const classAttributes = [processVariant,
|
|
6192
|
-
const classItem =
|
|
6336
|
+
const classAttributes = [processVariant, "hy-process", `hy-process__${this.headerstyle}`].join(" ");
|
|
6337
|
+
const classItem = "box";
|
|
6193
6338
|
var stepState;
|
|
6194
6339
|
return [
|
|
6195
6340
|
h("div", { class: classAttributes }, this._dataItems.map((x, index) => {
|
|
6196
|
-
index % itemsPerRow == 0 ? (stepState =
|
|
6341
|
+
index % itemsPerRow == 0 ? (stepState = "first") : (stepState = "default");
|
|
6197
6342
|
return (h("hy-process-flow-box", { class: classItem, variant: processVariant, "box-number": index + 1, "box-title": x.heading, "box-description": x.description, "intermediate-step-title": x.step, "step-state": stepState, "number-term": this.numberTerm }));
|
|
6198
6343
|
})),
|
|
6199
6344
|
];
|
|
@@ -6211,16 +6356,16 @@ const ProcessFlowBox = class {
|
|
|
6211
6356
|
this.boxNumber = undefined;
|
|
6212
6357
|
this.boxTitle = undefined;
|
|
6213
6358
|
this.boxDescription = undefined;
|
|
6214
|
-
this.intermediateStepTitle =
|
|
6215
|
-
this.stepState =
|
|
6359
|
+
this.intermediateStepTitle = "";
|
|
6360
|
+
this.stepState = "default";
|
|
6216
6361
|
this.numberTerm = undefined;
|
|
6217
6362
|
}
|
|
6218
6363
|
render() {
|
|
6219
|
-
const classVariant = [this.variant,
|
|
6220
|
-
const classContentVariant = [this.variant,
|
|
6221
|
-
const classIsEven = parseInt(this.boxNumber) % 2 == 0 ?
|
|
6222
|
-
const classNumberVariant = [this.variant,
|
|
6223
|
-
const classStepVariant = [this.variant, this.stepState, classIsEven,
|
|
6364
|
+
const classVariant = [this.variant, "hy-process-flow-box"].join(" ");
|
|
6365
|
+
const classContentVariant = [this.variant, "hy-process-flow-box__content"].join(" ");
|
|
6366
|
+
const classIsEven = parseInt(this.boxNumber) % 2 == 0 ? "even" : "odd";
|
|
6367
|
+
const classNumberVariant = [this.variant, "hy-process-flow-box__number__container"].join(" ");
|
|
6368
|
+
const classStepVariant = [this.variant, this.stepState, classIsEven, "hy-process-flow-box__step__container"].join(" ");
|
|
6224
6369
|
return (h(Host, null, h("div", { class: classVariant }, this.intermediateStepTitle && (h("div", { class: classStepVariant }, h("svg", { class: "desktop", width: "210", height: "60" }, h("polygon", { points: "0 0, 0 60, 190 60, 210 30, 190 0, 0 0" })), h("svg", { class: "mobile", width: "138", height: "82" }, h("polygon", { points: "0 0, 69 15, 138 0, 138 50, 69 82, 0 50" })), h("h2", { class: "hy-process-flow-box__step" }, this.intermediateStepTitle))), h("div", { class: classNumberVariant }, h("h2", { class: "hy-process-flow-box__number", "aria-label": `${this.numberTerm && this.numberTerm} ${this.boxNumber}` }, h("div", { class: "hy-process-flow-box__number-title" }, this.boxNumber))), h("div", { class: classContentVariant }, h("h3", { class: "hy-process-flow-box__title", innerHTML: this.boxTitle }), h("div", { class: "hy-process-flow-box__description", innerHTML: this.boxDescription }))), h("hy-box", { mb: "1.75, 1.75, 2, 2.5" })));
|
|
6225
6370
|
}
|
|
6226
6371
|
};
|
|
@@ -6233,25 +6378,25 @@ const HyProminentImage = class {
|
|
|
6233
6378
|
registerInstance(this, hostRef);
|
|
6234
6379
|
this.textTitle = undefined;
|
|
6235
6380
|
this.imageUrl = undefined;
|
|
6236
|
-
this.imageAlt =
|
|
6237
|
-
this.headerstyle =
|
|
6381
|
+
this.imageAlt = "";
|
|
6382
|
+
this.headerstyle = "common";
|
|
6238
6383
|
this.sourceSet = undefined;
|
|
6239
6384
|
}
|
|
6240
6385
|
componentDidLoad() {
|
|
6241
|
-
let hyMainDiv = this.el.closest(
|
|
6386
|
+
let hyMainDiv = this.el.closest(".hy-main");
|
|
6242
6387
|
if (hyMainDiv) {
|
|
6243
|
-
if (!hyMainDiv.classList.contains(
|
|
6244
|
-
this.headerstyle =
|
|
6388
|
+
if (!hyMainDiv.classList.contains("with-sidebar")) {
|
|
6389
|
+
this.headerstyle = "large";
|
|
6245
6390
|
}
|
|
6246
6391
|
}
|
|
6247
6392
|
}
|
|
6248
6393
|
render() {
|
|
6249
6394
|
const prominentImageClass = [
|
|
6250
|
-
|
|
6395
|
+
"hy-prominent-image",
|
|
6251
6396
|
this.headerstyle,
|
|
6252
6397
|
`hy-prominent-image__${this.headerstyle}`,
|
|
6253
|
-
].join(
|
|
6254
|
-
const prominentImageText = [
|
|
6398
|
+
].join(" ");
|
|
6399
|
+
const prominentImageText = ["hy-prominent-image__text", `hy-prominent-image__text__${this.headerstyle}`].join(" ");
|
|
6255
6400
|
return (h(Host, null, h("div", { class: prominentImageClass }, h("div", { class: "hy-prominent-image__image" }, h("hy-image", { "source-set": this.sourceSet, "image-url": this.imageUrl, "image-alt": this.imageAlt, aspectRatioWidth: 2, aspectRatioHeight: 1 })), this.textTitle && h("div", { class: prominentImageText }, this.textTitle))));
|
|
6256
6401
|
}
|
|
6257
6402
|
get el() { return getElement(this); }
|
|
@@ -6264,19 +6409,19 @@ const HyQuote = class {
|
|
|
6264
6409
|
constructor(hostRef) {
|
|
6265
6410
|
registerInstance(this, hostRef);
|
|
6266
6411
|
this.quoteSignature = undefined;
|
|
6267
|
-
this.headerstyle =
|
|
6412
|
+
this.headerstyle = "common";
|
|
6268
6413
|
}
|
|
6269
6414
|
componentDidLoad() {
|
|
6270
|
-
let hyMainDiv = this.el.closest(
|
|
6415
|
+
let hyMainDiv = this.el.closest(".hy-main");
|
|
6271
6416
|
if (hyMainDiv) {
|
|
6272
|
-
if (!hyMainDiv.classList.contains(
|
|
6273
|
-
this.headerstyle =
|
|
6417
|
+
if (!hyMainDiv.classList.contains("with-sidebar")) {
|
|
6418
|
+
this.headerstyle = "large";
|
|
6274
6419
|
}
|
|
6275
6420
|
}
|
|
6276
6421
|
}
|
|
6277
6422
|
render() {
|
|
6278
|
-
const quoteClass = [
|
|
6279
|
-
return (h("div", { class: quoteClass }, h("span", { class: "hy-quote__icon-wrapper" }, h("div", { class: "hy-quote__icon" }, h("hy-icon", { icon:
|
|
6423
|
+
const quoteClass = ["hy-quote", this.headerstyle, `hy-quote__${this.headerstyle}`].join(" ");
|
|
6424
|
+
return (h("div", { class: quoteClass }, h("span", { class: "hy-quote__icon-wrapper" }, h("div", { class: "hy-quote__icon" }, h("hy-icon", { icon: "hy-icon-quote", size: 48 }))), h("div", { class: "hy-quote-text-wrapper" }, h("div", { class: "hy-quote__text" }, h("slot", null)), this.quoteSignature && h("div", { class: "hy-quote__signature" }, this.quoteSignature))));
|
|
6280
6425
|
}
|
|
6281
6426
|
get el() { return getElement(this); }
|
|
6282
6427
|
};
|
|
@@ -6297,8 +6442,8 @@ const createCss = (justify, align, margin) => {
|
|
|
6297
6442
|
const Row = class {
|
|
6298
6443
|
constructor(hostRef) {
|
|
6299
6444
|
registerInstance(this, hostRef);
|
|
6300
|
-
this.justify =
|
|
6301
|
-
this.align =
|
|
6445
|
+
this.justify = "stretch";
|
|
6446
|
+
this.align = "center";
|
|
6302
6447
|
this.margin = 1;
|
|
6303
6448
|
}
|
|
6304
6449
|
render() {
|
|
@@ -6316,15 +6461,15 @@ const HySearchField = class {
|
|
|
6316
6461
|
this.isLabelBold = false;
|
|
6317
6462
|
this.labelLarge = false;
|
|
6318
6463
|
this.isLuomusSearch = false;
|
|
6319
|
-
this.placeholder =
|
|
6464
|
+
this.placeholder = "Type here...";
|
|
6320
6465
|
this.isLabelHidden = false;
|
|
6321
6466
|
this.inputId = undefined;
|
|
6322
|
-
this.prefillParameter =
|
|
6467
|
+
this.prefillParameter = "";
|
|
6323
6468
|
this.isInputValueEmpty = true;
|
|
6324
6469
|
}
|
|
6325
6470
|
componentDidLoad() {
|
|
6326
|
-
const searchInput = this.el.querySelector(
|
|
6327
|
-
searchInput.addEventListener(
|
|
6471
|
+
const searchInput = this.el.querySelector(".search-field__input");
|
|
6472
|
+
searchInput.addEventListener("keyup", (event) => {
|
|
6328
6473
|
const { value } = event.target;
|
|
6329
6474
|
this.isInputValueEmpty = value.length > 0 ? false : true;
|
|
6330
6475
|
});
|
|
@@ -6333,38 +6478,50 @@ const HySearchField = class {
|
|
|
6333
6478
|
return;
|
|
6334
6479
|
const urlParams = new URLSearchParams(window.location.search);
|
|
6335
6480
|
const searchValue = urlParams.get(`${this.prefillParameter}`);
|
|
6336
|
-
const searchInput = this.el.querySelector(
|
|
6337
|
-
searchInput.value = searchValue && searchValue.length > 0 ? searchValue :
|
|
6481
|
+
const searchInput = this.el.querySelector(".search-field__input");
|
|
6482
|
+
searchInput.value = searchValue && searchValue.length > 0 ? searchValue : "";
|
|
6338
6483
|
this.isInputValueEmpty = false;
|
|
6339
6484
|
}
|
|
6340
6485
|
}
|
|
6341
6486
|
handleInputReset() {
|
|
6342
6487
|
this.isInputValueEmpty = true;
|
|
6343
|
-
const searchInput = this.el.querySelector(
|
|
6344
|
-
searchInput.value =
|
|
6488
|
+
const searchInput = this.el.querySelector(".search-field__input");
|
|
6489
|
+
searchInput.value = "";
|
|
6345
6490
|
searchInput.focus();
|
|
6346
6491
|
}
|
|
6347
6492
|
render() {
|
|
6348
6493
|
return (h(Host, { class: "search-field" }, !this.isLuomusSearch && (h("label", { htmlFor: this.inputId, class: `search-field__label
|
|
6349
|
-
${this.isLabelHidden ?
|
|
6350
|
-
${this.labelLarge ?
|
|
6351
|
-
${this.isLabelBold ?
|
|
6494
|
+
${this.isLabelHidden ? "visually-hidden" : ""}
|
|
6495
|
+
${this.labelLarge ? "label-large" : ""}
|
|
6496
|
+
${this.isLabelBold ? "bold" : ""}` }, this.label)), h("div", { class: "search-field__actions" }, h("div", { class: "search-field__wrapper" }, this.isLuomusSearch && (h("input", { id: this.inputId, name: "search", "data-drupal-selector": "edit-search", value: "", type: "text", placeholder: this.placeholder, class: "search-field__input" })), !this.isLuomusSearch && (h("input", { id: this.inputId, type: "text", placeholder: this.placeholder, class: "search-field__input" })), !this.isInputValueEmpty && (h("button", { type: "button", class: "search-field__reset", "aria-label": "Reset", onClick: () => this.handleInputReset() }, h("hy-icon", { icon: "hy-icon-remove", size: 14, "aria-hidden": "true" })))), this.isLuomusSearch && (h("button", { type: "submit", class: "search-field__submit", "aria-label": "Search", "data-drupal-selector": "edit-submit-luomus-search", id: "edit-submit-luomus-search", value: "Apply" }, h("hy-icon", { icon: "hy-icon-search", size: 18, fill: ColorVariant.white, "aria-hidden": "true" }))), !this.isLuomusSearch && (h("button", { type: "submit", class: "search-field__submit", "aria-label": "Search" }, h("hy-icon", { icon: "hy-icon-search", size: 18, fill: ColorVariant.white, "aria-hidden": "true" }))))));
|
|
6352
6497
|
}
|
|
6353
6498
|
get el() { return getElement(this); }
|
|
6354
6499
|
};
|
|
6355
6500
|
HySearchField.style = hySearchFieldCss;
|
|
6356
6501
|
|
|
6502
|
+
const sectionContainerCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand-main-bright:#48c5f8;--brand-main-light:#107eab;--brand-main-active:#005379;--brand-main-dark:#003146;--brand-main-nearly-black:#000222;--link-blue:#0479a4;--link-disabled:#767676;--grayscale-white:#fff;--grayscale-slightly-gray:#fefefe;--grayscale-light:#f8f8f8;--grayscale-medium:#d2d2d2;--grayscale-background-box:#f5f5f5;--grayscale-tabs-border:#e6e6e6;--grayscale-background-arrow:#dfdfdf;--grayscale-medium-dark:#979797;--grayscale-dark:#555555;--grayscale-dark-text:#222222;--grayscale-black:#000000;--additional-red-light:#e5053a;--additional-red-dark:#a31621;--additional-purple-light:#420039;--additional-yellow-light:#f9a21a;--additional-yellow:#c47f1b;--additional-skyblue:#48c5f8;--additional-orange:#d14600;--additional-green-light:#96ba3c;--additional-green-dark:#006400;--hover-gray:#eaeaea}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{--gutter-mobile:16px;--gutter-narrow:24px;--gutter-medium:24px;--gutter-wide:24px;--gutter-extrawide:32px}:root{--breakpoint-extrawide:75.0625rem;--breakpoint-max-width:75.0625rem;--breakpoint-medium:48rem;--breakpoint-narrow:30rem;--breakpoint-wide:60rem}:host{display:block}.hy-section--container{display:block;width:100%;margin-left:auto;margin-right:auto}@media only screen and (min-width: 30rem){.hy-section--container{width:100%}}@media only screen and (min-width: 60rem){.hy-section--container{width:100%;max-width:60rem}}@media only screen and (min-width: 75.0625rem){.hy-section--container{width:100%;max-width:75rem}}";
|
|
6503
|
+
|
|
6504
|
+
const SectionContainer = class {
|
|
6505
|
+
constructor(hostRef) {
|
|
6506
|
+
registerInstance(this, hostRef);
|
|
6507
|
+
}
|
|
6508
|
+
render() {
|
|
6509
|
+
return (h("div", { class: "hy-section--container" }, h("slot", null)));
|
|
6510
|
+
}
|
|
6511
|
+
};
|
|
6512
|
+
SectionContainer.style = sectionContainerCss;
|
|
6513
|
+
|
|
6357
6514
|
const hyShortcutsCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand-main-bright:#48c5f8;--brand-main-light:#107eab;--brand-main-active:#005379;--brand-main-dark:#003146;--brand-main-nearly-black:#000222;--link-blue:#0479a4;--link-disabled:#767676;--grayscale-white:#fff;--grayscale-slightly-gray:#fefefe;--grayscale-light:#f8f8f8;--grayscale-medium:#d2d2d2;--grayscale-background-box:#f5f5f5;--grayscale-tabs-border:#e6e6e6;--grayscale-background-arrow:#dfdfdf;--grayscale-medium-dark:#979797;--grayscale-dark:#555555;--grayscale-dark-text:#222222;--grayscale-black:#000000;--additional-red-light:#e5053a;--additional-red-dark:#a31621;--additional-purple-light:#420039;--additional-yellow-light:#f9a21a;--additional-yellow:#c47f1b;--additional-skyblue:#48c5f8;--additional-orange:#d14600;--additional-green-light:#96ba3c;--additional-green-dark:#006400;--hover-gray:#eaeaea}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{--gutter-mobile:16px;--gutter-narrow:24px;--gutter-medium:24px;--gutter-wide:24px;--gutter-extrawide:32px}:root{--breakpoint-extrawide:75.0625rem;--breakpoint-max-width:75.0625rem;--breakpoint-medium:48rem;--breakpoint-narrow:30rem;--breakpoint-wide:60rem}:host{display:block}.hy-shortcuts{overflow:hidden}.hy-shortcuts .shortcut-link-container{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin:0 calc(var(--gutter-mobile)* -1)}@media (min-width: 30rem){.hy-shortcuts .shortcut-link-container{margin:0 calc(var(--gutter-narrow)* -1)}}@media (min-width: 60rem){.hy-shortcuts .shortcut-link-container{margin:0 calc(var(--gutter-wide)* -1)}}.hy-shortcuts .shortcut-link-container .shortcut-link-wrapper{min-height:62px;padding:0 var(--gutter-mobile)}@media (min-width: 30rem){.hy-shortcuts .shortcut-link-container .shortcut-link-wrapper{min-height:70px;padding:0 var(--gutter-narrow)}}@media (min-width: 60rem){.hy-shortcuts .shortcut-link-container .shortcut-link-wrapper{min-height:82px;padding:0 var(--gutter-wide)}}.hy-shortcuts .shortcut-link-container .shortcut-link-wrapper.box-3{width:100%}@media (min-width: 30rem){.hy-shortcuts .shortcut-link-container .shortcut-link-wrapper.box-3{width:33.33%}}.hy-shortcuts .shortcut-link-container .shortcut-link-wrapper.box-4{width:50%}@media (min-width: 30rem){.hy-shortcuts .shortcut-link-container .shortcut-link-wrapper.box-4{width:25%}}.hy-shortcuts .shortcut-link-container .shortcut-link-wrapper.box-3.first a.shortcut-link,.hy-shortcuts .shortcut-link-container .shortcut-link-wrapper.box-4.first a.shortcut-link{border-top:2.5px solid var(--brand-main-nearly-black)}@media (min-width: 30rem){.hy-shortcuts .shortcut-link-container .shortcut-link-wrapper.box-3.first a.shortcut-link,.hy-shortcuts .shortcut-link-container .shortcut-link-wrapper.box-4.first a.shortcut-link{border-top:3px solid var(--brand-main-nearly-black)}}.hy-shortcuts .shortcut-link-container a.shortcut-link{-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:transparent;border-bottom:2.5px solid var(--brand-main-nearly-black);color:var(--brand-main-nearly-black);cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--main-font-family);font-size:14px;font-weight:600;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;height:100%;letter-spacing:-0.44px;line-height:18px;min-height:70px;position:relative;text-decoration:none;word-break:break-word}@media (min-width: 30rem){.hy-shortcuts .shortcut-link-container a.shortcut-link{border-bottom:3px solid var(--brand-main-nearly-black);border-top:3px solid var(--brand-main-nearly-black);font-size:16px;letter-spacing:-0.5px;line-height:18px;min-height:70px}}@media (min-width: 60rem){.hy-shortcuts .shortcut-link-container a.shortcut-link{font-size:16px;letter-spacing:-0.5px;line-height:22px;min-height:82px}}.hy-shortcuts .shortcut-link-container a.shortcut-link .link-icon{padding:0 0 0 8px}@media (min-width: 30rem){.hy-shortcuts .shortcut-link-container a.shortcut-link .link-icon{padding:0 0 0 12px}}@media (min-width: 60rem){.hy-shortcuts .shortcut-link-container a.shortcut-link .link-icon{padding:0 4px 0 22px}}.hy-shortcuts .shortcut-link-container a.shortcut-link .link-icon svg{height:20px;fill:var(--brand-main-light);width:20px}@media (min-width: 30rem){.hy-shortcuts .shortcut-link-container a.shortcut-link .link-icon svg{height:24px;width:24px}}@media (min-width: 60rem){.hy-shortcuts .shortcut-link-container a.shortcut-link .link-icon svg{height:28px;width:28px}}.hy-shortcuts .shortcut-link-container a.shortcut-link:hover{color:var(--brand-main)}.hy-shortcuts .shortcut-link-container a.shortcut-link:hover svg{fill:var(--brand-main)}";
|
|
6358
6515
|
|
|
6359
6516
|
const HyShortcuts = class {
|
|
6360
6517
|
constructor(hostRef) {
|
|
6361
6518
|
registerInstance(this, hostRef);
|
|
6362
6519
|
this.dataItems = undefined;
|
|
6363
|
-
this.listHeading =
|
|
6364
|
-
this.headerstyle =
|
|
6520
|
+
this.listHeading = "";
|
|
6521
|
+
this.headerstyle = "default";
|
|
6365
6522
|
}
|
|
6366
6523
|
arrayDataWatcher(newValue) {
|
|
6367
|
-
if (typeof newValue ===
|
|
6524
|
+
if (typeof newValue === "string") {
|
|
6368
6525
|
this._dataItems = JSON.parse(newValue);
|
|
6369
6526
|
}
|
|
6370
6527
|
else {
|
|
@@ -6375,29 +6532,29 @@ const HyShortcuts = class {
|
|
|
6375
6532
|
this.arrayDataWatcher(this.dataItems);
|
|
6376
6533
|
}
|
|
6377
6534
|
componentDidLoad() {
|
|
6378
|
-
let hyMainDiv = this.el.closest(
|
|
6535
|
+
let hyMainDiv = this.el.closest(".hy-main");
|
|
6379
6536
|
if (hyMainDiv) {
|
|
6380
|
-
if (!hyMainDiv.classList.contains(
|
|
6381
|
-
this.headerstyle =
|
|
6537
|
+
if (!hyMainDiv.classList.contains("with-sidebar")) {
|
|
6538
|
+
this.headerstyle = "large";
|
|
6382
6539
|
}
|
|
6383
6540
|
}
|
|
6384
6541
|
}
|
|
6385
6542
|
render() {
|
|
6386
|
-
const classAttributes = [
|
|
6387
|
-
const textClassAttributes = [
|
|
6388
|
-
const iconClassAttributes = [
|
|
6389
|
-
let classItem = [
|
|
6543
|
+
const classAttributes = ["hy-shortcuts", `hy-shortcuts__${this.headerstyle}`].join(" ");
|
|
6544
|
+
const textClassAttributes = ["text"].join(" ");
|
|
6545
|
+
const iconClassAttributes = ["link-icon"].join(" ");
|
|
6546
|
+
let classItem = ["shortcut-link-wrapper", this._dataItems.length % 4 == 0 ? "box-4" : "box-3"].join(" ");
|
|
6390
6547
|
return (h(Host, null, h("div", { class: classAttributes }, this.listHeading.length > 0 && (h("hy-heading", { class: "list-title", heading: HeadingVarians.h2 }, this.listHeading)), h("div", { class: "shortcut-link-container" }, this._dataItems.map((x, index) => {
|
|
6391
|
-
let isFirstLine =
|
|
6548
|
+
let isFirstLine = "";
|
|
6392
6549
|
if (this._dataItems.length % 4 == 0) {
|
|
6393
|
-
isFirstLine = index == 0 || index == 1 ?
|
|
6550
|
+
isFirstLine = index == 0 || index == 1 ? "first" : "";
|
|
6394
6551
|
}
|
|
6395
6552
|
else {
|
|
6396
|
-
isFirstLine = index == 0 ?
|
|
6553
|
+
isFirstLine = index == 0 ? "first" : "";
|
|
6397
6554
|
}
|
|
6398
|
-
let classLinkWrapper = classItem.concat(
|
|
6399
|
-
let target = x.isExternal ?
|
|
6400
|
-
return (h("div", { class: classLinkWrapper }, h("a", { "aria-label": x.ariaLabel, class: "shortcut-link", href: x.url, target: target }, h("span", { class: textClassAttributes }, x.heading), h("span", { class: iconClassAttributes }, h("hy-icon", { icon:
|
|
6555
|
+
let classLinkWrapper = classItem.concat(" ", isFirstLine);
|
|
6556
|
+
let target = x.isExternal ? "_blank" : "_self";
|
|
6557
|
+
return (h("div", { class: classLinkWrapper }, h("a", { "aria-label": x.ariaLabel, class: "shortcut-link", href: x.url, target: target }, h("span", { class: textClassAttributes }, x.heading), h("span", { class: iconClassAttributes }, h("hy-icon", { icon: "hy-icon-arrow-right", size: 28 })))));
|
|
6401
6558
|
}))), h("hy-box", { mb: "1.75, 1.75, 2, 2.5" })));
|
|
6402
6559
|
}
|
|
6403
6560
|
get el() { return getElement(this); }
|
|
@@ -6421,9 +6578,9 @@ const SiteHeader = class {
|
|
|
6421
6578
|
this.isGroup = false;
|
|
6422
6579
|
this.isLuomusGroup = false;
|
|
6423
6580
|
this.isBetaGroup = false;
|
|
6424
|
-
this.researchGroupLabel =
|
|
6425
|
-
this.groupType =
|
|
6426
|
-
this.groupLogoUrl =
|
|
6581
|
+
this.researchGroupLabel = "";
|
|
6582
|
+
this.groupType = "";
|
|
6583
|
+
this.groupLogoUrl = "";
|
|
6427
6584
|
this.dataMenuLanguage = undefined;
|
|
6428
6585
|
this.dataMenuDonate = undefined;
|
|
6429
6586
|
this.dataSiteHeaderLabels = undefined;
|
|
@@ -6434,7 +6591,7 @@ const SiteHeader = class {
|
|
|
6434
6591
|
this.siteUrl = undefined;
|
|
6435
6592
|
this.showSearchLabel = true;
|
|
6436
6593
|
this.noSearch = false;
|
|
6437
|
-
this.menuLabel =
|
|
6594
|
+
this.menuLabel = "Menu";
|
|
6438
6595
|
this.menuLabelOpen = undefined;
|
|
6439
6596
|
this.menuLabelClose = undefined;
|
|
6440
6597
|
this.menuType = null;
|
|
@@ -6455,12 +6612,12 @@ const SiteHeader = class {
|
|
|
6455
6612
|
mobileMenuToggle() {
|
|
6456
6613
|
this.isMenuOpen = !this.isMenuOpen;
|
|
6457
6614
|
this.menuMobileToggled.emit();
|
|
6458
|
-
let bodyElement = document.getElementsByTagName(
|
|
6615
|
+
let bodyElement = document.getElementsByTagName("body")[0];
|
|
6459
6616
|
if (this.isMenuOpen) {
|
|
6460
|
-
bodyElement.style.overflow =
|
|
6617
|
+
bodyElement.style.overflow = "hidden";
|
|
6461
6618
|
}
|
|
6462
6619
|
else {
|
|
6463
|
-
bodyElement.style.overflow =
|
|
6620
|
+
bodyElement.style.overflow = "initial";
|
|
6464
6621
|
}
|
|
6465
6622
|
}
|
|
6466
6623
|
// Listener for toggling mobile menu top panel on or off.
|
|
@@ -6495,25 +6652,25 @@ const SiteHeader = class {
|
|
|
6495
6652
|
this.lastScrollTop = topOffset;
|
|
6496
6653
|
}
|
|
6497
6654
|
toggleStickyness(toggleOn = true) {
|
|
6498
|
-
const bodyElementClasses = document.querySelector(
|
|
6499
|
-
let hySiteHeader = this.el.querySelector(
|
|
6655
|
+
const bodyElementClasses = document.querySelector("body").classList;
|
|
6656
|
+
let hySiteHeader = this.el.querySelector(".hy-site-header");
|
|
6500
6657
|
if (!hySiteHeader)
|
|
6501
6658
|
return;
|
|
6502
|
-
this.isTopVisible ? hySiteHeader.classList.add(
|
|
6659
|
+
this.isTopVisible ? hySiteHeader.classList.add("is-at-top") : hySiteHeader.classList.remove("is-at-top");
|
|
6503
6660
|
if (toggleOn) {
|
|
6504
|
-
hySiteHeader.classList.add(
|
|
6505
|
-
hySiteHeader.classList.remove(
|
|
6506
|
-
!this.isBottomVisible && !this.isTopVisible && bodyElementClasses.add(
|
|
6507
|
-
if (bodyElementClasses.contains(
|
|
6508
|
-
hySiteHeader.classList.add(
|
|
6509
|
-
if (bodyElementClasses.contains(
|
|
6510
|
-
hySiteHeader.classList.add(
|
|
6661
|
+
hySiteHeader.classList.add("hy-site-header--sticky-active", "hy-site-header--sticky-visible");
|
|
6662
|
+
hySiteHeader.classList.remove("hy-site-header--sticky-hidden");
|
|
6663
|
+
!this.isBottomVisible && !this.isTopVisible && bodyElementClasses.add("sticky-active");
|
|
6664
|
+
if (bodyElementClasses.contains("toolbar-horizontal")) {
|
|
6665
|
+
hySiteHeader.classList.add("has-toolbar");
|
|
6666
|
+
if (bodyElementClasses.contains("toolbar-tray-open")) {
|
|
6667
|
+
hySiteHeader.classList.add("has-toolbar--large");
|
|
6511
6668
|
}
|
|
6512
6669
|
}
|
|
6513
6670
|
}
|
|
6514
6671
|
if (!toggleOn) {
|
|
6515
|
-
hySiteHeader.classList.remove(
|
|
6516
|
-
bodyElementClasses.remove(
|
|
6672
|
+
hySiteHeader.classList.remove("hy-site-header--sticky-active", "hy-site-header--sticky-visible", "hy-site-header--sticky-hidden", "has-toolbar", "has-toolbar--large");
|
|
6673
|
+
bodyElementClasses.remove("sticky-active");
|
|
6517
6674
|
}
|
|
6518
6675
|
}
|
|
6519
6676
|
componentDidLoad() {
|
|
@@ -6526,41 +6683,41 @@ const SiteHeader = class {
|
|
|
6526
6683
|
this.ro.observe(document.body);
|
|
6527
6684
|
const topOptions = {
|
|
6528
6685
|
root: null,
|
|
6529
|
-
rootMargin:
|
|
6686
|
+
rootMargin: "250px",
|
|
6530
6687
|
threshold: [0.0, 1.0],
|
|
6531
6688
|
};
|
|
6532
6689
|
this.topObserver = new IntersectionObserver((entries) => {
|
|
6533
6690
|
entries.forEach((entry) => {
|
|
6534
|
-
if (entry.target.nodeName ===
|
|
6691
|
+
if (entry.target.nodeName === "HEADER") {
|
|
6535
6692
|
this.isTopVisible = entry.isIntersecting;
|
|
6536
6693
|
}
|
|
6537
6694
|
});
|
|
6538
6695
|
}, topOptions);
|
|
6539
|
-
const header = document.querySelector(
|
|
6696
|
+
const header = document.querySelector("header");
|
|
6540
6697
|
if (header) {
|
|
6541
6698
|
this.topObserver.observe(header);
|
|
6542
6699
|
}
|
|
6543
6700
|
const bottomOptions = {
|
|
6544
6701
|
root: null,
|
|
6545
|
-
rootMargin:
|
|
6702
|
+
rootMargin: "0px",
|
|
6546
6703
|
threshold: [0.0, 1.0],
|
|
6547
6704
|
};
|
|
6548
6705
|
this.bottomObserver = new IntersectionObserver((entries) => {
|
|
6549
6706
|
entries.forEach((entry) => {
|
|
6550
|
-
if (entry.target.nodeName ===
|
|
6707
|
+
if (entry.target.nodeName === "HEADER") {
|
|
6551
6708
|
this.isTopVisible = entry.isIntersecting;
|
|
6552
6709
|
}
|
|
6553
6710
|
});
|
|
6554
6711
|
}, bottomOptions);
|
|
6555
|
-
const footer = document.querySelector(
|
|
6712
|
+
const footer = document.querySelector("hy-footer");
|
|
6556
6713
|
if (footer) {
|
|
6557
6714
|
this.bottomObserver.observe(footer);
|
|
6558
6715
|
}
|
|
6559
6716
|
// Pass the dataMenuLanguage prop to menu component.
|
|
6560
|
-
this.el.children[0].setAttribute(
|
|
6717
|
+
this.el.children[0].setAttribute("data-menu-language", this.dataMenuLanguage);
|
|
6561
6718
|
this.navbarHeight = 120;
|
|
6562
|
-
const body = document.querySelector(
|
|
6563
|
-
body.style.setProperty(
|
|
6719
|
+
const body = document.querySelector("body");
|
|
6720
|
+
body.style.setProperty("--nav-height", `${this.navbarHeight * 2}px`);
|
|
6564
6721
|
}
|
|
6565
6722
|
async componentWillLoad() {
|
|
6566
6723
|
// Check for site header labels and set them to variables accordingly.
|
|
@@ -6570,26 +6727,26 @@ const SiteHeader = class {
|
|
|
6570
6727
|
this.languageLabels = labels.language_labels;
|
|
6571
6728
|
this.searchLabels = labels.search_labels;
|
|
6572
6729
|
this.groupPages = labels.group_pages;
|
|
6573
|
-
this.el.children[0].setAttribute(
|
|
6730
|
+
this.el.children[0].setAttribute("menu-button-breadcrumb-logourl", this.logoUrl);
|
|
6574
6731
|
}
|
|
6575
6732
|
// Check for the donation link information and set it to variables accordingly.
|
|
6576
6733
|
// Also pass the donation link data to menu-component.
|
|
6577
6734
|
if (this.dataMenuDonate) {
|
|
6578
6735
|
this.donateLink = await jsonParserWorker(this.dataMenuDonate);
|
|
6579
|
-
this.el.children[0].setAttribute(
|
|
6736
|
+
this.el.children[0].setAttribute("data-menu-donate", this.dataMenuDonate);
|
|
6580
6737
|
}
|
|
6581
6738
|
// Pass the necessary information to menu component. These props will be
|
|
6582
6739
|
// used in mobile menu.
|
|
6583
|
-
this.el.children[0].setAttribute(
|
|
6584
|
-
this.el.children[0].setAttribute(
|
|
6585
|
-
this.el.children[0].setAttribute(
|
|
6586
|
-
this.el.children[0].setAttribute(
|
|
6587
|
-
this.el.children[0].setAttribute(
|
|
6588
|
-
this.el.children[0].setAttribute(
|
|
6589
|
-
this.el.children[0].setAttribute(
|
|
6590
|
-
this.el.children[0].setAttribute(
|
|
6591
|
-
this.el.children[0].setAttribute(
|
|
6592
|
-
if (this.groupType !==
|
|
6740
|
+
this.el.children[0].setAttribute("open", this.isMenuOpen.toString());
|
|
6741
|
+
this.el.children[0].setAttribute("logo-label", this.logoLabel);
|
|
6742
|
+
this.el.children[0].setAttribute("logo-url", this.logoUrl);
|
|
6743
|
+
this.el.children[0].setAttribute("site-label", this.siteLabel);
|
|
6744
|
+
this.el.children[0].setAttribute("site-url", this.siteUrl);
|
|
6745
|
+
this.el.children[0].setAttribute("menu-button-breadcrumb-logourl", this.logoUrl);
|
|
6746
|
+
this.el.children[0].setAttribute("menu-language-label-open", this.languageLabels["open"]);
|
|
6747
|
+
this.el.children[0].setAttribute("menu-language-label-close", this.languageLabels["close"]);
|
|
6748
|
+
this.el.children[0].setAttribute("label-front-page", this.menuLabels["front_page"]);
|
|
6749
|
+
if (this.groupType !== "") {
|
|
6593
6750
|
this.isDesktopMenuDropdown = true;
|
|
6594
6751
|
}
|
|
6595
6752
|
}
|
|
@@ -6606,7 +6763,7 @@ const SiteHeader = class {
|
|
|
6606
6763
|
// Pass the menu type to menu component.
|
|
6607
6764
|
this.isMobile = this.menuType === (MenuType.mobile || MenuType.tablet);
|
|
6608
6765
|
const menuAttribute = this.menuType;
|
|
6609
|
-
this.el.children[0].setAttribute(
|
|
6766
|
+
this.el.children[0].setAttribute("menu-type", menuAttribute);
|
|
6610
6767
|
}
|
|
6611
6768
|
render() {
|
|
6612
6769
|
var _a;
|
|
@@ -6617,29 +6774,29 @@ const SiteHeader = class {
|
|
|
6617
6774
|
const logoColor = ColorVariant.black;
|
|
6618
6775
|
const logoColorGroup = ColorVariant.white;
|
|
6619
6776
|
let classAttributes = [
|
|
6620
|
-
|
|
6777
|
+
"hy-site-header",
|
|
6621
6778
|
`hy-site-header--${this.menuType}`,
|
|
6622
|
-
this.isGroup ?
|
|
6623
|
-
|
|
6779
|
+
this.isGroup ? "is-group" : "",
|
|
6780
|
+
"is-at-top",
|
|
6624
6781
|
];
|
|
6625
6782
|
const toggleMenuMobileAndRemoveListener = () => {
|
|
6626
|
-
window.removeEventListener(
|
|
6783
|
+
window.removeEventListener("click", handleClickOutside);
|
|
6627
6784
|
this.mobileMenuToggle();
|
|
6628
6785
|
};
|
|
6629
6786
|
const handleClickOutside = (event) => {
|
|
6630
6787
|
const [targetElement] = event.composedPath();
|
|
6631
|
-
if (targetElement.classList.contains(
|
|
6788
|
+
if (targetElement.classList.contains("hy-backdrop")) {
|
|
6632
6789
|
toggleMenuMobileAndRemoveListener();
|
|
6633
6790
|
}
|
|
6634
6791
|
};
|
|
6635
6792
|
if (this.isMenuOpen) {
|
|
6636
|
-
window.addEventListener(
|
|
6793
|
+
window.addEventListener("click", () => {
|
|
6637
6794
|
clearTimeout(clickTimeout);
|
|
6638
6795
|
clickTimeout = setTimeout(() => {
|
|
6639
6796
|
}, 250);
|
|
6640
6797
|
});
|
|
6641
6798
|
}
|
|
6642
|
-
let activeLang =
|
|
6799
|
+
let activeLang = "en";
|
|
6643
6800
|
let dataMenuLanguageArray = JSON.parse(this.dataMenuLanguage);
|
|
6644
6801
|
dataMenuLanguageArray.forEach((lang) => {
|
|
6645
6802
|
if (lang.isActive) {
|
|
@@ -6650,22 +6807,22 @@ const SiteHeader = class {
|
|
|
6650
6807
|
case MenuType.desktop:
|
|
6651
6808
|
// Larger than 1200px screens
|
|
6652
6809
|
return [
|
|
6653
|
-
h("header", { class: `${classAttributes.join(
|
|
6654
|
-
|
|
6655
|
-
|
|
6810
|
+
h("header", { class: `${classAttributes.join(" ")}` }, h("div", { class: {
|
|
6811
|
+
"hy-backdrop": true,
|
|
6812
|
+
"is-active": (this.isMenuOpen && !this.isDesktopMenuDropdown) ||
|
|
6656
6813
|
(this.isTopMenuOpen && !this.isDesktopMenuDropdown),
|
|
6657
|
-
} }), this.isGroup && (h("section", { class: `hy-site-header__content-top ${this.isTopMenuOpen ?
|
|
6658
|
-
return (h("a", { class:
|
|
6659
|
-
}))))), h("section", { class: `hy-site-header__container ${this.isGroup ?
|
|
6660
|
-
return (h("a", { class:
|
|
6814
|
+
} }), this.isGroup && (h("section", { class: `hy-site-header__content-top ${this.isTopMenuOpen ? "is-open" : ""}` }, h("div", { class: "hy-site-header__container" }, h("div", { class: "hy-site-header__branding" }, h("hy-site-logo", { "is-group": true, "is-luomus-group": this.isLuomusGroup, size: logoSizeGroup, color: logoColorGroup, url: this.siteUrl, label: this.siteLabel })), this.dataMainMenuLinks.length > 2 && (h("hy-menu-main-group", { tabindex: "0", "is-mobile": false, "menu-label": (_a = this.groupPages["university_main_menu"]) !== null && _a !== void 0 ? _a : null, "data-main-menu": this.dataMainMenuLinks, "menu-label-close": this.menuLabelClose })), h("div", { class: "hy-site-header__actions" }, h("hy-menu-language", { "data-menu-language": this.dataMenuLanguage, labels: this.languageLabels, isGroup: true }), !this.noSearch && (h("hy-site-search", { class: "menu--secondary__item group", size: 18, color: logoColorGroup, "is-group": true, "is-luomus-group": this.isLuomusGroup, "is-beta-group": this.isBetaGroup, "search-language": activeLang, "show-label": this.showSearchLabel, labels: this.searchLabels, "search-labels": this.dataSiteSearchLabels, "search-tools": this.dataSearchTools })), this.donateLink.map(({ label, url }) => {
|
|
6815
|
+
return (h("a", { class: "hy-site-header__donate-link", href: url }, h("hy-icon", { icon: "hy-icon-heart-support", size: 14, fill: ColorVariant.black }), h("span", null, label)));
|
|
6816
|
+
}))))), h("section", { class: `hy-site-header__container ${this.isGroup ? "is-group" : ""} ${this.groupType === "research_group_menu" ? "is-research-group" : ""}` }, h("div", { class: "hy-site-header__branding" }, this.isGroup && this.groupType == "research_group_menu" && h("p", null, this.researchGroupLabel), this.isGroup ? (h("a", { href: this.logoUrl }, this.groupType == "generic_site_group_menu" && this.groupLogoUrl ? (h("img", { src: this.groupLogoUrl, alt: `${this.logoLabel} logo` })) : (this.logoLabel))) : (h("hy-site-logo", { size: logoSize, color: logoColor, url: this.logoUrl, label: this.logoLabel }))), this.groupType != "research_group_menu" && h("slot", { name: "menu" }), !this.isGroup && (h("div", { class: "hy-site-header__actions" }, h("hy-menu-language", { "data-menu-language": this.dataMenuLanguage, labels: this.languageLabels }), !this.noSearch && (h("hy-site-search", { size: 14, "is-luomus-group": this.isLuomusGroup, "is-beta-group": this.isBetaGroup, "search-language": activeLang, color: ColorVariant.black, "show-label": this.showSearchLabel, labels: this.searchLabels, "search-labels": this.dataSiteSearchLabels, "search-tools": this.dataSearchTools })), this.donateLink.map(({ label, url }) => {
|
|
6817
|
+
return (h("a", { class: "hy-site-header__donate-link", href: url }, h("hy-icon", { icon: "hy-icon-heart-support", size: 14, fill: ColorVariant.black }), h("span", null, label)));
|
|
6661
6818
|
}))))),
|
|
6662
6819
|
];
|
|
6663
6820
|
case MenuType.mobile:
|
|
6664
6821
|
// Smaller than 960px screens
|
|
6665
|
-
return (h("header", { class: classAttributes.join(
|
|
6666
|
-
|
|
6667
|
-
|
|
6668
|
-
}, "aria-hidden": `${!this.isMenuOpen}` }, h("slot", { name:
|
|
6822
|
+
return (h("header", { class: classAttributes.join(" "), "data-menu-active": this.isMenuOpen }, h("div", { class: { "hy-backdrop": true, "is-active": this.isMenuOpen } }), h("div", { class: { "hy-backdrop": true, "is-active-top": this.isTopMenuOpen } }), this.isGroup && (h("section", { class: `hy-site-header__content-top ${this.isTopMenuOpen ? "is-open" : ""}` }, h("div", { class: "hy-site-header__container" }, h("div", { class: "hy-site-header__branding" }, h("hy-site-logo", { "is-group": true, "is-luomus-group": this.isLuomusGroup, size: logoSizeGroup, color: logoColorGroup, url: this.siteUrl, label: this.siteLabel })), h("div", { class: "hy-site-header__actions" }, h("hy-menu-language", { "data-menu-language": this.dataMenuLanguage, labels: this.languageLabels, isGroup: true }), !this.noSearch && (h("hy-site-search", { class: "menu--secondary__item group", size: 18, color: logoColorGroup, "is-group": true, "is-luomus-group": this.isLuomusGroup, "is-beta-group": this.isBetaGroup, "search-language": activeLang, "show-label": this.showSearchLabel, labels: this.searchLabels, "search-labels": this.dataSiteSearchLabels, "search-tools": this.dataSearchTools })), this.dataMainMenuLinks.length > 2 && (h("hy-menu-main-group", { "site-label": this.siteLabel, "site-url": this.siteUrl, "logo-label": this.logoLabel, "logo-url": this.logoUrl, "is-mobile": true, donate: this.donateLink, "data-main-menu": this.dataMainMenuLinks })))))), h("section", { class: "hy-site-header__container" }, h("div", { class: "hy-site-header__branding" }, this.groupType == "research_group_menu" && h("p", null, this.researchGroupLabel), this.isGroup ? (h("a", { href: this.logoUrl }, this.groupType == "generic_site_group_menu" && this.groupLogoUrl ? (h("img", { src: this.groupLogoUrl, alt: `${this.logoLabel} logo` })) : (this.logoLabel))) : (h("hy-site-logo", { size: logoSize, color: logoColor, url: this.logoUrl, label: this.logoLabel }))), h("div", { class: "hy-site-header__actions" }, !this.isGroup && (h("hy-menu-language", { "data-menu-language": this.dataMenuLanguage, labels: this.languageLabels })), !this.isGroup && !this.noSearch && (h("hy-site-search", { size: 24, color: ColorVariant.black, "is-luomus-group": this.isLuomusGroup, "is-beta-group": this.isBetaGroup, "search-language": activeLang, "show-label": this.showSearchLabel, labels: this.searchLabels, "search-labels": this.dataSiteSearchLabels, "search-tools": this.dataSearchTools })), h("button", { onClick: () => toggleMenuMobileAndRemoveListener(), class: `hy-site-header__menu-open-button`, "aria-label": this.isMenuOpen ? this.menuLabels["close"] : this.menuLabels["open"], "aria-expanded": `${this.isMenuOpen}` }, !this.isMenuOpen && h("hy-icon", { icon: "hy-icon-hamburger", size: 24, fill: ColorVariant.black }), this.isMenuOpen && (h(Fragment, null, h("span", null, this.menuLabelClose), h("hy-icon", { icon: "hy-icon-remove", size: 16 }))))), h("div", { class: {
|
|
6823
|
+
"is-open": this.isMenuOpen,
|
|
6824
|
+
"hy-site-header__panel": true,
|
|
6825
|
+
}, "aria-hidden": `${!this.isMenuOpen}` }, h("slot", { name: "menu_mobile" })))));
|
|
6669
6826
|
}
|
|
6670
6827
|
}
|
|
6671
6828
|
get el() { return getElement(this); }
|
|
@@ -6686,15 +6843,15 @@ const SiteLogo = class {
|
|
|
6686
6843
|
this.url = undefined;
|
|
6687
6844
|
}
|
|
6688
6845
|
render() {
|
|
6689
|
-
const isGroupClass = this.isGroup ?
|
|
6846
|
+
const isGroupClass = this.isGroup ? "group" : "page";
|
|
6690
6847
|
// const isLuomusGroupClass = this.isLuomusGroup ? 'luomus' : 'regular';
|
|
6691
6848
|
const classAttributes = [
|
|
6692
|
-
|
|
6849
|
+
"hy-site-logo",
|
|
6693
6850
|
`hy-site-logo__${this.type}__${isGroupClass}`,
|
|
6694
6851
|
`hy-site-logo__${this.type}`,
|
|
6695
|
-
|
|
6696
|
-
].join(
|
|
6697
|
-
return this.url ? (h(Host, { class: classAttributes }, !this.isLuomusGroup && (h("a", { href: this.url }, h("hy-icon", { class: {
|
|
6852
|
+
"luomus",
|
|
6853
|
+
].join(" ");
|
|
6854
|
+
return this.url ? (h(Host, { class: classAttributes }, !this.isLuomusGroup && (h("a", { href: this.url }, h("hy-icon", { class: { "hy-site-logo__icon": true, group: this.isGroup }, icon: "hy-icon-hy-logo", size: this.size, fill: this.color }), h("span", { class: { "hy-site-logo__label": true, group: this.isGroup }, style: { color: this.color } }, this.label))), this.isLuomusGroup && (h("div", { class: "luomus-group" }, h("hy-icon", { class: { "hy-site-logo__icon": true, group: this.isGroup }, icon: "hy-icon-hy-logo", size: this.size, fill: this.color }), h("span", { class: { "hy-site-logo__label": true, group: this.isGroup }, style: { color: this.color } }, this.label))))) : this.label ? (h(Host, { class: classAttributes }, h("hy-icon", { class: { "hy-site-logo__icon": true, group: this.isGroup }, icon: "hy-icon-hy-logo", size: this.size, fill: this.color }), h("span", { class: { "hy-site-logo__label": true, group: this.isGroup }, style: { color: this.color } }, this.label))) : ("");
|
|
6698
6855
|
}
|
|
6699
6856
|
};
|
|
6700
6857
|
SiteLogo.style = siteLogoCss;
|
|
@@ -6727,10 +6884,10 @@ const SiteSearch = class {
|
|
|
6727
6884
|
}
|
|
6728
6885
|
if (this.searchLabels) {
|
|
6729
6886
|
this._searchLabels = await jsonParserWorker(this.searchLabels);
|
|
6730
|
-
this.searchTitleLabel = this._searchLabels[
|
|
6731
|
-
this.searchCloseLabel = this._searchLabels[
|
|
6732
|
-
this.searchToolsLabel = this._searchLabels[
|
|
6733
|
-
this.searchDescriptionLabel = this._searchLabels[
|
|
6887
|
+
this.searchTitleLabel = this._searchLabels["search_label"];
|
|
6888
|
+
this.searchCloseLabel = this._searchLabels["search_close_label"];
|
|
6889
|
+
this.searchToolsLabel = this._searchLabels["search_tools_label"];
|
|
6890
|
+
this.searchDescriptionLabel = this._searchLabels["search_description"];
|
|
6734
6891
|
}
|
|
6735
6892
|
}
|
|
6736
6893
|
// CLose the search panel if user opens the desktop menu panel.
|
|
@@ -6755,7 +6912,7 @@ const SiteSearch = class {
|
|
|
6755
6912
|
return;
|
|
6756
6913
|
if (this.isSearchPanelOpen) {
|
|
6757
6914
|
const path = event.path || (event.composedPath && event.composedPath());
|
|
6758
|
-
if (path[0].classList.contains(
|
|
6915
|
+
if (path[0].classList.contains("hy-backdrop")) {
|
|
6759
6916
|
this.closeSearchPanel();
|
|
6760
6917
|
event.stopPropagation();
|
|
6761
6918
|
}
|
|
@@ -6768,10 +6925,10 @@ const SiteSearch = class {
|
|
|
6768
6925
|
// }
|
|
6769
6926
|
closeSearchPanel() {
|
|
6770
6927
|
this.isSearchPanelOpen = false;
|
|
6771
|
-
let cludoSayt = document.querySelectorAll(
|
|
6928
|
+
let cludoSayt = document.querySelectorAll("stencil-cludo-sayt")[0];
|
|
6772
6929
|
if (cludoSayt) {
|
|
6773
6930
|
let CludoSayt = window.CludoSayt;
|
|
6774
|
-
if (typeof CludoSayt !==
|
|
6931
|
+
if (typeof CludoSayt !== "undefined") {
|
|
6775
6932
|
CludoSayt.hide();
|
|
6776
6933
|
}
|
|
6777
6934
|
}
|
|
@@ -6779,16 +6936,16 @@ const SiteSearch = class {
|
|
|
6779
6936
|
}
|
|
6780
6937
|
handleSearchPanelToggle(event) {
|
|
6781
6938
|
if (this.isLuomusGroup) {
|
|
6782
|
-
let beta = this.isBetaGroup ?
|
|
6783
|
-
let luomus_search_url =
|
|
6784
|
-
if (this.searchLanguage ==
|
|
6785
|
-
luomus_search_url =
|
|
6939
|
+
let beta = this.isBetaGroup ? "/beta" : "";
|
|
6940
|
+
let luomus_search_url = "/" + this.searchLanguage + beta + "/luomus/search-results";
|
|
6941
|
+
if (this.searchLanguage == "fi") {
|
|
6942
|
+
luomus_search_url = "/" + this.searchLanguage + beta + "/luomus/hakutulokset";
|
|
6786
6943
|
}
|
|
6787
|
-
else if (this.searchLanguage ==
|
|
6788
|
-
luomus_search_url =
|
|
6944
|
+
else if (this.searchLanguage == "sv") {
|
|
6945
|
+
luomus_search_url = "/" + this.searchLanguage + beta + "/luomus/sokresultat";
|
|
6789
6946
|
}
|
|
6790
|
-
else if (this.searchLanguage ==
|
|
6791
|
-
luomus_search_url =
|
|
6947
|
+
else if (this.searchLanguage == "ru") {
|
|
6948
|
+
luomus_search_url = "/" + this.searchLanguage + beta + "/luomus/rezultaty-poiska";
|
|
6792
6949
|
}
|
|
6793
6950
|
location.href = luomus_search_url;
|
|
6794
6951
|
}
|
|
@@ -6799,18 +6956,18 @@ const SiteSearch = class {
|
|
|
6799
6956
|
this.searchPanelToggled.emit();
|
|
6800
6957
|
this.adjustPosition(this.el);
|
|
6801
6958
|
// Remove hidden class from cludo suggestions
|
|
6802
|
-
let cludoSayt = document.querySelectorAll(
|
|
6959
|
+
let cludoSayt = document.querySelectorAll("stencil-cludo-sayt")[0];
|
|
6803
6960
|
if (cludoSayt) {
|
|
6804
|
-
const cludoSearchContentFormElement = this.el.shadowRoot.querySelector(
|
|
6805
|
-
cludoSayt.classList.remove(
|
|
6961
|
+
const cludoSearchContentFormElement = this.el.shadowRoot.querySelector("#cludo-search-content-form");
|
|
6962
|
+
cludoSayt.classList.remove("hidden");
|
|
6806
6963
|
cludoSearchContentFormElement.append(cludoSayt);
|
|
6807
|
-
cludoSayt.shadowRoot.querySelector(
|
|
6808
|
-
cludoSayt.shadowRoot.querySelector(
|
|
6809
|
-
cludoSayt.shadowRoot.querySelector(
|
|
6964
|
+
cludoSayt.shadowRoot.querySelector("#cludo-reli-flexi-wrapper").style.position = "relative";
|
|
6965
|
+
cludoSayt.shadowRoot.querySelector("#cludo-reli-flexi").style.position = "relative";
|
|
6966
|
+
cludoSayt.shadowRoot.querySelector("#cludo-reli-flexi").style.maxWidth = "none";
|
|
6810
6967
|
}
|
|
6811
6968
|
// Without setTimeout it will not focus the input because it hasn't rendered yet.
|
|
6812
6969
|
setTimeout(() => {
|
|
6813
|
-
const searchInput = this.el.shadowRoot.querySelector(
|
|
6970
|
+
const searchInput = this.el.shadowRoot.querySelector("input#search");
|
|
6814
6971
|
searchInput.focus();
|
|
6815
6972
|
});
|
|
6816
6973
|
}
|
|
@@ -6821,76 +6978,76 @@ const SiteSearch = class {
|
|
|
6821
6978
|
event.stopPropagation();
|
|
6822
6979
|
}
|
|
6823
6980
|
adjustPosition(target) {
|
|
6824
|
-
let headerHeight =
|
|
6981
|
+
let headerHeight = "0";
|
|
6825
6982
|
let shadowTop = 0;
|
|
6826
6983
|
const searchPanel = target.shadowRoot.querySelectorAll(`.site-search__panel`)[0];
|
|
6827
6984
|
let initialDisplayStyle = searchPanel.style.display;
|
|
6828
6985
|
if (this.isGroup) {
|
|
6829
|
-
let hyHeader = target.closest(
|
|
6986
|
+
let hyHeader = target.closest(".hy-site-header__content-top");
|
|
6830
6987
|
if (hyHeader) {
|
|
6831
6988
|
let headerHeightValue = hyHeader.offsetHeight;
|
|
6832
6989
|
headerHeight = `${headerHeightValue}px`;
|
|
6833
6990
|
let headerTop = hyHeader.offsetTop;
|
|
6834
6991
|
// Add shadow backdrop
|
|
6835
|
-
searchPanel.style.display =
|
|
6992
|
+
searchPanel.style.display = "flex";
|
|
6836
6993
|
shadowTop = headerHeightValue + headerTop + searchPanel.offsetHeight;
|
|
6837
6994
|
}
|
|
6838
6995
|
}
|
|
6839
6996
|
else {
|
|
6840
|
-
let hyHeader = target.closest(
|
|
6997
|
+
let hyHeader = target.closest(".hy-site-header");
|
|
6841
6998
|
if (hyHeader) {
|
|
6842
|
-
let headerHeightValue = hyHeader.classList.contains(
|
|
6999
|
+
let headerHeightValue = hyHeader.classList.contains("hy-site-header--sticky-active")
|
|
6843
7000
|
? hyHeader.offsetHeight
|
|
6844
7001
|
: hyHeader.offsetTop + hyHeader.offsetHeight;
|
|
6845
7002
|
headerHeight = `${headerHeightValue}px`;
|
|
6846
7003
|
// Add shadow backdrop
|
|
6847
|
-
searchPanel.style.display =
|
|
7004
|
+
searchPanel.style.display = "flex";
|
|
6848
7005
|
let searchPanelHeight = searchPanel.offsetHeight;
|
|
6849
7006
|
shadowTop = searchPanelHeight + headerHeightValue;
|
|
6850
7007
|
}
|
|
6851
7008
|
}
|
|
6852
7009
|
searchPanel.style.display = initialDisplayStyle;
|
|
6853
7010
|
searchPanel.style.top = headerHeight;
|
|
6854
|
-
this.showBackdropShadow(
|
|
7011
|
+
this.showBackdropShadow("open", shadowTop);
|
|
6855
7012
|
}
|
|
6856
|
-
showBackdropShadow(state =
|
|
6857
|
-
let hyHeader = this.el.closest(
|
|
7013
|
+
showBackdropShadow(state = "close", top = 0) {
|
|
7014
|
+
let hyHeader = this.el.closest(".hy-site-header");
|
|
6858
7015
|
let hyBackdropDiv = hyHeader.children[0];
|
|
6859
7016
|
if (hyBackdropDiv) {
|
|
6860
|
-
if (state ===
|
|
7017
|
+
if (state === "open") {
|
|
6861
7018
|
let me = window.outerHeight - top;
|
|
6862
7019
|
hyBackdropDiv.style.height = `${me}px`;
|
|
6863
7020
|
hyBackdropDiv.style.top = `${top}px`;
|
|
6864
|
-
hyBackdropDiv.style.position =
|
|
6865
|
-
hyBackdropDiv.classList.add(
|
|
7021
|
+
hyBackdropDiv.style.position = "absolute";
|
|
7022
|
+
hyBackdropDiv.classList.add("is-active");
|
|
6866
7023
|
}
|
|
6867
7024
|
else {
|
|
6868
|
-
hyBackdropDiv.removeAttribute(
|
|
6869
|
-
hyBackdropDiv.classList.remove(
|
|
7025
|
+
hyBackdropDiv.removeAttribute("style");
|
|
7026
|
+
hyBackdropDiv.classList.remove("is-active");
|
|
6870
7027
|
}
|
|
6871
7028
|
}
|
|
6872
7029
|
}
|
|
6873
7030
|
render() {
|
|
6874
7031
|
const currentPageUrlPathName = window.location.pathname;
|
|
6875
|
-
const searchPagePathNames = [
|
|
7032
|
+
const searchPagePathNames = ["/fi/haku", "/en/search", "/sv/sök"];
|
|
6876
7033
|
return (h("div", { class: {
|
|
6877
|
-
|
|
6878
|
-
|
|
6879
|
-
|
|
6880
|
-
} }, h("button", { "aria-label": this.showLabel ? this._labels[
|
|
6881
|
-
|
|
6882
|
-
|
|
6883
|
-
|
|
6884
|
-
|
|
6885
|
-
}, onClick: (e) => this.handleSearchPanelToggle(e), disabled: searchPagePathNames.some((item) => item === currentPageUrlPathName) ? true : false }, this.showLabel ? (h("span", { class: {
|
|
6886
|
-
|
|
6887
|
-
|
|
6888
|
-
}, "aria-hidden": `${!this.isSearchPanelOpen}` }, h("div", { class: "site-search__panel__wrapper" }, h("div", { class: "site-search__panel__title" }, h("div", { class: "site-search__panel__title__group" }, h("span", { class: "panel-title" }, this.searchTitleLabel), h("div", { class: "description" }, this.searchDescriptionLabel))), h("div", { id: "cludo-search-results", class: "container_12" }, h("div", { class: "search-banner" }), h("div", { class: "search-filters search-filters-mobile" }), h("div", { class: "col-md-12" }, h("div", { style: { margin:
|
|
6889
|
-
let searchToolTarget = i.isExternal ?
|
|
6890
|
-
return (h("a", { class: "search-special-tool", href: i.url, target: searchToolTarget }, h("hy-icon", { icon:
|
|
7034
|
+
"site-search": true,
|
|
7035
|
+
"site-search__is-open": this.isSearchPanelOpen,
|
|
7036
|
+
"is-group": this.isGroup,
|
|
7037
|
+
} }, h("button", { "aria-label": this.showLabel ? this._labels["open"] : "", "aria-expanded": `${this.isSearchPanelOpen}`, class: {
|
|
7038
|
+
"button--search": true,
|
|
7039
|
+
"is-open--menu": this.isAlternative,
|
|
7040
|
+
"is-open": this.isSearchPanelOpen,
|
|
7041
|
+
"is-active": searchPagePathNames.some((item) => item === currentPageUrlPathName),
|
|
7042
|
+
}, onClick: (e) => this.handleSearchPanelToggle(e), disabled: searchPagePathNames.some((item) => item === currentPageUrlPathName) ? true : false }, this.showLabel ? (h("span", { class: { "button--search__label": true, "button--search__label__group": this.isGroup } }, this._labels["label"])) : (""), h("hy-icon", { icon: "hy-icon-search", size: this.size, fill: this.color })), !this.isLuomusGroup && (h("div", { class: {
|
|
7043
|
+
"site-search__panel": true,
|
|
7044
|
+
"site-search__panel__is-open": this.isSearchPanelOpen,
|
|
7045
|
+
}, "aria-hidden": `${!this.isSearchPanelOpen}` }, h("div", { class: "site-search__panel__wrapper" }, h("div", { class: "site-search__panel__title" }, h("div", { class: "site-search__panel__title__group" }, h("span", { class: "panel-title" }, this.searchTitleLabel), h("div", { class: "description" }, this.searchDescriptionLabel))), h("div", { id: "cludo-search-results", class: "container_12" }, h("div", { class: "search-banner" }), h("div", { class: "search-filters search-filters-mobile" }), h("div", { class: "col-md-12" }, h("div", { style: { margin: "20px 0 32px" }, id: "cludo-search-content-form" }, h("hy-search-field", { "input-id": "search", label: "" }))), h("div", { class: "col-md-3" }, h("div", { class: "search-filters", "aria-controls": "search-results" })), h("div", { class: "col-md-9" }, h("div", { class: "search-results-container" }, h("hy-paragraph-text", null, h("div", { class: "search-result-count" })), h("div", { class: "search-did-you-mean", role: "Complementary" }), h("div", { class: "search-results", role: "region", id: "search-results", "aria-live": "polite" })))), this._searchTools && this._searchTools.length > 0 && (h("div", { class: "site-search__panel__tools" }, h("div", { class: "title" }, this.searchToolsLabel), h("div", { class: "list" }, this._searchTools.map((i) => {
|
|
7046
|
+
let searchToolTarget = i.isExternal ? "_blank" : "_self";
|
|
7047
|
+
return (h("a", { class: "search-special-tool", href: i.url, target: searchToolTarget }, h("hy-icon", { icon: "hy-icon-arrow-to-right", size: 14, fill: ColorVariant.black }), h("span", { class: "label" }, i.label), h("span", { class: "description" }, i.description)));
|
|
6891
7048
|
})))), h("button", { onClick: () => this.closeSearchPanel(), class: {
|
|
6892
|
-
|
|
6893
|
-
}, "aria-label": this.searchCloseLabel, "aria-expanded": `${this.isSearchPanelOpen}` }, h("span", { class: "site-search__panel__panel-toggle__label" }, h("span", { class: "site-search__panel__panel-toggle__label__title", tabindex: "0" }, this.searchCloseLabel), h("hy-icon", { icon:
|
|
7049
|
+
"site-search__panel__panel-toggle": true,
|
|
7050
|
+
}, "aria-label": this.searchCloseLabel, "aria-expanded": `${this.isSearchPanelOpen}` }, h("span", { class: "site-search__panel__panel-toggle__label" }, h("span", { class: "site-search__panel__panel-toggle__label__title", tabindex: "0" }, this.searchCloseLabel), h("hy-icon", { icon: "hy-icon-remove", size: 16, fill: ColorVariant.black }))))))));
|
|
6894
7051
|
}
|
|
6895
7052
|
get el() { return getElement(this); }
|
|
6896
7053
|
};
|
|
@@ -6903,7 +7060,7 @@ const HyTableContainer = class {
|
|
|
6903
7060
|
registerInstance(this, hostRef);
|
|
6904
7061
|
}
|
|
6905
7062
|
render() {
|
|
6906
|
-
const classAttributes = [
|
|
7063
|
+
const classAttributes = ["hy-table-container"].join(" ");
|
|
6907
7064
|
return (h(Host, { class: classAttributes }, h("slot", null), h("hy-box", { mb: "1.75, 1.75, 2, 2.5" })));
|
|
6908
7065
|
}
|
|
6909
7066
|
};
|
|
@@ -6935,76 +7092,76 @@ const HyTabs = class {
|
|
|
6935
7092
|
constructor(hostRef) {
|
|
6936
7093
|
registerInstance(this, hostRef);
|
|
6937
7094
|
this.tabId = undefined;
|
|
6938
|
-
this.tabListLabel =
|
|
7095
|
+
this.tabListLabel = "";
|
|
6939
7096
|
this.focusTimeoutCleared = true;
|
|
6940
7097
|
this.tabButtonTitles = undefined;
|
|
6941
7098
|
this.tabPanelsState = undefined;
|
|
6942
7099
|
this.tabButtons = undefined;
|
|
6943
7100
|
this.tabList = undefined;
|
|
6944
|
-
this.headerstyle =
|
|
7101
|
+
this.headerstyle = "common";
|
|
6945
7102
|
}
|
|
6946
7103
|
componentWillLoad() {
|
|
6947
|
-
const tabItems = this.el.querySelectorAll(
|
|
7104
|
+
const tabItems = this.el.querySelectorAll("hy-tabs-item");
|
|
6948
7105
|
if (tabItems) {
|
|
6949
7106
|
this.tabButtonTitles = Array.from(tabItems).map((panel) => {
|
|
6950
7107
|
return {
|
|
6951
|
-
title: panel.getAttribute(
|
|
6952
|
-
id: panel.getAttribute(
|
|
7108
|
+
title: panel.getAttribute("tab-title"),
|
|
7109
|
+
id: panel.getAttribute("tab-title").toLowerCase().replace(/\W/g, "-"),
|
|
6953
7110
|
};
|
|
6954
7111
|
});
|
|
6955
7112
|
}
|
|
6956
7113
|
}
|
|
6957
7114
|
componentDidLoad() {
|
|
6958
|
-
let hyMainDiv = this.el.closest(
|
|
7115
|
+
let hyMainDiv = this.el.closest(".hy-main");
|
|
6959
7116
|
if (hyMainDiv) {
|
|
6960
|
-
if (!hyMainDiv.classList.contains(
|
|
6961
|
-
this.headerstyle =
|
|
7117
|
+
if (!hyMainDiv.classList.contains("with-sidebar")) {
|
|
7118
|
+
this.headerstyle = "large";
|
|
6962
7119
|
}
|
|
6963
7120
|
}
|
|
6964
|
-
const tabContainer = this.el.querySelector(
|
|
7121
|
+
const tabContainer = this.el.querySelector(".hy-tabs__container");
|
|
6965
7122
|
if (tabContainer) {
|
|
6966
7123
|
this.generateArrays(tabContainer);
|
|
6967
|
-
const leftButton = this.el.querySelectorAll(
|
|
6968
|
-
const rightButton = this.el.querySelectorAll(
|
|
7124
|
+
const leftButton = this.el.querySelectorAll(".hy-tab-scroll__left")[0];
|
|
7125
|
+
const rightButton = this.el.querySelectorAll(".hy-tab-scroll__right")[0];
|
|
6969
7126
|
const tabList = this.tabList;
|
|
6970
7127
|
this.checkScrollHidden(tabList, leftButton, rightButton);
|
|
6971
|
-
tabList.addEventListener(
|
|
7128
|
+
tabList.addEventListener("scroll", () => {
|
|
6972
7129
|
scrollTimeout = setTimeout(() => {
|
|
6973
7130
|
window.clearTimeout(scrollTimeout);
|
|
6974
7131
|
this.checkScrollHidden(tabList, leftButton, rightButton);
|
|
6975
7132
|
}, 250);
|
|
6976
7133
|
}, false);
|
|
6977
7134
|
if (tabList.offSetWidth <= document.body.scrollWidth) {
|
|
6978
|
-
leftButton.classList.add(
|
|
6979
|
-
rightButton.classList.add(
|
|
7135
|
+
leftButton.classList.add("is-hidden");
|
|
7136
|
+
rightButton.classList.add("is-hidden");
|
|
6980
7137
|
}
|
|
6981
7138
|
const oneTabWidth = 250;
|
|
6982
|
-
rightButton.addEventListener(
|
|
7139
|
+
rightButton.addEventListener("click", (e) => {
|
|
6983
7140
|
e.preventDefault();
|
|
6984
|
-
rightButton.classList.add(
|
|
7141
|
+
rightButton.classList.add("is-disabled");
|
|
6985
7142
|
tabList.scrollBy({
|
|
6986
7143
|
top: 0,
|
|
6987
7144
|
left: +oneTabWidth,
|
|
6988
|
-
behavior:
|
|
7145
|
+
behavior: "smooth",
|
|
6989
7146
|
});
|
|
6990
7147
|
checkTimeout = window.setTimeout(() => {
|
|
6991
7148
|
window.clearTimeout(checkTimeout);
|
|
6992
7149
|
this.checkScrollHidden(tabList, leftButton, rightButton);
|
|
6993
|
-
rightButton.classList.remove(
|
|
7150
|
+
rightButton.classList.remove("is-disabled");
|
|
6994
7151
|
}, 250);
|
|
6995
7152
|
});
|
|
6996
|
-
leftButton.addEventListener(
|
|
7153
|
+
leftButton.addEventListener("click", (e) => {
|
|
6997
7154
|
e.preventDefault();
|
|
6998
|
-
leftButton.classList.add(
|
|
7155
|
+
leftButton.classList.add("is-disabled");
|
|
6999
7156
|
tabList.scrollBy({
|
|
7000
7157
|
top: 0,
|
|
7001
7158
|
left: -oneTabWidth,
|
|
7002
|
-
behavior:
|
|
7159
|
+
behavior: "smooth",
|
|
7003
7160
|
});
|
|
7004
7161
|
checkTimeout = window.setTimeout(() => {
|
|
7005
7162
|
window.clearTimeout(checkTimeout);
|
|
7006
7163
|
this.checkScrollHidden(tabList, leftButton, rightButton);
|
|
7007
|
-
leftButton.classList.remove(
|
|
7164
|
+
leftButton.classList.remove("is-disabled");
|
|
7008
7165
|
}, 250);
|
|
7009
7166
|
});
|
|
7010
7167
|
}
|
|
@@ -7021,8 +7178,8 @@ const HyTabs = class {
|
|
|
7021
7178
|
addListeners(tabs, index) {
|
|
7022
7179
|
if (tabs.length > 1) {
|
|
7023
7180
|
for (let i = 0; i < tabs.length; ++i) {
|
|
7024
|
-
tabs[index].addEventListener(
|
|
7025
|
-
tabs[index].addEventListener(
|
|
7181
|
+
tabs[index].addEventListener("click", this.clickEventListener);
|
|
7182
|
+
tabs[index].addEventListener("keydown", this.keydownEventListener);
|
|
7026
7183
|
//tabs[index].addEventListener('keyup', this.keyupEventListener);
|
|
7027
7184
|
tabs[index].index = index;
|
|
7028
7185
|
}
|
|
@@ -7030,16 +7187,16 @@ const HyTabs = class {
|
|
|
7030
7187
|
}
|
|
7031
7188
|
checkScrollHidden(tablist, leftButton, rightButton) {
|
|
7032
7189
|
if (tablist.scrollLeft === 0) {
|
|
7033
|
-
leftButton.classList.add(
|
|
7190
|
+
leftButton.classList.add("is-hidden");
|
|
7034
7191
|
}
|
|
7035
7192
|
else {
|
|
7036
|
-
leftButton.classList.remove(
|
|
7193
|
+
leftButton.classList.remove("is-hidden");
|
|
7037
7194
|
}
|
|
7038
7195
|
if (tablist.scrollLeft + tablist.clientWidth >= tablist.scrollWidth - 1) {
|
|
7039
|
-
rightButton.classList.add(
|
|
7196
|
+
rightButton.classList.add("is-hidden");
|
|
7040
7197
|
}
|
|
7041
7198
|
else {
|
|
7042
|
-
rightButton.classList.remove(
|
|
7199
|
+
rightButton.classList.remove("is-hidden");
|
|
7043
7200
|
}
|
|
7044
7201
|
}
|
|
7045
7202
|
// When a tab is clicked, activateTab is fired to activate it
|
|
@@ -7088,7 +7245,7 @@ const HyTabs = class {
|
|
|
7088
7245
|
switch (key) {
|
|
7089
7246
|
case keys.left:
|
|
7090
7247
|
case keys.right:
|
|
7091
|
-
if (event.target.role ===
|
|
7248
|
+
if (event.target.role === "tab") {
|
|
7092
7249
|
event.preventDefault();
|
|
7093
7250
|
if (this.focusTimeoutCleared) {
|
|
7094
7251
|
this.determineOrientation(event);
|
|
@@ -7100,12 +7257,12 @@ const HyTabs = class {
|
|
|
7100
7257
|
event.stopImmediatePropagation();
|
|
7101
7258
|
}
|
|
7102
7259
|
determineOrientation(event) {
|
|
7103
|
-
const leftButton = this.el.querySelectorAll(
|
|
7104
|
-
const rightButton = this.el.querySelectorAll(
|
|
7260
|
+
const leftButton = this.el.querySelectorAll(".hy-tab-scroll__left")[0];
|
|
7261
|
+
const rightButton = this.el.querySelectorAll(".hy-tab-scroll__right")[0];
|
|
7105
7262
|
const tabList = this.tabList;
|
|
7106
7263
|
this.checkScrollHidden(tabList, leftButton, rightButton);
|
|
7107
7264
|
const key = event.keyCode;
|
|
7108
|
-
const vertical = tabList.getAttribute(
|
|
7265
|
+
const vertical = tabList.getAttribute("aria-orientation") == "vertical";
|
|
7109
7266
|
let proceed = false;
|
|
7110
7267
|
if (vertical) {
|
|
7111
7268
|
if (key === keys.up || key === keys.down) {
|
|
@@ -7153,10 +7310,10 @@ const HyTabs = class {
|
|
|
7153
7310
|
// Deactivate all other tabs
|
|
7154
7311
|
this.deactivateTabs(this.tabButtons);
|
|
7155
7312
|
// Remove tabindex attribute
|
|
7156
|
-
tab.removeAttribute(
|
|
7157
|
-
tab.setAttribute(
|
|
7158
|
-
const controls = tab.getAttribute(
|
|
7159
|
-
this.el.querySelector(`#${controls}`).removeAttribute(
|
|
7313
|
+
tab.removeAttribute("tabindex");
|
|
7314
|
+
tab.setAttribute("aria-selected", "true");
|
|
7315
|
+
const controls = tab.getAttribute("aria-controls");
|
|
7316
|
+
this.el.querySelector(`#${controls}`).removeAttribute("hidden");
|
|
7160
7317
|
if (setFocus) {
|
|
7161
7318
|
tab.focus();
|
|
7162
7319
|
}
|
|
@@ -7164,13 +7321,13 @@ const HyTabs = class {
|
|
|
7164
7321
|
// Deactivate all tabs and tab panels
|
|
7165
7322
|
deactivateTabs(tabs) {
|
|
7166
7323
|
for (let t = 0; t < tabs.length; t++) {
|
|
7167
|
-
tabs[t].setAttribute(
|
|
7168
|
-
tabs[t].setAttribute(
|
|
7169
|
-
tabs[t].removeEventListener(
|
|
7324
|
+
tabs[t].setAttribute("tabindex", "-1");
|
|
7325
|
+
tabs[t].setAttribute("aria-selected", "false");
|
|
7326
|
+
tabs[t].removeEventListener("focus", this.focusEventHandler);
|
|
7170
7327
|
}
|
|
7171
7328
|
const panels = this.tabPanelsState[0];
|
|
7172
7329
|
for (let p = 0; p < panels.length; p++) {
|
|
7173
|
-
panels[p].setAttribute(
|
|
7330
|
+
panels[p].setAttribute("hidden", "hidden");
|
|
7174
7331
|
}
|
|
7175
7332
|
}
|
|
7176
7333
|
focusEventHandler(tab) {
|
|
@@ -7186,30 +7343,30 @@ const HyTabs = class {
|
|
|
7186
7343
|
}, 250);
|
|
7187
7344
|
}
|
|
7188
7345
|
render() {
|
|
7189
|
-
const classComponentAttributes = [
|
|
7190
|
-
const id = this.tabId.toLowerCase().replace(/\W/g,
|
|
7346
|
+
const classComponentAttributes = ["hy-tabs__container", `hy-tabs__container__${this.headerstyle}`].join(" ");
|
|
7347
|
+
const id = this.tabId.toLowerCase().replace(/\W/g, "-");
|
|
7191
7348
|
if (window.location.hash) {
|
|
7192
7349
|
const tabHash = window.location.hash.substring(1);
|
|
7193
|
-
const isUrlHashed = this.tabButtonTitles.some((tab) => tab[
|
|
7350
|
+
const isUrlHashed = this.tabButtonTitles.some((tab) => tab["id"] === tabHash);
|
|
7194
7351
|
if (isUrlHashed) {
|
|
7195
7352
|
const hashElement = document.getElementById(tabHash);
|
|
7196
7353
|
if (hashElement) {
|
|
7197
7354
|
this.activateTab(hashElement, true);
|
|
7198
7355
|
const hashElementRect = hashElement.getBoundingClientRect();
|
|
7199
|
-
window.scrollTo({ top: window.scrollY + hashElementRect.top - 200, behavior:
|
|
7356
|
+
window.scrollTo({ top: window.scrollY + hashElementRect.top - 200, behavior: "smooth" });
|
|
7200
7357
|
}
|
|
7201
7358
|
}
|
|
7202
7359
|
}
|
|
7203
7360
|
return [
|
|
7204
7361
|
h("hy-box", { pt: "1.25, 1.25, 1.5, 2.5" }),
|
|
7205
|
-
h("div", { id: id, class: classComponentAttributes }, h("div", { class: "hy-tablist-container" }, h("button", { tabindex: "-1", class: "hy-tab-scroll hy-tab-scroll__left is-hidden", "aria-hidden": "true" }, h("span", null, h("hy-icon", { icon:
|
|
7362
|
+
h("div", { id: id, class: classComponentAttributes }, h("div", { class: "hy-tablist-container" }, h("button", { tabindex: "-1", class: "hy-tab-scroll hy-tab-scroll__left is-hidden", "aria-hidden": "true" }, h("span", null, h("hy-icon", { icon: "hy-icon-caret-left", size: 16 }))), h("div", { role: "tablist", "aria-label": this.tabListLabel }, this.tabButtonTitles &&
|
|
7206
7363
|
this.tabButtonTitles.map((item) => {
|
|
7207
7364
|
const title = Object.values(item)[0];
|
|
7208
|
-
const id = title.toLowerCase().replace(/\W/g,
|
|
7209
|
-
const titleAsId = title.toLowerCase().replace(/\W/g,
|
|
7210
|
-
const tabItemHref =
|
|
7365
|
+
const id = title.toLowerCase().replace(/\W/g, "-");
|
|
7366
|
+
const titleAsId = title.toLowerCase().replace(/\W/g, "-");
|
|
7367
|
+
const tabItemHref = "#" + titleAsId;
|
|
7211
7368
|
return (h("a", { href: tabItemHref, tabindex: "-1" }, h("button", { "aria-selected": "false", "aria-controls": `${id}-tab`, class: this.headerstyle, role: "tab", id: id }, h("span", null, title))));
|
|
7212
|
-
})), h("button", { tabindex: "-1", class: "hy-tab-scroll hy-tab-scroll__right", "aria-hidden": "true" }, h("span", null, h("hy-icon", { icon:
|
|
7369
|
+
})), h("button", { tabindex: "-1", class: "hy-tab-scroll hy-tab-scroll__right", "aria-hidden": "true" }, h("span", null, h("hy-icon", { icon: "hy-icon-caret-right", size: 16 })))), h("slot", null)),
|
|
7213
7370
|
h("hy-box", { mb: "1.75, 1.75, 2, 2.5" }),
|
|
7214
7371
|
];
|
|
7215
7372
|
}
|
|
@@ -7225,7 +7382,7 @@ const HyTabsItem = class {
|
|
|
7225
7382
|
this.tabTitle = undefined;
|
|
7226
7383
|
}
|
|
7227
7384
|
render() {
|
|
7228
|
-
const id = this.tabTitle.toLowerCase().replace(/\W/g,
|
|
7385
|
+
const id = this.tabTitle.toLowerCase().replace(/\W/g, "-");
|
|
7229
7386
|
return (h("div", { tabindex: "0", role: "tabpanel", id: `${id}-tab`, "aria-labelledby": id, hidden: true }, h("slot", null)));
|
|
7230
7387
|
}
|
|
7231
7388
|
};
|
|
@@ -7238,12 +7395,25 @@ const HyTag = class {
|
|
|
7238
7395
|
registerInstance(this, hostRef);
|
|
7239
7396
|
}
|
|
7240
7397
|
render() {
|
|
7241
|
-
const classAttributes = [
|
|
7398
|
+
const classAttributes = ["hy-tag"].join(" ");
|
|
7242
7399
|
return (h(Host, null, h("div", { class: classAttributes }, h("span", null, h("slot", null)))));
|
|
7243
7400
|
}
|
|
7244
7401
|
};
|
|
7245
7402
|
HyTag.style = hyTagCss;
|
|
7246
7403
|
|
|
7404
|
+
const tinyTextCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand-main-bright:#48c5f8;--brand-main-light:#107eab;--brand-main-active:#005379;--brand-main-dark:#003146;--brand-main-nearly-black:#000222;--link-blue:#0479a4;--link-disabled:#767676;--grayscale-white:#fff;--grayscale-slightly-gray:#fefefe;--grayscale-light:#f8f8f8;--grayscale-medium:#d2d2d2;--grayscale-background-box:#f5f5f5;--grayscale-tabs-border:#e6e6e6;--grayscale-background-arrow:#dfdfdf;--grayscale-medium-dark:#979797;--grayscale-dark:#555555;--grayscale-dark-text:#222222;--grayscale-black:#000000;--additional-red-light:#e5053a;--additional-red-dark:#a31621;--additional-purple-light:#420039;--additional-yellow-light:#f9a21a;--additional-yellow:#c47f1b;--additional-skyblue:#48c5f8;--additional-orange:#d14600;--additional-green-light:#96ba3c;--additional-green-dark:#006400;--hover-gray:#eaeaea}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{--gutter-mobile:16px;--gutter-narrow:24px;--gutter-medium:24px;--gutter-wide:24px;--gutter-extrawide:32px}:root{--breakpoint-extrawide:75.0625rem;--breakpoint-max-width:75.0625rem;--breakpoint-medium:48rem;--breakpoint-narrow:30rem;--breakpoint-wide:60rem}:host{display:block}.hy-tiny-text{color:var(--grayscale-dark);font-family:var(--main-font-family);font-size:12px;letter-spacing:-0.07px;line-height:16px}";
|
|
7405
|
+
|
|
7406
|
+
const TinyText = class {
|
|
7407
|
+
constructor(hostRef) {
|
|
7408
|
+
registerInstance(this, hostRef);
|
|
7409
|
+
}
|
|
7410
|
+
render() {
|
|
7411
|
+
const classAttributes = ["hy-tiny-text"];
|
|
7412
|
+
return (h("div", { class: classAttributes.join(" ") }, h("slot", null)));
|
|
7413
|
+
}
|
|
7414
|
+
};
|
|
7415
|
+
TinyText.style = tinyTextCss;
|
|
7416
|
+
|
|
7247
7417
|
const hyTwitterFeedCss = ":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand-main-bright:#48c5f8;--brand-main-light:#107eab;--brand-main-active:#005379;--brand-main-dark:#003146;--brand-main-nearly-black:#000222;--link-blue:#0479a4;--link-disabled:#767676;--grayscale-white:#fff;--grayscale-slightly-gray:#fefefe;--grayscale-light:#f8f8f8;--grayscale-medium:#d2d2d2;--grayscale-background-box:#f5f5f5;--grayscale-tabs-border:#e6e6e6;--grayscale-background-arrow:#dfdfdf;--grayscale-medium-dark:#979797;--grayscale-dark:#555555;--grayscale-dark-text:#222222;--grayscale-black:#000000;--additional-red-light:#e5053a;--additional-red-dark:#a31621;--additional-purple-light:#420039;--additional-yellow-light:#f9a21a;--additional-yellow:#c47f1b;--additional-skyblue:#48c5f8;--additional-orange:#d14600;--additional-green-light:#96ba3c;--additional-green-dark:#006400;--hover-gray:#eaeaea}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{--gutter-mobile:16px;--gutter-narrow:24px;--gutter-medium:24px;--gutter-wide:24px;--gutter-extrawide:32px}:root{--breakpoint-extrawide:75.0625rem;--breakpoint-max-width:75.0625rem;--breakpoint-medium:48rem;--breakpoint-narrow:30rem;--breakpoint-wide:60rem}.hy-twitter-feed{margin:40px 0}.hy-twitter-feed__header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-bottom:24px}@media (min-width: 30rem){.hy-twitter-feed__header{margin-bottom:32px}}@media (min-width: 75.0625rem){.without-sidebar .hy-twitter-feed__header{margin-bottom:41px}}@media (min-width: 1601px){.with-sidebar .hy-twitter-feed__header{margin-bottom:41px}}.hy-twitter-feed__title{font-weight:700;font-family:var(--main-font-family);margin-top:0;margin-bottom:0;margin-right:8px}@media (min-width: 30rem){.hy-twitter-feed__title{margin-right:12px}}@media (min-width: 75.0625rem){.without-sidebar .hy-twitter-feed__title{margin-right:16px}}@media (min-width: 1601px){.with-sidebar .hy-twitter-feed__title{margin-right:16px}}h2.hy-twitter-feed__title{font-size:1.625rem;line-height:32px;letter-spacing:-0.82px}@media (min-width: 30rem){h2.hy-twitter-feed__title{font-size:1.875rem;line-height:36px;letter-spacing:-0.6px}}@media (min-width: 75.0625rem){.without-sidebar h2.hy-twitter-feed__title{font-size:2.125rem;line-height:40px;letter-spacing:-0.68px}}@media (min-width: 1601px){.with-sidebar h2.hy-twitter-feed__title{font-size:2.125rem;line-height:40px;letter-spacing:-0.68px}}.is-front-page h2.hy-twitter-feed__title,.is-landing-page h2.hy-twitter-feed__title{font-size:1.75rem;line-height:32px;letter-spacing:-0.7px;text-transform:uppercase}@media (min-width: 30rem){.is-front-page h2.hy-twitter-feed__title,.is-landing-page h2.hy-twitter-feed__title{font-size:2.125rem;line-height:40px;letter-spacing:-0.85px}}@media (min-width: 60rem){.without-sidebar .is-front-page h2.hy-twitter-feed__title,.without-sidebar .is-landing-page h2.hy-twitter-feed__title{font-size:2.125rem;line-height:40px;letter-spacing:-0.68px}}@media (min-width: 75.0625rem){.without-sidebar .is-front-page h2.hy-twitter-feed__title,.without-sidebar .is-landing-page h2.hy-twitter-feed__title{font-size:2.625rem;line-height:48px;letter-spacing:-1.05px}}@media (min-width: 75.0625rem){.with-sidebar .is-front-page h2.hy-twitter-feed__title,.with-sidebar .is-landing-page h2.hy-twitter-feed__title{font-size:2.125rem;line-height:40px;letter-spacing:-0.68px}}@media (min-width: 1601px){.with-sidebar .is-front-page h2.hy-twitter-feed__title,.with-sidebar .is-landing-page h2.hy-twitter-feed__title{font-size:2.625rem;line-height:48px;letter-spacing:-1.05px}}h3.hy-twitter-feed__title{font-size:1.3125rem;line-height:28px;letter-spacing:-0.42px}@media (min-width: 30rem){h3.hy-twitter-feed__title{font-size:1.5625rem;line-height:32px;letter-spacing:-0.5px}}.is-front-page h3.hy-twitter-feed__title,.is-landing-page h3.hy-twitter-feed__title{font-size:1.625rem;line-height:32px;letter-spacing:-0.52px}@media (min-width: 30rem){.is-front-page h3.hy-twitter-feed__title,.is-landing-page h3.hy-twitter-feed__title{font-size:1.875rem;line-height:36px;letter-spacing:-0.6px}}@media (min-width: 60rem){.without-sidebar .is-front-page h3.hy-twitter-feed__title,.without-sidebar .is-landing-page h3.hy-twitter-feed__title{font-size:1.875rem;line-height:36px;letter-spacing:-0.6px}}@media (min-width: 75.0625rem){.without-sidebar .is-front-page h3.hy-twitter-feed__title,.without-sidebar .is-landing-page h3.hy-twitter-feed__title{font-size:2.125rem;line-height:40px;letter-spacing:-0.68px}}@media (min-width: 75.0625rem){.with-sidebar .is-front-page h3.hy-twitter-feed__title,.with-sidebar .is-landing-page h3.hy-twitter-feed__title{font-size:1.875rem;line-height:36px;letter-spacing:-0.6px}}@media (min-width: 1601px){.with-sidebar .is-front-page h3.hy-twitter-feed__title,.with-sidebar .is-landing-page h3.hy-twitter-feed__title{font-size:2.125rem;line-height:40px;letter-spacing:-0.68px}}.hy-twitter-feed__keyword{font-size:0.9375rem;line-height:22px;margin:0;font-weight:400;font-family:var(--main-font-family);color:var(--grayscale-dark-text);display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.hy-twitter-feed__keyword hy-icon{margin-right:4px}@media (min-width: 30rem){.hy-twitter-feed__keyword hy-icon{margin-right:6px}}@media (min-width: 30rem){.hy-twitter-feed__keyword hy-icon svg{width:24px;height:24px}}@media (min-width: 30rem){.hy-twitter-feed__keyword{font-size:1rem;line-height:24px}}@media (min-width: 75.0625rem){.without-sidebar .hy-twitter-feed__keyword{font-size:1.0625rem;line-height:24px}}@media (min-width: 75.0625rem){.without-sidebar .hy-twitter-feed__keyword hy-icon svg{width:32px;height:32px}}@media (min-width: 1601px){.with-sidebar .hy-twitter-feed__keyword{font-size:1.0625rem;line-height:24px}}@media (min-width: 1601px){.with-sidebar .hy-twitter-feed__keyword hy-icon svg{width:32px;height:32px}}.hy-twitter-feed__keyword+a{font-size:0.9375rem;line-height:18px;margin:0 0 0 8px;font-weight:600;font-family:var(--main-font-family);color:var(--link-blue);letter-spacing:-0.28px;text-decoration:none;-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.hy-twitter-feed__keyword+a:hover{text-decoration:underline}.hy-twitter-feed__keyword+a hy-icon{margin-right:6px}.hy-twitter-feed__keyword+a hy-icon svg{fill:var(--link-blue)}@media (min-width: 30rem){.hy-twitter-feed__keyword+a{font-size:0.875rem;line-height:18px;letter-spacing:-0.26px;margin:0 0 0 12px}}@media (min-width: 75.0625rem){.without-sidebar .hy-twitter-feed__keyword+a{font-size:1rem;line-height:20px;letter-spacing:-0.3px;margin:0 0 0 16px}}@media (min-width: 1601px){.with-sidebar .hy-twitter-feed__keyword+a{font-size:1rem;line-height:20px;letter-spacing:-0.3px;margin:0 0 0 16px}}.hy-twitter-feed__tweets{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr;gap:16px}@media (min-width: 30rem){.hy-twitter-feed__tweets{grid-template-columns:repeat(2, 1fr);gap:24px}}@media (min-width: 60rem){.without-sidebar .hy-twitter-feed__tweets{grid-template-columns:repeat(3, 1fr)}}@media (min-width: 75.0625rem){.with-sidebar .hy-twitter-feed__tweets{grid-template-columns:repeat(3, 1fr)}}.hy-twitter-tweet{background-color:var(--grayscale-background-box);height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;position:relative}.hy-twitter-tweet__header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-left:-8px;padding-top:12px;margin-bottom:8px}@media (min-width: 30rem){.hy-twitter-tweet__header{padding-top:16px}}.hy-twitter-tweet__profile-image img{height:70px;width:70px}@media (min-width: 75.0625rem){.without-sidebar .hy-twitter-tweet__profile-image img{height:80px;width:80px}}@media (min-width: 1601px){.with-sidebar .hy-twitter-tweet__profile-image img{height:80px;width:80px}}.hy-twitter-tweet__header-content{margin-left:8px}.hy-twitter-tweet__header-content time{font-size:0.75rem;line-height:14px;font-weight:400;font-family:var(--main-font-family);color:var(--grayscale-black);letter-spacing:-0.1px}.hy-twitter-tweet__header-content p{font-size:0.9375rem;line-height:18px;font-weight:700;font-family:var(--main-font-family);color:var(--brand-main-nearly-black);letter-spacing:-0.3px;margin:4px 0 2px}@media (min-width: 30rem){.hy-twitter-tweet__header-content p{font-size:1rem;line-height:20px;letter-spacing:-0.32px}}.hy-twitter-tweet__header-content a{font-size:0.75rem;line-height:16px;font-weight:600;font-family:var(--main-font-family);color:var(--link-blue);letter-spacing:-0.1px;text-decoration:none;position:relative;z-index:10}.hy-twitter-tweet__header-content a:hover{text-decoration:underline}.hy-twitter-tweet__content-wrapper{height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.hy-twitter-tweet__content{padding:0 16px}.hy-twitter-tweet__content p{font-size:0.9375rem;line-height:20px;font-weight:400;font-family:var(--main-font-family);color:var(--grayscale-dark-text);letter-spacing:-0.03px;margin:0 0 8px}@media (min-width: 30rem){.hy-twitter-tweet__content p{font-size:0.875rem;line-height:18px;letter-spacing:-0.08px}}.hy-twitter-tweet__tweet-link{font-size:0.75rem;line-height:16px;font-weight:600;font-family:var(--main-font-family);color:var(--link-blue);letter-spacing:-0.1px;text-decoration:none}.hy-twitter-tweet__tweet-link span{position:absolute;inset:0}.hy-twitter-tweet__tweet-link:hover{text-decoration:underline}.hy-twitter-tweet__statistics{margin-top:16px;padding:0 16px 16px}.hy-twitter-tweet__statistics .visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}.hy-twitter-tweet__statistics p{font-size:0.75rem;line-height:14px;font-weight:400;font-family:var(--main-font-family);color:var(--grayscale-dark);letter-spacing:-0.1px;margin:0;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.hy-twitter-tweet__statistics p:not(:first-of-type){margin-left:16px}.hy-twitter-tweet__statistics p hy-icon{margin-right:4px}.hy-twitter-tweet__statistics p hy-icon svg{fill:var(--grayscale-dark)}";
|
|
7248
7418
|
|
|
7249
7419
|
const HyTwitterFeed = class {
|
|
@@ -7258,11 +7428,11 @@ const HyTwitterFeed = class {
|
|
|
7258
7428
|
render() {
|
|
7259
7429
|
const parsedTweets = JSON.parse(this.tweets);
|
|
7260
7430
|
const HeadingVariant = this.headingVariant.toLowerCase();
|
|
7261
|
-
if (this.tweetType ===
|
|
7431
|
+
if (this.tweetType === "Hashtag" && this.twitterFeedKeyword.charAt(0) === "#") {
|
|
7262
7432
|
this.twitterFeedKeyword = this.twitterFeedKeyword.substring(1);
|
|
7263
7433
|
}
|
|
7264
|
-
return (h("section", { class: "hy-twitter-feed" }, h("div", { class: "hy-twitter-feed__header" }, h(HeadingVariant, { class: "hy-twitter-feed__title" }, this.paragraphTitle ||
|
|
7265
|
-
const dateFormatted = new Intl.DateTimeFormat(
|
|
7434
|
+
return (h("section", { class: "hy-twitter-feed" }, h("div", { class: "hy-twitter-feed__header" }, h(HeadingVariant, { class: "hy-twitter-feed__title" }, this.paragraphTitle || "Twitter"), h("p", { class: "hy-twitter-feed__keyword" }, h("hy-icon", { icon: `hy-icon-some-twitter`, size: 20 }), this.tweetType === "Hashtag" ? `#${this.twitterFeedKeyword}` : `@${this.twitterFeedKeyword}`), this.tweetType === "Username" && (h("a", { href: `https://twitter.com/${this.twitterFeedKeyword}`, target: "_blank" }, h("hy-icon", { icon: `hy-icon-plus`, size: 12 }), "Follow"))), h("ul", { class: "hy-twitter-feed__tweets" }, parsedTweets.map(({ tweet_text, tweet_created, tweet_absolute_url, tweet_like_count, tweet_retweet_count, user_name, user_username, user_profile_image_url, }) => {
|
|
7435
|
+
const dateFormatted = new Intl.DateTimeFormat("fi-FI").format(new Date(tweet_created));
|
|
7266
7436
|
return (h("li", { class: "hy-twitter-feed__item" }, h("article", { class: "hy-twitter-tweet" }, h("header", { class: "hy-twitter-tweet__header" }, h("figure", { class: "hy-twitter-tweet__profile-image", role: "complementary" }, h("img", { src: user_profile_image_url, alt: "" })), h("div", { class: "hy-twitter-tweet__header-content" }, h("time", { dateTime: tweet_created }, dateFormatted), h("p", null, user_name), h("a", { class: "hy-twitter-tweet__user-link", href: `https://twitter.com/${user_username}`, target: "_blank" }, "@", user_username))), h("div", { class: "hy-twitter-tweet__content-wrapper" }, h("div", { class: "hy-twitter-tweet__content" }, h("p", null, tweet_text.length > 113 ? `${tweet_text.substr(0, 113)}...` : tweet_text), h("a", { class: "hy-twitter-tweet__tweet-link", href: tweet_absolute_url, target: "_blank" }, h("span", { "aria-hidden": "true" }), `${tweet_absolute_url.substr(0, 24)}...`)), h("div", { class: "hy-twitter-tweet__statistics", role: "complementary" }, h("p", null, h("span", { class: "visually-hidden" }, "Tweet like count: "), h("hy-icon", { icon: `hy-icon-some-twitter-like`, size: 16 }), tweet_like_count), h("p", null, h("span", { class: "visually-hidden" }, "Tweet retweet count: "), h("hy-icon", { icon: `hy-icon-some-twitter-retweet`, size: 16 }), tweet_retweet_count))))));
|
|
7267
7437
|
}))));
|
|
7268
7438
|
}
|
|
@@ -7277,7 +7447,7 @@ const HyTwoColumns = class {
|
|
|
7277
7447
|
this.reversed = false;
|
|
7278
7448
|
}
|
|
7279
7449
|
render() {
|
|
7280
|
-
const classAttributes = [
|
|
7450
|
+
const classAttributes = ["hy-two-columns", this.reversed ? "hy-two-columns--reversed" : ""].join(" ");
|
|
7281
7451
|
return (h(Host, null, h("div", { class: classAttributes }, h("div", { class: "hy-two-columns__item hy-two-columns__item--main" }, h("slot", { name: "main" })), h("div", { class: "hy-two-columns__item hy-two-columns__item--side" }, h("slot", { name: "side" })))));
|
|
7282
7452
|
}
|
|
7283
7453
|
};
|
|
@@ -7292,10 +7462,10 @@ const HyUserLoginForm = class {
|
|
|
7292
7462
|
this.logoLabel = undefined;
|
|
7293
7463
|
}
|
|
7294
7464
|
render() {
|
|
7295
|
-
const classAttributes =
|
|
7465
|
+
const classAttributes = "hy-user-login-form";
|
|
7296
7466
|
const logoSize = SiteLogoSize.large;
|
|
7297
7467
|
const logoColor = ColorVariant.black;
|
|
7298
|
-
return (h("div", { class: classAttributes }, h("div", { class:
|
|
7468
|
+
return (h("div", { class: classAttributes }, h("div", { class: "hy-site-header__logo-container" }, h("hy-site-logo", { size: logoSize, color: logoColor, url: this.logoUrl, label: this.logoLabel })), h("slot", null)));
|
|
7299
7469
|
}
|
|
7300
7470
|
};
|
|
7301
7471
|
HyUserLoginForm.style = hyUserLoginFormCss;
|
|
@@ -7306,18 +7476,18 @@ const HyVideo = class {
|
|
|
7306
7476
|
constructor(hostRef) {
|
|
7307
7477
|
registerInstance(this, hostRef);
|
|
7308
7478
|
this.renderPreviewWithLink = () => {
|
|
7309
|
-
return this.linkToVideo ? (h("a", { title: this.videoTitle, href: this.linkToVideo, class: "hy-video__link-to-video" }, h("img", { loading: this.disableLazy ?
|
|
7479
|
+
return this.linkToVideo ? (h("a", { title: this.videoTitle, href: this.linkToVideo, class: "hy-video__link-to-video" }, h("img", { loading: this.disableLazy ? "eager" : "lazy", class: "hy-video__preview-image", src: this.previewImageUrl, alt: this.videoTitle }))) : (h("img", { loading: this.disableLazy ? "eager" : "lazy", class: "hy-video__preview-image", src: this.previewImageUrl, alt: this.videoTitle }));
|
|
7310
7480
|
};
|
|
7311
7481
|
this.renderPlayButton = () => {
|
|
7312
7482
|
if (this.simplePlayButton) {
|
|
7313
|
-
return (h("span", { class: "hy-video__play__simple" }, h("button", { type: "button" }, h("hy-icon", { icon:
|
|
7483
|
+
return (h("span", { class: "hy-video__play__simple" }, h("button", { type: "button" }, h("hy-icon", { icon: "hy-icon-video", class: "hy-video__play-icon", size: 20 }))));
|
|
7314
7484
|
}
|
|
7315
7485
|
else {
|
|
7316
|
-
return (h("span", { class: "hy-video__play" }, h("button", { type: "button" }, h("hy-icon", { icon:
|
|
7486
|
+
return (h("span", { class: "hy-video__play" }, h("button", { type: "button" }, h("hy-icon", { icon: "hy-icon-video", class: "hy-video__play-icon", size: 20 }), h("span", { class: "hy-video__button-label" }, this.playButtonLabel))));
|
|
7317
7487
|
}
|
|
7318
7488
|
};
|
|
7319
7489
|
this.truncate = (str, n) => {
|
|
7320
|
-
return str.length > n ? str.substr(0, n - 1) +
|
|
7490
|
+
return str.length > n ? str.substr(0, n - 1) + "..." : str;
|
|
7321
7491
|
};
|
|
7322
7492
|
this.videoTitle = undefined;
|
|
7323
7493
|
this.videoDescription = undefined;
|
|
@@ -7327,7 +7497,7 @@ const HyVideo = class {
|
|
|
7327
7497
|
this.linkToVideo = undefined;
|
|
7328
7498
|
this.playButtonLabel = undefined;
|
|
7329
7499
|
this.playButtonVisible = false;
|
|
7330
|
-
this.seriesLabel =
|
|
7500
|
+
this.seriesLabel = "In this series";
|
|
7331
7501
|
this.seriesCount = null;
|
|
7332
7502
|
this.views = undefined;
|
|
7333
7503
|
this.viewsLabel = undefined;
|
|
@@ -7337,18 +7507,18 @@ const HyVideo = class {
|
|
|
7337
7507
|
this.dateAddedLabel = undefined;
|
|
7338
7508
|
this.horizontal = false;
|
|
7339
7509
|
this.disableLazy = false;
|
|
7340
|
-
this.headerstyle =
|
|
7341
|
-
this.showMoreLabel =
|
|
7342
|
-
this.showLessLabel =
|
|
7510
|
+
this.headerstyle = "default";
|
|
7511
|
+
this.showMoreLabel = "Show more";
|
|
7512
|
+
this.showLessLabel = "Show less";
|
|
7343
7513
|
this.simplePlayButton = false;
|
|
7344
7514
|
this.styleList = false;
|
|
7345
7515
|
this.descCollapsed = false;
|
|
7346
7516
|
}
|
|
7347
7517
|
componentDidLoad() {
|
|
7348
|
-
let hyMainDiv = this.el.closest(
|
|
7518
|
+
let hyMainDiv = this.el.closest(".hy-main");
|
|
7349
7519
|
if (hyMainDiv) {
|
|
7350
|
-
if (!hyMainDiv.classList.contains(
|
|
7351
|
-
this.headerstyle =
|
|
7520
|
+
if (!hyMainDiv.classList.contains("with-sidebar")) {
|
|
7521
|
+
this.headerstyle = "large";
|
|
7352
7522
|
}
|
|
7353
7523
|
}
|
|
7354
7524
|
if (this.videoDescription && this.videoDescription.match(/\S/g).length > 255) {
|
|
@@ -7357,18 +7527,18 @@ const HyVideo = class {
|
|
|
7357
7527
|
}
|
|
7358
7528
|
render() {
|
|
7359
7529
|
const classAttributes = [
|
|
7360
|
-
|
|
7361
|
-
this.horizontal ?
|
|
7362
|
-
!this.styleList ? `hy-video__${this.headerstyle}` :
|
|
7363
|
-
this.styleList ?
|
|
7364
|
-
].join(
|
|
7530
|
+
"hy-video",
|
|
7531
|
+
this.horizontal ? "hy-video--horizontal" : "",
|
|
7532
|
+
!this.styleList ? `hy-video__${this.headerstyle}` : "",
|
|
7533
|
+
this.styleList ? "hy-video--list" : "",
|
|
7534
|
+
].join(" ");
|
|
7365
7535
|
const maxChars = 255;
|
|
7366
7536
|
const charCount = this.videoDescription ? this.videoDescription.match(/\S/g).length : 0;
|
|
7367
7537
|
if (this.linkToVideo && this.styleList) {
|
|
7368
7538
|
return [
|
|
7369
7539
|
h("a", { href: this.linkToVideo, class: classAttributes }, this.videoTitle && !this.horizontal && !this.styleList && (h("hy-heading", { class: "hy-video__meta__title", heading: HeadingVarians.h2 }, this.videoTitle)), h("div", { class: "hy-video__video-container" }, this.previewImageUrl ? (h("div", null, this.renderPreviewWithLink(), h("slot", { name: "video" }))) : (h("slot", { name: "video" })), this.playButtonVisible && this.renderPlayButton()), h("div", { class: "hy-video__meta" }, (this.videoTitle && this.horizontal) ||
|
|
7370
|
-
(this.styleList && (h("hy-heading", { class: "hy-video__meta__title", heading: HeadingVarians.h3 }, this.videoTitle))), this.contextLabelVisible && h("span", { class: "hy-video__label" }, this.contextLabel), (this.duration || this.views || this.dateAdded || this.seriesCount) && (h("div", { class: "hy-video__meta__details" }, this.duration && (h("div", { class: "hy-video__meta__details--item" }, h("span", { class: "hy-video__meta__label" }, this.durationLabel), h("span", { class: "hy-video__meta__content" }, this.duration))), this.views && (h("div", { class: "hy-video__meta__details--item" }, h("span", { class: "hy-video__meta__label" }, this.viewsLabel), h("span", { class: "hy-video__meta__content" }, this.views))), this.dateAdded && (h("div", { class: "hy-video__meta__details--item" }, h("span", { class: "hy-video__meta__label" }, this.dateAddedLabel), h("span", { class: "hy-video__meta__content" }, this.dateAdded))), !this.views && this.seriesCount && (h("div", { class: "hy-video__meta__details--item" }, h("span", { class: "hy-video__meta__label" }, this.seriesLabel), h("span", { class: "hy-video__meta__content" }, this.seriesCount))))), this.videoDescription && (h("div", { class: "hy-video__meta__description", "aria-expanded": this.descCollapsed ?
|
|
7371
|
-
if (e.key !=
|
|
7540
|
+
(this.styleList && (h("hy-heading", { class: "hy-video__meta__title", heading: HeadingVarians.h3 }, this.videoTitle))), this.contextLabelVisible && h("span", { class: "hy-video__label" }, this.contextLabel), (this.duration || this.views || this.dateAdded || this.seriesCount) && (h("div", { class: "hy-video__meta__details" }, this.duration && (h("div", { class: "hy-video__meta__details--item" }, h("span", { class: "hy-video__meta__label" }, this.durationLabel), h("span", { class: "hy-video__meta__content" }, this.duration))), this.views && (h("div", { class: "hy-video__meta__details--item" }, h("span", { class: "hy-video__meta__label" }, this.viewsLabel), h("span", { class: "hy-video__meta__content" }, this.views))), this.dateAdded && (h("div", { class: "hy-video__meta__details--item" }, h("span", { class: "hy-video__meta__label" }, this.dateAddedLabel), h("span", { class: "hy-video__meta__content" }, this.dateAdded))), !this.views && this.seriesCount && (h("div", { class: "hy-video__meta__details--item" }, h("span", { class: "hy-video__meta__label" }, this.seriesLabel), h("span", { class: "hy-video__meta__content" }, this.seriesCount))))), this.videoDescription && (h("div", { class: "hy-video__meta__description", "aria-expanded": this.descCollapsed ? "false" : "true" }, h("div", { class: "hy-video__meta__description__content" }, this.descCollapsed ? this.truncate(this.videoDescription, 255) : this.videoDescription), charCount > maxChars && (h("span", { class: "hy-video__meta__description__more-button", role: "button", tabindex: "0", "aria-expanded": this.descCollapsed ? "false" : "true", onClick: () => (this.descCollapsed = !this.descCollapsed), onKeyDown: (e) => {
|
|
7541
|
+
if (e.key != " ")
|
|
7372
7542
|
return;
|
|
7373
7543
|
e.preventDefault();
|
|
7374
7544
|
this.descCollapsed = !this.descCollapsed;
|
|
@@ -7378,8 +7548,8 @@ const HyVideo = class {
|
|
|
7378
7548
|
else {
|
|
7379
7549
|
return [
|
|
7380
7550
|
h("div", { class: classAttributes }, this.videoTitle && !this.horizontal && !this.styleList && (h("hy-heading", { class: "hy-video__meta__title", heading: HeadingVarians.h2 }, this.videoTitle)), h("div", { class: "hy-video__video-container" }, this.previewImageUrl ? (h("div", null, this.renderPreviewWithLink(), h("slot", { name: "video" }))) : (h("slot", { name: "video" })), this.playButtonVisible && this.renderPlayButton()), h("div", { class: "hy-video__meta" }, (this.videoTitle && this.horizontal) ||
|
|
7381
|
-
(this.styleList && (h("hy-heading", { class: "hy-video__meta__title", heading: HeadingVarians.h2 }, this.videoTitle))), this.contextLabelVisible && h("span", { class: "hy-video__label" }, this.contextLabel), (this.duration || this.views || this.dateAdded) && (h("div", { class: "hy-video__meta__details" }, this.duration && (h("div", { class: "hy-video__meta__details--item" }, h("span", { class: "hy-video__meta__label" }, this.durationLabel), h("span", { class: "hy-video__meta__content" }, this.duration))), this.views && (h("div", { class: "hy-video__meta__details--item" }, h("span", { class: "hy-video__meta__label" }, this.viewsLabel), h("span", { class: "hy-video__meta__content" }, this.views))), this.dateAdded && (h("div", { class: "hy-video__meta__details--item" }, h("span", { class: "hy-video__meta__label" }, this.dateAddedLabel), h("span", { class: "hy-video__meta__content" }, this.dateAdded))))), this.videoDescription && (h("div", { class: "hy-video__meta__description", "aria-expanded": this.descCollapsed ?
|
|
7382
|
-
if (e.key !=
|
|
7551
|
+
(this.styleList && (h("hy-heading", { class: "hy-video__meta__title", heading: HeadingVarians.h2 }, this.videoTitle))), this.contextLabelVisible && h("span", { class: "hy-video__label" }, this.contextLabel), (this.duration || this.views || this.dateAdded) && (h("div", { class: "hy-video__meta__details" }, this.duration && (h("div", { class: "hy-video__meta__details--item" }, h("span", { class: "hy-video__meta__label" }, this.durationLabel), h("span", { class: "hy-video__meta__content" }, this.duration))), this.views && (h("div", { class: "hy-video__meta__details--item" }, h("span", { class: "hy-video__meta__label" }, this.viewsLabel), h("span", { class: "hy-video__meta__content" }, this.views))), this.dateAdded && (h("div", { class: "hy-video__meta__details--item" }, h("span", { class: "hy-video__meta__label" }, this.dateAddedLabel), h("span", { class: "hy-video__meta__content" }, this.dateAdded))))), this.videoDescription && (h("div", { class: "hy-video__meta__description", "aria-expanded": this.descCollapsed ? "false" : "true" }, h("div", { class: "hy-video__meta__description__content" }, this.descCollapsed ? this.truncate(this.videoDescription, 255) : this.videoDescription), charCount > maxChars && (h("span", { class: "hy-video__meta__description__more-button", role: "button", tabindex: "0", "aria-expanded": this.descCollapsed ? "false" : "true", onClick: () => (this.descCollapsed = !this.descCollapsed), onKeyDown: (e) => {
|
|
7552
|
+
if (e.key != " ")
|
|
7383
7553
|
return;
|
|
7384
7554
|
e.preventDefault();
|
|
7385
7555
|
this.descCollapsed = !this.descCollapsed;
|
|
@@ -7392,6 +7562,4 @@ const HyVideo = class {
|
|
|
7392
7562
|
};
|
|
7393
7563
|
HyVideo.style = hyVideoCss;
|
|
7394
7564
|
|
|
7395
|
-
export { AccordionContainer as hy_accordion_container, AccordionItem as hy_accordion_item, AdjacentImageText as hy_adjacent_image_text, HyAnchorLinkList as hy_anchor_link_list, HyBadge as hy_badge, HyBanner as hy_banner, Baseline as hy_baseline, HyBox as hy_box, HyBoxContainer as hy_box_container, HyBreadcrumbs as hy_breadcrumbs, HyCheckbox as hy_checkbox, HyCollaboration as hy_collaboration, HyContentList as hy_content_list, HyContentLstItem as hy_content_list_item, HyCrisisBanner as hy_crisis_banner, CtaButton as hy_cta_button, CtaLink as hy_cta_link, HyDropdown as hy_dropdown, HyDropdownPanel as hy_dropdown_panel, HyDropdownPanelItem as hy_dropdown_panel_item, HyFilterGroup as hy_filter_group, HyFilterGroupItem as hy_filter_group_item, HyFilterListType as hy_filter_list_type, HyFilterVisibilityTool as hy_filter_visibility_tool, HyFilterVisibilityToolReset as hy_filter_visibility_tool_reset, HyFilterVisibilityToolToggle as hy_filter_visibility_tool_toggle, HyFooter as hy_footer, HyFooterAction as hy_footer_action, HyFooterBase as hy_footer_base, HyFooterInfo as hy_footer_info, HyFooterLinkItem as hy_footer_link_item, HyGeneralList as hy_general_list, HyGeneralListItem as hy_general_list_item, Heading as hy_heading, HyHero as hy_hero, Icon as hy_icon, Image as hy_image, Ingress as hy_ingress, HyIntroduction as hy_introduction, HyKeyFigure as hy_key_figure, HyKeyFigureGroup as hy_key_figure_group, HyKeyHighlight as hy_key_highlight, HyKeyHighlightGroup as hy_key_highlight_group, HyLargeProcessFlow as hy_large_process_flow, HyLargeProcessFlowPhase as hy_large_process_flow_phase, Link as hy_link, LinkBox as hy_link_box, LinkBoxList as hy_link_box_list, HyLinkList as hy_link_list, HyListItem as hy_list_item, HyLogoGrid as hy_logo_grid, HyLogoGridItem as hy_logo_grid_item, HyMain as hy_main, HyMainContentWrapper as hy_main_content_wrapper, MenuLanguage as hy_menu_language, SiteLanguage as hy_menu_language_item, HyMenuMainGroup as hy_menu_main_group, HyOpeningHours as hy_opening_hours, HyOpeningHoursContent as hy_opening_hours_content, HyPager as hy_pager, HyPagerItem as hy_pager_item, ParagraphText as hy_paragraph_text, HyPersonCard as hy_person_card, PersonProfile$1 as hy_person_profile, PersonProfile as hy_person_profile_listing, Process as hy_process, ProcessFlowBox as hy_process_flow_box, HyProminentImage as hy_prominent_image, HyQuote as hy_quote, Row as hy_row, HySearchField as hy_search_field, HyShortcuts as hy_shortcuts, SiteHeader as hy_site_header, SiteLogo as hy_site_logo, SiteSearch as hy_site_search, HyTableContainer as hy_table_container, HyTabs as hy_tabs, HyTabsItem as hy_tabs_item, HyTag as hy_tag, HyTwitterFeed as hy_twitter_feed, HyTwoColumns as hy_two_columns, HyUserLoginForm as hy_user_login_form, HyVideo as hy_video };
|
|
7396
|
-
|
|
7397
|
-
//# sourceMappingURL=hy-accordion-container_83.entry.js.map
|
|
7565
|
+
export { ColorBox as color_box, AccordionContainer as hy_accordion_container, AccordionItem as hy_accordion_item, AdjacentImageText as hy_adjacent_image_text, HyAnchorLinkList as hy_anchor_link_list, HyBadge as hy_badge, HyBanner as hy_banner, Baseline as hy_baseline, HyBox as hy_box, HyBoxContainer as hy_box_container, HyBreadcrumbs as hy_breadcrumbs, Button as hy_button, HyCheckbox as hy_checkbox, HyCollaboration as hy_collaboration, HyContentList as hy_content_list, HyContentLstItem as hy_content_list_item, HyCrisisBanner as hy_crisis_banner, CtaButton as hy_cta_button, CtaLink as hy_cta_link, DocsContainer as hy_docs_container, HyDropdown as hy_dropdown, HyDropdownPanel as hy_dropdown_panel, HyDropdownPanelItem as hy_dropdown_panel_item, HyFilterGroup as hy_filter_group, HyFilterGroupItem as hy_filter_group_item, HyFilterListType as hy_filter_list_type, HyFilterVisibilityTool as hy_filter_visibility_tool, HyFilterVisibilityToolReset as hy_filter_visibility_tool_reset, HyFilterVisibilityToolToggle as hy_filter_visibility_tool_toggle, HyFooter as hy_footer, HyFooterAction as hy_footer_action, HyFooterBase as hy_footer_base, HyFooterInfo as hy_footer_info, HyFooterLinkItem as hy_footer_link_item, HyGeneralList as hy_general_list, HyGeneralListItem as hy_general_list_item, GridContainer as hy_grid_container, GridItem as hy_grid_item, GridRow as hy_grid_row, Heading as hy_heading, HyHero as hy_hero, Icon as hy_icon, Image as hy_image, Ingress as hy_ingress, HyIntroduction as hy_introduction, HyKeyFigure as hy_key_figure, HyKeyFigureGroup as hy_key_figure_group, HyKeyHighlight as hy_key_highlight, HyKeyHighlightGroup as hy_key_highlight_group, HyLargeProcessFlow as hy_large_process_flow, HyLargeProcessFlowPhase as hy_large_process_flow_phase, Link as hy_link, LinkBox as hy_link_box, LinkBoxList as hy_link_box_list, HyLinkList as hy_link_list, HyListItem as hy_list_item, HyLogoGrid as hy_logo_grid, HyLogoGridItem as hy_logo_grid_item, HyMain as hy_main, HyMainContentWrapper as hy_main_content_wrapper, MenuLanguage as hy_menu_language, SiteLanguage as hy_menu_language_item, HyMenuMainGroup as hy_menu_main_group, HyOpeningHours as hy_opening_hours, HyOpeningHoursContent as hy_opening_hours_content, HyPager as hy_pager, HyPagerItem as hy_pager_item, ParagraphText as hy_paragraph_text, HyPersonCard as hy_person_card, PersonProfile$1 as hy_person_profile, PersonProfile as hy_person_profile_listing, Process as hy_process, ProcessFlowBox as hy_process_flow_box, HyProminentImage as hy_prominent_image, HyQuote as hy_quote, Row as hy_row, HySearchField as hy_search_field, SectionContainer as hy_section_container, HyShortcuts as hy_shortcuts, SiteHeader as hy_site_header, SiteLogo as hy_site_logo, SiteSearch as hy_site_search, HyTableContainer as hy_table_container, HyTabs as hy_tabs, HyTabsItem as hy_tabs_item, HyTag as hy_tag, TinyText as hy_tiny_text, HyTwitterFeed as hy_twitter_feed, HyTwoColumns as hy_two_columns, HyUserLoginForm as hy_user_login_form, HyVideo as hy_video };
|