DigitalConsumer.FixMyGlass/src/common-components/funnel-sub-header/funnel-sub-header.vue

66 lines
1.3 KiB
Vue

<template>
<div class="current_car_info-text">
<div class="d-flex align-items-center justify-content-center container-fluid overflow-hidden">
<h5 class="text-center fw-normal mb-0">
<span>
{{ text }}
</span>
<buttonBack
v-if="hasBackButton"
:backButtonAccessibleText="backButtonAccessibleText"
@click-event="clickEvent"
/>
</h5>
</div>
<div class="d-flex align-items-center justify-content-center container-fluid overflow-hidden">
<p class="text-center small fw-normal mb-0">
<span>
{{ subText }}
</span>
</p>
</div>
</div>
</template>
<script>
import buttonBack from "@/common-components/button-back/button-back";
export default {
name: "FunnelSubHeader",
data() {
return {
text: '',
subText: ''
}
},
props: {
hasBackButton: Boolean,
backButtonAccessibleText: String,
},
components: {
buttonBack,
},
methods: {
clickEvent() {
this.$emit('click-event');
},
initializeComponent(cmsContent) {
this.text = cmsContent.HeaderText;
this.subText = cmsContent.HeaderSubText;
}
},
};
</script>
<style lang="scss">
h5 {
color: $gray-550;
line-height: 32px;
button {
border: none;
background: none;
color: inherit;
}
}
</style>