hookehuyr

style(Dashboard): 调整家庭信息展示样式和透明度

将家庭名称和标语从背景图中移出,改为独立展示
降低背景图遮罩层的透明度
......@@ -3,17 +3,21 @@
<!-- Hero section with family name and background image -->
<view class=" bg-white rounded-xl shadow-md mx-4 mt-4 relative" style="height: 30vh;">
<image :src="familyCover" mode="aspectFill" alt="Family background" class="w-full h-full object-cover rounded-xl" />
<view class="absolute inset-0 flex flex-col justify-end rounded-xl bg-black bg-opacity-20">
<view class="absolute inset-0 flex flex-col justify-end rounded-xl bg-black bg-opacity-10">
<view class="m-5">
<view v-if="familyOwner" class="absolute top-4 right-4 text-white flex items-center" @click="goToProfile">
<Setting size="20" />
<text class="ml-2 text-sm">家庭设置</text>
</view>
<h1 class="text-white text-2xl font-bold">{{ familyName }}</h1>
<p class="text-white opacity-90">{{ familySlogn }}</p>
<!-- <h1 class="text-white text-2xl font-bold">{{ familyName }}</h1>
<p class="text-white opacity-90">{{ familySlogn }}</p> -->
</view>
</view>
</view>
<view class=" mx-4 mt-4 px-2 py-2">
<h1 class="text-gray-800 text-xl font-bold mb-1">{{ familyName }}</h1>
<p class="text-gray-600 opacity-90">{{ familySlogn }}</p>
</view>
<!-- 微信步数授权组件 -->
<WeRunAuth
......