<template>
    <view class="">
        <view class="top_head pr" :style="'background-color:' + bg +';'">
			<view class="head_top" :style="'height:' + topBarTop() + 'px;'"></view>
			<view class="title" :style="topBarHeight() == 0 ? '' : 'height:' + topBarHeight() + 'px;'">
                <image style="width: 48rpx;height: 48rpx;margin-top: 2rpx" src="@/static/icon/back2.png" mode=""></image>
                <view class="s-title">{{ title }}</view>
			</view>
		</view>
    </view>
</template>

<script>
    export default {
        props: {
            title: {
                type: String,
                default: '标题'
            },
            bg: {
                type: String,
                default: '#fff'
            }
        },
        data() {
            return {

            };
        },
        mounted() {
        },
        methods: {
            
        }
    };
</script>

<style lang="scss">
    .top_head {
		line-height: 30px;
		z-index: 1;
		padding-left: 26rpx;
		position: sticky;
		top: 0;
		left: 0;
		z-index: 100;
	}

	.head_top {
		width: 100%;
		height: var(--status-bar-height);
	}

    .title {
        display: flex;
        align-items: center;

        .s-title {
            font-size: 36rpx;
            color: #303133;
            line-height: 50rpx;
            margin-left: 24rpx;
        }
    }
</style>