@iamproperty/components 7.6.4--beta8 → 7.7.0
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/assets/css/components/actionbar.component.css +1 -1
- package/assets/css/components/actionbar.component.css.map +1 -1
- package/assets/css/components/actionbar.global.css +1 -1
- package/assets/css/components/actionbar.global.css.map +1 -1
- package/assets/css/components/address-lookup.component.css +1 -1
- package/assets/css/components/address-lookup.component.css.map +1 -1
- package/assets/css/components/applied-filters.css +1 -1
- package/assets/css/components/applied-filters.css.map +1 -1
- package/assets/css/components/barchart.component.css +1 -1
- package/assets/css/components/barchart.component.css.map +1 -1
- package/assets/css/components/bento-grid.global.css +1 -1
- package/assets/css/components/calendar.component.css +1 -1
- package/assets/css/components/calendar.component.css.map +1 -1
- package/assets/css/components/calendar.config.css +1 -1
- package/assets/css/components/card.component.css +1 -1
- package/assets/css/components/card.component.css.map +1 -1
- package/assets/css/components/card.module.css +1 -1
- package/assets/css/components/carousel.component.css +1 -1
- package/assets/css/components/carousel.component.css.map +1 -1
- package/assets/css/components/charts.config.css +1 -1
- package/assets/css/components/charts.css +1 -1
- package/assets/css/components/charts.css.map +1 -1
- package/assets/css/components/charts.module.css +1 -1
- package/assets/css/components/charts.module.css.map +1 -1
- package/assets/css/components/collapsible-side.css +1 -1
- package/assets/css/components/collapsible-side.css.map +1 -1
- package/assets/css/components/config.component.css +1 -1
- package/assets/css/components/config.component.css.map +1 -1
- package/assets/css/components/content.component.css +1 -1
- package/assets/css/components/content.component.css.map +1 -1
- package/assets/css/components/doughnutchart.component.css +1 -1
- package/assets/css/components/doughnutchart.component.css.map +1 -1
- package/assets/css/components/fileupload.css +1 -1
- package/assets/css/components/fileupload.css.map +1 -1
- package/assets/css/components/filter-card.component.css +1 -1
- package/assets/css/components/header.css +1 -1
- package/assets/css/components/header.css.map +1 -1
- package/assets/css/components/inline-edit.css +1 -1
- package/assets/css/components/inline-edit.css.map +1 -1
- package/assets/css/components/input.component.css +1 -1
- package/assets/css/components/input.component.css.map +1 -1
- package/assets/css/components/menu.component.css +1 -1
- package/assets/css/components/menu.component.css.map +1 -1
- package/assets/css/components/milestone.css +1 -1
- package/assets/css/components/modal.component.css +1 -1
- package/assets/css/components/modal.component.css.map +1 -1
- package/assets/css/components/multi-step-modal.component.css +1 -1
- package/assets/css/components/multi-step-modal.component.css.map +1 -1
- package/assets/css/components/multiselect.css +1 -1
- package/assets/css/components/multiselect.css.map +1 -1
- package/assets/css/components/nav.component.css +1 -1
- package/assets/css/components/nav.component.css.map +1 -1
- package/assets/css/components/nav.global.css +1 -1
- package/assets/css/components/nav.global.css.map +1 -1
- package/assets/css/components/notification.css +1 -1
- package/assets/css/components/notification.css.map +1 -1
- package/assets/css/components/pagination.css +1 -1
- package/assets/css/components/pagination.css.map +1 -1
- package/assets/css/components/password.component.css +1 -1
- package/assets/css/components/password.component.css.map +1 -1
- package/assets/css/components/property-searchbar.css +1 -1
- package/assets/css/components/property-searchbar.css.map +1 -1
- package/assets/css/components/rank.component.css +1 -1
- package/assets/css/components/rank.component.css.map +1 -1
- package/assets/css/components/record-card.component.css +1 -1
- package/assets/css/components/record-card.component.css.map +1 -1
- package/assets/css/components/slider.css +1 -1
- package/assets/css/components/slider.css.map +1 -1
- package/assets/css/components/split-button.component.css +1 -1
- package/assets/css/components/split-button.component.css.map +1 -1
- package/assets/css/components/table-basic.component.css +1 -1
- package/assets/css/components/table-basic.component.css.map +1 -1
- package/assets/css/components/table-basic.global.css +1 -1
- package/assets/css/components/table-basic.global.css.map +1 -1
- package/assets/css/components/table.component.css +1 -1
- package/assets/css/components/table.component.css.map +1 -1
- package/assets/css/components/table.global.css +1 -1
- package/assets/css/components/table.global.css.map +1 -1
- package/assets/css/components/tabs.component.css +1 -1
- package/assets/css/components/tabs.component.css.map +1 -1
- package/assets/css/components/tag.component.css +1 -1
- package/assets/css/components/tag.component.css.map +1 -1
- package/assets/css/components/tooltip.component.css +1 -1
- package/assets/css/components/tooltip.component.css.map +1 -1
- package/assets/css/components/video-card.component.css +1 -1
- package/assets/css/components/video-modal.component.css +1 -1
- package/assets/css/components/video-modal.component.css.map +1 -1
- package/assets/css/core.min.css +1 -1
- package/assets/css/core.min.css.map +1 -1
- package/assets/css/style.min.css +1 -1
- package/assets/css/style.min.css.map +1 -1
- package/assets/js/components/accordion/accordion.component.min.js +1 -1
- package/assets/js/components/actionbar/actionbar.component.js +1 -1
- package/assets/js/components/actionbar/actionbar.component.min.js +7 -7
- package/assets/js/components/actionbar/actionbar.component.min.js.map +1 -1
- package/assets/js/components/address-lookup/address-lookup.component.js +1 -1
- package/assets/js/components/address-lookup/address-lookup.component.min.js +5 -5
- package/assets/js/components/address-lookup/address-lookup.component.min.js.map +1 -1
- package/assets/js/components/advanced-select/advanced-select.component.js +1 -1
- package/assets/js/components/advanced-select/advanced-select.component.min.js +2 -2
- package/assets/js/components/advanced-select/advanced-select.component.min.js.map +1 -1
- package/assets/js/components/applied-filters/applied-filters.component.min.js +4 -4
- package/assets/js/components/barchart/barchart.component.min.js +6 -6
- package/assets/js/components/barchart/barchart.component.min.js.map +1 -1
- package/assets/js/components/bento-grid/bento-grid.component.min.js +2 -2
- package/assets/js/components/calendar/calendar.component.min.js +2 -2
- package/assets/js/components/card/card.component.min.js +7 -7
- package/assets/js/components/carousel/carousel.component.min.js +4 -4
- package/assets/js/components/collapsible-side/collapsible-side.component.js +1 -1
- package/assets/js/components/collapsible-side/collapsible-side.component.min.js +5 -5
- package/assets/js/components/collapsible-side/collapsible-side.component.min.js.map +1 -1
- package/assets/js/components/config/config.component.min.js +9 -9
- package/assets/js/components/content/content.component.min.js +4 -4
- package/assets/js/components/darkmode/darkmode.component.min.js +1 -1
- package/assets/js/components/doughnutchart/doughnutchart.component.min.js +7 -7
- package/assets/js/components/fileupload/fileupload.component.min.js +4 -4
- package/assets/js/components/filter-card/filter-card.component.min.js +2 -2
- package/assets/js/components/filterlist/filterlist.component.min.js +1 -1
- package/assets/js/components/form/form.component.min.js +1 -1
- package/assets/js/components/header/header.component.js +39 -1
- package/assets/js/components/header/header.component.min.js +40 -4
- package/assets/js/components/header/header.component.min.js.map +1 -1
- package/assets/js/components/inline-edit/inline-edit.component.js +1 -1
- package/assets/js/components/inline-edit/inline-edit.component.min.js +4 -4
- package/assets/js/components/inline-edit/inline-edit.component.min.js.map +1 -1
- package/assets/js/components/input/input.component.js +1 -1
- package/assets/js/components/input/input.component.min.js +3 -3
- package/assets/js/components/input/input.component.min.js.map +1 -1
- package/assets/js/components/input-range/input-range.component.js +1 -1
- package/assets/js/components/input-range/input-range.component.min.js +2 -2
- package/assets/js/components/input-range/input-range.component.min.js.map +1 -1
- package/assets/js/components/marketing/marketing.component.js +1 -1
- package/assets/js/components/marketing/marketing.component.min.js +2 -2
- package/assets/js/components/marketing/marketing.component.min.js.map +1 -1
- package/assets/js/components/menu/menu.component.min.js +2 -2
- package/assets/js/components/milestone/milestone.component.min.js +1 -1
- package/assets/js/components/milestone-group/milestone-group.component.min.js +1 -1
- package/assets/js/components/modal/modal.component.js +1 -1
- package/assets/js/components/modal/modal.component.min.js +5 -5
- package/assets/js/components/modal/modal.component.min.js.map +1 -1
- package/assets/js/components/multi-step/multi-step.component.min.js +1 -1
- package/assets/js/components/multi-step-modal/multi-step-modal.component.js +1 -1
- package/assets/js/components/multi-step-modal/multi-step-modal.component.min.js +5 -5
- package/assets/js/components/multi-step-modal/multi-step-modal.component.min.js.map +1 -1
- package/assets/js/components/multiselect/multiselect.component.min.js +2 -2
- package/assets/js/components/nav/nav.component.js +1 -1
- package/assets/js/components/nav/nav.component.min.js +6 -6
- package/assets/js/components/nav/nav.component.min.js.map +1 -1
- package/assets/js/components/notification/notification.component.min.js +2 -2
- package/assets/js/components/pagination/pagination.component.js +1 -1
- package/assets/js/components/pagination/pagination.component.min.js +4 -4
- package/assets/js/components/pagination/pagination.component.min.js.map +1 -1
- package/assets/js/components/password/password.component.js +1 -1
- package/assets/js/components/password/password.component.min.js +5 -5
- package/assets/js/components/password/password.component.min.js.map +1 -1
- package/assets/js/components/popover/popover.component.min.js +1 -1
- package/assets/js/components/rank/rank.component.min.js +1 -1
- package/assets/js/components/rankings/rankings.component.min.js +1 -1
- package/assets/js/components/rating/rating.component.min.js +1 -1
- package/assets/js/components/record-card/record-card.component.min.js +2 -2
- package/assets/js/components/search/search.component.js +1 -1
- package/assets/js/components/search/search.component.min.js +2 -2
- package/assets/js/components/search/search.component.min.js.map +1 -1
- package/assets/js/components/slider/slider.component.min.js +2 -2
- package/assets/js/components/split-button/split-button.component.js +0 -4
- package/assets/js/components/split-button/split-button.component.min.js +6 -7
- package/assets/js/components/split-button/split-button.component.min.js.map +1 -1
- package/assets/js/components/std-address-lookup/std-address-lookup.component.js +41 -11
- package/assets/js/components/std-address-lookup/std-address-lookup.component.min.js +9 -17
- package/assets/js/components/std-address-lookup/std-address-lookup.component.min.js.map +1 -1
- package/assets/js/components/table/table.component.min.js +4 -4
- package/assets/js/components/table-ajax/table-ajax.component.min.js +7 -7
- package/assets/js/components/table-basic/table-basic.component.min.js +5 -5
- package/assets/js/components/table-no-submit/table-no-submit.component.min.js +4 -4
- package/assets/js/components/table-submit/table-submit.component.min.js +7 -7
- package/assets/js/components/tabs/tabs.component.js +1 -1
- package/assets/js/components/tabs/tabs.component.min.js +5 -5
- package/assets/js/components/tabs/tabs.component.min.js.map +1 -1
- package/assets/js/components/tag/tag.component.min.js +4 -4
- package/assets/js/components/tag/tag.component.min.js.map +1 -1
- package/assets/js/components/tooltip/tooltip.component.min.js +2 -2
- package/assets/js/components/video-card/video-card.component.min.js +2 -2
- package/assets/js/components/video-modal/video-modal.component.js +1 -1
- package/assets/js/components/video-modal/video-modal.component.min.js +4 -4
- package/assets/js/components/video-modal/video-modal.component.min.js.map +1 -1
- package/assets/js/components/word-count/word-count.component.min.js +1 -1
- package/assets/js/modules/helper.test.js +84 -0
- package/assets/js/modules/test.js +19 -0
- package/assets/js/scripts.bundle.js +1 -1
- package/assets/js/scripts.bundle.min.js +1 -1
- package/assets/sass/_components.scss +7 -7
- package/assets/sass/_corefiles.scss +8 -7
- package/assets/sass/_elements.scss +16 -16
- package/assets/sass/_functions/bs_mixins.scss +3 -3
- package/assets/sass/_utilities.scss +4 -3
- package/assets/sass/components/actionbar.component.scss +25 -25
- package/assets/sass/components/actionbar.global.scss +4 -4
- package/assets/sass/components/address-lookup.component.scss +7 -7
- package/assets/sass/components/applied-filters.scss +2 -2
- package/assets/sass/components/barchart.component.scss +6 -6
- package/assets/sass/components/bento-grid.component.scss +2 -2
- package/assets/sass/components/bento-grid.global.scss +3 -3
- package/assets/sass/components/calendar.component.scss +14 -14
- package/assets/sass/components/calendar.config.scss +4 -4
- package/assets/sass/components/card.component.scss +10 -10
- package/assets/sass/components/card.module.scss +2 -2
- package/assets/sass/components/carousel.component.scss +8 -8
- package/assets/sass/components/carousel.config.scss +2 -2
- package/assets/sass/components/charts.config.scss +3 -3
- package/assets/sass/components/charts.module.scss +4 -18
- package/assets/sass/components/charts.scss +3 -3
- package/assets/sass/components/collapsible-side.scss +16 -16
- package/assets/sass/components/config.component.scss +5 -5
- package/assets/sass/components/content.component.scss +1 -1
- package/assets/sass/components/darkmode.component.scss +1 -1
- package/assets/sass/components/doughnutchart.component.scss +11 -10
- package/assets/sass/components/fileupload.scss +9 -9
- package/assets/sass/components/filter-card.component.scss +3 -3
- package/assets/sass/components/header.scss +121 -23
- package/assets/sass/components/inline-edit.preload.scss +1 -1
- package/assets/sass/components/inline-edit.scss +1 -1
- package/assets/sass/components/input.component.scss +2 -1
- package/assets/sass/components/marketing.component.scss +1 -1
- package/assets/sass/components/menu.component.scss +10 -10
- package/assets/sass/components/milestone.scss +2 -2
- package/assets/sass/components/modal.component.scss +22 -22
- package/assets/sass/components/multi-step-modal.component.scss +15 -15
- package/assets/sass/components/multi-step-modal.global.scss +1 -1
- package/assets/sass/components/multi-step.component.scss +3 -3
- package/assets/sass/components/multiselect.scss +9 -9
- package/assets/sass/components/nav.component.scss +24 -24
- package/assets/sass/components/nav.docs.scss +1 -1
- package/assets/sass/components/nav.global.scss +120 -119
- package/assets/sass/components/nav.preload.scss +1 -1
- package/assets/sass/components/notification.scss +34 -7
- package/assets/sass/components/pagination.scss +7 -7
- package/assets/sass/components/password.component.scss +1 -1
- package/assets/sass/components/popover.component.scss +3 -3
- package/assets/sass/components/property-searchbar.scss +1 -1
- package/assets/sass/components/rank.component.scss +19 -19
- package/assets/sass/components/rankings.component.scss +1 -1
- package/assets/sass/components/rankings.global.scss +2 -2
- package/assets/sass/components/record-card.component.scss +15 -15
- package/assets/sass/components/slider.scss +4 -4
- package/assets/sass/components/snapshot.scss +1 -1
- package/assets/sass/components/split-button.component.scss +2 -2
- package/assets/sass/components/table-basic.component.scss +3 -3
- package/assets/sass/components/table-basic.global.scss +30 -10
- package/assets/sass/components/table.component.scss +27 -16
- package/assets/sass/components/table.global.scss +51 -49
- package/assets/sass/components/tabs.component.scss +3 -3
- package/assets/sass/components/tabs.config.scss +1 -1
- package/assets/sass/components/tag.component.scss +2 -2
- package/assets/sass/components/testimonial.scss +2 -2
- package/assets/sass/components/timeline.scss +3 -3
- package/assets/sass/components/tooltip.component.scss +13 -8
- package/assets/sass/components/video-card.component.scss +2 -2
- package/assets/sass/components/video-modal.component.scss +1 -1
- package/assets/sass/components/word-count.component.scss +1 -1
- package/assets/sass/core.scss +1 -1
- package/assets/sass/elements/{admin-panel.scss → admin-panel.css} +17 -24
- package/assets/sass/elements/{badge-tag.scss → badge-tag.css} +11 -19
- package/assets/sass/elements/button__group.css +3 -2
- package/assets/sass/elements/{buttons--action.scss → buttons--action.css} +11 -19
- package/assets/sass/elements/{buttons--compact.scss → buttons--compact.css} +8 -36
- package/assets/sass/elements/buttons--global.scss +12 -18
- package/assets/sass/elements/buttons--special.scss +1 -1
- package/assets/sass/elements/buttons.scss +6 -6
- package/assets/sass/elements/container.scss +6 -6
- package/assets/sass/elements/details.scss +13 -13
- package/assets/sass/elements/dialog.scss +7 -7
- package/assets/sass/elements/dropdown.scss +1 -1
- package/assets/sass/elements/feature.scss +114 -6
- package/assets/sass/elements/forms.scss +24 -25
- package/assets/sass/elements/icons.css +1 -1
- package/assets/sass/elements/links.scss +5 -5
- package/assets/sass/elements/lists--tick-list.scss +18 -6
- package/assets/sass/elements/modal.scss +24 -24
- package/assets/sass/elements/popover.scss +14 -14
- package/assets/sass/elements/prefix.scss +18 -4
- package/assets/sass/elements/progress.scss +14 -14
- package/assets/sass/elements/table.element.scss +9 -5
- package/assets/sass/elements/tooltips.scss +4 -4
- package/assets/sass/email.scss +1 -1
- package/assets/sass/foundations/animations.scss +2 -0
- package/assets/sass/foundations/colours.scss +1 -1
- package/assets/sass/foundations/reboot.scss +1 -1
- package/assets/sass/foundations/root.scss +29 -92
- package/assets/sass/templates/auth.scss +7 -7
- package/assets/sass/templates/form.scss +8 -8
- package/assets/sass/utilities/border.scss +6 -18
- package/assets/sass/utilities/font-awesome-iso-fallbacks.scss +6 -0
- package/assets/sass/utilities/shadow.scss +7 -0
- package/assets/sass/utilities/wider-colours.scss +0 -2
- package/assets/ts/components/actionbar/actionbar.component.ts +1 -1
- package/assets/ts/components/address-lookup/address-lookup.component.ts +1 -1
- package/assets/ts/components/advanced-select/advanced-select.component.ts +1 -1
- package/assets/ts/components/collapsible-side/collapsible-side.component.ts +1 -1
- package/assets/ts/components/header/header.component.ts +40 -1
- package/assets/ts/components/inline-edit/inline-edit.component.ts +1 -1
- package/assets/ts/components/input/input.component.ts +1 -1
- package/assets/ts/components/input-range/input-range.component.ts +1 -1
- package/assets/ts/components/marketing/marketing.component.ts +1 -1
- package/assets/ts/components/modal/modal.component.ts +1 -1
- package/assets/ts/components/multi-step-modal/multi-step-modal.component.ts +1 -1
- package/assets/ts/components/nav/nav.component.ts +1 -1
- package/assets/ts/components/pagination/pagination.component.ts +1 -1
- package/assets/ts/components/password/password.component.ts +1 -1
- package/assets/ts/components/search/search.component.ts +1 -1
- package/assets/ts/components/split-button/split-button.component.ts +0 -4
- package/assets/ts/components/std-address-lookup/std-address-lookup.component.ts +46 -12
- package/assets/ts/components/tabs/tabs.component.ts +1 -1
- package/assets/ts/components/video-modal/video-modal.component.ts +1 -1
- package/assets/ts/modules/helper.test.ts +143 -0
- package/assets/ts/modules/test.ts +22 -0
- package/dist/components.es.js +29 -29
- package/dist/components.umd.js +293 -266
- package/package.json +9 -21
- package/assets/js/tests/helpers.spec.js +0 -79
- package/assets/js/ui-tests/card.spec.js +0 -14
- package/assets/js/ui-tests/carousel.spec.js +0 -60
- package/assets/js/ui-tests/chart.spec.js +0 -59
- package/assets/js/ui-tests/fileupload.spec.js +0 -22
- package/assets/js/ui-tests/filterlist.spec.js +0 -22
- package/assets/js/ui-tests/multistep.spec.js +0 -68
- package/assets/js/ui-tests/slider.spec.js +0 -20
- package/assets/js/ui-tests/table.spec.js +0 -81
- package/assets/ts/tests/helpers.spec.ts +0 -137
- package/assets/ts/ui-tests/card.spec.ts +0 -19
- package/assets/ts/ui-tests/carousel.spec.ts +0 -66
- package/assets/ts/ui-tests/chart.spec.ts +0 -71
- package/assets/ts/ui-tests/data-layer.spec.js +0 -68
- package/assets/ts/ui-tests/fileupload.spec.ts +0 -30
- package/assets/ts/ui-tests/filterlist.spec.ts +0 -26
- package/assets/ts/ui-tests/multistep.spec.ts +0 -78
- package/assets/ts/ui-tests/slider.spec.ts +0 -27
- package/assets/ts/ui-tests/table.spec.ts +0 -91
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.
|
|
2
|
+
* iamKey v7.7.0
|
|
3
3
|
* Copyright 2022-2026 iamproperty
|
|
4
4
|
*/const p=o=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:o})},h=(o,t,a)=>(window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementAdded",element:t}),a.forEach(e=>{o.addEventListener(e,function(r){const i={event:e,element:t,target:r.target};Object.keys(r.detail).forEach(d=>{const s=r.detail[d];i[d]=s}),window.dataLayer.push(i)})}),!0),b=`<div class="card__head" part="head">
|
|
5
5
|
<slot name="head"></slot>
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
<style>
|
|
20
20
|
${this.hasAttribute("css")?`@import "${this.getAttribute("css")}";`:""}
|
|
21
21
|
|
|
22
|
-
:host{--card-icon-right: 1rem;--card-head-top-padding: 2rem;--card-head-bottom-padding: 2rem;--card-footer-bottom-padding: 1.5rem;--card-head-height: 6rem;box-shadow:var(--card-box-shadow);border-radius:var(--card-border-radius);position:relative;font-weight:bold;font-size:1.125rem;line-height:1.5rem;color:var(--colour-primary);width:100%;text-align:left;display:flex;flex-direction:column;overflow:hidden;z-index:0;background:var(--colour-canvas-2);outline:2px solid var(--outline-colour, --colour-canvas-2);outline-offset:-2px;margin-bottom:2rem}:host>*{width:100%;box-sizing:border-box}:host-context(:is(a,label,button)){margin-bottom:0 !important}:host(.border-0){box-shadow:none;--card-left-padding: 0rem;outline-offset:1px !important}.card__head:has(img){min-height:var(--card-head-height);position:relative;overflow:hidden;background:rgba(0,0,0,.1);z-index:-1}.card__head:has(img)>img{position:absolute;top:0;left:0;margin:-2px;width:calc(100% + 4px);height:calc(100% + 4px);object-fit:cover}.card__body{padding:var(--card-head-top-padding) var(--card-right-padding) var(--card-head-bottom-padding) var(--card-left-padding)}.card__footer{margin-top:0;padding:0 var(--card-right-padding) 0 var(--card-left-padding)}::slotted(i){font-size:1.5rem !important;margin:-3px var(--card-icon-right) 0 0 !important;vertical-align:middle !important}::slotted(i:not(.fa-light):not(.fa-bold)){font-weight:400 !important}::slotted(.badge){margin-bottom:.375rem !important}::slotted(span:not(.badge)){display:block !important;font-weight:normal !important;font-size:1rem !important}::slotted(small){padding-top:1rem !important;display:block !important;font-weight:normal !important;padding-bottom:0 !important;color:var(--colour-body)}::slotted(span:not(.badge):not([class*=pt-])){padding-top:1.5rem !important}::slotted(:is(a,button)[slot=footer]){margin-bottom:var(--card-footer-bottom-padding) !important}.card__body:has(.card__total){--card-head-top-padding: 1rem;--card-head-bottom-padding: 1.5rem}.card__total{font-size:3rem;line-height:3rem;padding-right:1rem;margin-top:.5rem}.card__total i{font-family:var(--fa-style-family, "Font Awesome
|
|
22
|
+
:host{--card-icon-right: 1rem;--card-head-top-padding: 2rem;--card-head-bottom-padding: 2rem;--card-footer-bottom-padding: 1.5rem;--card-head-height: 6rem;box-shadow:var(--card-box-shadow);border-radius:var(--card-border-radius);position:relative;font-weight:bold;font-size:1.125rem;line-height:1.5rem;color:var(--colour-primary);width:100%;text-align:left;display:flex;flex-direction:column;overflow:hidden;z-index:0;background:var(--colour-canvas-2);outline:2px solid var(--outline-colour, --colour-canvas-2);outline-offset:-2px;margin-bottom:2rem}:host>*{width:100%;box-sizing:border-box}:host-context(:is(a,label,button)){margin-bottom:0 !important}:host(.border-0){box-shadow:none;--card-left-padding: 0rem;outline-offset:1px !important}.card__head:has(img){min-height:var(--card-head-height);position:relative;overflow:hidden;background:rgba(0,0,0,.1);z-index:-1}.card__head:has(img)>img{position:absolute;top:0;left:0;margin:-2px;width:calc(100% + 4px);height:calc(100% + 4px);object-fit:cover}.card__body{padding:var(--card-head-top-padding) var(--card-right-padding) var(--card-head-bottom-padding) var(--card-left-padding)}.card__footer{margin-top:0;padding:0 var(--card-right-padding) 0 var(--card-left-padding)}::slotted(i){font-size:1.5rem !important;margin:-3px var(--card-icon-right) 0 0 !important;vertical-align:middle !important}::slotted(i:not(.fa-light):not(.fa-bold)){font-weight:400 !important}::slotted(.badge){margin-bottom:.375rem !important}::slotted(span:not(.badge)){display:block !important;font-weight:normal !important;font-size:1rem !important}::slotted(small){padding-top:1rem !important;display:block !important;font-weight:normal !important;padding-bottom:0 !important;color:var(--colour-body)}::slotted(span:not(.badge):not([class*=pt-])){padding-top:1.5rem !important}::slotted(:is(a,button)[slot=footer]){margin-bottom:var(--card-footer-bottom-padding) !important}.card__body:has(.card__total){--card-head-top-padding: 1rem;--card-head-bottom-padding: 1.5rem}.card__total{font-size:3rem;line-height:3rem;padding-right:1rem;margin-top:.5rem}.card__total i{font-family:var(--fa-style-family, "Font Awesome 7 Pro");font-weight:var(--fa-style, 900);display:block !important;font-size:2.5rem !important;margin:.5rem 0 .5rem 0 !important}::slotted([slot=total-icon]){display:block !important;font-size:2.5rem !important;margin:.5rem 0 .5rem 0 !important;line-height:2.5rem}.card__head:has(img)~.card__badges{position:absolute;top:0;text-align:left;left:0;z-index:9}.card__badges:not(.empty){padding:var(--card-badges-top-padding, 1rem) var(--card-right-padding) 0 var(--card-left-padding);margin-bottom:-1.5rem}:host{--card-right-padding: 1rem;--card-head-height: 10rem;font-size:1.5rem;--line-height: 2rem}:host(:is([data-youtube],[data-vimeo]):not(.video-card--top)) .card__head{order:2}:host(:is([data-youtube],[data-vimeo])) .card__head{cursor:pointer;position:relative}:host(:is([data-youtube],[data-vimeo])) .card__head>*:not(img){z-index:-1}:host(:is([data-youtube],[data-vimeo])) .card__head:before{content:"";display:block;background-color:var(--video-btn-colour, var(--colour-success));height:5rem;width:5rem;position:absolute;top:calc(50% - 2.5rem);left:calc(50% - 2.5rem);z-index:2;border-radius:2.5rem}:host(:is([data-youtube],[data-vimeo])) .card__head:after{--icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'><path d='M73 39c-14.8-9.1-33.4-9.4-48.5-.9S0 62.6 0 80L0 432c0 17.4 9.4 33.4 24.5 41.9s33.7 8.1 48.5-.9L361 297c14.3-8.7 23-24.2 23-41s-8.7-32.2-23-41L73 39z'/></svg>");content:"";display:block;height:2rem;width:2rem;position:absolute;top:calc(50% - 1rem);left:calc(50% - .8rem);z-index:5;background:var(--colour-primary-theme);mask-image:var(--icon);mask-size:80%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon);-webkit-mask-size:80%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%}:host(:is([data-youtube],[data-vimeo])) .card__head:is(:hover,:focus){--video-btn-colour: var(--colour-canvas)}:host(:is([data-youtube],[data-vimeo])) .card__head:is(:active){--video-btn-colour: color-mix(in oklab, var(--colour-success), #000000 20%) !important}.embed{aspect-ratio:1/1;display:block;width:10rem}/*# sourceMappingURL=assets/css/components/video-card.component.css.map */
|
|
23
23
|
|
|
24
24
|
</style>
|
|
25
25
|
${b}
|
|
@@ -63,7 +63,7 @@ class iamVideoCard extends HTMLElement {
|
|
|
63
63
|
${loadCSS}
|
|
64
64
|
</style>
|
|
65
65
|
|
|
66
|
-
<link rel="stylesheet" href="https://kit.fontawesome.com/
|
|
66
|
+
<link rel="stylesheet" href="https://kit.fontawesome.com/8bd0fca975.css" crossorigin="anonymous" />
|
|
67
67
|
|
|
68
68
|
<dialog>
|
|
69
69
|
${closeButtonHtml}
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.
|
|
2
|
+
* iamKey v7.7.0
|
|
3
3
|
* Copyright 2022-2026 iamproperty
|
|
4
|
-
*/const
|
|
4
|
+
*/const g=r=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:r})};var b=function(r,n,e,t){function a(o){return o instanceof e?o:new e(function(i){i(o)})}return new(e||(e=Promise))(function(o,i){function s(d){try{l(t.next(d))}catch(c){i(c)}}function p(d){try{l(t.throw(d))}catch(c){i(c)}}function l(d){d.done?o(d.value):a(d.value).then(s,p)}l((t=t.apply(r,n||[])).next())})};const u=()=>b(void 0,void 0,void 0,function*(){return new Promise((r,n)=>{const e=new Image;e.onload=function(){const t=document.createElement("script");t.src="https://www.youtube.com/iframe_api";const a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(t,a),document.body.classList.add("youtubeLoaded"),r(!0)},e.onerror=function(){n(!1)},e.src="https://youtube.com/favicon.ico"})}),v=(r,n)=>b(void 0,void 0,void 0,function*(){if(typeof window.player>"u"&&(window.player=[]),typeof window.player[n]<"u"&&typeof window.player[n].pauseVideo=="function")return window.player[n].playVideo(),!1;window.player[n]=new YT.Player(n,{height:"100%",width:"100%",videoId:n,playerVars:{modestbranding:1,playsinline:1,rel:0,showinfo:0},events:{onReady:e,onStateChange:a}});function e(o){o.target.playVideo()}let t=!1;function a(o){o.data==YT.PlayerState.PLAYING&&!t&&(document.getElementById(n).classList.add("player-ready"),t=!0)}}),h=(r,n)=>{var e;const t=(e=n.shadowRoot)===null||e===void 0?void 0:e.querySelector("dialog");t?.showModal(),t?.focus();const a=new CustomEvent("modal-opened",{bubbles:!0,cancelable:!0,detail:{modalId:r}});n.dispatchEvent(a),window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"openModal",id:r})},f=(r,n)=>{var e;const t=(e=n.shadowRoot)===null||e===void 0?void 0:e.querySelector("dialog");t?.close();const a=new CustomEvent("modal-closed",{bubbles:!0,cancelable:!0,detail:{modalId:r}});n.dispatchEvent(a),window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"closeModal",id:r})},w='<button class="btn btn-compact btn-secondary fa-xmark-large" data-close>Close</button>';var m=function(r,n,e,t){function a(o){return o instanceof e?o:new e(function(i){i(o)})}return new(e||(e=Promise))(function(o,i){function s(d){try{l(t.next(d))}catch(c){i(c)}}function p(d){try{l(t.throw(d))}catch(c){i(c)}}function l(d){d.done?o(d.value):a(d.value).then(s,p)}l((t=t.apply(r,n||[])).next())})};g("iam-video-modal");class y extends HTMLElement{constructor(){super(),this.openYoutubeVideo=(e,t)=>m(this,void 0,void 0,function*(){const a=t.querySelector(".embed");h(e,t);const o=t.getAttribute("data-youtube");document.body.classList.contains("youtubeLoaded")||(yield u());const i=new CustomEvent("play-video",{detail:{"Video Type":"YoutTube",ID:o}});t.dispatchEvent(i);const s=setInterval(()=>{typeof YT<"u"&&(clearInterval(s),v(a,o))},200);setTimeout(function(){clearInterval(s)},2e3)}),this.openVimeoVideo=(e,t)=>m(this,void 0,void 0,function*(){const a=t.querySelector(".embed");h(e,t);const o=t.getAttribute("data-vimeo"),i=new CustomEvent("play-video",{detail:{"Video Type":"Vimeo",ID:o}});t.dispatchEvent(i),window.dataLayer.push(i.detail),a.querySelector("iframe")||(a.innerHTML=`<iframe src="https://player.vimeo.com/video/${o}?autoplay=1" width="100%" height="100%" frameborder="0" allow="autoplay; encrypted-media" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>`)}),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const n=document.createElement("template");n.innerHTML=`
|
|
5
5
|
<style>
|
|
6
6
|
${this.hasAttribute("css")?`@import "${this.getAttribute("css")}";`:""}
|
|
7
7
|
|
|
8
|
-
@layer elements{body:not(.js-enabled) dialog:not([open]):target{display:block}dialog,[popover]{--dialog-padding: 1.5rem;--mh-padding-inline: var(--dialog-padding);color:inherit;width:fit-content;height:fit-content;border:none;overscroll-behavior:contain;background:var(--colour-canvas-2);box-shadow:0px 2px 9px rgba(0,0,0,.11);border-radius:0.625rem;padding:var(--dialog-padding);outline:var(--contrast-outline-width, 0px) solid var(--colour-primary)}dialog>*:last-child,[popover]>*:last-child{margin-bottom:0}dialog>:is(p):last-child,[popover]>:is(p):last-child{padding-bottom:0}dialog::backdrop{background:rgba(0,0,0,.3);backdrop-filter:blur(4px);overscroll-behavior:contain}dialog[open],[popover]:popover-open{display:flex;flex-direction:column}*:not(.dialog__wrapper)>dialog[open],*:not(.dialog__wrapper)>[popover]:popover-open{overflow-y:auto;width:90vw;max-width:20.25rem;max-height:min(90vh,47rem);overscroll-behavior:contain}@media screen and (min-width: 36em){*:not(.dialog__wrapper)>dialog[open],*:not(.dialog__wrapper)>[popover]:popover-open{min-width:20.9375rem;width:fit-content;max-width:42.875rem}}@media screen and (min-width: 62em){*:not(.dialog__wrapper)>dialog[open],*:not(.dialog__wrapper)>[popover]:popover-open{min-width:28.375rem;width:fit-content;max-width:46rem}}details.bg-light{margin-inline:calc(var(--dialog-padding)*-1);padding-inline:var(--dialog-padding)}}@layer elements{*,*::before,*::after{box-sizing:border-box}button{border-radius:0;text-transform:none;margin:0;font-family:inherit;font-size:inherit;line-height:inherit}[role=button]{cursor:pointer}button:focus:not(:focus-visible){outline:0}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button:not(:disabled),[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled){cursor:pointer}.btn{--btn-margin: 1rem;--btn-padding-block: 0.75rem;--btn-padding-inline: 2.5rem;--btn-border-width: 0.125rem;--btn-font-size: 1.125rem;--btn-line-height: 1.25rem;display:inline-block;font-weight:bold;text-align:left;text-decoration:none;vertical-align:middle;cursor:pointer;user-select:none;color:var(--colour-btn);font-size:var(--btn-font-size);line-height:var(--btn-line-height);padding:var(--btn-padding-block) var(--btn-padding-inline);border-radius:1.5rem;margin-bottom:var(--btn-margin);background:none;transition:border .5s,background .5s,color .5s;height:auto;max-width:fit-content;appearance:none;white-space:nowrap}@media screen and (min-width: 36em){.btn{--btn-margin: 1.5rem}}.btn:not(.btn-secondary)[class*=colour-]{--colour-btn-bg: var(--colour);--colour-btn-border: var(--colour)}.btn:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){--colour-btn: #fcfcfc}.btn:not(.border-0){background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border)}.btn:not(:last-child){margin-right:var(--btn-margin)}a:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn,.btn:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){outline:0;text-decoration:none;background:var(--colour-btn-bg-hover);color:var(--colour-btn-hover);border-radius:1.5rem}a:is(:active,.active):not([disabled]) .btn,.btn:is(:active,.active):not([disabled]){filter:brightness(85%);transition:background .1s,color .1s;color:var(--colour-btn);border-radius:1.5rem}a:disabled .btn,.btn:disabled,[disabled] .btn,.btn[disabled]{opacity:.4;cursor:not-allowed}.btn.colour-success{--colour-btn-bg-hover: var(--colour);--colour-btn-border-hover: var(--colour);--colour-btn-hover: var(--colour-primary-theme);position:relative;padding-left:3.5rem;padding-right:3.5rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.colour-success,.btn.colour-success:is(:hover,:focus,.hover):not([disabled],:active,.active){padding-left:2.5rem;padding-right:2.5rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.colour-success:before,.btn.colour-success:is(:hover,:focus,.hover):not([disabled],:active,.active):before{content:"\uF00C";font-family:"Font Awesome 6 Pro";margin-right:1rem;font-style:inherit;width:1rem;display:inline-block;height:var(--btn-line-height);vertical-align:bottom}.btn.btn-sm{--btn-padding-block: 0.5rem;--btn-padding-inline: 2rem;--btn-margin: 0.5rem;--btn-font-size: 1rem}.btn[class*=fa-]:before{content:var(--fa);font-family:"Font Awesome 6 Pro";line-height:1em}.btn.btn[class*=fa-after]{padding-right:4rem}.btn.btn[class*=fa-after]:before{margin-right:0;margin-right:0.375rem;position:absolute;right:1.5rem;top:50%;transform:translate(0, -50%)}.btn:not(.btn-compact):before{margin-right:1rem}.btn i[class*=fa-]{font-family:"Font Awesome 6 Pro";margin-right:1rem;line-height:1em;font-style:inherit}.btn i[class*=fa-]:not(:first-child){margin-left:1rem;margin-right:0}.btn.btn--prompt:after{content:"";height:var(--btn-line-height);width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.btn--prompt:after,.btn.btn--prompt:is(:hover,:focus,.hover):not([disabled],:active,.active):after{margin-left:1.5rem;margin-right:-0.5rem}.btn-filter:after{content:"\uF1DE";display:inline-block;margin-left:1em;margin-bottom:-0.15em;height:1em;width:1em;z-index:var(--index-focus);color:currentColor;font-weight:300;font-family:"Font Awesome 6 Pro"}}@layer elements{.btn-secondary{color:var(--colour-btn-secondary)}.btn-secondary:not(.border-0){background:var(--colour-btn-secondary-bg);border:2px solid var(--colour-btn-secondary-border)}a:is(:hover,:focus,.hover,:active,.active):not([disabled]) .btn-secondary,.btn-secondary:is(:hover,:focus,.hover,:focus-within,:active,.active):not([disabled]){background:var(--colour-btn-secondary-bg-hover);color:var(--colour-btn-secondary-hover)}}@layer elements{.btn.btn-tertiary{background-color:rgba(0,0,0,0);border:none;color:var(--colour-link);margin:0 var(--btn-margin) var(--btn-margin) 0;padding:0;font-size:1.125rem;font-weight:normal;line-height:1.5rem;min-height:1.5rem;position:relative}.btn.btn-tertiary:after{position:absolute;content:"";top:100%;left:50%;height:2px;width:100%;transform:translate(-50%, 0);background:var(--colour-underline);transition:width .5s}.btn.btn-tertiary.text-decoration-none:after{width:0%}.btn.btn-tertiary [class*=fa-]{margin-left:0;margin-right:.5rem}.btn.btn-tertiary [class*=fa-]:not(:first-child){margin-left:.5rem;margin-right:0}.btn.btn-tertiary:is(:hover,:focus,.hover,:focus-within):not([disabled],:disabled,:active,.active):after{width:60% !important}.btn.btn-tertiary:is(:active,.active):not([disabled],:disabled){color:var(--colour-active)}}@layer elements{.btn-action{--btn-border-width: 0.0625rem;--btn-padding-block: 0.3125rem;--btn-padding-inline: 0.3125rem;--btn-margin: 0.5rem}.btn-action:not(.btn-primary){color:var(--colour-heading)}.btn-action:not(.btn-primary):not(.border-0){background-color:var(--colour-canvas-2);border:var(--btn-border-width) solid var(--colour-muted)}.btn-action{border-radius:.25rem !important;font-weight:400 !important;font-size:1rem;line-height:1.25rem}.btn-action.btn[class*=fa-]:before{content:var(--fa);margin-right:0.375rem}a:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn-action,.btn-action:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){background:var(--colour-btn-action-hover-bg)}.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn-action,.btn-action.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){filter:brightness(90%);background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border);color:var(--colour-btn)}a:is(:active,.active):not([disabled]):not(.btn-primary) .btn-action,.btn-action:is(:active,.active):not([disabled]):not(.btn-primary){filter:brightness(85%);transition:all .1s;color:var(--colour-heading)}.btn-action:not(.btn-compact).fa-compact-only:before{display:none !important}}@layer elements{.btn-compact{--compact-size: 3rem;padding:0 !important;margin-bottom:.5rem}.btn-compact:not(:last-child){margin-right:.5rem}.btn-compact{text-align:center;width:var(--compact-size);min-width:var(--compact-size);max-width:var(--compact-size);height:var(--compact-size) !important;min-height:var(--compact-size) !important;max-height:var(--compact-size) !important;align-content:center;line-height:1 !important;text-indent:-500px;overflow:hidden;position:relative;font-size:1rem}.btn-compact:before{content:var(--fa);position:absolute;display:block;top:0;left:0;width:100%;height:100%;text-indent:0;line-height:calc(var(--compact-size) - .25rem);font-weight:900}.btn-compact[class*=fa-]:before{line-height:calc(var(--compact-size) - .25rem)}@container style(--theme: dark){.btn-compact[class*=fa-]:before{color:#fff}}.btn-compact.btn-sm{--compact-size: 2.5rem;font-size:1rem;padding:0 !important}.btn-compact.btn-action{--compact-size: 2rem;font-size:1rem}.btn-compact.btn-action:before{font-size:1em;font-weight:400}.btn-compact.btn-secondary{--colour-btn-bg: transparent;--colour-btn-border: transparent;border-color:rgba(0,0,0,0)}.btn-compact.btn-secondary:not([class*=colour-]){--colour: var(--colour-light)}.btn-compact.btn-secondary:is(:hover,:focus,.hover,:active,.active,[aria-expanded],:focus-within):not([disabled]):not(.btn-collapse){background-color:var(--colour);color:var(--colour-primary-theme);border-color:var(--colour)}.btn-compact.btn-secondary:is(:hover,:focus,.hover,:active,.active,[aria-expanded],:focus-within):not([disabled]):not(.btn-collapse):is(.colour-primary,.colour-dark,.colour-danger,.colour-black){color:var(--colour-inverted)}.btn-compact[data-number]{position:relative}.btn-compact[data-number]:after{content:attr(data-number);position:absolute;top:.5em;z-index:99;background:var(--colour-danger);height:1.5em;width:1.5em;border-radius:50%;text-indent:0;left:50%;font-size:.5em;line-height:1.5em;text-align:center;color:#fff;letter-spacing:-0.1em;font-family:arial,sans-serif}[class*=bg-]:not(.bg-info):not(.bg-success):not(.bg-light):not(.bg-warning):not(.bg-white):not(.bg-admin):not(.bg-canvas):not(.bg-canvas-2):not(.prevent-invert) .btn-compact.btn-secondary:not(:hover,:focus,.hover,:focus-within):not(.btn-collapse),.invert-colours .btn-compact.btn-secondary:not(:hover,:focus,.hover,:focus-within):not(.btn-collapse){background-color:var(--colour-white) !important;border-color:var(--colour-white) !important;color:var(--colour-heading)}[class*=bg-]:not(.bg-info):not(.bg-success):not(.bg-light):not(.bg-warning):not(.bg-white):not(.bg-admin):not(.bg-canvas):not(.bg-canvas-2):not(.prevent-invert) .btn-compact.btn-secondary:is(:hover,:focus,.hover,:focus-within):not([disabled]):not(.btn-collapse),.invert-colours .btn-compact.btn-secondary:is(:hover,:focus,.hover,:focus-within):not([disabled]):not(.btn-collapse){background-color:rgba(0,0,0,0);border-color:var(--colour-white) !important;color:var(--colour-white)}[class*=bg-]:not(.bg-info):not(.bg-success):not(.bg-light):not(.bg-warning):not(.bg-white):not(.bg-admin):not(.bg-canvas):not(.bg-canvas-2):not(.prevent-invert) .btn-compact.btn-secondary[disabled],.invert-colours .btn-compact.btn-secondary[disabled]{background-color:var(--colour-white) !important;border-color:var(--colour-white) !important;color:var(--colour-heading) !important}.btn-compact:is(.fa-left,.fa-chevron-left,.fa-right,.fa-chevron-right,.fa-up,.fa-chevron-up,.fa-down,.fa-chevron-down,.fa-plus,.fa-bars,.fa-edit){--iso-display: block;--iso-font-size: 1.5rem;--iso-border-radius: 50%;--iso-text-indent: -500px}@container style(--font-body){.btn-compact{font-size:var(--iso-font-size, 0.6rem) !important;text-indent:var(--iso-text-indent, 0px);white-space:initial}.btn-compact:not(.btn-action){border-radius:var(--iso-border-radius, 0.25rem) !important}.btn-compact:before{display:var(--iso-display, none);font-family:monospace !important;content:var(--iso) !important}}@container style(--fa-font-regular){.btn-compact{text-indent:-500px;font-size:1rem !important}.btn-compact:not(.btn-action){border-radius:50% !important}.btn-compact:before{font-family:"Font Awesome 6 Pro" !important;content:var(--fa) !important;display:block}}}@layer elements{.btn[popovertarget]{position:relative;anchor-name:--button2}.btn[popovertarget]>.fa-chevron-down{display:none}.btn[popovertarget]:not(:has(i)):after{content:"";display:inline-block;margin-right:.25em;margin-left:1em;height:.8em;width:.8em;z-index:var(--index-focus);background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;transform:rotate(90deg)}.btn[popovertarget][aria-pressed]:after{transform:rotate(270deg)}.btn:has(select){position:relative;padding:0;max-width:fit-content;min-width:fit-content;width:fit-content}.btn:has(select) select{all:unset !important;padding:var(--btn-padding-block) var(--btn-padding-inline) !important;padding-right:calc(var(--btn-padding-inline) + 2rem) !important;border-radius:1.5rem !important;appearance:none !important;background:none !important;border:none !important;color:currentColor !important;display:block;outline:none;font-weight:inherit !important;font-size:var(--btn-font-size) !important;line-height:var(--btn-line-height) !important;field-sizing:content !important;appearance:base-select !important}.btn:has(select) select option{font-size:1rem;text-align:left;color:var(--colour-primary);padding-inline:var(--menu-item-padding, 0.5rem);padding-block:var(--menu-item-padding, 0.5rem) !important;border-radius:.25rem !important}.btn:has(select) select option:not(:last-child){margin:var(--menu-item-margin, 0 0 0.25rem 0) !important}.btn:has(select) select option:hover{background:var(--colour-light) !important}.btn:has(select) select option:after{content:attr(data-email)}.btn:has(select) select::picker-icon{display:none}.btn:has(select) select::picker(select){appearance:base-select;background:var(--menu-bg, canvas);margin-block:var(--menu-margin, 0.25rem);padding:var(--menu-padding, 0.5rem) !important;border:none !important;border-radius:.5rem;box-shadow:0px 2px 9px rgba(0,0,0,.1);font-size:1rem}.btn:has(select) hr{height:1px !important;background-color:var(--menu-hr-border-color, var(--border-color, grey)) !important;width:100%;margin:var(--menu-item-margin, 0 0 0.25rem 0) !important;padding:0 !important}.btn:has(select) select option::checkmark{display:none}.btn:has(select) select selectedcontent span{display:none}.btn:has(select):after{position:absolute;top:0.625rem;right:1.5rem;content:"";height:1.5rem;width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem;transform:rotate(90deg);pointer-events:none}.btn-action:has(select){padding-block:0;padding-right:2rem;font-size:1em}.btn-action:has(select) select{margin:0rem 0rem !important;padding-right:2rem !important;margin-right:-2rem !important;font-size:1rem !important}.btn-action:has(select):after{top:.2rem;right:.5rem}}@layer elements{.btn__group{display:flex;flex-direction:column;row-gap:var(--gap);reading-flow:source-order;margin-bottom:1.5rem;.btn-compact{max-width:fit-content;margin-inline:auto}}:where(.btn__group,iam-modal){reading-flow:source-order;.btn{margin-inline-end:0;width:100%;max-width:100%;text-align:center;white-space:normal;margin:0;&:not(:last-child){margin-right:0}}.btn-tertiary{max-width:fit-content;margin-inline:auto;order:3;reading-order:3}.btn-secondary{order:2;reading-order:2}.btn-primary{order:1;reading-order:1;margin:0;&:not(:last-child){margin:0}}}:is(iam-form,form) .btn__group{padding-top:1rem}@container (min-width: 36em){.btn__group{flex-direction:row;row-gap:0;gap:var(--gap);flex-wrap:wrap;.btn-tertiary{max-width:fit-content;margin-inline:0;margin-block:auto;order:1}.btn-secondary{order:2}.btn-primary{order:3}.btn-compact{margin-inline:0;margin-block:auto}}:where(iam-modal,.btn__group){.btn{max-width:fit-content;white-space:nowrap;margin-block:auto}}.btn__group{.btn-tertiary{reading-order:1}.btn-secondary{reading-order:2}.btn-primary{reading-order:3}}iam-modal{.btn-tertiary{reading-order:3;order:1}.btn-secondary{order:2;reading-order:2}.btn-primary{order:3;reading-order:1}}.btn__group.text-end{justify-content:flex-end}:is(iam-form,form) .btn__group{justify-content:flex-end;padding-top:3rem}iam-modal .btn__group:last-child .btn,dialog .btn__group:last-child .btn{margin-bottom:0}}}:host{overscroll-behavior:contain;display:block;container-type:inline-size}::slotted(dialog){display:contents !important}::slotted(button){margin:0 !important}@layer components{dialog[open]{width:90vw;max-width:20.25rem;max-height:min(90vh,47rem);overscroll-behavior:contain;overflow-y:hidden}@media screen and (min-width: 36em){dialog[open]{--dialog-padding: 2rem;min-width:20.9375rem;width:fit-content;max-width:42.875rem}}@media screen and (min-width: 62em){dialog[open]{min-width:28.375rem;width:fit-content;max-width:46rem}}dialog[open]::before{content:"";top:.75rem;bottom:auto;left:0;right:.5rem;height:calc(var(--dialog-padding) - .75rem);position:absolute;display:block;background:linear-gradient(0deg, transparent 0%, var(--colour-canvas-2) 100%);z-index:2}dialog[open]::after{content:"";top:auto;bottom:.75rem;left:0;right:6px;height:calc(var(--dialog-padding) - .75rem);position:absolute;display:block;background:linear-gradient(180deg, transparent 0%, var(--colour-canvas-2) 100%);z-index:2}dialog[open] .scroll{margin-inline:calc(var(--dialog-padding)*-1);margin-block:calc((var(--dialog-padding) - .75rem)*-1);padding-inline:var(--dialog-padding);padding-block:calc(var(--dialog-padding) - .75rem);height:100%;max-height:100%;overflow:auto;overscroll-behavior:contain;position:relative;z-index:1}dialog[open] .scroll .fa-circle{display:none}dialog[open]>button:first-child{position:absolute;top:.5rem;right:.5rem;z-index:var(--index-floating);margin:0}dialog[open]>button:first-child:not(:hover,:focus,:active){background-color:var(--colour-canvas)}@container (min-width: 36em){dialog[open]>button:first-child{top:calc(var(--dialog-padding) - .75rem);right:calc(var(--dialog-padding) - .75rem)}}dialog[open]:has(.youtube-embed){padding:0 !important}dialog[open].dialog--fullwidth{max-width:69.5rem}dialog[open] .btn__group{display:none}@media screen and (min-width: 36em){:host(.modal--sm) dialog[open]{min-width:20.9375rem;width:20.9375rem;max-width:20.9375rem}}@media screen and (min-width: 62em){:host(.modal--sm) dialog[open]{min-width:28.375rem;width:28.375rem;max-width:28.375rem}}@media screen and (min-width: 36em){:host(.modal--lg) dialog[open]{min-width:42.875rem;width:42.875rem;max-width:42.875rem}}@media screen and (min-width: 62em){:host(.modal--lg) dialog[open]{min-width:46rem;width:46rem;max-width:46rem}}dialog::backdrop{background:rgba(0,0,0,.3);backdrop-filter:blur(4px);overscroll-behavior:contain}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background-color:rgba(0,0,0,0);border-top:4px solid rgba(0,0,0,0)}::-webkit-scrollbar-thumb{background-color:#c1c1c1;width:6px;border-radius:3px}::slotted(p:last-child){padding-bottom:0 !important}::slotted(p:last-child){padding-bottom:0 !important}::slotted(:last-child){margin-bottom:0 !important}:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open]{text-align:center}:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open] .scroll>.fa-circle{display:var(--fa-display, block);line-height:1;font-size:3rem;height:3rem;width:3rem;margin-top:0;margin-bottom:1.5rem;line-height:1;color:var(--colour-heading);margin-inline:auto}@media screen and (min-width: 62em){:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open] .scroll>.fa-circle{font-size:4rem;height:4rem;width:4rem}}:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open] .scroll>.fa-circle:has(>i){position:relative}:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open] .scroll>.fa-circle>i:before{position:absolute;top:0;left:50%;transform:scale(0.5) translate(-100%, 0)}:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open]>button:first-child{display:none}:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open] .btn__group{display:flex;justify-content:center;padding-top:2rem;margin-bottom:0}:host([data-type=acknowledgement]) dialog[open] .btn__group [data-cancel]{display:none}}@layer components{dialog{width:calc(100% - 6rem) !important;max-width:50rem !important;padding:0;aspect-ratio:16/9}dialog[open]::before{display:none}dialog[open]::after{display:none}::slotted(.embed){aspect-ratio:16/9;width:100%}}/*# sourceMappingURL=assets/css/components/video-modal.component.css.map */
|
|
8
|
+
@layer elements{body:not(.js-enabled) dialog:not([open]):target{display:block}dialog,[popover]{--dialog-padding: 1.5rem;--mh-padding-inline: var(--dialog-padding);color:inherit;width:fit-content;height:fit-content;border:none;overscroll-behavior:contain;background:var(--colour-canvas-2);box-shadow:0px 2px 9px rgba(0,0,0,.11);border-radius:.625rem;padding:var(--dialog-padding);outline:var(--contrast-outline-width, 0px) solid var(--colour-primary)}dialog>*:last-child,[popover]>*:last-child{margin-bottom:0}dialog>:is(p):last-child,[popover]>:is(p):last-child{padding-bottom:0}dialog::backdrop{background:rgba(0,0,0,.3);backdrop-filter:blur(4px);overscroll-behavior:contain}dialog[open],[popover]:popover-open{display:flex;flex-direction:column}*:not(.dialog__wrapper)>dialog[open],*:not(.dialog__wrapper)>[popover]:popover-open{overflow-y:auto;width:90vw;max-width:20.25rem;max-height:min(90vh,47rem);overscroll-behavior:contain}@media screen and (min-width: 36em){*:not(.dialog__wrapper)>dialog[open],*:not(.dialog__wrapper)>[popover]:popover-open{min-width:20.9375rem;width:fit-content;max-width:42.875rem}}@media screen and (min-width: 62em){*:not(.dialog__wrapper)>dialog[open],*:not(.dialog__wrapper)>[popover]:popover-open{min-width:28.375rem;width:fit-content;max-width:46rem}}details.bg-light{margin-inline:calc(var(--dialog-padding)*-1);padding-inline:var(--dialog-padding)}}@layer elements{*,*::before,*::after{box-sizing:border-box}button{border-radius:0;text-transform:none;margin:0;font-family:inherit;font-size:inherit;line-height:inherit}[role=button]{cursor:pointer}button:focus:not(:focus-visible){outline:0}:is(button,[type=button],[type=reset],[type=submit]){-webkit-appearance:button}:is(button,[type=button],[type=reset],[type=submit]):not(:disabled){cursor:pointer}.btn{--btn-margin: 1rem;--btn-padding-block: 0.75rem;--btn-padding-inline: 2.5rem;--btn-border-width: 2px;--btn-font-size: 1.125rem;--btn-line-height: 1.25rem;display:inline-block;font-weight:bold;text-align:left;text-decoration:none;vertical-align:middle;cursor:pointer;user-select:none;color:var(--colour-btn);font-size:var(--btn-font-size);line-height:var(--btn-line-height);padding:var(--btn-padding-block) var(--btn-padding-inline);border-radius:1.5rem;margin-bottom:var(--btn-margin);background:none;transition:border .5s,background .5s,color .5s;height:auto;max-width:fit-content;appearance:none;white-space:nowrap}@media screen and (min-width: 36em){.btn{--btn-margin: 1.5rem}}.btn:not(.btn-secondary)[class*=colour-]{--colour-btn-bg: var(--colour);--colour-btn-border: var(--colour)}.btn:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){--colour-btn: #fcfcfc}.btn:not(.border-0){background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border)}.btn:not(:last-child){margin-right:var(--btn-margin)}a:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn,.btn:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){outline:0;text-decoration:none;background:var(--colour-btn-bg-hover);color:var(--colour-btn-hover);border-radius:1.5rem}a:is(:active,.active):not([disabled]) .btn,.btn:is(:active,.active):not([disabled]){filter:brightness(85%);transition:background .1s,color .1s;color:var(--colour-btn);border-radius:1.5rem}a:disabled .btn,.btn:disabled,[disabled] .btn,.btn[disabled]{opacity:.4;cursor:not-allowed}.btn.colour-success{--colour-btn-bg-hover: var(--colour);--colour-btn-border-hover: var(--colour);--colour-btn-hover: var(--colour-primary-theme);position:relative;padding-left:3.5rem;padding-right:3.5rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.colour-success,.btn.colour-success:is(:hover,:focus,.hover):not([disabled],:active,.active){padding-left:2.5rem;padding-right:2.5rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.colour-success:before,.btn.colour-success:is(:hover,:focus,.hover):not([disabled],:active,.active):before{content:"\uF00C";font-family:"Font Awesome 7 Pro";margin-right:1rem;font-style:inherit;width:1rem;display:inline-block;height:var(--btn-line-height);vertical-align:bottom}.btn.btn-sm{--btn-padding-block: 0.5rem;--btn-padding-inline: 2rem;--btn-margin: 0.5rem;--btn-font-size: 1rem}.btn[class*=fa-]:before{content:var(--fa);font-family:"Font Awesome 7 Pro";line-height:1em}.btn.btn[class*=fa-after]{padding-right:4rem}.btn.btn[class*=fa-after]:before{margin-right:0;margin-right:.375rem;position:absolute;right:1.5rem;top:50%;transform:translate(0, -50%)}.btn:not(.btn-compact):before{margin-right:1rem}.btn i[class*=fa-]{--fa-width: 1em;font-family:"Font Awesome 7 Pro";margin-right:1rem;line-height:1em;font-style:inherit}.btn i[class*=fa-]:not(:first-child){margin-left:1rem;margin-right:0}.btn.btn--prompt:after{content:"";height:var(--btn-line-height);width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.btn--prompt:after,.btn.btn--prompt:is(:hover,:focus,.hover):not([disabled],:active,.active):after{margin-left:1.5rem;margin-right:-0.5rem}.btn-filter:after{content:"\uF1DE";display:inline-block;margin-left:1em;margin-bottom:-0.15em;height:1em;width:1em;z-index:var(--index-focus);color:currentColor;font-weight:300;font-family:"Font Awesome 7 Pro"}}@layer elements{.btn-secondary{color:var(--colour-btn-secondary)}.btn-secondary:not(.border-0){background:var(--colour-btn-secondary-bg);border:2px solid var(--colour-btn-secondary-border)}a:is(:hover,:focus,.hover,:active,.active):not([disabled]) .btn-secondary,.btn-secondary:is(:hover,:focus,.hover,:focus-within,:active,.active):not([disabled]){background:var(--colour-btn-secondary-bg-hover);color:var(--colour-btn-secondary-hover)}}@layer elements{.btn.btn-tertiary{background-color:rgba(0,0,0,0);border:none;color:var(--colour-link);margin:0 var(--btn-margin) var(--btn-margin) 0;padding:0;font-size:1.125rem;font-weight:normal;line-height:1.5rem;min-height:1.5rem;position:relative}.btn.btn-tertiary:after{position:absolute;content:"";top:100%;left:50%;height:2px;width:100%;transform:translate(-50%, 0);background:var(--colour-underline);transition:width .5s}.btn.btn-tertiary.text-decoration-none:after{width:0%}.btn.btn-tertiary [class*=fa-]{margin-left:0;margin-right:.5rem}.btn.btn-tertiary [class*=fa-]:not(:first-child){margin-left:.5rem;margin-right:0}.btn.btn-tertiary:is(:hover,:focus,.hover,:focus-within):not([disabled],:disabled,:active,.active):after{width:60% !important}.btn.btn-tertiary:is(:active,.active):not([disabled],:disabled){color:var(--colour-active)}}@layer elements{.btn-action{--btn-border-width: 1px;--btn-padding-block: 0.3125rem /* 5px */;--btn-padding-inline: 0.3125rem /* 5px */;--btn-margin: 0.5rem;border-radius:.25rem !important;font-weight:400 !important;font-size:1rem;line-height:1.25rem;&:not(.btn-primary){color:var(--colour-heading)}&:not(.btn-primary):not(.border-0){background-color:var(--colour-canvas-2);border:var(--btn-border-width) solid var(--colour-muted)}&.btn[class*=fa-]:before{content:var(--fa);margin-right:.375rem}a:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) &,&:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){background:var(--colour-btn-action-hover-bg)}.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) &,&.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){filter:brightness(90%);background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border);color:var(--colour-btn)}a:is(:active,.active):not([disabled]):not(.btn-primary) &,&:is(:active,.active):not([disabled]):not(.btn-primary){filter:brightness(85%);transition:all .1s;color:var(--colour-heading)}}.btn-action:not(.btn-compact).fa-compact-only:before{display:none !important}}@layer elements{.btn-compact{--compact-size: 3rem;padding:0 !important;margin-bottom:.5rem;text-align:center;width:var(--compact-size);min-width:var(--compact-size);max-width:var(--compact-size);height:var(--compact-size) !important;min-height:var(--compact-size) !important;max-height:var(--compact-size) !important;align-content:center;line-height:1 !important;text-indent:-500px;overflow:hidden;position:relative;font-size:1rem;&:not(:last-child){margin-right:.5rem}&:before{content:var(--fa);position:absolute;display:block;top:0;left:0;width:100%;height:100%;text-indent:0;line-height:calc(var(--compact-size) - .25rem);font-weight:900}&[class*=fa-]:before{line-height:calc(var(--compact-size) - .25rem)}&.btn-sm{--compact-size: 2.5rem;font-size:1rem;padding:0 !important}&.btn-action{--compact-size: 2rem;font-size:1rem;&:before{font-size:1em;font-weight:400}}&.btn-secondary{--colour-btn-bg: transparent;--colour-btn-border: transparent;border-color:transparent;&:not([class*=colour-]){--colour: var(--colour-light)}}&.btn-secondary:is(:hover,:focus,.hover,:active,.active,[aria-expanded],:focus-within):not([disabled]):not(.btn-collapse){background-color:var(--colour);color:var(--colour-primary-theme);border-color:var(--colour);&:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){color:var(--colour-inverted)}}&[data-number]{position:relative}&[data-number]:after{content:attr(data-number);position:absolute;top:.5em;z-index:99;background:var(--colour-danger);height:1.5em;width:1.5em;border-radius:50%;text-indent:0;left:50%;font-size:.5em;line-height:1.5em;text-align:center;color:white;letter-spacing:-0.1em;font-family:arial,sans-serif}}@container style(--theme: dark){&[class*=fa-]:before{color:white}}.btn-compact{&:is(.fa-left,.fa-chevron-left,.fa-right,.fa-chevron-right,.fa-up,.fa-chevron-up,.fa-down,.fa-chevron-down,.fa-plus,.fa-bars,.fa-edit,.fa-envelope,.fa-calendar){--iso-display: block;--iso-font-size: 1.5rem;--iso-border-radius: 50%;--iso-text-indent: -500px}}@container style(--font-body){.btn-compact{font-size:var(--iso-font-size, 0.6rem) !important;text-indent:var(--iso-text-indent, 0px);white-space:initial;&:not(.btn-action){border-radius:var(--iso-border-radius, 0.25rem) !important}&:before{display:var(--iso-display, none);font-family:monospace !important;content:var(--iso) !important}}}@container style(--fa-font-regular){.btn-compact{text-indent:-500px;font-size:1rem !important;&:not(.btn-action){border-radius:50% !important}&:before{font-family:"Font Awesome 7 Pro" !important;content:var(--fa) !important;display:block}}}}@layer elements{.btn[popovertarget]{position:relative;anchor-name:--button2}.btn[popovertarget]>.fa-chevron-down{display:none}.btn[popovertarget]:not(:has(i)):after{content:"";display:inline-block;margin-right:.25em;margin-left:1em;height:.8em;width:.8em;z-index:var(--index-focus);background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;transform:rotate(90deg)}.btn[popovertarget][aria-pressed]:after{transform:rotate(270deg)}.btn:has(select){position:relative;padding:0;max-width:fit-content;min-width:fit-content;width:fit-content}.btn:has(select) select{all:unset !important;padding:var(--btn-padding-block) var(--btn-padding-inline) !important;padding-right:calc(var(--btn-padding-inline) + 2rem) !important;border-radius:1.5rem !important;appearance:none !important;background:none !important;border:none !important;color:currentColor !important;display:block;outline:none;font-weight:inherit !important;font-size:var(--btn-font-size) !important;line-height:var(--btn-line-height) !important;field-sizing:content !important;appearance:base-select !important}.btn:has(select) select option{font-size:1rem;text-align:left;color:var(--colour-primary);padding-inline:var(--menu-item-padding, 0.5rem);padding-block:var(--menu-item-padding, 0.5rem) !important;border-radius:.25rem !important}.btn:has(select) select option:not(:last-child){margin:var(--menu-item-margin, 0 0 0.25rem 0) !important}.btn:has(select) select option:hover{background:var(--colour-light) !important}.btn:has(select) select option:after{content:attr(data-email)}.btn:has(select) select::picker-icon{display:none}.btn:has(select) select::picker(select){appearance:base-select;background:var(--menu-bg, canvas);margin-block:var(--menu-margin, 0.25rem);padding:var(--menu-padding, 0.5rem) !important;border:none !important;border-radius:.5rem;box-shadow:0px 2px 9px rgba(0,0,0,.1);font-size:1rem}.btn:has(select) hr{height:1px !important;background-color:var(--menu-hr-border-color, var(--border-color, grey)) !important;width:100%;margin:var(--menu-item-margin, 0 0 0.25rem 0) !important;padding:0 !important}.btn:has(select) select option::checkmark{display:none}.btn:has(select) select selectedcontent span{display:none}.btn:has(select):after{position:absolute;top:.625rem;right:1.5rem;content:"";height:1.5rem;width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem;transform:rotate(90deg);pointer-events:none}.btn-action:has(select){padding-block:0;padding-right:2rem;font-size:1em}.btn-action:has(select) select{margin:0rem 0rem !important;padding-right:2rem !important;margin-right:-2rem !important;font-size:1rem !important}.btn-action:has(select):after{top:.2rem;right:.5rem}}@layer elements{.btn__group{display:flex;flex-direction:column;row-gap:var(--gap);reading-flow:source-order;margin-bottom:1.5rem;.btn-compact{max-width:fit-content;margin-inline:auto}}:where(.btn__group,iam-modal){reading-flow:source-order;.btn{margin-inline-end:0;width:100%;max-width:100%;text-align:center;white-space:normal;margin:0;&:not(:last-child){margin-right:0}}.btn-tertiary{max-width:fit-content;margin-block:0 !important;margin-inline:auto !important;order:3;reading-order:3}.btn-secondary{order:2;reading-order:2}.btn-primary{order:1;reading-order:1;margin:0;&:not(:last-child){margin:0}}}:is(iam-form,form) .btn__group{padding-top:1rem}@container (min-width: 36em){.btn__group{flex-direction:row;row-gap:0;gap:var(--gap);flex-wrap:wrap;.btn-tertiary{max-width:fit-content;margin-inline:0 !important;margin-block:auto;order:1}.btn-secondary{order:2}.btn-primary{order:3}.btn-compact{margin-inline:0;margin-block:auto}}:where(iam-modal,.btn__group){.btn{max-width:fit-content;white-space:nowrap;margin-block:auto}}.btn__group{.btn-tertiary{reading-order:1}.btn-secondary{reading-order:2}.btn-primary{reading-order:3}}iam-modal{.btn-tertiary{reading-order:3;order:1}.btn-secondary{order:2;reading-order:2}.btn-primary{order:3;reading-order:1}}.btn__group.text-end{justify-content:flex-end}:is(iam-form,form) .btn__group{justify-content:flex-end;padding-top:3rem}iam-modal .btn__group:last-child .btn,dialog .btn__group:last-child .btn{margin-bottom:0}}}:host{overscroll-behavior:contain;display:block;container-type:inline-size}::slotted(dialog){display:contents !important}::slotted(button){margin:0 !important}@layer components{dialog[open]{width:90vw;max-width:20.25rem;max-height:min(90vh,47rem);overscroll-behavior:contain;overflow-y:hidden}@media screen and (min-width: 36em){dialog[open]{--dialog-padding: 2rem;min-width:20.9375rem;width:fit-content;max-width:42.875rem}}@media screen and (min-width: 62em){dialog[open]{min-width:28.375rem;width:fit-content;max-width:46rem}}dialog[open]::before{content:"";top:.75rem;bottom:auto;left:0;right:.5rem;height:calc(var(--dialog-padding) - .75rem);position:absolute;display:block;background:linear-gradient(0deg, transparent 0%, var(--colour-canvas-2) 100%);z-index:2}dialog[open]::after{content:"";top:auto;bottom:.75rem;left:0;right:6px;height:calc(var(--dialog-padding) - .75rem);position:absolute;display:block;background:linear-gradient(180deg, transparent 0%, var(--colour-canvas-2) 100%);z-index:2}dialog[open] .scroll{margin-inline:calc(var(--dialog-padding)*-1);margin-block:calc((var(--dialog-padding) - .75rem)*-1);padding-inline:var(--dialog-padding);padding-block:calc(var(--dialog-padding) - .75rem);height:100%;max-height:100%;overflow:auto;overscroll-behavior:contain;position:relative;z-index:1}dialog[open] .scroll .fa-circle{display:none}dialog[open]>button:first-child{position:absolute;top:.5rem;right:.5rem;z-index:var(--index-floating);margin:0}dialog[open]>button:first-child:not(:hover,:focus,:active){background-color:var(--colour-canvas)}@container (min-width: 36em){dialog[open]>button:first-child{top:calc(var(--dialog-padding) - .75rem);right:calc(var(--dialog-padding) - .75rem)}}dialog[open]:has(.youtube-embed){padding:0 !important}dialog[open].dialog--fullwidth{max-width:69.5rem}dialog[open] .btn__group{display:none}@media screen and (min-width: 36em){:host(.modal--sm) dialog[open]{min-width:20.9375rem;width:20.9375rem;max-width:20.9375rem}}@media screen and (min-width: 62em){:host(.modal--sm) dialog[open]{min-width:28.375rem;width:28.375rem;max-width:28.375rem}}@media screen and (min-width: 36em){:host(.modal--lg) dialog[open]{min-width:42.875rem;width:42.875rem;max-width:42.875rem}}@media screen and (min-width: 62em){:host(.modal--lg) dialog[open]{min-width:46rem;width:46rem;max-width:46rem}}dialog::backdrop{background:rgba(0,0,0,.3);backdrop-filter:blur(4px);overscroll-behavior:contain}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background-color:rgba(0,0,0,0);border-top:4px solid rgba(0,0,0,0)}::-webkit-scrollbar-thumb{background-color:#c1c1c1;width:6px;border-radius:3px}::slotted(p:last-child){padding-bottom:0 !important}::slotted(p:last-child){padding-bottom:0 !important}::slotted(:last-child){margin-bottom:0 !important}:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open]{text-align:center}:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open] .scroll>.fa-circle{display:var(--fa-display, block);line-height:1;font-size:3rem;height:3rem;width:3rem;margin-top:0;margin-bottom:1.5rem;line-height:1;color:var(--colour-heading);margin-inline:auto}@media screen and (min-width: 62em){:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open] .scroll>.fa-circle{font-size:4rem;height:4rem;width:4rem}}:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open] .scroll>.fa-circle:has(>i){position:relative}:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open] .scroll>.fa-circle>i:before{position:absolute;top:0;left:50%;transform:scale(0.5) translate(-100%, 0)}:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open]>button:first-child{display:none}:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open] .btn__group{display:flex;justify-content:center;padding-top:2rem;margin-bottom:0}:host([data-type=acknowledgement]) dialog[open] .btn__group [data-cancel]{display:none}}@layer components{dialog{width:calc(100% - 6rem) !important;max-width:50rem !important;padding:0;aspect-ratio:16/9}dialog[open]::before{display:none}dialog[open]::after{display:none}::slotted(.embed){aspect-ratio:16/9;width:100%}}/*# sourceMappingURL=assets/css/components/video-modal.component.css.map */
|
|
9
9
|
|
|
10
10
|
</style>
|
|
11
11
|
|
|
12
|
-
<link rel="stylesheet" href="https://kit.fontawesome.com/
|
|
12
|
+
<link rel="stylesheet" href="https://kit.fontawesome.com/8bd0fca975.css" crossorigin="anonymous" />
|
|
13
13
|
|
|
14
14
|
<dialog>
|
|
15
15
|
${w}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"video-modal.component.min.js","sources":["../_global.js","../../modules/videos.js","../../modules/modal.js","video-modal.component.js"],"sourcesContent":["export const trackComponentRegistered = (componentName) => {\n // Data layer Web component created\n window.dataLayer = window.dataLayer || [];\n window.dataLayer.push({\n event: 'customElementRegistered',\n element: componentName,\n });\n};\nexport const trackComponent = (component, componentName, trackEvents) => {\n // Data layer Web component created\n window.dataLayer = window.dataLayer || [];\n window.dataLayer.push({\n event: 'customElementAdded',\n element: componentName,\n });\n trackEvents.forEach((eventName) => {\n component.addEventListener(eventName, function (event) {\n const eventDetails = {\n event: eventName,\n element: componentName,\n target: event.target,\n };\n Object.keys(event.detail).forEach((eventKey) => {\n const eventDetail = event.detail[eventKey];\n eventDetails[eventKey] = eventDetail;\n });\n window.dataLayer.push(eventDetails);\n });\n });\n return true;\n};\n","var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nconst videoSupport = (body) => __awaiter(void 0, void 0, void 0, function* () {\n if (document.querySelector('.youtube-link[data-youtube]') && !document.body.classList.contains('youtubeLoaded')) {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const loaded = yield loadYouTubeScripts();\n }\n setTimeout(() => __awaiter(void 0, void 0, void 0, function* () {\n if (document.querySelector('.youtube-link[data-youtube]') && !document.body.classList.contains('youtubeLoaded')) {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const loaded = yield loadYouTubeScripts();\n }\n }), '2000');\n body.addEventListener('click', (event) => __awaiter(void 0, void 0, void 0, function* () {\n let target = event.target.closest('.youtube-link[data-youtube]');\n if (!target) {\n target = event.target.closest('.vimeo-link[data-vimeo]');\n }\n if (target && target.hasAttribute('data-youtube')) {\n event.preventDefault();\n if (!document.body.classList.contains('youtubeLoaded')) {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const loaded = yield loadYouTubeScripts();\n }\n const link_id = 'youtube-' + target.getAttribute('data-youtube');\n if (!document.getElementById(`${link_id}-dialog`)) {\n document.body.insertAdjacentHTML('beforeend', `<dialog id=\"${link_id}-dialog\"><div class=\"embed\" id=\"${link_id}\"></div></dialog>`);\n }\n const dialog = document.getElementById(`${link_id}-dialog`);\n const embed = document.getElementById(link_id);\n const customEvent = new CustomEvent('play-video', {\n detail: { 'Video Type': 'YoutTube', ID: target.getAttribute('data-youtube') },\n });\n target.dispatchEvent(customEvent);\n window.dataLayer.push(customEvent.detail);\n createYoutTubeVideo(embed, target.getAttribute('data-youtube'));\n dialog.showModal();\n dialog.addEventListener('close', () => {\n if (window.player[embed.getAttribute('id')] &&\n typeof window.player[embed.getAttribute('id')].pauseVideo == 'function') {\n window.player[embed.getAttribute('id')].pauseVideo();\n }\n const customEvent = new CustomEvent('close-video', {\n detail: { 'Video Type': 'YoutTube', ID: target.getAttribute('data-youtube') },\n });\n target.dispatchEvent(customEvent);\n window.dataLayer.push(customEvent.detail);\n });\n }\n else if (target && target.hasAttribute('data-vimeo')) {\n event.preventDefault();\n const link_id = 'vimeo-' + target.getAttribute('data-youtube');\n if (!document.getElementById(`${link_id}-dialog`)) {\n document.body.insertAdjacentHTML('beforeend', `<dialog id=\"${link_id}-dialog\"><div class=\"embed\" id=\"${link_id}\"></div></dialog>`);\n }\n const dialog = document.getElementById(`${link_id}-dialog`);\n const embed = document.getElementById(link_id);\n const videoId = target.getAttribute('data-vimeo');\n const customEvent = new CustomEvent('play-video', {\n detail: { 'Video Type': 'Vimeo', ID: videoId },\n });\n target.dispatchEvent(customEvent);\n window.dataLayer.push(customEvent.detail);\n if (!embed.querySelector('iframe'))\n embed.innerHTML = `<iframe src=\"https://player.vimeo.com/video/${videoId}?autoplay=1\" width=\"100%\" height=\"100%\" frameborder=\"0\" allow=\"autoplay; encrypted-media\" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>`;\n dialog.showModal();\n dialog.addEventListener('close', () => {\n embed.innerHTML = ``; // Remove the video since we cant pause it\n const customEvent = new CustomEvent('close-video', {\n detail: { 'Video Type': 'Vimeo', ID: target.getAttribute('data-vimeo') },\n });\n target.dispatchEvent(customEvent);\n window.dataLayer.push(customEvent.detail);\n });\n }\n }));\n});\nexport const loadYouTubeScripts = () => __awaiter(void 0, void 0, void 0, function* () {\n return new Promise((resolve, reject) => {\n const image = new Image();\n image.onload = function () {\n // This code loads the IFrame Player API code asynchronously.\n const tag = document.createElement('script');\n tag.src = 'https://www.youtube.com/iframe_api';\n const firstScriptTag = document.getElementsByTagName('script')[0];\n firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);\n document.body.classList.add('youtubeLoaded');\n resolve(true);\n };\n image.onerror = function () {\n reject(false);\n };\n image.src = 'https://youtube.com/favicon.ico';\n });\n});\nexport const createYoutTubeVideo = (target, video_id) => __awaiter(void 0, void 0, void 0, function* () {\n if (typeof window.player == 'undefined') {\n window.player = [];\n }\n //const link_id = target.getAttribute('id');\n if (typeof window.player[video_id] != 'undefined' && typeof window.player[video_id].pauseVideo == 'function') {\n window.player[video_id].playVideo();\n return false;\n }\n // This function creates an <iframe> (and YouTube player) after the API code downloads.\n //function onYouTubeIframeAPIReady() {\n window.player[video_id] = new YT.Player(video_id, {\n height: '100%',\n width: '100%',\n videoId: video_id,\n playerVars: {\n modestbranding: 1,\n playsinline: 1,\n rel: 0,\n showinfo: 0,\n },\n events: {\n onReady: onPlayerReady,\n onStateChange: onPlayerStateChange,\n },\n });\n //}\n //onYouTubeIframeAPIReady();\n // The API will call this function when the video player is ready.\n function onPlayerReady(event) {\n // Play the video straight away\n event.target.playVideo();\n }\n // The API calls this function when the player's state changes.\n // The function indicates that when playing a video (state=1)\n let done = false;\n function onPlayerStateChange(event) {\n if (event.data == YT.PlayerState.PLAYING && !done) {\n const link = document.getElementById(video_id);\n link.classList.add('player-ready');\n done = true;\n }\n }\n});\nexport default videoSupport;\n","export const openModal = (id, modal) => {\n var _a;\n const dialog = (_a = modal.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('dialog');\n dialog === null || dialog === void 0 ? void 0 : dialog.showModal();\n dialog === null || dialog === void 0 ? void 0 : dialog.focus();\n const closeEvent = new CustomEvent('modal-opened', {\n bubbles: true,\n cancelable: true,\n detail: { modalId: id },\n });\n modal.dispatchEvent(closeEvent);\n window.dataLayer = window.dataLayer || [];\n window.dataLayer.push({\n event: 'openModal',\n id: id,\n });\n};\nexport const closeModal = (id, modal) => {\n var _a;\n const dialog = (_a = modal.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('dialog');\n dialog === null || dialog === void 0 ? void 0 : dialog.close();\n const closeEvent = new CustomEvent('modal-closed', {\n bubbles: true,\n cancelable: true,\n detail: { modalId: id },\n });\n modal.dispatchEvent(closeEvent);\n window.dataLayer = window.dataLayer || [];\n window.dataLayer.push({\n event: 'closeModal',\n id: id,\n });\n};\nexport const closeButtonHtml = `<button class=\"btn btn-compact btn-secondary fa-xmark-large\" data-close>Close</button>`;\n","var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nimport { trackComponentRegistered } from '../_global.js';\nimport { loadYouTubeScripts, createYoutTubeVideo } from '../../modules/videos.js';\nimport { openModal, closeModal, closeButtonHtml } from '../../modules/modal.js';\ntrackComponentRegistered('iam-video-modal');\nclass iamVideoCard extends HTMLElement {\n constructor() {\n super();\n this.openYoutubeVideo = (id, component) => __awaiter(this, void 0, void 0, function* () {\n const embed = component.querySelector('.embed');\n openModal(id, component);\n const youtubeId = component.getAttribute('data-youtube');\n let loaded;\n if (!document.body.classList.contains('youtubeLoaded')) {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n loaded = yield loadYouTubeScripts();\n }\n const customEvent = new CustomEvent('play-video', {\n detail: { 'Video Type': 'YoutTube', ID: youtubeId },\n });\n component.dispatchEvent(customEvent);\n const interval = setInterval(() => {\n if (typeof YT != \"undefined\") {\n clearInterval(interval);\n createYoutTubeVideo(embed, youtubeId);\n }\n }, 200);\n // Limit the number of calls\n setTimeout(function () {\n clearInterval(interval);\n }, 2000);\n });\n this.openVimeoVideo = (id, component) => __awaiter(this, void 0, void 0, function* () {\n const embed = component.querySelector('.embed');\n openModal(id, component);\n const vimeoId = component.getAttribute('data-vimeo');\n const customEvent = new CustomEvent('play-video', {\n detail: { 'Video Type': 'Vimeo', ID: vimeoId },\n });\n component.dispatchEvent(customEvent);\n window.dataLayer.push(customEvent.detail);\n if (!embed.querySelector('iframe'))\n embed.innerHTML = `<iframe src=\"https://player.vimeo.com/video/${vimeoId}?autoplay=1\" width=\"100%\" height=\"100%\" frameborder=\"0\" allow=\"autoplay; encrypted-media\" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>`;\n });\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location')\n ? document.body.getAttribute('data-assets-location')\n : '/assets';\n const loadCSS = `@import \"${assetLocation}/css/components/modal.component.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n \n ${loadCSS}\n </style>\n\n <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/26fdbf0179.css\" crossorigin=\"anonymous\" />\n\n <dialog>\n ${closeButtonHtml}\n <slot></slot>\n </dialog>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n return __awaiter(this, void 0, void 0, function* () {\n var _a;\n const id = this.getAttribute('id');\n const closeButton = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('[data-close]');\n this.innerHTML = `<div class=\"embed\"></div>`;\n const embed = this.querySelector('.embed');\n document.addEventListener('click', (e) => __awaiter(this, void 0, void 0, function* () {\n if (e.target.closest(`[command=\"show-modal\"][commandfor=\"${id}\"]`)) {\n e.preventDefault();\n if (this.hasAttribute('data-youtube')) {\n const youtubeId = this.getAttribute('data-youtube');\n embed === null || embed === void 0 ? void 0 : embed.setAttribute('id', youtubeId);\n this.openYoutubeVideo(id, this);\n }\n else if (this.hasAttribute('data-vimeo')) {\n this.openVimeoVideo(id, this);\n }\n }\n }));\n closeButton === null || closeButton === void 0 ? void 0 : closeButton.addEventListener('click', () => {\n closeModal(id, this);\n if (this.hasAttribute('data-youtube')) {\n const youtubeId = this.getAttribute('data-youtube');\n if (window.player[youtubeId] && typeof window.player[youtubeId].pauseVideo == 'function') {\n window.player[youtubeId].pauseVideo();\n }\n }\n else if (this.hasAttribute('data-vimeo')) {\n embed.innerHTML = ``; // Remove the video since we cant pause it\n const customEvent = new CustomEvent('close-video', {\n detail: { 'Video Type': 'Vimeo', ID: this.getAttribute('data-vimeo') },\n });\n this.dispatchEvent(customEvent);\n window.dataLayer.push(customEvent.detail);\n }\n });\n });\n }\n}\nexport default iamVideoCard;\n"],"names":["trackComponentRegistered","componentName","__awaiter","thisArg","_arguments","P","generator","adopt","value","resolve","reject","fulfilled","step","e","rejected","result","loadYouTubeScripts","image","tag","firstScriptTag","createYoutTubeVideo","target","video_id","onPlayerReady","onPlayerStateChange","event","done","openModal","id","modal","_a","dialog","closeEvent","closeModal","closeButtonHtml","iamVideoCard","component","embed","youtubeId","customEvent","interval","vimeoId","template","closeButton"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"video-modal.component.min.js","sources":["../_global.js","../../modules/videos.js","../../modules/modal.js","video-modal.component.js"],"sourcesContent":["export const trackComponentRegistered = (componentName) => {\n // Data layer Web component created\n window.dataLayer = window.dataLayer || [];\n window.dataLayer.push({\n event: 'customElementRegistered',\n element: componentName,\n });\n};\nexport const trackComponent = (component, componentName, trackEvents) => {\n // Data layer Web component created\n window.dataLayer = window.dataLayer || [];\n window.dataLayer.push({\n event: 'customElementAdded',\n element: componentName,\n });\n trackEvents.forEach((eventName) => {\n component.addEventListener(eventName, function (event) {\n const eventDetails = {\n event: eventName,\n element: componentName,\n target: event.target,\n };\n Object.keys(event.detail).forEach((eventKey) => {\n const eventDetail = event.detail[eventKey];\n eventDetails[eventKey] = eventDetail;\n });\n window.dataLayer.push(eventDetails);\n });\n });\n return true;\n};\n","var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nconst videoSupport = (body) => __awaiter(void 0, void 0, void 0, function* () {\n if (document.querySelector('.youtube-link[data-youtube]') && !document.body.classList.contains('youtubeLoaded')) {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const loaded = yield loadYouTubeScripts();\n }\n setTimeout(() => __awaiter(void 0, void 0, void 0, function* () {\n if (document.querySelector('.youtube-link[data-youtube]') && !document.body.classList.contains('youtubeLoaded')) {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const loaded = yield loadYouTubeScripts();\n }\n }), '2000');\n body.addEventListener('click', (event) => __awaiter(void 0, void 0, void 0, function* () {\n let target = event.target.closest('.youtube-link[data-youtube]');\n if (!target) {\n target = event.target.closest('.vimeo-link[data-vimeo]');\n }\n if (target && target.hasAttribute('data-youtube')) {\n event.preventDefault();\n if (!document.body.classList.contains('youtubeLoaded')) {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const loaded = yield loadYouTubeScripts();\n }\n const link_id = 'youtube-' + target.getAttribute('data-youtube');\n if (!document.getElementById(`${link_id}-dialog`)) {\n document.body.insertAdjacentHTML('beforeend', `<dialog id=\"${link_id}-dialog\"><div class=\"embed\" id=\"${link_id}\"></div></dialog>`);\n }\n const dialog = document.getElementById(`${link_id}-dialog`);\n const embed = document.getElementById(link_id);\n const customEvent = new CustomEvent('play-video', {\n detail: { 'Video Type': 'YoutTube', ID: target.getAttribute('data-youtube') },\n });\n target.dispatchEvent(customEvent);\n window.dataLayer.push(customEvent.detail);\n createYoutTubeVideo(embed, target.getAttribute('data-youtube'));\n dialog.showModal();\n dialog.addEventListener('close', () => {\n if (window.player[embed.getAttribute('id')] &&\n typeof window.player[embed.getAttribute('id')].pauseVideo == 'function') {\n window.player[embed.getAttribute('id')].pauseVideo();\n }\n const customEvent = new CustomEvent('close-video', {\n detail: { 'Video Type': 'YoutTube', ID: target.getAttribute('data-youtube') },\n });\n target.dispatchEvent(customEvent);\n window.dataLayer.push(customEvent.detail);\n });\n }\n else if (target && target.hasAttribute('data-vimeo')) {\n event.preventDefault();\n const link_id = 'vimeo-' + target.getAttribute('data-youtube');\n if (!document.getElementById(`${link_id}-dialog`)) {\n document.body.insertAdjacentHTML('beforeend', `<dialog id=\"${link_id}-dialog\"><div class=\"embed\" id=\"${link_id}\"></div></dialog>`);\n }\n const dialog = document.getElementById(`${link_id}-dialog`);\n const embed = document.getElementById(link_id);\n const videoId = target.getAttribute('data-vimeo');\n const customEvent = new CustomEvent('play-video', {\n detail: { 'Video Type': 'Vimeo', ID: videoId },\n });\n target.dispatchEvent(customEvent);\n window.dataLayer.push(customEvent.detail);\n if (!embed.querySelector('iframe'))\n embed.innerHTML = `<iframe src=\"https://player.vimeo.com/video/${videoId}?autoplay=1\" width=\"100%\" height=\"100%\" frameborder=\"0\" allow=\"autoplay; encrypted-media\" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>`;\n dialog.showModal();\n dialog.addEventListener('close', () => {\n embed.innerHTML = ``; // Remove the video since we cant pause it\n const customEvent = new CustomEvent('close-video', {\n detail: { 'Video Type': 'Vimeo', ID: target.getAttribute('data-vimeo') },\n });\n target.dispatchEvent(customEvent);\n window.dataLayer.push(customEvent.detail);\n });\n }\n }));\n});\nexport const loadYouTubeScripts = () => __awaiter(void 0, void 0, void 0, function* () {\n return new Promise((resolve, reject) => {\n const image = new Image();\n image.onload = function () {\n // This code loads the IFrame Player API code asynchronously.\n const tag = document.createElement('script');\n tag.src = 'https://www.youtube.com/iframe_api';\n const firstScriptTag = document.getElementsByTagName('script')[0];\n firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);\n document.body.classList.add('youtubeLoaded');\n resolve(true);\n };\n image.onerror = function () {\n reject(false);\n };\n image.src = 'https://youtube.com/favicon.ico';\n });\n});\nexport const createYoutTubeVideo = (target, video_id) => __awaiter(void 0, void 0, void 0, function* () {\n if (typeof window.player == 'undefined') {\n window.player = [];\n }\n //const link_id = target.getAttribute('id');\n if (typeof window.player[video_id] != 'undefined' && typeof window.player[video_id].pauseVideo == 'function') {\n window.player[video_id].playVideo();\n return false;\n }\n // This function creates an <iframe> (and YouTube player) after the API code downloads.\n //function onYouTubeIframeAPIReady() {\n window.player[video_id] = new YT.Player(video_id, {\n height: '100%',\n width: '100%',\n videoId: video_id,\n playerVars: {\n modestbranding: 1,\n playsinline: 1,\n rel: 0,\n showinfo: 0,\n },\n events: {\n onReady: onPlayerReady,\n onStateChange: onPlayerStateChange,\n },\n });\n //}\n //onYouTubeIframeAPIReady();\n // The API will call this function when the video player is ready.\n function onPlayerReady(event) {\n // Play the video straight away\n event.target.playVideo();\n }\n // The API calls this function when the player's state changes.\n // The function indicates that when playing a video (state=1)\n let done = false;\n function onPlayerStateChange(event) {\n if (event.data == YT.PlayerState.PLAYING && !done) {\n const link = document.getElementById(video_id);\n link.classList.add('player-ready');\n done = true;\n }\n }\n});\nexport default videoSupport;\n","export const openModal = (id, modal) => {\n var _a;\n const dialog = (_a = modal.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('dialog');\n dialog === null || dialog === void 0 ? void 0 : dialog.showModal();\n dialog === null || dialog === void 0 ? void 0 : dialog.focus();\n const closeEvent = new CustomEvent('modal-opened', {\n bubbles: true,\n cancelable: true,\n detail: { modalId: id },\n });\n modal.dispatchEvent(closeEvent);\n window.dataLayer = window.dataLayer || [];\n window.dataLayer.push({\n event: 'openModal',\n id: id,\n });\n};\nexport const closeModal = (id, modal) => {\n var _a;\n const dialog = (_a = modal.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('dialog');\n dialog === null || dialog === void 0 ? void 0 : dialog.close();\n const closeEvent = new CustomEvent('modal-closed', {\n bubbles: true,\n cancelable: true,\n detail: { modalId: id },\n });\n modal.dispatchEvent(closeEvent);\n window.dataLayer = window.dataLayer || [];\n window.dataLayer.push({\n event: 'closeModal',\n id: id,\n });\n};\nexport const closeButtonHtml = `<button class=\"btn btn-compact btn-secondary fa-xmark-large\" data-close>Close</button>`;\n","var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nimport { trackComponentRegistered } from '../_global.js';\nimport { loadYouTubeScripts, createYoutTubeVideo } from '../../modules/videos.js';\nimport { openModal, closeModal, closeButtonHtml } from '../../modules/modal.js';\ntrackComponentRegistered('iam-video-modal');\nclass iamVideoCard extends HTMLElement {\n constructor() {\n super();\n this.openYoutubeVideo = (id, component) => __awaiter(this, void 0, void 0, function* () {\n const embed = component.querySelector('.embed');\n openModal(id, component);\n const youtubeId = component.getAttribute('data-youtube');\n let loaded;\n if (!document.body.classList.contains('youtubeLoaded')) {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n loaded = yield loadYouTubeScripts();\n }\n const customEvent = new CustomEvent('play-video', {\n detail: { 'Video Type': 'YoutTube', ID: youtubeId },\n });\n component.dispatchEvent(customEvent);\n const interval = setInterval(() => {\n if (typeof YT != \"undefined\") {\n clearInterval(interval);\n createYoutTubeVideo(embed, youtubeId);\n }\n }, 200);\n // Limit the number of calls\n setTimeout(function () {\n clearInterval(interval);\n }, 2000);\n });\n this.openVimeoVideo = (id, component) => __awaiter(this, void 0, void 0, function* () {\n const embed = component.querySelector('.embed');\n openModal(id, component);\n const vimeoId = component.getAttribute('data-vimeo');\n const customEvent = new CustomEvent('play-video', {\n detail: { 'Video Type': 'Vimeo', ID: vimeoId },\n });\n component.dispatchEvent(customEvent);\n window.dataLayer.push(customEvent.detail);\n if (!embed.querySelector('iframe'))\n embed.innerHTML = `<iframe src=\"https://player.vimeo.com/video/${vimeoId}?autoplay=1\" width=\"100%\" height=\"100%\" frameborder=\"0\" allow=\"autoplay; encrypted-media\" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>`;\n });\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location')\n ? document.body.getAttribute('data-assets-location')\n : '/assets';\n const loadCSS = `@import \"${assetLocation}/css/components/modal.component.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n \n ${loadCSS}\n </style>\n\n <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/8bd0fca975.css\" crossorigin=\"anonymous\" />\n\n <dialog>\n ${closeButtonHtml}\n <slot></slot>\n </dialog>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n return __awaiter(this, void 0, void 0, function* () {\n var _a;\n const id = this.getAttribute('id');\n const closeButton = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('[data-close]');\n this.innerHTML = `<div class=\"embed\"></div>`;\n const embed = this.querySelector('.embed');\n document.addEventListener('click', (e) => __awaiter(this, void 0, void 0, function* () {\n if (e.target.closest(`[command=\"show-modal\"][commandfor=\"${id}\"]`)) {\n e.preventDefault();\n if (this.hasAttribute('data-youtube')) {\n const youtubeId = this.getAttribute('data-youtube');\n embed === null || embed === void 0 ? void 0 : embed.setAttribute('id', youtubeId);\n this.openYoutubeVideo(id, this);\n }\n else if (this.hasAttribute('data-vimeo')) {\n this.openVimeoVideo(id, this);\n }\n }\n }));\n closeButton === null || closeButton === void 0 ? void 0 : closeButton.addEventListener('click', () => {\n closeModal(id, this);\n if (this.hasAttribute('data-youtube')) {\n const youtubeId = this.getAttribute('data-youtube');\n if (window.player[youtubeId] && typeof window.player[youtubeId].pauseVideo == 'function') {\n window.player[youtubeId].pauseVideo();\n }\n }\n else if (this.hasAttribute('data-vimeo')) {\n embed.innerHTML = ``; // Remove the video since we cant pause it\n const customEvent = new CustomEvent('close-video', {\n detail: { 'Video Type': 'Vimeo', ID: this.getAttribute('data-vimeo') },\n });\n this.dispatchEvent(customEvent);\n window.dataLayer.push(customEvent.detail);\n }\n });\n });\n }\n}\nexport default iamVideoCard;\n"],"names":["trackComponentRegistered","componentName","__awaiter","thisArg","_arguments","P","generator","adopt","value","resolve","reject","fulfilled","step","e","rejected","result","loadYouTubeScripts","image","tag","firstScriptTag","createYoutTubeVideo","target","video_id","onPlayerReady","onPlayerStateChange","event","done","openModal","id","modal","_a","dialog","closeEvent","closeModal","closeButtonHtml","iamVideoCard","component","embed","youtubeId","customEvent","interval","vimeoId","template","closeButton"],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.
|
|
2
|
+
* iamKey v7.7.0
|
|
3
3
|
* Copyright 2022-2026 iamproperty
|
|
4
4
|
*/const o=i=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:i})};o("iam-word-count");class n extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const t=document.createElement("template");t.innerHTML=`
|
|
5
5
|
<style>
|
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
import { describe, it, expect } from './test.js';
|
|
2
|
+
import { isValidPostcode } from './helpers.js';
|
|
3
|
+
describe("MathUtils Tests", function () {
|
|
4
|
+
it('should pass', function () {
|
|
5
|
+
expect(1 === 1);
|
|
6
|
+
});
|
|
7
|
+
});
|
|
8
|
+
describe('The postcode helper function', () => {
|
|
9
|
+
// #region valid pattern variations
|
|
10
|
+
it('should return true when testing the postcode "ne33hd"', () => {
|
|
11
|
+
expect(isValidPostcode("ne33hd"));
|
|
12
|
+
});
|
|
13
|
+
it('should return true when testing the postcode "ne3 3hd"', () => {
|
|
14
|
+
expect(isValidPostcode("ne3 3hd"));
|
|
15
|
+
});
|
|
16
|
+
it('should return true when testing the postcode "NE3 3HD"', () => {
|
|
17
|
+
expect(isValidPostcode("NE3 3HD"));
|
|
18
|
+
});
|
|
19
|
+
it('should return true when testing the postcode "NE33HD"', () => {
|
|
20
|
+
expect(isValidPostcode("NE33HD"));
|
|
21
|
+
});
|
|
22
|
+
it('should return true when testing the postcode " NE33HD"', () => {
|
|
23
|
+
expect(isValidPostcode(" NE33HD"));
|
|
24
|
+
});
|
|
25
|
+
it('should return true when testing the postcode " NE33HD "', () => {
|
|
26
|
+
expect(isValidPostcode(" NE33HD "));
|
|
27
|
+
});
|
|
28
|
+
// #endregion
|
|
29
|
+
// #region Valid postcodes
|
|
30
|
+
it('should return true when testing the postcode "NE3 5DP"', () => {
|
|
31
|
+
expect(isValidPostcode("NE3 5DP"));
|
|
32
|
+
});
|
|
33
|
+
it('should return true when testing the postcode "CW11 1SX"', () => {
|
|
34
|
+
expect(isValidPostcode("CW11 1SX"));
|
|
35
|
+
});
|
|
36
|
+
it('should return true when testing the postcode "NE21 6RB"', () => {
|
|
37
|
+
expect(isValidPostcode("NE21 6RB"));
|
|
38
|
+
});
|
|
39
|
+
it('should return true when testing the postcode "SW1A 1AA"', () => {
|
|
40
|
+
expect(isValidPostcode("SW1A 1AA"));
|
|
41
|
+
});
|
|
42
|
+
it('should return true when testing the postcode "M1 1AE"', () => {
|
|
43
|
+
expect(isValidPostcode("M1 1AE"));
|
|
44
|
+
});
|
|
45
|
+
// #endregion
|
|
46
|
+
// incorrect pattern
|
|
47
|
+
it('should return false when testing the postcode "NE3"', () => {
|
|
48
|
+
expect(!isValidPostcode("NE3"));
|
|
49
|
+
});
|
|
50
|
+
// #region Invalid postcodes correct pattern
|
|
51
|
+
it('should return true when testing the postcode "Q1A 4BT"', () => {
|
|
52
|
+
expect(isValidPostcode("Q1A 4BT"));
|
|
53
|
+
});
|
|
54
|
+
it('should return true when testing the postcode "AB0 7RE"', () => {
|
|
55
|
+
expect(isValidPostcode("AB0 7RE"));
|
|
56
|
+
});
|
|
57
|
+
it('should return true when testing the postcode "LN0A 4JP"', () => {
|
|
58
|
+
expect(isValidPostcode("LN0A 4JP"));
|
|
59
|
+
});
|
|
60
|
+
it('should return true when testing the postcode "WS0 9ND"', () => {
|
|
61
|
+
expect(isValidPostcode("WS0 9ND"));
|
|
62
|
+
});
|
|
63
|
+
it('should return true when testing the postcode "X8 2HR"', () => {
|
|
64
|
+
expect(isValidPostcode("X8 2HR"));
|
|
65
|
+
});
|
|
66
|
+
// #endregion
|
|
67
|
+
// #region Invalid postcodes incorrect pattern
|
|
68
|
+
it('should return false when testing the postcode "ZZ2 TYD"', () => {
|
|
69
|
+
expect(!isValidPostcode("ZZ2 TYD"));
|
|
70
|
+
});
|
|
71
|
+
it('should return false when testing the postcode "ABC EFG"', () => {
|
|
72
|
+
expect(!isValidPostcode("ABC EFG"));
|
|
73
|
+
});
|
|
74
|
+
it('should return false when testing the postcode "1234 567"', () => {
|
|
75
|
+
expect(!isValidPostcode("1234 567"));
|
|
76
|
+
});
|
|
77
|
+
it('should return false when testing the postcode "23A PP2"', () => {
|
|
78
|
+
expect(!isValidPostcode("23A PP2"));
|
|
79
|
+
});
|
|
80
|
+
it('should return false when testing the postcode "NE3 H23"', () => {
|
|
81
|
+
expect(!isValidPostcode("NE3 H23"));
|
|
82
|
+
});
|
|
83
|
+
// #endregion
|
|
84
|
+
});
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
export const describe = (desc, fn) => {
|
|
2
|
+
console.log(desc);
|
|
3
|
+
fn();
|
|
4
|
+
};
|
|
5
|
+
export const it = (desc, fn) => {
|
|
6
|
+
try {
|
|
7
|
+
fn();
|
|
8
|
+
console.log(`\x1b[32m ${desc} \x1b[0m`);
|
|
9
|
+
}
|
|
10
|
+
catch (error) {
|
|
11
|
+
console.log(`\x1b[31m ${desc} \x1b[0m`);
|
|
12
|
+
console.error(error);
|
|
13
|
+
}
|
|
14
|
+
};
|
|
15
|
+
export const expect = (isTrue) => {
|
|
16
|
+
if (!isTrue) {
|
|
17
|
+
throw new Error();
|
|
18
|
+
}
|
|
19
|
+
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.
|
|
2
|
+
* iamKey v7.7.0
|
|
3
3
|
* Copyright 2022-2026 iamproperty
|
|
4
4
|
*/(function(w){typeof define=="function"&&define.amd?define(w):w()})((function(){"use strict";var w=a=>{a.classList.add("js-enabled"),(navigator.userAgent.indexOf("MSIE")!==-1||navigator.appVersion.indexOf("Trident/")>0)&&a.classList.add("ie")},H=a=>{var e=function(n){var r=document.querySelector('label[for="'.concat(n.replace("#",""),'"]')),s=document.querySelector(n+" summary"),u=document.querySelector("dialog".concat(n)),i=document.querySelector("detail".concat(n));r instanceof HTMLElement?r.click():s instanceof HTMLElement?s.click():u instanceof HTMLElement?u.showModal():i instanceof HTMLElement&&i.addAttribute("open")};location.hash&&e(location.hash),window.addEventListener("hashchange",function(){e(location.hash)},!1),addEventListener("popstate",o=>{if(o&&o.state&&o.state.type&&o.state.type=="pagination"){var n=document.querySelector("#".concat(o.state.form)),r=document.querySelector("#".concat(o.state.form," [data-pagination]"));r?r.value=o.state.page:n.innerHTML+='<input name="page" type="hidden" data-pagination="true" value="'.concat(o.state.page,'" />'),n.dispatchEvent(new Event("submit"))}}),Array.from(document.querySelectorAll("form")).forEach(o=>{o?.closest("iam-form")||o.addEventListener("submit",n=>{var r;o.querySelector(":invalid")&&(o.classList.add("was-validated"),(r=o?.querySelector("input:invalid"))===null||r===void 0||r.scrollIntoView(),n.preventDefault())})}),document.addEventListener("click",o=>{var n;if(o&&o.target instanceof HTMLElement&&o.target.matches("form button:not([type=button])")){var r=o.target.closest("form");r?.closest("iam-form")||(Array.from(r.querySelectorAll("[data-password-type]")).forEach(s=>{s.setAttribute("type","password")}),(r.querySelector(":invalid")||r.querySelector('.pwd-checker[data-strength="1"]')||r.querySelector('.pwd-checker[data-strength="2"]'))&&(r.classList.add("was-validated"),(n=r?.querySelector("input:invalid"))===null||n===void 0||n.scrollIntoView(),o.preventDefault()),r.querySelector("iam-multiselect[data-is-required][data-error]")&&(r.classList.add("was-validated"),o.preventDefault()))}}),document.addEventListener("keydown",o=>{o.key==="Escape"&&document.querySelector(".dialog--transactional[open], .dialog--acknowledgement[open]")&&(o.preventDefault(),o.stopPropagation())}),Array.from(document.querySelectorAll("label progress")).forEach(o=>{var n=o.closest("label");n.setAttribute("data-percent",o.getAttribute("value"))})};function N(){window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"Pageview",pageTitle:document.title}),document.addEventListener("click",a=>{var e=a.target.closest("[open] summary");if(e)window.dataLayer.push({event:"closeDetails",detailsTitle:e.textContent||""});else{var o=a.target.closest("summary"),n=a.target.closest("a"),r=a.target.closest("button");o&&window.dataLayer.push({event:"openDetails",detailsTitle:o.textContent||""}),n&&window.dataLayer.push({event:"linkClicked",linkText:n.hasAttribute("title")?n.getAttribute("title")||"":n.textContent||"",class:n.hasAttribute("class")&&n.getAttribute("class")||"",href:n.getAttribute("href")||""}),r&&window.dataLayer.push({event:"buttonClicked",buttonText:r.textContent||"",class:r.hasAttribute("class")&&r.getAttribute("class")||""})}})}window.triggerDynamicEvent=function(a){var e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:"change";console.log("event"),a.hasAttribute("data-change-events")&&e=="change"&&v(a,a.getAttribute("data-change-events")),a.hasAttribute("data-click-events")&&e=="click"&&v(a,a.getAttribute("data-click-events"))};var M=()=>{document.addEventListener("change",a=>{a&&a.target instanceof HTMLElement&&a.target.closest("[data-change-events]")&&v(a.target,a.target.closest("[data-change-events]").getAttribute("data-change-events"))}),document.addEventListener("keyup",a=>{a&&a.target instanceof HTMLElement&&a.target.closest("[data-change-events]")&&v(a.target,a.target.closest("[data-change-events]").getAttribute("data-change-events"))}),document.addEventListener("click",a=>{a&&a.target instanceof HTMLElement&&a.target.closest("[data-click-events]")&&v(a.target,a.target.closest("[data-click-events]").getAttribute("data-click-events"))})},v=(a,e)=>{if(e||(e=a.parentNode.getAttribute("data-change-events")),!e)return!1;Array.from(JSON.parse(e)).forEach(o=>{C(a,o)})},C=(a,e)=>{if("matches"in e)return e.matches=="any"||a.value==e.matches?f(a,e,"if"):f(a,e,"else"),!1;if("in-list"in e){var o=document.querySelector("".concat(e["in-list"],' option[value="').concat(a.value,'"]'));return document.querySelector("".concat(e["in-list"],' option[value="').concat(a.value,'"]'))?f(o,e,"if"):f(o,e,"else"),!1}else"event"in e&&f(a,e,"event")},f=(a,e,o)=>{if(!(o in e))return!1;switch(e[o]){case"hide":if(document.querySelector(e.target)){var n=document.querySelector(e.target);n.classList.add("js-hide"),Array.from(n.querySelectorAll("[data-required]")).forEach(i=>{i.removeAttribute("required")})}break;case"show":if(document.querySelector(e.target)){var r=document.querySelector(e.target);r.classList.remove("js-hide"),Array.from(r.querySelectorAll("[data-required]")).forEach(i=>{i.closest(".js-hide")||i.setAttribute("required","true")})}break;case"populate-form":D(a,e);break;case"dispatchEvent":var s=new Event(e.value);document.querySelector("".concat(e.target)).dispatchEvent(s);break;case"setAttribute":Array.from(document.querySelectorAll("".concat(e.target))).forEach(function(i){i.setAttribute(e.attribute,e.value)});break;case"focus":document.querySelector("".concat(e.target)).focus();break;case"removeAttribute":Array.from(document.querySelectorAll("".concat(e.target))).forEach(function(i){i.removeAttribute(e.attribute)});break;case"updateValue":document.querySelector("".concat(e.target)).value=e.value?e.value:"";var u=new Event("change");document.querySelector("".concat(e.target)).dispatchEvent(u);break;case"submitForm":document.querySelector("".concat(e.target)).submit();break;case"openLink":document.querySelector("".concat(e.target)).value&&(window.location.href=document.querySelector("".concat(e.target)).value);break}},D=function(e,o){var n=JSON.parse(e.getAttribute("data-values")),r=document.querySelector(o.target);if(!n)return!1;Object.keys(n).forEach(s=>{document.getElementById(s)&&document.getElementById(s).tagName=="SPAN"&&(document.getElementById(s).innerHTML=n[s]),r.querySelector('select[name="'.concat(s,'"] [value="').concat(n[s],'"]'))?(r.querySelector('select[name="'.concat(s,'"]')).value=n[s],e.hasAttribute("data-lock-fields")&&(r.querySelector('select[name="'.concat(s,'"]')).disabled=!0)):r.querySelector('input[name="'.concat(s,'"][type="radio"][value="').concat(n[s],'"]'))?(Array.from(r.querySelectorAll('input[name="'.concat(s,'"][type="radio"]'))).forEach(function(u){u.disabled=!0}),r.querySelector('input[name="'.concat(s,'"][type="radio"][value="').concat(n[s],'"]')).checked=!0,r.querySelector('input[name="'.concat(s,'"][type="radio"][value="').concat(n[s],'"]')).disabled=!1):r.querySelector('input[name="'.concat(s,'"]'))&&(r.querySelector('input[name="'.concat(s,'"]')).value=n[s],e.hasAttribute("data-lock-fields")&&r.querySelector('input[name="'.concat(s,'"]')).setAttribute("readonly","true"))})},F=()=>{var a=[],e={},o="These tests run against mark-up and content meant to test how a component or element has been integrated. Making sure that guidance setout in the design system is being followed.";window.integrationTestsIntro=o,console.log("%cVirgin Money Framework Tests","color: #E10A0A; font-size: 24px; font-weight: bold; margin-top: 20px; margin-bottom: 10px;"),console.log("%c"+o,"font-size: 14px; margin-bottom: 20px;"),console.log("%cKey","font-size: 16px;font-weight:bold;"),console.log("%c %cSuccessfully implemented","background-color: green; margin-right: 10px","background-color: transparent"),console.log("%c %cNOT implemented correctly","background-color: red; margin-right: 10px","background-color: transparent"),console.log("%c %cN/A","background-color: grey; margin-right: 10px","background-color: transparent"),console.log("%c %cWarning - No action needed","background-color: orange; margin-right: 10px","background-color: transparent"),console.log("%c ? %cWarning - Action needed","background-color: orange; margin-right: 10px","background-color: transparent"),e={Test:"Each card with in a card deck has a footer with some CTA text via a button link",Total:0,Passes:0,Fails:0},Array.from(document.querySelectorAll(".card-deck .card")).forEach((t,c)=>{if(t.closest(".navbar")==null){var l=t.querySelector(".btn-link");l!=null&&l.textContent.length?e.Passes++:e.Fails++}}),e.Total=e.Passes+e.Fails,a.push(e),e={Test:"Article Decks need to have a background colour applied",Total:0,Passes:0,Fails:0},Array.from(document.querySelectorAll(".article-deck")).forEach((t,c)=>{var l=t.closest(".container");l!=null&&l.matches('[class*="bg-"]')?e.Passes++:e.Fails++}),e.Total=e.Passes+e.Fails,a.push(e),e={Test:"Tabs Carousel has a h2 title with a display-4 class. It should always have a strapline next to it also.",Total:0,Passes:0,Fails:0,Notes:"The site nav contains cards without a footer by design."},Array.from(document.querySelectorAll(".tabs__container--carousel")).forEach((t,c)=>{var l=t.querySelector("h2.display-4:first-child"),d=t.querySelector("h2.display-4:first-child + .strapline");l!=null&&d!=null?e.Passes++:e.Fails++}),e.Total=e.Passes+e.Fails,a.push(e),e={Test:"Split Containers can only have multiple of two columns. So either 2, 4, 6 and so on.",Total:0,Passes:0,Fails:0,Notes:""},Array.from(document.querySelectorAll(".container.container--split")).forEach((t,c)=>{t.querySelectorAll(':scope > .row > [class*="col"]').length%2===0?e.Passes++:e.Fails++}),e.Total=e.Passes+e.Fails,a.push(e),e={Test:"Statement Containers with only one paragraph or text element should have the class of .h6",Total:0,Passes:0,Fails:0,Notes:""},Array.from(document.querySelectorAll(".container.container--statement")).forEach((t,c)=>{t.querySelectorAll(":scope > *").length==1&&t.querySelectorAll(":scope > .h6:first-child").length==1?e.Passes++:t.querySelectorAll(":scope > *").length==1&&e.Fails++}),e.Total=e.Passes+e.Fails,a.push(e),e={Test:"CTA Containers title should always have the class of .h1",Total:0,Passes:0,Fails:0,Notes:""},Array.from(document.querySelectorAll(".container.container--cta")).forEach((t,c)=>{t.querySelectorAll("h2.h1:first-child").length==1?e.Passes++:e.Fails++}),e.Total=e.Passes+e.Fails,a.push(e),console.log("%cImplementation Tests","font-size: 16px;font-weight:bold; margin-top: 20px;"),a.forEach(function(t){var c="green";t.Total===0?c="grey":t.Fails!=0&&(c="red"),t.Type=="warning"&&(c="orange"),console.groupCollapsed("%c %c"+t.Test,"background-color: "+c+"; margin-right: 10px","background-color: transparent"),console.table({Passed:{value:t.Passes},Failed:{value:t.Fails},Total:{value:t.Total}}),t.Notes!=""&&console.log(t.Notes),console.groupEnd()}),window.integrationTests=a;var n=[];e={Test:"There are XX padding classes being used on this page",Type:"warning",Total:0,Passes:0,Fails:0,Notes:""},Array.from(document.querySelectorAll('[class*="p-"],[class*="pt-"],[class*="pb-"],[class*="pl-"],[class*="pr-"],[class*="px-"],[class*="py-"]')).forEach((t,c)=>{e.Total++}),e.Test=e.Test.replace("XX",e.Total),n.push(e),e={Test:"There are XX margin classes being used on this page",Type:"warning",Total:0,Passes:0,Fails:0,Notes:""},Array.from(document.querySelectorAll('[class*="m-"],[class*="mt-"],[class*="mb-"],[class*="ml-"],[class*="mr-"],[class*="mx-"],[class*="my-"]')).forEach((t,c)=>{e.Total++}),e.Test=e.Test.replace("XX",e.Total),n.push(e),e={Test:"There are XX text modifier classes being used on this page",Type:"warning",Total:0,Passes:0,Fails:0,Notes:""},Array.from(document.querySelectorAll('[class*="text-"]')).forEach((t,c)=>{e.Total++}),e.Test=e.Test.replace("XX",e.Total),n.push(e),console.log("%cUtility classes","font-size: 16px;font-weight:bold;"),console.log("The use of certain utility classes is necessary at times but the over use of these classes will lead to design/layout inconsistencies."),n.forEach(function(t){var c="green";t.Total===0?c="grey":t.Fails!=0&&(c="red"),t.Type=="warning"&&(c="orange"),console.groupCollapsed("%c %c"+t.Test,"background-color: "+c+"; margin-right: 10px","background-color: transparent"),console.table({Total:{value:t.Total}}),t.Notes!=""&&console.log(t.Notes),console.groupEnd()}),console.log("%cAccessibility and Best practice Tests","font-size: 16px;font-weight:bold;");var r="green",s=1,u={};Array.from(document.querySelectorAll("h1,h2,h3,h4,h5,h6")).forEach((t,c)=>{var l=1,d=t.textContent;t.matches("h2")?l=2:t.matches("h3")?l=3:t.matches("h4")?l=4:t.matches("h5")?l=5:t.matches("h6")&&(l=6);var h=l-s<=1;c==0&&l!=1&&(h=!1);var p={"Heading Level":l,"In order":h};h?s=l:r="red",u[d]=p}),console.groupCollapsed("%c %cHeadings are in the correct order","background-color: "+r+"; margin-right: 10px","background-color: transparent"),console.table(u),console.groupEnd(),console.groupCollapsed("%c ? %cDo all of the headings make sense out of context and do they introduce the content that follows?","background-color: orange; margin-right: 10px","background-color: transparent"),console.log("You should be able to read the below table and get an understanding of what the page content consists of. The titles should make sense when read in order and child titles should be relevant to the parent title."),console.table(u),console.groupEnd();var i={};Array.from(document.querySelectorAll("a")).forEach((t,c)=>{var l=t.getAttribute("href"),d=t.textContent,h=t.getAttribute("title"),p={Text:d,Title:h};i[l]=p}),console.groupCollapsed("%c ? %cDo all of the links make sense out of context and do they describe the page/section that it links to?","background-color: orange; margin-right: 10px","background-color: transparent"),console.table(i),console.groupEnd();var A={},m={};Array.from(document.querySelectorAll("img[alt]")).forEach((t,c)=>{var l=t.getAttribute("src"),d=t.getAttribute("alt");if(d!=""){var h={Alt:d};A[l]=h}else{var l=t.getAttribute("src"),p={};m[l]=p}}),console.groupCollapsed("%c ? %cDo all of the images with an alt tag make sense out of context and describes the image appropriately?","background-color: orange; margin-right: 10px","background-color: transparent"),console.table(A),console.log("%cImages with an empty alt tag:","font-weight: bold;"),console.table(m),console.groupEnd(),console.groupCollapsed("%c ? %cCan you navigation the page links by tabbing through the page?","background-color: orange; margin-right: 10px","background-color: transparent"),console.log("Are all of the links, input fields and buttons accessible through using the keyboard only?"),console.groupEnd(),console.log("%cLighthouse","font-size: 16px;font-weight:bold;"),console.groupCollapsed("%c ? %cHave you ran a lighthouse report on this page","background-color: orange; margin-right: 10px","background-color: transparent"),console.log("If you are in a modern version of chrome you can a lighthouse report by opening the lighthouse window within the devtools. This should appear as a tab link above."),console.log("This report will give you more detail about the above the tests aswell as extra tests. "),console.groupEnd(),console.log("%cImage sizes","font-size: 16px;font-weight:bold;"),console.log("The below tests work from the current screen size, so if you have your screen at a mobile viewport the scaling and sizes of images will reflect that. It is worth running the image tests in both mobile and desktop views. Simply change the screen size and refresh the page."),Array.from(document.querySelectorAll("img")).forEach((t,c)=>{if(!t.matches("[src*='http']")&&!t.matches("[src$='.svg']")){var l=t.getAttribute("src"),d=new XMLHttpRequest;d.open("HEAD",l,!0),d.onreadystatechange=function(){if(d.readyState==4)if(d.status==200){var h=d.getResponseHeader("Content-Length");if(h>1024){var p=t.naturalWidth,P=t.naturalHeight,S=t.clientWidth,O=t.clientHeight,k=(S/p).toFixed(2)=="0.00"?"Hidden":(S/p).toFixed(2),B=Math.floor(h/1024),E=(h/(p*P)).toFixed(2),b="green",L="green",q="green",x="",T="";E>.5?(b="red",L="red",x="The image has a VERY large 'Bytes per pixel' score, trying optimising the image using https://tinypng.com/."):E>.2&&(b="orange",L="orange",x="The image has a large 'Bytes per pixel' score, trying optimising the image using https://tinypng.com/."),k>1.2?(b="red",q="red",T="The image size is smaller than the size shown on screen this may cause the image to appear blurry and low quality."):k<.5?(b="red",q="red",T="The image size is VERY large compared to the size shown on screen, this means unnecessary kb's are being downloaded. Try resizing the image in photoshop or other image editing software."):k<.8&&(b="orange",q="orange",T="The image size is large compared to the size shown on screen, this means unnecessary kb's are being downloaded. Try resizing the image in photoshop or other image editing software."),console.log("%c %c "+t.src,"background: url("+t.src+"); border: 3px solid "+b+"; line-height: 30px; width: 30px; background-size: cover;","background-color: transparent"),x!=""&&console.log("%c %c"+x,"background-color: "+L+"; margin-right: 10px","background-color: transparent"),T!=""&&console.log("%c %c"+T,"background-color: "+q+"; margin-right: 10px","background-color: transparent"),console.table({Image:{Dimensions:p+"x"+P,"Scaled to":S+"x"+O,Scale:k,Filesize:B+"Kb","Bytes per pixel":E}}),console.groupEnd()}}else console.log("%c %c"+t.src+" not loaded","background-color: red; margin-right: 10px","background-color: transparent")},d.send(null)}});var g=[];if(typeof window.integrationTests<"u"&&window.integrationTests.forEach(function(t){t.Total!=0&&t.Type!="warning"&&g.push(t.Test)}),g.length!=0){var y=document.querySelector("#vmtests-display");if(y!=null){y.innerHTML=`<div class="container">
|
|
5
5
|
<h2>Integration notes</h2>
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.
|
|
2
|
+
* iamKey v7.7.0
|
|
3
3
|
* Copyright 2022-2026 iamproperty
|
|
4
4
|
*/
|
|
5
5
|
!function(e){"function"==typeof define&&define.amd?define(e):e()}(function(){"use strict";window.triggerDynamicEvent=function(t){var a=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"change";console.log("event"),t.hasAttribute("data-change-events")&&"change"==a&&e(t,t.getAttribute("data-change-events")),t.hasAttribute("data-click-events")&&"click"==a&&e(t,t.getAttribute("data-click-events"))};var e=(e,a)=>{if(a||(a=e.parentNode.getAttribute("data-change-events")),!a)return!1;Array.from(JSON.parse(a)).forEach(a=>{t(e,a)})},t=(e,t)=>{if("matches"in t)return"any"==t.matches||e.value==t.matches?a(e,t,"if"):a(e,t,"else"),!1;if("in-list"in t){var o=document.querySelector("".concat(t["in-list"],' option[value="').concat(e.value,'"]'));return document.querySelector("".concat(t["in-list"],' option[value="').concat(e.value,'"]'))?a(o,t,"if"):a(o,t,"else"),!1}"event"in t&&a(e,t,"event")},a=(e,t,a)=>{if(!(a in t))return!1;switch(t[a]){case"hide":if(document.querySelector(t.target)){var n=document.querySelector(t.target);n.classList.add("js-hide"),Array.from(n.querySelectorAll("[data-required]")).forEach(e=>{e.removeAttribute("required")})}break;case"show":if(document.querySelector(t.target)){var r=document.querySelector(t.target);r.classList.remove("js-hide"),Array.from(r.querySelectorAll("[data-required]")).forEach(e=>{e.closest(".js-hide")||e.setAttribute("required","true")})}break;case"populate-form":o(e,t);break;case"dispatchEvent":var s=new Event(t.value);document.querySelector("".concat(t.target)).dispatchEvent(s);break;case"setAttribute":Array.from(document.querySelectorAll("".concat(t.target))).forEach(function(e){e.setAttribute(t.attribute,t.value)});break;case"focus":document.querySelector("".concat(t.target)).focus();break;case"removeAttribute":Array.from(document.querySelectorAll("".concat(t.target))).forEach(function(e){e.removeAttribute(t.attribute)});break;case"updateValue":document.querySelector("".concat(t.target)).value=t.value?t.value:"";var l=new Event("change");document.querySelector("".concat(t.target)).dispatchEvent(l);break;case"submitForm":document.querySelector("".concat(t.target)).submit();break;case"openLink":document.querySelector("".concat(t.target)).value&&(window.location.href=document.querySelector("".concat(t.target)).value)}},o=function(e,t){var a=JSON.parse(e.getAttribute("data-values")),o=document.querySelector(t.target);if(!a)return!1;Object.keys(a).forEach(t=>{document.getElementById(t)&&"SPAN"==document.getElementById(t).tagName&&(document.getElementById(t).innerHTML=a[t]),o.querySelector('select[name="'.concat(t,'"] [value="').concat(a[t],'"]'))?(o.querySelector('select[name="'.concat(t,'"]')).value=a[t],e.hasAttribute("data-lock-fields")&&(o.querySelector('select[name="'.concat(t,'"]')).disabled=!0)):o.querySelector('input[name="'.concat(t,'"][type="radio"][value="').concat(a[t],'"]'))?(Array.from(o.querySelectorAll('input[name="'.concat(t,'"][type="radio"]'))).forEach(function(e){e.disabled=!0}),o.querySelector('input[name="'.concat(t,'"][type="radio"][value="').concat(a[t],'"]')).checked=!0,o.querySelector('input[name="'.concat(t,'"][type="radio"][value="').concat(a[t],'"]')).disabled=!1):o.querySelector('input[name="'.concat(t,'"]'))&&(o.querySelector('input[name="'.concat(t,'"]')).value=a[t],e.hasAttribute("data-lock-fields")&&o.querySelector('input[name="'.concat(t,'"]')).setAttribute("readonly","true"))})},n=()=>{var e=[],t={},a="These tests run against mark-up and content meant to test how a component or element has been integrated. Making sure that guidance setout in the design system is being followed.";window.integrationTestsIntro=a,console.log("%cVirgin Money Framework Tests","color: #E10A0A; font-size: 24px; font-weight: bold; margin-top: 20px; margin-bottom: 10px;"),console.log("%c"+a,"font-size: 14px; margin-bottom: 20px;"),console.log("%cKey","font-size: 16px;font-weight:bold;"),console.log("%c %cSuccessfully implemented","background-color: green; margin-right: 10px","background-color: transparent"),console.log("%c %cNOT implemented correctly","background-color: red; margin-right: 10px","background-color: transparent"),console.log("%c %cN/A","background-color: grey; margin-right: 10px","background-color: transparent"),console.log("%c %cWarning - No action needed","background-color: orange; margin-right: 10px","background-color: transparent"),console.log("%c ? %cWarning - Action needed","background-color: orange; margin-right: 10px","background-color: transparent"),t={Test:"Each card with in a card deck has a footer with some CTA text via a button link",Total:0,Passes:0,Fails:0},Array.from(document.querySelectorAll(".card-deck .card")).forEach((e,a)=>{if(null==e.closest(".navbar")){var o=e.querySelector(".btn-link");null!=o&&o.textContent.length?t.Passes++:t.Fails++}}),t.Total=t.Passes+t.Fails,e.push(t),t={Test:"Article Decks need to have a background colour applied",Total:0,Passes:0,Fails:0},Array.from(document.querySelectorAll(".article-deck")).forEach((e,a)=>{var o=e.closest(".container");null!=o&&o.matches('[class*="bg-"]')?t.Passes++:t.Fails++}),t.Total=t.Passes+t.Fails,e.push(t),t={Test:"Tabs Carousel has a h2 title with a display-4 class. It should always have a strapline next to it also.",Total:0,Passes:0,Fails:0,Notes:"The site nav contains cards without a footer by design."},Array.from(document.querySelectorAll(".tabs__container--carousel")).forEach((e,a)=>{var o=e.querySelector("h2.display-4:first-child"),n=e.querySelector("h2.display-4:first-child + .strapline");null!=o&&null!=n?t.Passes++:t.Fails++}),t.Total=t.Passes+t.Fails,e.push(t),t={Test:"Split Containers can only have multiple of two columns. So either 2, 4, 6 and so on.",Total:0,Passes:0,Fails:0,Notes:""},Array.from(document.querySelectorAll(".container.container--split")).forEach((e,a)=>{e.querySelectorAll(':scope > .row > [class*="col"]').length%2==0?t.Passes++:t.Fails++}),t.Total=t.Passes+t.Fails,e.push(t),t={Test:"Statement Containers with only one paragraph or text element should have the class of .h6",Total:0,Passes:0,Fails:0,Notes:""},Array.from(document.querySelectorAll(".container.container--statement")).forEach((e,a)=>{1==e.querySelectorAll(":scope > *").length&&1==e.querySelectorAll(":scope > .h6:first-child").length?t.Passes++:1==e.querySelectorAll(":scope > *").length&&t.Fails++}),t.Total=t.Passes+t.Fails,e.push(t),t={Test:"CTA Containers title should always have the class of .h1",Total:0,Passes:0,Fails:0,Notes:""},Array.from(document.querySelectorAll(".container.container--cta")).forEach((e,a)=>{1==e.querySelectorAll("h2.h1:first-child").length?t.Passes++:t.Fails++}),t.Total=t.Passes+t.Fails,e.push(t),console.log("%cImplementation Tests","font-size: 16px;font-weight:bold; margin-top: 20px;"),e.forEach(function(e){var t="green";0===e.Total?t="grey":0!=e.Fails&&(t="red"),"warning"==e.Type&&(t="orange"),console.groupCollapsed("%c %c"+e.Test,"background-color: "+t+"; margin-right: 10px","background-color: transparent"),console.table({Passed:{value:e.Passes},Failed:{value:e.Fails},Total:{value:e.Total}}),""!=e.Notes&&console.log(e.Notes),console.groupEnd()}),window.integrationTests=e;var o=[];t={Test:"There are XX padding classes being used on this page",Type:"warning",Total:0,Passes:0,Fails:0,Notes:""},Array.from(document.querySelectorAll('[class*="p-"],[class*="pt-"],[class*="pb-"],[class*="pl-"],[class*="pr-"],[class*="px-"],[class*="py-"]')).forEach((e,a)=>{t.Total++}),t.Test=t.Test.replace("XX",t.Total),o.push(t),t={Test:"There are XX margin classes being used on this page",Type:"warning",Total:0,Passes:0,Fails:0,Notes:""},Array.from(document.querySelectorAll('[class*="m-"],[class*="mt-"],[class*="mb-"],[class*="ml-"],[class*="mr-"],[class*="mx-"],[class*="my-"]')).forEach((e,a)=>{t.Total++}),t.Test=t.Test.replace("XX",t.Total),o.push(t),t={Test:"There are XX text modifier classes being used on this page",Type:"warning",Total:0,Passes:0,Fails:0,Notes:""},Array.from(document.querySelectorAll('[class*="text-"]')).forEach((e,a)=>{t.Total++}),t.Test=t.Test.replace("XX",t.Total),o.push(t),console.log("%cUtility classes","font-size: 16px;font-weight:bold;"),console.log("The use of certain utility classes is necessary at times but the over use of these classes will lead to design/layout inconsistencies."),o.forEach(function(e){var t="green";0===e.Total?t="grey":0!=e.Fails&&(t="red"),"warning"==e.Type&&(t="orange"),console.groupCollapsed("%c %c"+e.Test,"background-color: "+t+"; margin-right: 10px","background-color: transparent"),console.table({Total:{value:e.Total}}),""!=e.Notes&&console.log(e.Notes),console.groupEnd()}),console.log("%cAccessibility and Best practice Tests","font-size: 16px;font-weight:bold;");var n="green",r=1,s={};Array.from(document.querySelectorAll("h1,h2,h3,h4,h5,h6")).forEach((e,t)=>{var a=1,o=e.textContent;e.matches("h2")?a=2:e.matches("h3")?a=3:e.matches("h4")?a=4:e.matches("h5")?a=5:e.matches("h6")&&(a=6);var l=a-r<=1;0==t&&1!=a&&(l=!1);var c={"Heading Level":a,"In order":l};l?r=a:n="red",s[o]=c}),console.groupCollapsed("%c %cHeadings are in the correct order","background-color: "+n+"; margin-right: 10px","background-color: transparent"),console.table(s),console.groupEnd(),console.groupCollapsed("%c ? %cDo all of the headings make sense out of context and do they introduce the content that follows?","background-color: orange; margin-right: 10px","background-color: transparent"),console.log("You should be able to read the below table and get an understanding of what the page content consists of. The titles should make sense when read in order and child titles should be relevant to the parent title."),console.table(s),console.groupEnd();var l={};Array.from(document.querySelectorAll("a")).forEach((e,t)=>{var a=e.getAttribute("href"),o={Text:e.textContent,Title:e.getAttribute("title")};l[a]=o}),console.groupCollapsed("%c ? %cDo all of the links make sense out of context and do they describe the page/section that it links to?","background-color: orange; margin-right: 10px","background-color: transparent"),console.table(l),console.groupEnd();var c={},i={};Array.from(document.querySelectorAll("img[alt]")).forEach((e,t)=>{var a=e.getAttribute("src"),o=e.getAttribute("alt");if(""!=o){var n={Alt:o};c[a]=n}else a=e.getAttribute("src"),i[a]={}}),console.groupCollapsed("%c ? %cDo all of the images with an alt tag make sense out of context and describes the image appropriately?","background-color: orange; margin-right: 10px","background-color: transparent"),console.table(c),console.log("%cImages with an empty alt tag:","font-weight: bold;"),console.table(i),console.groupEnd(),console.groupCollapsed("%c ? %cCan you navigation the page links by tabbing through the page?","background-color: orange; margin-right: 10px","background-color: transparent"),console.log("Are all of the links, input fields and buttons accessible through using the keyboard only?"),console.groupEnd(),console.log("%cLighthouse","font-size: 16px;font-weight:bold;"),console.groupCollapsed("%c ? %cHave you ran a lighthouse report on this page","background-color: orange; margin-right: 10px","background-color: transparent"),console.log("If you are in a modern version of chrome you can a lighthouse report by opening the lighthouse window within the devtools. This should appear as a tab link above."),console.log("This report will give you more detail about the above the tests aswell as extra tests. "),console.groupEnd(),console.log("%cImage sizes","font-size: 16px;font-weight:bold;"),console.log("The below tests work from the current screen size, so if you have your screen at a mobile viewport the scaling and sizes of images will reflect that. It is worth running the image tests in both mobile and desktop views. Simply change the screen size and refresh the page."),Array.from(document.querySelectorAll("img")).forEach((e,t)=>{if(!e.matches("[src*='http']")&&!e.matches("[src$='.svg']")){var a=e.getAttribute("src"),o=new XMLHttpRequest;o.open("HEAD",a,!0),o.onreadystatechange=function(){if(4==o.readyState)if(200==o.status){var t=o.getResponseHeader("Content-Length");if(t>1024){var a=e.naturalWidth,n=e.naturalHeight,r=e.clientWidth,s=e.clientHeight,l="0.00"==(r/a).toFixed(2)?"Hidden":(r/a).toFixed(2),c=Math.floor(t/1024),i=(t/(a*n)).toFixed(2),u="green",d="green",g="green",h="",p="";i>.5?(u="red",d="red",h="The image has a VERY large 'Bytes per pixel' score, trying optimising the image using https://tinypng.com/."):i>.2&&(u="orange",d="orange",h="The image has a large 'Bytes per pixel' score, trying optimising the image using https://tinypng.com/."),l>1.2?(u="red",g="red",p="The image size is smaller than the size shown on screen this may cause the image to appear blurry and low quality."):l<.5?(u="red",g="red",p="The image size is VERY large compared to the size shown on screen, this means unnecessary kb's are being downloaded. Try resizing the image in photoshop or other image editing software."):l<.8&&(u="orange",g="orange",p="The image size is large compared to the size shown on screen, this means unnecessary kb's are being downloaded. Try resizing the image in photoshop or other image editing software."),console.log("%c %c "+e.src,"background: url("+e.src+"); border: 3px solid "+u+"; line-height: 30px; width: 30px; background-size: cover;","background-color: transparent"),""!=h&&console.log("%c %c"+h,"background-color: "+d+"; margin-right: 10px","background-color: transparent"),""!=p&&console.log("%c %c"+p,"background-color: "+g+"; margin-right: 10px","background-color: transparent"),console.table({Image:{Dimensions:a+"x"+n,"Scaled to":r+"x"+s,Scale:l,Filesize:c+"Kb","Bytes per pixel":i}}),console.groupEnd()}}else console.log("%c %c"+e.src+" not loaded","background-color: red; margin-right: 10px","background-color: transparent")},o.send(null)}});var u=[];if(typeof window.integrationTests<"u"&&window.integrationTests.forEach(function(e){0!=e.Total&&"warning"!=e.Type&&u.push(e.Test)}),0!=u.length){var d=document.querySelector("#vmtests-display");if(null!=d){d.innerHTML='<div class="container">\n <h2>Integration notes</h2>\n <ul id="integrationTests"></ul>\n </div>';var g=document.getElementById("integrationTests");null!=g&&u.forEach(function(e){g.innerHTML+="<li>"+e+"</li>"})}}return null},r=Object.freeze({__proto__:null,default:n});["localhost"].includes(window.location.hostname)&&Promise.resolve().then(function(){return r}).then(e=>{window.iamTest=()=>{n()}}).catch(e=>{console.log(e.message)}),document.addEventListener("DOMContentLoaded",()=>{return t=void 0,a=void 0,n=function*(){var t,a;window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"Pageview",pageTitle:document.title}),document.addEventListener("click",e=>{var t=e.target.closest("[open] summary");if(t)window.dataLayer.push({event:"closeDetails",detailsTitle:t.textContent||""});else{var a=e.target.closest("summary"),o=e.target.closest("a"),n=e.target.closest("button");a&&window.dataLayer.push({event:"openDetails",detailsTitle:a.textContent||""}),o&&window.dataLayer.push({event:"linkClicked",linkText:o.hasAttribute("title")?o.getAttribute("title")||"":o.textContent||"",class:o.hasAttribute("class")&&o.getAttribute("class")||"",href:o.getAttribute("href")||""}),n&&window.dataLayer.push({event:"buttonClicked",buttonText:n.textContent||"",class:n.hasAttribute("class")&&n.getAttribute("class")||""})}}),document.addEventListener("change",t=>{t&&t.target instanceof HTMLElement&&t.target.closest("[data-change-events]")&&e(t.target,t.target.closest("[data-change-events]").getAttribute("data-change-events"))}),document.addEventListener("keyup",t=>{t&&t.target instanceof HTMLElement&&t.target.closest("[data-change-events]")&&e(t.target,t.target.closest("[data-change-events]").getAttribute("data-change-events"))}),document.addEventListener("click",t=>{t&&t.target instanceof HTMLElement&&t.target.closest("[data-click-events]")&&e(t.target,t.target.closest("[data-click-events]").getAttribute("data-click-events"))}),(a=document.body).classList.add("js-enabled"),(-1!==navigator.userAgent.indexOf("MSIE")||navigator.appVersion.indexOf("Trident/")>0)&&a.classList.add("ie"),t=function(e){var t=document.querySelector('label[for="'.concat(e.replace("#",""),'"]')),a=document.querySelector(e+" summary"),o=document.querySelector("dialog".concat(e)),n=document.querySelector("detail".concat(e));t instanceof HTMLElement?t.click():a instanceof HTMLElement?a.click():o instanceof HTMLElement?o.showModal():n instanceof HTMLElement&&n.addAttribute("open")},location.hash&&t(location.hash),window.addEventListener("hashchange",function(){t(location.hash)},!1),addEventListener("popstate",e=>{if(e&&e.state&&e.state.type&&"pagination"==e.state.type){var t=document.querySelector("#".concat(e.state.form)),a=document.querySelector("#".concat(e.state.form," [data-pagination]"));a?a.value=e.state.page:t.innerHTML+='<input name="page" type="hidden" data-pagination="true" value="'.concat(e.state.page,'" />'),t.dispatchEvent(new Event("submit"))}}),Array.from(document.querySelectorAll("form")).forEach(e=>{e?.closest("iam-form")||e.addEventListener("submit",t=>{var a;e.querySelector(":invalid")&&(e.classList.add("was-validated"),null===(a=e?.querySelector("input:invalid"))||void 0===a||a.scrollIntoView(),t.preventDefault())})}),document.addEventListener("click",e=>{var t;if(e&&e.target instanceof HTMLElement&&e.target.matches("form button:not([type=button])")){var a=e.target.closest("form");a?.closest("iam-form")||(Array.from(a.querySelectorAll("[data-password-type]")).forEach(e=>{e.setAttribute("type","password")}),(a.querySelector(":invalid")||a.querySelector('.pwd-checker[data-strength="1"]')||a.querySelector('.pwd-checker[data-strength="2"]'))&&(a.classList.add("was-validated"),null===(t=a?.querySelector("input:invalid"))||void 0===t||t.scrollIntoView(),e.preventDefault()),a.querySelector("iam-multiselect[data-is-required][data-error]")&&(a.classList.add("was-validated"),e.preventDefault()))}}),document.addEventListener("keydown",e=>{"Escape"===e.key&&document.querySelector(".dialog--transactional[open], .dialog--acknowledgement[open]")&&(e.preventDefault(),e.stopPropagation())}),Array.from(document.querySelectorAll("label progress")).forEach(e=>{e.closest("label").setAttribute("data-percent",e.getAttribute("value"))})},new((o=void 0)||(o=Promise))(function(e,r){function s(e){try{c(n.next(e))}catch(e){r(e)}}function l(e){try{c(n.throw(e))}catch(e){r(e)}}function c(t){t.done?e(t.value):function(e){return e instanceof o?e:new o(function(t){t(e)})}(t.value).then(s,l)}c((n=n.apply(t,a||[])).next())});var t,a,o,n})});
|
|
@@ -9,16 +9,16 @@
|
|
|
9
9
|
@use 'components/multi-step-modal.global';
|
|
10
10
|
|
|
11
11
|
@use 'components/inline-edit.preload';
|
|
12
|
-
@use 'components/charts.config
|
|
13
|
-
@use 'components/menu.global
|
|
12
|
+
@use 'components/charts.config';
|
|
13
|
+
@use 'components/menu.global';
|
|
14
14
|
|
|
15
|
-
@use 'components/tabs.config
|
|
15
|
+
@use 'components/tabs.config';
|
|
16
16
|
|
|
17
|
-
@use 'components/address-lookup.preload
|
|
17
|
+
@use 'components/address-lookup.preload';
|
|
18
18
|
|
|
19
19
|
|
|
20
|
-
@use 'components/milestone
|
|
21
|
-
@use 'components/calendar.config
|
|
20
|
+
@use 'components/milestone';
|
|
21
|
+
@use 'components/calendar.config';
|
|
22
22
|
|
|
23
23
|
@layer components {
|
|
24
24
|
// Make sure the first
|
|
@@ -38,7 +38,7 @@
|
|
|
38
38
|
|
|
39
39
|
@media screen and (min-width: 62em) {
|
|
40
40
|
iam-header:not(:defined) {
|
|
41
|
-
min-height:
|
|
41
|
+
min-height: 29.375rem;
|
|
42
42
|
}
|
|
43
43
|
}
|
|
44
44
|
|
|
@@ -3,21 +3,22 @@
|
|
|
3
3
|
|
|
4
4
|
|
|
5
5
|
// Foundations
|
|
6
|
-
@use 'foundations/root
|
|
7
|
-
@use 'foundations/
|
|
6
|
+
@use 'foundations/root';
|
|
7
|
+
@use 'foundations/animations';
|
|
8
|
+
@use 'foundations/colours';
|
|
8
9
|
|
|
9
|
-
@use 'foundations/reboot
|
|
10
|
+
@use 'foundations/reboot';
|
|
10
11
|
|
|
11
12
|
// Elements
|
|
12
|
-
@use '_elements
|
|
13
|
+
@use '_elements';
|
|
13
14
|
|
|
14
15
|
// Components
|
|
15
|
-
@use '_components
|
|
16
|
+
@use '_components';
|
|
16
17
|
|
|
17
18
|
// Templates
|
|
18
|
-
@use 'templates/form
|
|
19
|
+
@use 'templates/form';
|
|
19
20
|
|
|
20
|
-
@use 'templates/auth
|
|
21
|
+
@use 'templates/auth';
|
|
21
22
|
|
|
22
23
|
// Overrides
|
|
23
24
|
@layer overrides {
|