diff --git a/public/index.html b/public/index.html index e88f8ca8f..abba76b43 100644 --- a/public/index.html +++ b/public/index.html @@ -10,9 +10,6 @@ - - - <%= htmlWebpackPlugin.options.title %> diff --git a/src/assets/fonts/averta-bold-webfont.woff b/src/assets/fonts/averta-bold-webfont.woff new file mode 100644 index 000000000..422e65fff Binary files /dev/null and b/src/assets/fonts/averta-bold-webfont.woff differ diff --git a/src/assets/fonts/averta-bold-webfont.woff2 b/src/assets/fonts/averta-bold-webfont.woff2 new file mode 100644 index 000000000..c66990f59 Binary files /dev/null and b/src/assets/fonts/averta-bold-webfont.woff2 differ diff --git a/src/assets/fonts/averta-bolditalic-webfont.woff b/src/assets/fonts/averta-bolditalic-webfont.woff new file mode 100644 index 000000000..e3fff494c Binary files /dev/null and b/src/assets/fonts/averta-bolditalic-webfont.woff differ diff --git a/src/assets/fonts/averta-bolditalic-webfont.woff2 b/src/assets/fonts/averta-bolditalic-webfont.woff2 new file mode 100644 index 000000000..afde47c88 Binary files /dev/null and b/src/assets/fonts/averta-bolditalic-webfont.woff2 differ diff --git a/src/assets/fonts/averta-extrabold-webfont.woff b/src/assets/fonts/averta-extrabold-webfont.woff new file mode 100644 index 000000000..1f76979dd Binary files /dev/null and b/src/assets/fonts/averta-extrabold-webfont.woff differ diff --git a/src/assets/fonts/averta-extrabold-webfont.woff2 b/src/assets/fonts/averta-extrabold-webfont.woff2 new file mode 100644 index 000000000..48c8bfeda Binary files /dev/null and b/src/assets/fonts/averta-extrabold-webfont.woff2 differ diff --git a/src/assets/fonts/averta-regular-webfont.woff b/src/assets/fonts/averta-regular-webfont.woff new file mode 100644 index 000000000..e657e8a0f Binary files /dev/null and b/src/assets/fonts/averta-regular-webfont.woff differ diff --git a/src/assets/fonts/averta-regular-webfont.woff2 b/src/assets/fonts/averta-regular-webfont.woff2 new file mode 100644 index 000000000..4b481ebb1 Binary files /dev/null and b/src/assets/fonts/averta-regular-webfont.woff2 differ diff --git a/src/assets/fonts/averta-regularitalic-webfont.woff b/src/assets/fonts/averta-regularitalic-webfont.woff new file mode 100644 index 000000000..0bb7810b6 Binary files /dev/null and b/src/assets/fonts/averta-regularitalic-webfont.woff differ diff --git a/src/assets/fonts/averta-regularitalic-webfont.woff2 b/src/assets/fonts/averta-regularitalic-webfont.woff2 new file mode 100644 index 000000000..86b275720 Binary files /dev/null and b/src/assets/fonts/averta-regularitalic-webfont.woff2 differ diff --git a/src/assets/fonts/averta-semibold-webfont.woff b/src/assets/fonts/averta-semibold-webfont.woff new file mode 100644 index 000000000..e7fbb0d86 Binary files /dev/null and b/src/assets/fonts/averta-semibold-webfont.woff differ diff --git a/src/assets/fonts/averta-semibold-webfont.woff2 b/src/assets/fonts/averta-semibold-webfont.woff2 new file mode 100644 index 000000000..1245f1a4e Binary files /dev/null and b/src/assets/fonts/averta-semibold-webfont.woff2 differ diff --git a/src/digital-components/modal/modal.vue b/src/digital-components/modal/modal.vue index 6e6664ca1..3dc6e4afd 100644 --- a/src/digital-components/modal/modal.vue +++ b/src/digital-components/modal/modal.vue @@ -156,7 +156,6 @@ export default { width: 100%; bottom: 0; z-index: 5; - background-color: $gray-100; } &.modal-component { .modal-dialog { diff --git a/src/fmg-components/funnel-header/funnel-header.vue b/src/fmg-components/funnel-header/funnel-header.vue index 8de05c3c1..22d9e77fa 100644 --- a/src/fmg-components/funnel-header/funnel-header.vue +++ b/src/fmg-components/funnel-header/funnel-header.vue @@ -94,7 +94,7 @@ export default { } .logo-image { - max-width: 114px; - height: auto; + width: auto; + height: 1.1875rem; } diff --git a/src/fmg-components/funnel-sub-header/funnel-sub-header.vue b/src/fmg-components/funnel-sub-header/funnel-sub-header.vue index 54c8aa34d..fa8aea13f 100644 --- a/src/fmg-components/funnel-sub-header/funnel-sub-header.vue +++ b/src/fmg-components/funnel-sub-header/funnel-sub-header.vue @@ -53,7 +53,7 @@ export default { return this.leftAlignHeader ? "justify-content-start" : "justify-content-center"; }, subText() { - return this.getCmsContent(this.cmsWidgetName, "SubheaderText"); + return this.getCmsContent(this.cmsWidgetName, "HeaderSubText"); }, backButtonAccessibleText() { return this.getCmsContent(this.cmsWidgetName, "BackButtonAccessibleText"); diff --git a/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue b/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue index 97037c4e9..af8c488f9 100644 --- a/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue +++ b/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue @@ -71,7 +71,7 @@ @@ -166,14 +166,14 @@ export default { position: relative; cursor: pointer; width: 100%; - padding: 1rem; + padding: 0.75rem; border: 1px solid $gray-300; box-shadow: 0px 4px 8px -4px rgba(0, 0, 0, 0.15), 0px 4px 24px -8px rgba(0, 0, 0, 0.2); border-radius: 0.5rem; overflow: hidden; - min-height: 60px; + min-height: 52px; max-height: 126px; @include media-breakpoint-up(md) { max-height: 500px; @@ -182,14 +182,14 @@ export default { transition: max-height 0.25s ease-in; &.has-subheader { - min-height: 80px; + min-height: 72px; } &:before { content: ""; position: relative; top: 5px; - margin-right: 1rem; + margin-right: 0.5rem; border-radius: 50%; border: 1px solid $gray-500; width: 16px; @@ -200,8 +200,8 @@ export default { &:after { content: ""; position: absolute; - left: 19px; - top: 24px; + left: 15px; + top: 20px; border-radius: 50%; width: 10px; height: 10px; @@ -280,6 +280,7 @@ export default { font-weight: 600; display: flex; justify-content: space-between; + align-items: center; span { &.pricing-info { color: $green; @@ -341,7 +342,7 @@ export default { } } ul { - margin: 1rem 0 0 -15px; + margin: 1rem 0 0 -5px; padding: 0; li { font-size: 0.875rem; diff --git a/src/styles/common-typography-styles.scss b/src/styles/common-typography-styles.scss index b15c07a88..d3ad60708 100644 --- a/src/styles/common-typography-styles.scss +++ b/src/styles/common-typography-styles.scss @@ -76,68 +76,53 @@ caption, font-weight: 500; } -// Poppins styles from Google Fonts +// Averta Fonts -// Regular styles - -.poppins-light { - font-family: "Poppins", sans-serif; - font-weight: 300; +@font-face { + font-family: 'AvertaBold'; + src: url('@/assets/fonts/averta-bold-webfont.woff2') format('woff2'), + url('@/assets/fonts/averta-bold-webfont.woff') format('woff'); + font-weight: normal; font-style: normal; } -.poppins-regular { - font-family: "Poppins", sans-serif; - font-weight: 400; +@font-face { + font-family: 'AvertaBold_Italic'; + src: url('@/assets/fonts/averta-bolditalic-webfont.woff2') format('woff2'), + url('@/assets/fonts/averta-bolditalic-webfont.woff') format('woff'); + font-weight: normal; font-style: normal; } -.poppins-medium { - font-family: "Poppins", sans-serif; - font-weight: 500; +@font-face { + font-family: 'AvertaExtraBold'; + src: url('@/assets/fonts/averta-extrabold-webfont.woff2') format('woff2'), + url('@/assets/fonts/averta-extrabold-webfont.woff') format('woff'); + font-weight: normal; font-style: normal; } -.poppins-semibold { - font-family: "Poppins", sans-serif; - font-weight: 600; +@font-face { + font-family: 'AvertaRegular'; + src: url('@/assets/fonts/averta-regular-webfont.woff2') format('woff2'), + url('@/assets/fonts/averta-regular-webfont.woff') format('woff'); + font-weight: normal; font-style: normal; } -.poppins-bold { - font-family: "Poppins", sans-serif; - font-weight: 700; +@font-face { + font-family: 'AvertaRegular_Italic'; + src: url('@/assets/fonts/averta-regularitalic-webfont.woff2') format('woff2'), + url('@/assets/fonts/averta-regularitalic-webfont.woff') format('woff'); + font-weight: normal; font-style: normal; } -// Italic styles +@font-face { + font-family: 'AvertaSemibold'; + src: url('@/assets/fonts/averta-semibold-webfont.woff2') format('woff2'), + url('@/assets/fonts/averta-semibold-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; -.poppins-light-italic { - font-family: "Poppins", sans-serif; - font-weight: 300; - font-style: italic; -} - -.poppins-regular-italic { - font-family: "Poppins", sans-serif; - font-weight: 400; - font-style: italic; -} - -.poppins-medium-italic { - font-family: "Poppins", sans-serif; - font-weight: 500; - font-style: italic; -} - -.poppins-semibold-italic { - font-family: "Poppins", sans-serif; - font-weight: 600; - font-style: italic; -} - -.poppins-bold-italic { - font-family: "Poppins", sans-serif; - font-weight: 700; - font-style: italic; -} +} \ No newline at end of file diff --git a/src/styles/ux-variables.scss b/src/styles/ux-variables.scss index 0ca01ca76..df984b224 100644 --- a/src/styles/ux-variables.scss +++ b/src/styles/ux-variables.scss @@ -115,7 +115,7 @@ $theme-colors: ( $body-color: $gray-600; //Fonts -$font-family-sans-serif: Poppins, Arial, Helvetica, sans-serif; +$font-family-sans-serif: AvertaRegular, Arial, Helvetica, sans-serif; $font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; // stylelint-enable value-keyword-case diff --git a/src/ux-components/list-button-horizontal/list-button-horizontal.vue b/src/ux-components/list-button-horizontal/list-button-horizontal.vue index f452f597d..3a360c1bc 100644 --- a/src/ux-components/list-button-horizontal/list-button-horizontal.vue +++ b/src/ux-components/list-button-horizontal/list-button-horizontal.vue @@ -7,7 +7,7 @@ ]" v-model="selectedValue">
+ class="button-content list-button-horizontal-content d-flex flex-column justify-content-center p-2"> {{ buttonLabel }} @@ -105,7 +105,7 @@ export default { span { font-size: 1rem; - font-weight: 500; + font-weight: 600; } } diff --git a/src/ux-components/list-card/list-card.vue b/src/ux-components/list-card/list-card.vue index ffdf4efc0..56cb1482e 100644 --- a/src/ux-components/list-card/list-card.vue +++ b/src/ux-components/list-card/list-card.vue @@ -7,7 +7,7 @@ ]" v-model="selectedValue">