<template>
	<view>
		<view class="flex align-center">
			<view class="lineBar" :style="{'background':bgColor}">

			</view>
			<view class="text" :style="{'fontSize':fontSize}">
				{{title}}
			</view>
			<slot></slot>
		</view>
	</view>
</template>

<script>
	export default {
		name: "titleSection",
		props: {
			title: {
				type: String,
				default: ""
			},
			bgColor: {
				type: String,
				default: ""
			},
			fontSize: {
				type: String,
				default: "16px"
			},
		},
		data() {
			return {

			};
		}
	}
</script>

<style lang="scss">
	.lineBar {
		content: " ";
		width: 3px;
		height: 15px;
		margin: 0 10px 0 0;
	}
</style>