jason/DigitalConsumer.ISS
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

SSR-1201 subheader font style updates.

Browse source 
Spoke with Devyn about changing multiple gray color values to all use #4d5151 font weight 400 font size 14px.
This commit is contained in:
Bryan Mauger 2024-05-08 14:41:57 -04:00
parent 06f6abb905
commit 45cb8c00b2
3 changed files with 23 additions and 21 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

42
src/iss-components/site-sub-header/site-sub-header.vue
View file

@ -1,7 +1,7 @@
<template> <template>
<div> <div>
<div <div
class="subheader-primary d-flex align-items-center justify-content-center overflow-hidden"> class="subheader-primary d-flex align-items-center justify-content-center overflow-hidden mb-2">
<h5 <h5
class="text-center fw-normal mb-0 subheader-primary" class="text-center fw-normal mb-0 subheader-primary"
:class="headerColor"> :class="headerColor">
@ -18,7 +18,7 @@
class="subheader-secondary d-flex align-items-center overflow-hidden" class="subheader-secondary d-flex align-items-center overflow-hidden"
:class="[justifySubheader, subHeaderClasses]"> :class="[justifySubheader, subHeaderClasses]">
<p <p
class="fw-bold dark-header" class="dark-header"
:class="[alternateFormatting, subTextClasses]"> :class="[alternateFormatting, subTextClasses]">
<span v-html="subText"> </span> <span v-html="subText"> </span>
</p> </p>
@ -127,7 +127,7 @@ export default {
} }
.light-header { .light-header {
color: $gray-550; color: $gray-600;
} }
h5 { h5 {
@ -140,28 +140,30 @@ h5 {
color: $black; color: $black;
} }
} }
p.light-gray { p {
color: $gray-550; margin: 0;
} &.light-gray {
color: $gray-600;
p.dark-gray { }
color: $darker-gray; &.dark-gray {
} color: $darker-gray;
}
p.service-packages-subtext { &.service-packages-subtext {
font-weight: 500 !important; font-weight: 500;
line-height: 24px; line-height: 24px;
span {
font-size: 1rem;
}
}
} }
.subheader-secondary { .subheader-secondary {
&.justify-content-center { p {
p { font-size: .875rem;
&.justify-content-center {
text-align: center; text-align: center;
} }
} &.justify-content-left {
&.justify-content-left {
p {
text-align: left; text-align: left;
} }
} }

1
src/layouts/order-confirmation/order-confirmation.vue
View file

@ -441,7 +441,6 @@ export default {
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
$page-side-padding: 1.5rem;
.page-container-grouped-styles { .page-container-grouped-styles {
overflow: auto; overflow: auto;

1
src/layouts/service-packages/service-packages.vue
View file

@ -13,6 +13,7 @@
<div class="row justify-content-center"> <div class="row justify-content-center">
<div class="col-md-6 col-xl-4"> <div class="col-md-6 col-xl-4">
<siteSubHeader <siteSubHeader
class="mb-2"
justification="left" justification="left"
cmsWidgetName="SiteSubHeaderWidget" cmsWidgetName="SiteSubHeaderWidget"
issContainingPage="service-packages" /> issContainingPage="service-packages" />