<template>
	<view class="tabbar">
		<view :style="{ 'padding-top': tophight.top + 'px', 'padding-bottom': '15rpx',width:'100%',textAlign:'center' }">
			<view class="slot-box" :style="{'padding-left': `calc(100vw - ${tophight.right}px)`,width:'100%','padding-right': `calc(100vw - ${tophight.left}px)`,height: tophight.height + 'px'}">
				<slot></slot>
			</view>
		</view>
	</view>

</template>

<script>
	export default {
		data: () => ({
			tophight: uni.getMenuButtonBoundingClientRect(),
		}),
		mounted() {
	
		}
	};
</script>

<style lang="scss" scoped>
	.tabbar {
		display: flex;
	
		width: 750rpx;
		.slot-box{
			display: flex;
			align-items: center;
		}
	}
</style>
