massage-front/components/base/cardTitle.vue

<template>
  <view class="flex title__view">
    <view class="underline"></view>
    <view class="title">
      <slot></slot>
    </view>
  </view>
</template>


<script>
	export default {
		data() {
			return {
      }
    }
  }
</script>

<style scoped lang="scss">

.title__view {
  position: relative;

  .underline {
    margin-top: 26rpx;
    width: 146rpx;
    height: 8rpx;
    border-radius: 4rpx;
    background-image: linear-gradient(to right, #84A73F, #D8FF8F);
  }
  .title {
    transform: translateX(-10rpx);
    color: #000000;
    font-size: 28rpx;
    font-weight: 700;
    position: absolute;
    top: 0;
  }
}
</style>