diff --git a/src/iss-components/site-sub-header/site-sub-header.vue b/src/iss-components/site-sub-header/site-sub-header.vue index 2d5f7342..8d910ac2 100644 --- a/src/iss-components/site-sub-header/site-sub-header.vue +++ b/src/iss-components/site-sub-header/site-sub-header.vue @@ -31,7 +31,8 @@ import buttonBack from "@/iss-components/site-sub-header/button-back/button-back cmsWidgetName: String, hasBackButton: Boolean, justification: String, - issContainingPage: String + issContainingPage: String, + darkGraySubText: Boolean, }, computed: { content() { @@ -53,9 +54,15 @@ import buttonBack from "@/iss-components/site-sub-header/button-back/button-back 'justify-content-center'; }, alternateFormatting() { - return (this.issContainingPage?.toLowerCase() === 'service-packages') ? - 'service-packages-subtext mt-4 mb-2 px-5' : - 'small'; + //override for service-packages unique style + if (this.issContainingPage?.toLowerCase() === 'service-packages') + { + return 'service-packages-subtext mt-4 mb-2 px-5'; + } + else + { + return this.darkGraySubText ? "dark-gray" : "light-gray"; + } } }, methods: { @@ -84,9 +91,14 @@ import buttonBack from "@/iss-components/site-sub-header/button-back/button-back color: inherit; } } - p.small { + p.light-gray { color: $gray-550; } + + p.dark-gray { + color: $darker-gray; + } + p.service-packages-subtext { font-weight: 500 !important; line-height: 24px; diff --git a/src/layouts/vehicle-selection/vehicle-selection.vue b/src/layouts/vehicle-selection/vehicle-selection.vue index 0914aef1..d0996a69 100644 --- a/src/layouts/vehicle-selection/vehicle-selection.vue +++ b/src/layouts/vehicle-selection/vehicle-selection.vue @@ -12,6 +12,7 @@ cmsWidgetName="SiteSubHeaderWidget" class="siteSubHeader" justification="center" + darkGraySubText />