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 {
font-size: 32px;
font-weight: bold;
line-height: 1;
text-align: v-bind(titleAlign);
// text-align: v-bind(titleAlign);
text-align: center;
a:hover {
color: var(--main-color);
}
......
components/home/abroadStudy.vue
浏览文件 @ 1d9cb3fc
<template>
<AppCard title="$t('home.abroad.title')" titleAlign="center">
<template #title>
<nuxt-link to="/studyAbroad">{{ $t('home.abroad.title') }}</nuxt-link>
</template>
<div class="box-row">
<div class="box-l">
<div class="box-red_title">学历项目</div>
<div class="box-l_master" v-for="item in abroadList">
<div class="box-col__title" style="margin-top: 35px">{{ item.title }}</div>
<div class="box-l_list">
<div class="box-l_item" v-for="cItem in item.children">
<div class="box-item_title">{{ cItem.title }}</div>
<img :src="cItem.img" class="box-item_logo" />
<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
style="padding:100px 0 40px;background: url(https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/240531/lx-bg.png); background-size: cover;"
>
<AppCard title="$t('home.abroad.title')" titleAlign="center" style="margin: 0 auto">
<template #title>
<nuxt-link to="/studyAbroad">{{ $t('home.abroad.title') }}</nuxt-link>
</template>
<div class="box-row">
<div class="box-l">
<div class="box-red_title">学历项目</div>
<div class="box-l_master" v-for="item in abroadList">
<div class="box-col__title" style="margin-top: 35px">{{ item.title }}</div>
<div class="box-l_list">
<div class="box-l_item" v-for="cItem in item.children">
<div class="box-item_title">{{ cItem.title }}</div>
<img :src="cItem.img" class="box-item_logo" />
<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 class="box-r">
<div class="box-red_title">非学历项目</div>
<div class="box-block" style="margin: 75px 0 30px">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/fxl-img1.png" />
<div style="margin-left: 10px;" class="btn">交换生项目</div>
</div>
<div class="box-block">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/fxl-img2.png" />
<div style="margin-left: 10px;" class="btn">教师访学项目</div>
<div class="box-r">
<div class="box-red_title">非学历项目</div>
<div class="box-block" style="margin: 75px 0 30px">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/fxl-img1.png" />
<div style="margin-left: 10px;" class="btn">交换生项目</div>
</div>
<div class="box-block">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/www/pc/fxl-img2.png" />
<div style="margin-left: 10px;" class="btn">教师访学项目</div>
</div>
</div>
</div>
</div>
<!-- <div class="box-row">
<div class="box-col" v-for="(col, index) in abroadList" :key="index">
<div class="box-col__title">{{ col.title }}</div>
<ul class="box-wrap">
<li v-for="(item, index) in col.children" :key="index">
<AppLink :data="item">
<div class="box-inner">
<img :src="item.img" class="box-pic" />
<div class="box-desc" v-html="item.desc"></div>
</div>
</AppLink>
</li>
</ul>
</div>
</div> -->
</AppCard>
<!-- <div class="box-row">
<div class="box-col" v-for="(col, index) in abroadList" :key="index">
<div class="box-col__title">{{ col.title }}</div>
<ul class="box-wrap">
<li v-for="(item, index) in col.children" :key="index">
<AppLink :data="item">
<div class="box-inner">
<img :src="item.img" class="box-pic" />
<div class="box-desc" v-html="item.desc"></div>
</div>
</AppLink>
</li>
</ul>
</div>
</div> -->
</AppCard>
</div>
</template>
<script>
......@@ -165,10 +169,19 @@ export default {
.box-block {
width: 300px;
height: 106px;
background: #ffffff;
// background: #ffffff;
display: flex;
justify-content: center;
align-items: center;
border-radius: 12px 12px 12px 12px;
img {
width: 150px;
height: 80px;
object-fit: cover;
}
&:hover {
background-color: #aa1941;
}
.btn {
min-width: 120px;
// line-height: 30px;
......@@ -176,11 +189,11 @@ export default {
text-align: center;
font-size: 12px;
color: #333333;
border: 1px solid #d5d5d5;
// border: 1px solid #d5d5d5;
cursor: pointer;
&:hover {
background-color: #aa1941;
border: 1px solid #aa1941;
// background-color: #aa1941;
// border: 1px solid #aa1941;
color: #fff;
}
}
......@@ -203,40 +216,48 @@ export default {
margin-bottom: 30px;
min-width: 180px;
// height: 230px;
background-color: #fff;
// background-color: #fff;
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 {
font-size: 12px;
font-size: 15px;
font-weight: bold;
color: #333333;
color: #aa1941;
line-height: 100%;
margin-bottom: 10px;
text-align: center;
}
.box-item_btns {
width: 150px;
border-top: 1px dashed #f47524;
margin-top: 10px;
// border-top: 1px dashed #f47524;
// margin-top: 10px;
padding-top: 10px;
height: 140px;
padding-bottom: 20px;
// height: 140px;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
// align-items: center;
.box-item_btn {
min-width: 120px;
// line-height: 30px;
padding: 6px 0;
margin-bottom: 8px;
// margin-bottom: 8px;
text-align: center;
font-size: 12px;
color: #333333;
border: 1px solid #d5d5d5;
// border: 1px solid #d5d5d5;
cursor: pointer;
&:hover {
background-color: #aa1941;
border: 1px solid #aa1941;
// background-color: #aa1941;
// border: 1px solid #aa1941;
color: #fff;
}
}
......@@ -286,4 +307,9 @@ export default {
// text-align: center;
// }
// }
.box-item_logo {
width: 150px;
height: 80px;
object-fit: cover;
}
</style>
components/home/digital.vue
浏览文件 @ 1d9cb3fc
......@@ -22,7 +22,21 @@
</ul>
</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>
<li class="item" v-for="item in list2" :key="item.title" :style="item.style">
<AppLink :to="item.path">
......@@ -34,7 +48,7 @@
</AppLink>
</li>
</ul>
</div>
</div> -->
</AppCard>
</template>
......@@ -155,6 +169,54 @@ export default {
title: '职业技能大赛',
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 {
.col {
flex: 1;
background-color: #fff;
box-shadow: 0px 3px 12px 1px rgba(0, 0, 0, 0.16);
&:first-child {
flex: 0 0 694px;
}
......@@ -271,4 +334,56 @@ export default {
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>
pages/digital/ds.vue
浏览文件 @ 1d9cb3fc
......@@ -265,7 +265,7 @@ export default {
justify-content: space-between;
.sx-list_item {
width: 370px;
border: 1px solid #dbdbdb;
// border: 1px solid #dbdbdb;
padding: 19px 25px 25px;
box-sizing: border-box;
cursor: pointer;
......
pages/digital/yx_1.vue
浏览文件 @ 1d9cb3fc
......@@ -243,7 +243,7 @@ export default {
}
}
.is-border {
border: 1px solid #d5d5d5;
// border: 1px solid #d5d5d5;
}
.gk-list {
margin-top: 100px;
......@@ -254,7 +254,7 @@ export default {
.gk-item {
min-height: 280px;
text-align: center;
background: #fff;
// background: #fff;
transition: all 0.3s;
&:hover {
transform: scale(1.06);
......@@ -299,7 +299,7 @@ export default {
font-family: Source Han Sans CN;
font-weight: 500;
line-height: 24px;
color: #333;
color: #AA1941;
}
p {
margin: 12px 0;
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论