WIP move css block to fix specificity issue.

This commit is contained in:
Bryan Mauger 2024-07-08 13:13:43 -04:00
parent b886723e2f
commit 5c13ee9dd2

View file

@ -12,7 +12,7 @@
]" ]"
for="testradio"> for="testradio">
<div class="package-specs"> <div class="package-specs">
<div v-if="this.additionalButtonData.servicePackageDiscount" class="row"> <div v-if="this.additionalButtonData.servicePackageDiscount" class="row justify-content-between">
<div class="col md-6"> <div class="col md-6">
<p class="m-0"> <p class="m-0">
<span v-html="this.buttonLabel"></span> <span v-html="this.buttonLabel"></span>
@ -136,21 +136,7 @@ export default {
</script> </script>
<style lang="scss"> <style lang="scss">
.discount-text {
line-height: 36px;
display: flex;
border-top-right-radius: 0.5rem;
border-top-left-radius: 0.5rem;
background-color: #469d2a;
align-items: center;
justify-content: center;
padding: 5px;
width: 100%;
color: white;
@include media-breakpoint-up(md) {
position: absolute;
}
}
.package-main { .package-main {
.package-wrapper { .package-wrapper {
margin: 1rem 0; margin: 1rem 0;
@ -193,7 +179,7 @@ export default {
&.has-subheader { &.has-subheader {
min-height: 80px; min-height: 80px;
@include media-breakpoint-up(md) { @include media-breakpoint-up(md) {
padding-top: 46px; padding-top: 60px;
} }
} }
&.has-text { &.has-text {
@ -367,6 +353,28 @@ export default {
} }
} }
} }
.discount-text {
line-height: 36px;
display: flex;
border-top-right-radius: 0.5rem;
border-top-left-radius: 0.5rem;
background-color: #469d2a;
align-items: center;
justify-content: center;
padding: 5px;
width: 100%;
color: white;
height: 2.875rem;
@include media-breakpoint-up(md) {
position: absolute;
z-index: 1;
}
@include media-breakpoint-up(md) {
~label .package-label:after {
top: 68px;
}
}
}
} }
} }
</style> </style>