Skip to content

P
project-www-pc
提交 1d9cb3fc authored 作者: lhh's avatar lhh
浏览文件
操作

update

上级 79672f9b
隐藏空白字符变更
内嵌 并排
正在显示 包含 209 行增加 和 67 行删除
components/AppCard.vue
浏览文件 @ 1d9cb3fc
...@@ -37,7 +37,8 @@ export default { ...@@ -37,7 +37,8 @@ export default {
font-size: 32px; font-size: 32px;
font-weight: bold; font-weight: bold;
line-height: 1; line-height: 1;
text-align: v-bind(titleAlign); // text-align: v-bind(titleAlign);
text-align: center;
a:hover { a:hover {
color: var(--main-color); color: var(--main-color);
} }
......
components/home/abroadStudy.vue
浏览文件 @ 1d9cb3fc
<template> <template>
<AppCard title="$t('home.abroad.title')" titleAlign="center"> <div
<template #title> style="padding:100px 0 40px;background: url(https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/240531/lx-bg.png); background-size: cover;"
<nuxt-link to="/studyAbroad">{{ $t('home.abroad.title') }}</nuxt-link> >
</template> <AppCard title="$t('home.abroad.title')" titleAlign="center" style="margin: 0 auto">
<div class="box-row"> <template #title>
<div class="box-l"> <nuxt-link to="/studyAbroad">{{ $t('home.abroad.title') }}</nuxt-link>
<div class="box-red_title">学历项目</div> </template>
<div class="box-l_master" v-for="item in abroadList"> <div class="box-row">
<div class="box-col__title" style="margin-top: 35px">{{ item.title }}</div> <div class="box-l">
<div class="box-l_list"> <div class="box-red_title">学历项目</div>
<div class="box-l_item" v-for="cItem in item.children"> <div class="box-l_master" v-for="item in abroadList">
<div class="box-item_title">{{ cItem.title }}</div> <div class="box-col__title" style="margin-top: 35px">{{ item.title }}</div>
<img :src="cItem.img" class="box-item_logo" /> <div class="box-l_list">
<div class="box-item_btns"> <div class="box-l_item" v-for="cItem in item.children">
<a :href="btn.href" v-for="btn in cItem.btn" target="_blank"> <div class="box-item_title">{{ cItem.title }}</div>
<div class="box-item_btn" v-html="btn.name"></div> <img :src="cItem.img" class="box-item_logo" />
</a> <div class="box-item_btns">
<a :href="btn.href" v-for="btn in cItem.btn" target="_blank">
<div class="box-item_btn" v-html="btn.name"></div>
</a>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> <div class="box-r">
<div class="box-r"> <div class="box-red_title">非学历项目</div>
<div class="box-red_title">非学历项目</div> <div class="box-block" style="margin: 75px 0 30px">
<div class="box-block" style="margin: 75px 0 30px"> <img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/fxl-img1.png" />
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/fxl-img1.png" /> <div style="margin-left: 10px;" class="btn">交换生项目</div>
<div style="margin-left: 10px;" class="btn">交换生项目</div> </div>
</div> <div class="box-block">
<div class="box-block"> <img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/fxl-img2.png" />
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/fxl-img2.png" /> <div style="margin-left: 10px;" class="btn">教师访学项目</div>
<div style="margin-left: 10px;" class="btn">教师访学项目</div> </div>
</div> </div>
</div> </div>
</div> <!-- <div class="box-row">
<!-- <div class="box-row"> <div class="box-col" v-for="(col, index) in abroadList" :key="index">
<div class="box-col" v-for="(col, index) in abroadList" :key="index"> <div class="box-col__title">{{ col.title }}</div>
<div class="box-col__title">{{ col.title }}</div> <ul class="box-wrap">
<ul class="box-wrap"> <li v-for="(item, index) in col.children" :key="index">
<li v-for="(item, index) in col.children" :key="index"> <AppLink :data="item">
<AppLink :data="item"> <div class="box-inner">
<div class="box-inner"> <img :src="item.img" class="box-pic" />
<img :src="item.img" class="box-pic" /> <div class="box-desc" v-html="item.desc"></div>
<div class="box-desc" v-html="item.desc"></div> </div>
</div> </AppLink>
</AppLink> </li>
</li> </ul>
</ul> </div>
</div> </div> -->
</div> --> </AppCard>
</AppCard> </div>
</template> </template>
<script> <script>
...@@ -165,10 +169,19 @@ export default { ...@@ -165,10 +169,19 @@ export default {
.box-block { .box-block {
width: 300px; width: 300px;
height: 106px; height: 106px;
background: #ffffff; // background: #ffffff;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
border-radius: 12px 12px 12px 12px;
img {
width: 150px;
height: 80px;
object-fit: cover;
}
&:hover {
background-color: #aa1941;
}
.btn { .btn {
min-width: 120px; min-width: 120px;
// line-height: 30px; // line-height: 30px;
...@@ -176,11 +189,11 @@ export default { ...@@ -176,11 +189,11 @@ export default {
text-align: center; text-align: center;
font-size: 12px; font-size: 12px;
color: #333333; color: #333333;
border: 1px solid #d5d5d5; // border: 1px solid #d5d5d5;
cursor: pointer; cursor: pointer;
&:hover { &:hover {
background-color: #aa1941; // background-color: #aa1941;
border: 1px solid #aa1941; // border: 1px solid #aa1941;
color: #fff; color: #fff;
} }
} }
...@@ -203,40 +216,48 @@ export default { ...@@ -203,40 +216,48 @@ export default {
margin-bottom: 30px; margin-bottom: 30px;
min-width: 180px; min-width: 180px;
// height: 230px; // height: 230px;
background-color: #fff; // background-color: #fff;
margin-right: 30px; margin-right: 30px;
padding: 10px 15px 0; padding: 14px 15px 0;
border-radius: 12px 12px 12px 12px;
&:hover {
background: #aa1941;
.box-item_title {
color: #fff;
}
}
.box-item_title { .box-item_title {
font-size: 12px; font-size: 15px;
font-weight: bold; font-weight: bold;
color: #333333; color: #aa1941;
line-height: 100%; line-height: 100%;
margin-bottom: 10px; margin-bottom: 10px;
text-align: center; text-align: center;
} }
.box-item_btns { .box-item_btns {
width: 150px; width: 150px;
border-top: 1px dashed #f47524; // border-top: 1px dashed #f47524;
margin-top: 10px; // margin-top: 10px;
padding-top: 10px; padding-top: 10px;
height: 140px; padding-bottom: 20px;
// height: 140px;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: center; justify-content: center;
align-items: center; // align-items: center;
.box-item_btn { .box-item_btn {
min-width: 120px; min-width: 120px;
// line-height: 30px; // line-height: 30px;
padding: 6px 0; padding: 6px 0;
margin-bottom: 8px; // margin-bottom: 8px;
text-align: center; text-align: center;
font-size: 12px; font-size: 12px;
color: #333333; color: #333333;
border: 1px solid #d5d5d5; // border: 1px solid #d5d5d5;
cursor: pointer; cursor: pointer;
&:hover { &:hover {
background-color: #aa1941; // background-color: #aa1941;
border: 1px solid #aa1941; // border: 1px solid #aa1941;
color: #fff; color: #fff;
} }
} }
...@@ -286,4 +307,9 @@ export default { ...@@ -286,4 +307,9 @@ export default {
// text-align: center; // text-align: center;
// } // }
// } // }
.box-item_logo {
width: 150px;
height: 80px;
object-fit: cover;
}
</style> </style>
components/home/digital.vue
浏览文件 @ 1d9cb3fc
...@@ -22,7 +22,21 @@ ...@@ -22,7 +22,21 @@
</ul> </ul>
</div> </div>
</div> </div>
<div class="col2"> <div class="col3" v-for="item in newList2">
<div class="left">{{ item.title }}</div>
<div class="right">
<template v-for="cItem in item.children">
<AppLink :to="cItem.path">
<div class="item">
<img :src="cItem.icon" class="img" />
<img :src="cItem.hoverIcon" class="imga" />
<div class="name">{{ cItem.name }}</div>
</div>
</AppLink>
</template>
</div>
</div>
<!-- <div class="col2">
<ul> <ul>
<li class="item" v-for="item in list2" :key="item.title" :style="item.style"> <li class="item" v-for="item in list2" :key="item.title" :style="item.style">
<AppLink :to="item.path"> <AppLink :to="item.path">
...@@ -34,7 +48,7 @@ ...@@ -34,7 +48,7 @@
</AppLink> </AppLink>
</li> </li>
</ul> </ul>
</div> </div> -->
</AppCard> </AppCard>
</template> </template>
...@@ -155,6 +169,54 @@ export default { ...@@ -155,6 +169,54 @@ export default {
title: '职业技能大赛', title: '职业技能大赛',
path: 'digital/ds' path: 'digital/ds'
} }
],
newList2: [
{
title: '职业技能大赛',
children: [
{
name: '国赛',
icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/240531/ds-icon1.png',
hoverIcon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/240531/ds-icon1a.png',
path: 'digital/ds'
},
{
name: '省赛',
icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/240531/ds-icon2.png',
hoverIcon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/240531/ds-icon2a.png',
path: 'digital/ds'
},
{
name: '行业赛',
icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/240531/ds-icon3.png',
hoverIcon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/240531/ds-icon3a.png',
path: 'digital/ds'
}
]
},
{
title: '数字教材',
children: [
{
name: '数字教材编辑器',
icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/240531/jc-icon1.png',
hoverIcon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/240531/jc-icon1a.png',
path: 'digital/sz'
},
{
name: '数字教材出版',
icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/240531/jc-icon2.png',
hoverIcon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/240531/jc-icon2a.png',
path: 'digital/sz'
},
{
name: '数智化教学',
icon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/240531/jc-icon3.png',
hoverIcon: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/240531/jc-icon3a.png',
path: 'digital/sz'
}
]
}
] ]
} }
} }
...@@ -169,6 +231,7 @@ export default { ...@@ -169,6 +231,7 @@ export default {
.col { .col {
flex: 1; flex: 1;
background-color: #fff; background-color: #fff;
box-shadow: 0px 3px 12px 1px rgba(0, 0, 0, 0.16);
&:first-child { &:first-child {
flex: 0 0 694px; flex: 0 0 694px;
} }
...@@ -271,4 +334,56 @@ export default { ...@@ -271,4 +334,56 @@ export default {
justify-content: center; justify-content: center;
} }
} }
.col3 {
display: flex;
background-color: #fff;
margin-top: 30px;
box-shadow: 0px 3px 12px 1px rgba(0, 0, 0, 0.16);
.left {
min-width: 259px;
line-height: 104px;
background: #aa1941;
font-weight: bold;
font-size: 26px;
color: #ffffff;
text-align: center;
}
.right {
display: flex;
justify-content: space-around;
align-items: center;
flex: 1;
.item {
display: flex;
align-items: center;
width: 220px;
line-height: 64px;
border: 1px solid #d5d5d5;
&:hover {
background-color: #aa1941;
.name {
color: #fff;
}
.img {
display: none;
}
.imga {
display: block;
}
}
img {
margin-left: 30px;
}
.imga {
display: none;
}
.name {
margin-left: 5px;
font-size: 16px;
color: #6c6c6c;
letter-spacing: 2px;
}
}
}
}
</style> </style>
pages/digital/ds.vue
浏览文件 @ 1d9cb3fc
...@@ -265,7 +265,7 @@ export default { ...@@ -265,7 +265,7 @@ export default {
justify-content: space-between; justify-content: space-between;
.sx-list_item { .sx-list_item {
width: 370px; width: 370px;
border: 1px solid #dbdbdb; // border: 1px solid #dbdbdb;
padding: 19px 25px 25px; padding: 19px 25px 25px;
box-sizing: border-box; box-sizing: border-box;
cursor: pointer; cursor: pointer;
......
pages/digital/yx_1.vue
浏览文件 @ 1d9cb3fc
...@@ -243,7 +243,7 @@ export default { ...@@ -243,7 +243,7 @@ export default {
} }
} }
.is-border { .is-border {
border: 1px solid #d5d5d5; // border: 1px solid #d5d5d5;
} }
.gk-list { .gk-list {
margin-top: 100px; margin-top: 100px;
...@@ -254,7 +254,7 @@ export default { ...@@ -254,7 +254,7 @@ export default {
.gk-item { .gk-item {
min-height: 280px; min-height: 280px;
text-align: center; text-align: center;
background: #fff; // background: #fff;
transition: all 0.3s; transition: all 0.3s;
&:hover { &:hover {
transform: scale(1.06); transform: scale(1.06);
...@@ -299,7 +299,7 @@ export default { ...@@ -299,7 +299,7 @@ export default {
font-family: Source Han Sans CN; font-family: Source Han Sans CN;
font-weight: 500; font-weight: 500;
line-height: 24px; line-height: 24px;
color: #333; color: #AA1941;
} }
p { p {
margin: 12px 0; margin: 12px 0;
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论