Commit a6044025 authored by youjie's avatar youjie

样式调整

parent 206296cf
...@@ -143,21 +143,16 @@ ...@@ -143,21 +143,16 @@
<style scoped> <style scoped>
@import url("../../assets/css/home.css"); @import url("../../assets/css/home.css");
@import url("../../assets/css/app.css"); @import url("../../assets/css/app.css");
</style>
<style scoped>
/* 整个平台区域 */ /* 整个平台区域 */
.platTabs { .platTabs {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center;
} }
/* tabs 导航 */ /* tabs 导航 */
.platTabs-nav { .platTabs-nav {
display: flex; display: flex;
gap: 24px; gap: 53px;
margin-bottom: 12px; margin-bottom: 12px;
} }
...@@ -182,18 +177,18 @@ ...@@ -182,18 +177,18 @@
bottom: 0; bottom: 0;
width: 100%; width: 100%;
height: 1px; height: 1px;
background: #fff; background: linear-gradient(to right, #052032, #fff, #052032);
} }
/* 内容区,防止切换时高度抖动 */ /* 内容区,防止切换时高度抖动 */
.platTabs-content { .platTabs-content {
min-height: 170px; min-height: 170px;
display: flex; display: flex;
align-items: center;
} }
/* 二维码容器:从左 → 右,自动换行 */ /* 二维码容器:从左 → 右,自动换行 */
.plat-qrs { .plat-qrs {
width: 440px;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
gap: 10px; gap: 10px;
...@@ -209,6 +204,10 @@ ...@@ -209,6 +204,10 @@
display: block; display: block;
} }
.plat-qrs{
font-size: 12px;
}
</style> </style>
<template> <template>
<div class="relative newHor_BtmContent" v-if="dataList&&dataList.Config"> <div class="relative newHor_BtmContent" v-if="dataList&&dataList.Config">
...@@ -217,7 +216,7 @@ ...@@ -217,7 +216,7 @@
<q-img :src="dataList.Config.FootLogo2" style="width:40px;height:auto;" /> <q-img :src="dataList.Config.FootLogo2" style="width:40px;height:auto;" />
</div> </div>
<div class="row justify-between items-end"> <div class="row justify-between items-center">
<div class="column"> <div class="column">
<div class="row newLogoText q-pb-lg"> <div class="row newLogoText q-pb-lg">
<span class="text-logo">和平旅行社</span> <span class="text-logo">和平旅行社</span>
...@@ -247,7 +246,13 @@ ...@@ -247,7 +246,13 @@
</li> </li>
</ul> </ul>
</div> </div>
<div :class="[$q.platform.is.desktop?'':'q-pt-lg']">
</div>
<div class="row q-pt-lg q-mt-lg">
<div
style="width: 414px;"
class="column items-start"
:class="[$q.platform.is.desktop?'':'q-pt-lg']">
<ul class="text-xs font-light newHor-right"> <ul class="text-xs font-light newHor-right">
<li class="flex -mx-4 my-2 tracking-2 sm:justify-end opacity-70"> <li class="flex -mx-4 my-2 tracking-2 sm:justify-end opacity-70">
<span class="inline-block px-4 icon-slash icon-slash-white">代表人</span> <span class="inline-block px-4 icon-slash icon-slash-white">代表人</span>
...@@ -267,7 +272,7 @@ ...@@ -267,7 +272,7 @@
</li> </li>
</ul> </ul>
</div> </div>
<div class="platTabs"> <div class="platTabs col items-center">
<!-- tabs --> <!-- tabs -->
<div class="platTabs-nav"> <div class="platTabs-nav">
<span v-for="tab in tabs" :key="tab.key" :class="['platTabs-tab', { active: activeTab === tab.key }]" <span v-for="tab in tabs" :key="tab.key" :class="['platTabs-tab', { active: activeTab === tab.key }]"
...@@ -279,8 +284,14 @@ ...@@ -279,8 +284,14 @@
<div class="platTabs-content"> <div class="platTabs-content">
<!-- 公众号 / 微博 --> <!-- 公众号 / 微博 -->
<div v-show="activeTab === 'mp'" class="plat-qrs"> <div v-show="activeTab === 'mp'" class="plat-qrs">
<img v-if="yyzlImg" :src="yyzlImg" /> <div class="column text-center">
<img v-if="wbImg" :src="wbImg" /> <img v-if="yyzlImg" :src="yyzlImg" />
<div class="q-pt-sm tracking-2 opacity-70">公众号</div>
</div>
<div class="column text-center">
<img v-if="wbImg" :src="wbImg" />
<div class="q-pt-sm tracking-2 opacity-70">微博</div>
</div>
</div> </div>
<!-- 小红书 --> <!-- 小红书 -->
<div v-show="activeTab === 'xhs'" class="plat-qrs"> <div v-show="activeTab === 'xhs'" class="plat-qrs">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment