<template>
	<view class="base-title-box">
		<view class="base-title-line" />
		<u--text :lines="1" align='left' :size='fontSize' :text="txt" :color="color"></u--text>
	</view>
</template>

<script>
	export default {
		// BaseTitle
		name: "base-title",
		props: {
			txt: {
				type: String,
				default: "",
			},
			fontSize: {
				type: String,
				default: "28rpx",
			},
			color: {
				type: String,
				default: "#232323",
			},
		},
		computed: {
			getTitleStyle() {
				return "font-size:" + this.fontSize + ";"
			},
		},
		data() {
			return {

			};
		}
	}
</script>

<style lang="scss" scoped>
	.base-title-box {
		width: 100%;
		height: 80rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
	}

	.base-title-line {
		margin-left: 20rpx;
		margin-right: 8rpx;
		width: 4rpx;
		height: 24rpx;
		background: linear-gradient(180deg, #9276FE 0%, rgba(225, 217, 255, 0.85) 93%, rgba(231, 224, 255, 0) 100%);
	}
</style>
