Skip to content

杨炀 / dance-pc

Go to a project
Toggle navigation
Toggle navigation pinning
db500f7d by zhangmeng
Options

首页

1 parent 0ee396af
Inline Side-by-side
Showing 2 changed files with 206 additions and 200 deletions
src/viewsPc/index.vue
......@@ -8,13 +8,14 @@
<div class="h100" @click.stop="goMatch(n)">
<img :src="fillImgUrl(n.bgImgUrl)" class="bannerImg">
<div class="box forPc" style="position: absolute;top: 0;left: 0;right: 0;margin: auto;">
<img class="slogen" src="@/assets/logo/banner-text.png"/>
<!-- <img class="slogen" src="@/assets/logo/banner-text.png"/>-->
<img class="slogen" src="@/assets/pc/banner_text01.png"/>
<div class="btabs">
<div v-for="tab in tabList" @click.stop="goMatchWithTab(n,tab.id)">{{ tab.customTitle }}</div>
</div>
<div v-if="!liveData || liveData.videoStatus==0">
<!-- <div class="banner-count bb"></div>-->
</div>
......@@ -68,7 +69,7 @@
<img :src="fillImgUrl(n.bgImgUrl)" class="bannerImg">
<div style="position: absolute;left: 0;right: 0;bottom: 0;margin: auto;">
<!-- <img class="slogen" src="@/assets/logo/banner-text.png"/>-->
<div v-if="currentDateTime < liveData.videoStart" class="banner-count" @click="goliveUrl">
距离直播开始
<van-count-down :time="liveStartTime" format="DD 天 HH 时 mm 分 ss 秒">
......@@ -103,15 +104,15 @@
</el-carousel-item>
</el-carousel>
</div>
<div class="mb30">
<home-weather-bar lang=""/>
<home-weather-bar lang=""/>
</div>
<div class="box">
<HomeQuick :cpt-name="matchData?.name" :match-id="matchData?.id" @pick-up="handlePickup"/>
</div>
<div id="part0" class="box part">
<el-row :gutter="20">
<el-col :lg="12" :sm="24">
......@@ -136,12 +137,12 @@
<home-calendar/>
</el-card>
</el-col>
</el-row>
</div>
<!-- 新闻 -->
<div id="part1" class="part">
<div class="box">
<div class="indexTitle">
<h3 class="leftboderTT">新闻资讯</h3>
......@@ -248,13 +249,13 @@
</el-card>
</div>
</div>
<div class="box">
<el-row :gutter="20">
<el-col :lg="12">
<div class="indexTitle">
<h3 class="leftboderTT">关于我们</h3>
<!-- <a class="more" style="filter: brightness(10)">MORE</a>-->
<!-- <a class="more" style="filter: brightness(10)">MORE</a>-->
</div>
<div class="aboutBox">
<div class="content">
......@@ -264,13 +265,13 @@
<a class="btn-black" href="#/about/wuDao" style="display: inline-flex;align-items: center;">了解更多<img
src="@/assets/v1/more.png" style="filter: brightness(2);height: 8px"/></a>
</div>
</div>
</el-col>
<el-col :lg="12">
<div class="indexTitle">
<h3 class="leftboderTT">联系我们</h3>
<!-- <a class="more" style="filter: brightness(10)">MORE</a>-->
<!-- <a class="more" style="filter: brightness(10)">MORE</a>-->
</div>
<div class="mapBox">
<div class="content">
......@@ -291,7 +292,7 @@
</el-col>
</el-row>
</div>
<div class="box">
<div class="indexTitle">
<h3 class="leftboderTT">合作伙伴</h3>
......@@ -389,17 +390,17 @@ const init = () => {
).then(res => {
newest2.value = res.rows
})
getNewsListById({pageSize: 6, pageNum: 1, sortId: '20000000'}).then(res => {
newsList.value = res.rows
})
async function getMatchSet(id) {
const res = await getBaseInfoByActiveId(id)
form.value = res.data ?? null
console.log(form.value)
}
match.getMaList({topFlag: 1}).then((res) => {
maList.value = res.rows
for (let n of maList.value) {
......@@ -419,7 +420,7 @@ const init = () => {
getMatchInfo(matchData.value.id)
getMatchSet(matchData.value.id)
})
match.getLabelList().then(res => {
tabList.value = res.data
})
......@@ -525,7 +526,7 @@ const handlePickup = () => {
const goliveUrl = () => {
ElMessage.warning('暂未开放')
// if (liveData.value.videoStatus == "1") {
// window.open(liveData.value.videoUrlCn)
// } else {
......@@ -535,7 +536,7 @@ const goliveUrl = () => {
const gopicliveUrl = () => {
proxy.$modal.msgWarning('暂未开放')
return
if (liveData.value.picStatus == "1") {
window.open(liveData.value.picUrlCn)
} else {
......@@ -556,7 +557,7 @@ const gopicliveUrl = () => {
position: absolute;
bottom: 60px;
gap: 10px;
div {
color: #fff;
background-color: rgba(0, 0, 0, 0.5);
......@@ -565,7 +566,7 @@ const gopicliveUrl = () => {
border-radius: 50px;
padding: 6px 20px;
}
div:hover {
cursor: pointer;
background: #fff;
......@@ -584,18 +585,18 @@ const gopicliveUrl = () => {
.zn-Box {
.bgbg {
padding: 5%;
img {
margin: 5% 0
}
}
.itemBox {
padding: 20px 0;
}
border-radius: 15px;
.zn-btn {
background: #FFFFFF;
font-size: 18px;
......@@ -605,8 +606,8 @@ const gopicliveUrl = () => {
display: inline-flex;
align-items: center;
}
}
.app-main {
......@@ -623,24 +624,25 @@ const gopicliveUrl = () => {
height: 450px;
background: #000;
position: relative;
.slogen {
position: relative;
top: 130px;
top: 37%;
width: 48%;
}
.picliveBtn {
position: absolute;
cursor: pointer;
bottom: 24%;
font-size: 20px;
padding: 10px 25px;
right: 5%;
right: 0%;
color: #fff;
border: 2px solid rgba(255, 255, 255, 0.5);
border-radius: 50px;
}
.banner-count {
cursor: pointer;
position: absolute;
......@@ -653,9 +655,9 @@ const gopicliveUrl = () => {
bottom: 40%;
display: flex;
flex-wrap: nowrap;
right: 5%;
right: 0;
color: #fff;
.van-count-down {
display: flex;
color: #fff;
......@@ -663,7 +665,7 @@ const gopicliveUrl = () => {
width: 360px;
font-size: 41px;
}
.block {
color: #fff;
text-align: center;
......@@ -671,7 +673,7 @@ const gopicliveUrl = () => {
font-size: 41px;
font-family: DIN Alternate;
}
.colon {
color: #fff;
display: block;
......@@ -679,27 +681,27 @@ const gopicliveUrl = () => {
font-size: 20px;
}
}
.bb {
width: 580px;
justify-content: center;
height: 100px;
font-size: 30px;
}
.banner-count.bb:hover {
box-shadow: 0 0 20px #453DEA;
border-radius: 100px;
background: #000
}
.box {
position: absolute;
height: 100%;
left: 0;
right: 0;
}
h3 {
position: absolute;
color: #fff;
......@@ -708,7 +710,7 @@ const gopicliveUrl = () => {
bottom: 50px;
font-size: 3vw;
}
video {
width: 100%;
height: 100%;
......@@ -723,26 +725,26 @@ const gopicliveUrl = () => {
.banner {
position: relative;
margin: 0 0 30px;
:deep(.el-carousel__arrow) {
border-radius: 0;
.el-icon {
color: transparent;
}
&:hover {
filter: brightness(1.5)
}
}
:deep(.el-carousel__arrow--left) {
background: url("@/assets/images/prev2@2x.png") no-repeat center;
width: 78px;
height: 45px;
background-size: contain;
}
:deep(.el-carousel__arrow--right) {
background: url("@/assets/images/next2@2x.png") no-repeat center;
width: 78px;
......@@ -763,7 +765,7 @@ const gopicliveUrl = () => {
.ggbond {
height: 230px;
position: relative;
img {
height: 100%;
object-fit: cover;
......@@ -781,17 +783,17 @@ const gopicliveUrl = () => {
position: relative;
border-radius: 10px;
overflow: hidden;
.imgbox {
background: linear-gradient(0, #C8AAFC, #fff)
}
img {
height: 350px;
width: 100%;
object-fit: cover;
}
h3 {
color: #fff;
background: url("@/assets/dance/name_bg.png") no-repeat center;
......@@ -804,7 +806,7 @@ const gopicliveUrl = () => {
width: 100%;
bottom: 30px;
}
p {
text-align: center;
margin: 25px 0 0;
......@@ -815,7 +817,7 @@ const gopicliveUrl = () => {
@media screen and (max-width: 1650px) {
.teacher {
height: 320px;
.imgbox {
img {
height: 260px
......@@ -828,7 +830,7 @@ const gopicliveUrl = () => {
.teacher {
height: 450px;
margin: 0 0 20px;
.imgbox {
img {
height: 390px
......@@ -841,7 +843,7 @@ const gopicliveUrl = () => {
.teacher {
height: 400px;
margin: 0 0 20px;
.imgbox {
img {
height: 340px
......@@ -854,7 +856,7 @@ const gopicliveUrl = () => {
.teacher {
height: 400px;
margin: 0 0 20px;
.imgbox {
img {
height: 260px
......@@ -869,7 +871,7 @@ const gopicliveUrl = () => {
background-size: cover;
padding: 40px 60px;
position: relative;
.content {
font-size: 18px;
line-height: 2.2;
......@@ -878,7 +880,7 @@ const gopicliveUrl = () => {
text-align: left;
text-indent: 2em;
}
.shadowbox {
position: absolute;
left: 0;
......@@ -887,7 +889,7 @@ const gopicliveUrl = () => {
width: 100%;
background: linear-gradient(0deg, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
}
.btn-lineG {
}
}
......@@ -899,7 +901,7 @@ const gopicliveUrl = () => {
padding: 1px;
position: relative;
display: flex;
.content {
background: #fff;
width: 50%;
......@@ -911,33 +913,33 @@ const gopicliveUrl = () => {
bottom: 0;
margin: auto;
}
div {
padding-left: 60px;
}
.phone {
background: url("@/assets/dance/map01.png") no-repeat left;
background-size: 30px;
}
.address {
background: url("@/assets/dance/map02.png") no-repeat left;
background-size: 30px;
margin: 50px 0;
}
.email {
background: url("@/assets/dance/map03.png") no-repeat left;
background-size: 30px;
}
h4 {
margin: 0;
font-size: 16px;
color: #AAAAAA;
}
p {
margin: 13px 0 0;
}
......@@ -948,7 +950,7 @@ const gopicliveUrl = () => {
height: 180px;
border-radius: 10px;
margin: 0 0 30px;
img {
width: 100%;
height: 100%;
......@@ -961,7 +963,7 @@ const gopicliveUrl = () => {
position: relative;
height: 100%;
padding: 20px 45px;
.picprev {
position: absolute;
left: 5px;
......@@ -970,12 +972,12 @@ const gopicliveUrl = () => {
margin: auto;
height: 33px;
cursor: pointer;
&:hover {
filter: brightness(2)
}
}
.picnext {
position: absolute;
right: 5px;
......@@ -984,7 +986,7 @@ const gopicliveUrl = () => {
margin: auto;
height: 33px;
cursor: pointer;
&:hover {
filter: brightness(2)
}
......@@ -995,7 +997,7 @@ const gopicliveUrl = () => {
.teacher {
height: 460px;
margin: 0 0 20px;
img {
height: 400px
}
......@@ -1006,11 +1008,11 @@ const gopicliveUrl = () => {
.box {
width: 94%
}
.calendarList {
padding: 0;
ul {
li {
margin: 10px
......@@ -1026,7 +1028,7 @@ const gopicliveUrl = () => {
.teacher {
height: 320px;
margin: 0 0 20px;
img {
height: 260px
}
......@@ -1038,17 +1040,17 @@ const gopicliveUrl = () => {
div {
padding-left: 40px;
}
.content {
width: 80%;
left: 10%;
padding: 10px 20px 0 20px;
}
.address {
margin: 30px 0;
}
p {
text-align: left;
word-break: break-all;
......@@ -1063,19 +1065,19 @@ const gopicliveUrl = () => {
width: auto;
left: 0;
right: 0;
.van-count-down {
margin: 30px 0 0;
}
}
.bgbg {
text-align: center;
img {
max-width: 100%;
}
h1 {
text-align: center
}
......@@ -1088,7 +1090,7 @@ const gopicliveUrl = () => {
z-index: 2;
background: #F04035;
padding: 2px 4px;
&::after {
content: '';
width: 0;
......@@ -1099,12 +1101,12 @@ const gopicliveUrl = () => {
border-top: 24px solid #F04035;
border-right: 15px solid transparent;
}
.van-count-down {
display: flex;
color: #fff;
font-size: 14px;
.block {
color: #fff;
text-align: center;
......@@ -1120,7 +1122,7 @@ const gopicliveUrl = () => {
height: 56px;
justify-content: space-between;
cursor: pointer;
h3 {
font-weight: 400;
margin: 0;
......@@ -1131,13 +1133,13 @@ const gopicliveUrl = () => {
font-size: 18px;
color: #030303;
}
span {
font-weight: 400;
font-size: 14px;
color: #B4B6B8;
}
&:hover {
background: #F7F8FC;
}
......@@ -1152,12 +1154,12 @@ const gopicliveUrl = () => {
}
.newline {
height: 40px;
h3 {
width: 70%;
font-size: 14px;
}
span {
font-size: 12px;
}
......
src/viewsPc/index_en.vue
......@@ -8,8 +8,9 @@
<div class="h100" @click.stop="goMatch(n)">
<img :src="fillImgUrl(n.bgImgUrl)" class="bannerImg">
<div class="box" style="position: absolute;top: 0;left: 0;right: 0;margin: auto;">
<img class="slogen" src="@/assets/logo/banner-text.png"/>
<!-- <img class="slogen" src="@/assets/logo/banner-text.png"/>-->
<img class="slogen" src="@/assets/pc/banner_text01.png"/>
<div class="btabs">
<div v-for="tab in tabList" @click.stop="goMatchWithTab(n,tab.id)">{{ tab.customTitle }}</div>
</div>
......@@ -36,7 +37,7 @@
</template>
</van-count-down>
</div>
<div v-if="liveData&& liveData.videoStatus==1&&form.isLivePic==1" @click.stop="goliveUrl">
<div v-if="(currentDateTime>liveData.videoStart)&&(currentDateTime<liveData.videoEnd)"
class="banner-count">
......@@ -94,16 +95,16 @@
</el-carousel-item>
</el-carousel>
</div>
<div class="mb30">
<home-weather-bar :lang="1"/>
</div>
<div class="box">
<HomeQuick :cpt-name="matchData?.name" :match-id="matchData?.id" @pick-up="handlePickup"/>
</div>
<div id="part0" class="box part">
<el-row :gutter="20">
<el-col :lg="12" :sm="24">
......@@ -128,12 +129,12 @@
<home-calendar/>
</el-card>
</el-col>
</el-row>
</div>
<!-- NEWS -->
<div id="part1" class="part">
<div class="box">
<div class="indexTitle">
<h3 class="leftboderTT">NEWS</h3>
......@@ -183,7 +184,7 @@
</a>
</el-col>
<el-col :lg="16">
<div class="swiperPic forPx">
<swiper
:autoplay="true" :loop="true" :modules="modules" :navigation="navigationPic"
......@@ -199,7 +200,7 @@
<div class="picprev"><img src="@/assets/dance/prev1.png"></div>
<div class="picnext"><img src="@/assets/dance/next1.png"></div>
</div>
</el-col>
</el-row>
<el-row class="news-l-r">
......@@ -219,10 +220,10 @@
</el-col>
</el-row>
</el-card>
</div>
</div>
<div hidden>
<div class="box">
<div class="indexTitle">
......@@ -242,13 +243,13 @@
</el-row>
</div>
</div>
<div class="box">
<el-row :gutter="20">
<el-col :lg="12">
<div class="indexTitle">
<h3 class="leftboderTT">ABOUT US </h3>
<!-- <a class="more" style="filter: brightness(10)">MORE</a>-->
<!-- <a class="more" style="filter: brightness(10)">MORE</a>-->
</div>
<div class="aboutBox">
<div class="content">
......@@ -259,13 +260,13 @@
<a class="btn-lineG" href="#/about/wuDao" style="display: inline-flex;align-items: center;">Learn more
<img src="@/assets/v1/more.png" style="filter: brightness(2);height: 8px;margin-left: 10px"></a>
</div>
</div>
</el-col>
<el-col :lg="12">
<div class="indexTitle">
<h3 class="leftboderTT">CONTACT US</h3>
<!-- <a class="more" href="#/about/wuDao" style="filter: brightness(10)">MORE</a>-->
<!-- <a class="more" href="#/about/wuDao" style="filter: brightness(10)">MORE</a>-->
</div>
<div class="mapBox">
<div class="content">
......@@ -286,7 +287,7 @@
</el-col>
</el-row>
</div>
<div class="box">
<div class="indexTitle">
<h3 class="leftboderTT">PARTNERS</h3>
......@@ -299,8 +300,8 @@
</el-col>
</el-row>
</div>
</div>
</template>
<script setup>
......@@ -405,12 +406,12 @@ const init = () => {
matchData.value = maList.value[0]
getMatchInfo(matchData.value.id)
getMatchSet(matchData.value.id)
})
match.getLabelList().then(res => {
tabList.value = res.data
})
getpartners()
}
const getMatchInfo = (id) => {
......@@ -554,7 +555,7 @@ const goDetail = (n) => {
position: absolute;
bottom: 60px;
gap: 10px;
div {
color: #fff;
background-color: rgba(0, 0, 0, 0.5);
......@@ -563,7 +564,7 @@ const goDetail = (n) => {
border-radius: 50px;
padding: 6px 20px;
}
div:hover {
cursor: pointer;
background: #fff;
......@@ -581,29 +582,29 @@ const goDetail = (n) => {
background-size: contain;
position: relative;
overflow: hidden;
.bbbg {
position: absolute;
width: 100%;
height: 100%;
object-fit: cover;
}
.bgbg {
height: 100%;
padding: 5%;
display: flex;
flex-direction: column;
justify-content: center;
img {
margin: 5% 0
}
}
.itemBox {
padding: 20px 40px;
p {
margin: 0;
height: 40px;
......@@ -612,9 +613,9 @@ const goDetail = (n) => {
align-items: center;
}
}
border-radius: 15px;
.zn-btn {
background: #FFFFFF;
text-transform: uppercase;
......@@ -627,7 +628,7 @@ const goDetail = (n) => {
display: inline-flex;
align-items: center;
}
.item {
box-shadow: 0px 0px 21px 0px rgba(41, 23, 101, 0.14);
margin: 40px 0 0;
......@@ -641,7 +642,7 @@ const goDetail = (n) => {
background-size: cover;
position: relative;
border-radius: 15px;
img {
position: absolute;
top: -30px
......@@ -670,12 +671,15 @@ const goDetail = (n) => {
height: 450px;
background: #000;
position: relative;
.slogen {
position: relative;
top: 130px;
top: 37%;
//left: -120px;
//图片按比例缩放
width: 48%;
}
.banner-count {
position: absolute;
padding: 20px 40px;
......@@ -693,9 +697,9 @@ const goDetail = (n) => {
bottom: 40%;
display: flex;
flex-wrap: nowrap;
right: 5%;
right: 0;
color: #fff;
.van-count-down {
display: flex;
color: #fff;
......@@ -703,7 +707,7 @@ const goDetail = (n) => {
width: 360px;
font-size: 41px;
}
.block {
color: #fff;
text-align: center;
......@@ -711,7 +715,7 @@ const goDetail = (n) => {
font-size: 41px;
font-family: DIN Alternate;
}
.colon {
color: #fff;
display: block;
......@@ -719,27 +723,27 @@ const goDetail = (n) => {
font-size: 20px;
}
}
.bb {
width: 580px;
justify-content: center;
height: 100px;
font-size: 30px;
}
.banner-count.bb:hover {
box-shadow: 0 0 20px #453DEA;
border-radius: 100px;
background: #000
}
.box {
position: absolute;
height: 100%;
left: 0;
right: 0;
}
h3 {
position: absolute;
color: #fff;
......@@ -748,7 +752,7 @@ const goDetail = (n) => {
bottom: 50px;
font-size: 3vw;
}
video {
width: 100%;
height: 100%;
......@@ -763,26 +767,26 @@ const goDetail = (n) => {
.banner {
position: relative;
margin: 0 0 30px;
:deep(.el-carousel__arrow) {
border-radius: 0;
.el-icon {
color: transparent;
}
&:hover {
filter: brightness(1.5)
}
}
:deep(.el-carousel__arrow--left) {
background: url("@/assets/images/prev2@2x.png") no-repeat center;
width: 78px;
height: 45px;
background-size: contain;
}
:deep(.el-carousel__arrow--right) {
background: url("@/assets/images/next2@2x.png") no-repeat center;
width: 78px;
......@@ -796,38 +800,38 @@ const goDetail = (n) => {
--el-calendar-cell-width: 40px;
text-align: center;
--el-text-color-regular: #8E8D94;
:deep(.el-calendar__header) {
justify-content: center;
padding: 0 0 10px
}
:deep(.el-calendar__body) {
border: 1px solid #F0F0F0;
padding: 0
}
:deep(.el-calendar-table .el-calendar-day) {
padding: 1px;
}
:deep(.el-calendar-table td.is-selected) {
background: transparent;
}
:deep(.el-calendar__button-group) {
display: none;
}
:deep(.el-calendar-table thead th) {
padding: 5px 0 0
}
.primaryDate {
color: #fff;
background: #000;
}
.date {
margin: auto;
border-radius: 50%;
......@@ -843,7 +847,7 @@ const goDetail = (n) => {
padding: 12px 20px;
overflow: auto;
height: 233px;
ul {
li {
background: #F6F9FE;
......@@ -853,11 +857,11 @@ const goDetail = (n) => {
border-radius: 10px;
font-weight: 500;
font-size: 15px;
label {
color: #000;
margin-right: 15px;
&::before {
content: '';
background: #fff;
......@@ -873,7 +877,7 @@ const goDetail = (n) => {
}
}
}
li::before {
content: '';
background: #000;
......@@ -887,7 +891,7 @@ const goDetail = (n) => {
margin: auto;
z-index: 1;
}
li::after {
content: '';
left: -16px;
......@@ -897,11 +901,11 @@ const goDetail = (n) => {
position: absolute;
top: 20px
}
li:hover {
color: #fff;
background: #000;
label {
color: #fff;
}
......@@ -918,7 +922,7 @@ const goDetail = (n) => {
.ggbond {
height: 230px;
position: relative;
img {
height: 100%;
object-fit: cover;
......@@ -936,17 +940,17 @@ const goDetail = (n) => {
position: relative;
border-radius: 10px;
overflow: hidden;
.imgbox {
background: linear-gradient(0, #C8AAFC, #fff)
}
img {
height: 350px;
width: 100%;
object-fit: cover;
}
h3 {
color: #fff;
background: url("@/assets/dance/name_bg.png") no-repeat center;
......@@ -959,7 +963,7 @@ const goDetail = (n) => {
width: 100%;
bottom: 30px;
}
p {
text-align: center;
margin: 25px 0 0;
......@@ -970,7 +974,7 @@ const goDetail = (n) => {
@media screen and (max-width: 1650px) {
.teacher {
height: 320px;
.imgbox {
img {
height: 260px
......@@ -983,7 +987,7 @@ const goDetail = (n) => {
.teacher {
height: 450px;
margin: 0 0 20px;
.imgbox {
img {
height: 390px
......@@ -996,7 +1000,7 @@ const goDetail = (n) => {
.teacher {
height: 400px;
margin: 0 0 20px;
.imgbox {
img {
height: 340px
......@@ -1009,7 +1013,7 @@ const goDetail = (n) => {
.teacher {
height: 400px;
margin: 0 0 20px;
.imgbox {
img {
height: 260px
......@@ -1024,7 +1028,7 @@ const goDetail = (n) => {
background-size: cover;
padding: 40px 60px;
position: relative;
.content {
font-size: 18px;
line-height: 2.2;
......@@ -1033,7 +1037,7 @@ const goDetail = (n) => {
text-align: left;
text-indent: 2em;
}
.shadowbox {
position: absolute;
left: 0;
......@@ -1042,7 +1046,7 @@ const goDetail = (n) => {
width: 100%;
background: linear-gradient(0deg, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
}
.btn-lineG {
}
}
......@@ -1054,7 +1058,7 @@ const goDetail = (n) => {
padding: 1px;
position: relative;
display: flex;
.content {
background: #fff;
width: 50%;
......@@ -1066,33 +1070,33 @@ const goDetail = (n) => {
bottom: 0;
margin: auto;
}
div {
padding-left: 60px;
}
.phone {
background: url("@/assets/dance/map01.png") no-repeat left;
background-size: 30px;
}
.address {
background: url("@/assets/dance/map02.png") no-repeat left;
background-size: 30px;
margin: 50px 0;
}
.email {
background: url("@/assets/dance/map03.png") no-repeat left;
background-size: 30px;
}
h4 {
margin: 0;
font-size: 16px;
color: #AAAAAA;
}
p {
margin: 13px 0 0;
}
......@@ -1103,7 +1107,7 @@ const goDetail = (n) => {
height: 180px;
border-radius: 10px;
margin: 0 0 30px;
img {
width: 100%;
height: 100%;
......@@ -1116,7 +1120,7 @@ const goDetail = (n) => {
position: relative;
height: 100%;
padding: 20px 45px;
.picprev {
position: absolute;
left: 5px;
......@@ -1125,12 +1129,12 @@ const goDetail = (n) => {
margin: auto;
height: 33px;
cursor: pointer;
&:hover {
filter: brightness(2)
}
}
.picnext {
position: absolute;
right: 5px;
......@@ -1139,7 +1143,7 @@ const goDetail = (n) => {
margin: auto;
height: 33px;
cursor: pointer;
&:hover {
filter: brightness(2)
}
......@@ -1152,7 +1156,7 @@ const goDetail = (n) => {
height: 56px;
justify-content: space-between;
cursor: pointer;
h3 {
font-weight: 400;
margin: 0;
......@@ -1163,13 +1167,13 @@ const goDetail = (n) => {
font-size: 18px;
color: #030303;
}
span {
font-weight: 400;
font-size: 14px;
color: #B4B6B8;
}
&:hover {
background: #F7F8FC;
}
......@@ -1178,12 +1182,12 @@ const goDetail = (n) => {
@media (max-width: 800px) {
.newline {
height: 40px;
h3 {
width: 70%;
font-size: 14px;
}
span {
font-size: 12px;
}
......@@ -1193,7 +1197,7 @@ const goDetail = (n) => {
}
.calendarList {
padding: 0;
ul {
li {
margin: 10px
......@@ -1209,7 +1213,7 @@ const goDetail = (n) => {
.teacher {
height: 320px;
margin: 0 0 20px;
img {
height: 260px
}
......@@ -1221,17 +1225,17 @@ const goDetail = (n) => {
div {
padding-left: 40px;
}
.content {
width: 80%;
left: 10%;
padding: 10px 20px 0 20px;
}
.address {
margin: 30px 0;
}
p {
text-align: left;
word-break: break-all;
......@@ -1246,14 +1250,14 @@ const goDetail = (n) => {
width: auto;
left: 0;
right: 0;
.van-count-down {
margin: 30px 0 0;
}
}
.bgbg {
text-align: center;
h1 {
text-align: center
}
......@@ -1268,7 +1272,7 @@ const goDetail = (n) => {
//padding: 10px 20px;
//display: inline-flex;
//align-items: center;
padding: 20px 40px;
font-size: 20px;
align-items: center;
......@@ -1311,7 +1315,7 @@ const goDetail = (n) => {
z-index: 2;
background: #F04035;
padding: 2px 4px;
&::after {
content: '';
width: 0;
......@@ -1322,12 +1326,12 @@ const goDetail = (n) => {
border-top: 24px solid #F04035;
border-right: 15px solid transparent;
}
.van-count-down {
display: flex;
color: #fff;
font-size: 14px;
.block {
color: #fff;
text-align: center;
......@@ -1343,11 +1347,11 @@ const goDetail = (n) => {
}
.zn-Box .bgbg {
padding: 10px 0 0;
.mb30 {
margin: 0
}
.zn-btn {
margin-top: 10px
}
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!