sxc-frontend/miniprogram/components/SsHeadline.vue

<script setup lang="ts">
import { useGlobalStore } from '@/stores/global';

const global = useGlobalStore();
</script>

<template>
	<view class="headline" :class="{ spread: global.spread }">
		<view class="title">随时随地，问问商小川</view>
	</view>
</template>

<style scoped lang="scss">
.headline {
	margin-bottom: 32rpx;
	transition: all 0.3s linear;
	overflow: hidden;

	.title {
		color: #101333;
		font-size: 56rpx;
		line-height: 56rpx;
		font-weight: 600;
		margin: 32rpx 0;
		text-align: center;
	}

	&.spread {
		height: 0;
		margin-bottom: 0;
	}
}
</style>