Skip to content

P
project-online-old
提交 073f5216 authored 作者: lihuihui's avatar lihuihui
浏览文件
操作

项目站开发完成

上级 4fbdb2d1
隐藏空白字符变更
内嵌 并排
正在显示 包含 770 行增加 和 578 行删除
src/assets/css/reset.css
浏览文件 @ 073f5216
...@@ -77,5 +77,5 @@ textarea:focus { ...@@ -77,5 +77,5 @@ textarea:focus {
} }
:root { :root {
--main-color: #005596; --main-color: #1A5632;
} }
src/components/courseSystem.vue 0 → 100644
浏览文件 @ 073f5216
<template>
<div class="course">
<h1>课程体系</h1>
<div class="card-list">
<div class="item" v-for="(item, index) in course" :key="index">
<h2>{{ item.title }}</h2>
<ul>
<li v-for="cItem in item.list" :key="cItem.t2">
<h3>{{ cItem.t1 }}</h3>
<p>{{ cItem.t2 }}</p>
</li>
</ul>
</div>
</div>
</div>
</template>
<script>
// import HomeBanner from '@/components/home/banner'
// import HomeSchool from '@/components/home/school'
// import FormBox from '@/components/formBox'
export default {
data() {
return {
course: [
{
title: '数字商业思维与方法模块',
list: [
{
t1: '设计思维与管理创新',
t2: 'Design Thinking for Managers'
},
{
t1: '研究方法',
t2: 'Research Methodology'
},
{
t1: '商业数据分析',
t2: 'Business Data Analysis'
},
{
t1: '信息系统高级管理专题',
t2: 'Advanced Topics in Management Information System'
}
]
},
{
title: '领导力与执行模块',
list: [
{
t1: '沟通管理',
t2: 'Communication Management'
},
{
t1: '组织行为与领导力',
t2: 'Organizational Behavior and Leadership'
},
{
t1: '数字时代领导力',
t2: 'Leadership in the Information Age'
},
{
t1: '商法',
t2: 'Commercial Law'
}
]
},
{
title: '经营管理模块',
list: [
{
t1: '战略管理',
t2: 'Strategic Management'
},
{
t1: '运营管理',
t2: 'Operation Management'
},
{
t1: '营销管理与数字化营销',
t2: 'Marketing Management and Digital Marketing'
},
{
t1: '财务规划与管理',
t2: 'Financial Planning and Management'
}
]
}
]
}
}
}
</script>
<style lang="scss" scoped>
.course {
height: 722px;
background: url(https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/course_bg.png);
background-size: cover;
h1 {
font-size: 40px;
font-weight: bold;
color: #ffffff;
line-height: 51px;
width: fit-content;
margin: 0 auto;
border-bottom: 3px solid #f6a800;
padding-top: 40px;
}
.card-list {
padding-top: 80px;
display: flex;
justify-content: center;
.item {
width: 380px;
&:nth-child(2){
margin: 0 30px;
}
h2 {
font-size: 30px;
font-weight: bold;
color: #f6a800;
line-height: 45px;
text-align: center;
margin-bottom: 35px;
}
ul {
border: 2px solid #f9aa00;
li {
height: 90px;
border-bottom: 2px solid #f9aa00;
text-align: center;
&:last-child {
border-bottom: none;
}
p {
font-size: 16px;
color: #ffffff;
line-height: 19px;
margin-top: 6px;
// white-space: nowrap;
}
h3 {
font-size: 20px;
font-weight: bold;
color: #ffffff;
line-height: 30px;
padding-top: 15px;
// white-space: nowrap;
}
}
}
}
}
}
</style>
src/components/formBox.vue
浏览文件 @ 073f5216
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<div class="section-form"> <div class="section-form">
<div class="section-form-inner"> <div class="section-form-inner">
<div class="form-box"> <div class="form-box">
<h2>报名咨询CUW家庭教育硕士</h2> <h2>玛丽伍德大学<br />数字领导力方向MBA</h2>
<p>填写姓名 + 手机， 点击报名咨询</p> <p>填写姓名 + 手机， 点击报名咨询</p>
<el-form :model="ruleForm" :rules="rules" ref="ruleForm"> <el-form :model="ruleForm" :rules="rules" ref="ruleForm">
<el-form-item prop="name"> <el-form-item prop="name">
...@@ -39,7 +39,7 @@ export default { ...@@ -39,7 +39,7 @@ export default {
name: '', name: '',
phone: '', phone: '',
channel: window.localStorage.getItem('channel_num') || 19960, channel: window.localStorage.getItem('channel_num') || 19960,
project_id: 1021 project_id: 1012
}, },
isLoading: false, isLoading: false,
rules: { rules: {
...@@ -72,7 +72,7 @@ export default { ...@@ -72,7 +72,7 @@ export default {
display: flex; display: flex;
justify-content: center; justify-content: center;
height: 554px; height: 554px;
background: url(https://webapp-pub.ezijing.com/project/cuw/proejct_form_bg.jpg) no-repeat center; background: url(https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/form_bg.png) no-repeat center;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: cover; background-size: cover;
} }
...@@ -83,12 +83,13 @@ export default { ...@@ -83,12 +83,13 @@ export default {
font-size: 26px; font-size: 26px;
font-family: SourceHanSansCN-Medium, SourceHanSansCN; font-family: SourceHanSansCN-Medium, SourceHanSansCN;
font-weight: 500; font-weight: 500;
color: #0466a1; color: #1a5632;
line-height: 40px; line-height: 40px;
letter-spacing: 5px; letter-spacing: 5px;
text-align: center; text-align: center;
} }
p { p {
margin-top: 10px;
margin-bottom: 30px; margin-bottom: 30px;
font-size: 20px; font-size: 20px;
font-family: SourceHanSansCN-Regular, SourceHanSansCN; font-family: SourceHanSansCN-Regular, SourceHanSansCN;
......
src/components/home/banner.vue
浏览文件 @ 073f5216
...@@ -5,18 +5,23 @@ ...@@ -5,18 +5,23 @@
</el-carousel> </el-carousel>
<router-link to="profession"> <router-link to="profession">
<div class="cover"> <div class="cover">
<img src="https://webapp-pub.ezijing.com/project/cuw/banner_top.jpg" /> <img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/banner_block.png" />
<div class="cover-inner"> <div class="cover-inner">
<h1>威斯康星协和大学</h1> <h1>玛丽伍德大学</h1>
<h2>家庭教育硕士</h2> <h2>数字领导力方向MBA</h2>
<p> <p>
围绕“广义家庭教育”进行教学，从家庭系统的视角深度剖析全部家庭元素以及家庭与社会的关系，从根本上理解并解决家庭的问题。 赋能当今社会每位管理人，成就数字时代先锋领导者系统、实用、数字地赋能项目成长和企业转型升级
</p> </p>
</div> </div>
</div> </div>
</router-link> </router-link>
<div class="video-box" v-show="isPlaying"> <div class="video-box" v-show="isPlaying">
<video ref="video" src="https://webapp-pub.ezijing.com/project/cuw/video.mp4" preload="auto" playsinline></video> <video
ref="video"
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/videoplayback.mp4"
preload="auto"
playsinline
></video>
</div> </div>
<div class="button-group"> <div class="button-group">
<!-- <div class="button-item"><router-link to="profession">了解更多</router-link></div> --> <!-- <div class="button-item"><router-link to="profession">了解更多</router-link></div> -->
...@@ -34,16 +39,16 @@ export default { ...@@ -34,16 +39,16 @@ export default {
bannerList: [ bannerList: [
{ {
src: 'https://webapp-pub.ezijing.com/project/cuw/banner_1.jpg' src: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/banner1.png'
}, },
{ {
src: 'https://webapp-pub.ezijing.com/project/cuw/banner_2.jpg' src: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/banner2.png'
}, },
{ {
src: 'https://webapp-pub.ezijing.com/project/cuw/banner_3.jpg' src: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/banner3.png'
}, },
{ {
src: 'https://webapp-pub.ezijing.com/project/cuw/banner_4.jpg' src: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/banner4.png'
} }
] ]
} }
...@@ -157,7 +162,7 @@ export default { ...@@ -157,7 +162,7 @@ export default {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: flex-end; justify-content: flex-end;
padding-bottom: 25%; padding-bottom: 33%;
} }
h1 { h1 {
font-size: 36px; font-size: 36px;
...@@ -173,8 +178,8 @@ export default { ...@@ -173,8 +178,8 @@ export default {
text-align: right; text-align: right;
} }
p { p {
margin-top: 16px; margin-top: 20px;
font-size: 18px; font-size: 16px;
color: #fff; color: #fff;
line-height: 2; line-height: 2;
text-align: justify; text-align: justify;
......
src/components/home/school.vue
浏览文件 @ 073f5216
...@@ -2,30 +2,28 @@ ...@@ -2,30 +2,28 @@
<div class="home-school"> <div class="home-school">
<div class="info"> <div class="info">
<div class="subtitle"> <div class="subtitle">
<h2>走进百年名校CUW</h2> <h2>走进百年名校玛丽伍德大学</h2>
</div> </div>
<p> <p>
美国威斯康星协和大学（Concordia University 美国玛丽伍德大学（Marywood University）成立于1915年，是一所非营利性的综合型大学。大学拥有3000余名在校学生，承担着100余个本科、硕士及博士专业的教学与科研工作。2021年度，学校毕业生就业率高达100%，并且毕业生平均薪资超过美国中产水平。
Wisconsin，简称CUW）成立于1881年，是一所综合型非营利性的综合型大学。学校位于美国威斯康星州Mequon市，坐落于美国五大湖之一的风光旖旎的密歇根湖畔。CUW是美国著名的协和大学系统（Concordia
University System）的六所大学中排名最高、历史最悠久、规模最大的高校。
</p> </p>
</div> </div>
<div class="card-list"> <div class="card-list">
<div class="card-item"> <div class="card-item">
<img src="https://webapp-pub.ezijing.com/project/cuw/school_01.jpg" /> <img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/school_1.png" />
<div class="card-item__inner"> <div class="card-item__inner">
<h3>总统母校</h3> <h3>位置优越</h3>
<p> <p>
2004年5月，时任美国总统的乔治·沃克·布什先生乘坐总统的空军一号专机抵达威斯康星协和大学，慷慨激昂地发表了他在这所学校的荣誉博士毕业演讲。 玛丽伍德大学位于宾夕法尼亚州Scranton市，地处美国历史名城费城、国际金融中心纽约、以及众多常青藤名校正中心的位置。校园占地面积115英亩，同时也是一所国家植物园，在秀美茂盛的原始森林里，蕴藏着100多种树木和灌木。
</p> </p>
</div> </div>
</div> </div>
<div class="card-item"> <div class="card-item">
<img src="https://webapp-pub.ezijing.com/project/cuw/school_02.jpg" /> <img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/school_2.png" />
<div class="card-item__inner"> <div class="card-item__inner">
<h3>学校构成</h3> <h3>校园人文</h3>
<p> <p>
CUW拥有6大学院，承担70余个本科、硕士和博士专业的教学与科研工作。来自33个国家、42个州的8000余名在校本科生和研究生在此就读，学校文体活动丰富，拥有40余个不同领域的学生组织和30多支体育校队。 玛丽伍德大学的学生文体活动丰富，学校是全美大学生体育协会 (NCAA) 成员，学校有着超过100个不同主题的学生组织。
</p> </p>
</div> </div>
</div> </div>
......
src/components/layout-register.vue
浏览文件 @ 073f5216
...@@ -31,12 +31,12 @@ export default { ...@@ -31,12 +31,12 @@ export default {
.layout-register { .layout-register {
.layout-register-header { .layout-register-header {
padding: 20px 0px; padding: 20px 0px;
color: #005596; color: rgba(26, 86, 50, 1);
.border { .border {
width: 100%; width: 100%;
height: 2px; height: 2px;
display: inline-block; display: inline-block;
background: #005596; background: rgba(26, 86, 50, 1);
} }
} }
.layout-register-body { .layout-register-body {
......
src/components/layout/footer.vue
浏览文件 @ 073f5216
...@@ -6,43 +6,36 @@ ...@@ -6,43 +6,36 @@
<h4> <h4>
<span>学校官网</span> <span>学校官网</span>
</h4> </h4>
<a href="https://www.cuw.edu" target="_blank">威斯康星协和大学官网</a> <a href="https://www.marywood.edu/" target="_blank">玛丽伍德大学官网</a>
<a href="https://www.marywood.edu/programs/featured/zijing-mba" target="_blank">紫荆玛丽伍德MBA</a>
</div> </div>
<div class="footer-link"> <div class="footer-link">
<h4> <h4>
<span>学校认证</span> <span>学校认证</span>
</h4> </h4>
<a href="http://jsj.moe.gov.cn/news/1/217.shtml" target="_blank">中国教育部承认院校</a> <a href="http://jsj.moe.gov.cn/api/index/mdDesc" target="_blank">中国教育部承认院校</a>
<a <a href="https://acbsp.org/members/?id=18776651&hhSearchTerms=%22marywood+and+university%22" target="_blank"
href="https://www.hlcommission.org/component/directory/?Itemid=&Action=ShowBasic&instid=1685" >美国商学院认证委员会 ACBSP认证</a
target="_blank"
>美国高等教育认证委员会认证</a
> >
<a href="https://www.msche.org/institution/0531/" target="_blank">美国中部各州院校协会 MSCHE认证</a>
</div> </div>
<div class="footer-link"> <div class="footer-link">
<h4> <h4>
<span>排名查询</span> <span>排名查询</span>
</h4> </h4>
<a <a href="https://www.usnews.com/best-colleges/marywood-university-3296/overall-rankings" target="_blank"
href="https://www.usnews.com/best-colleges/concordia-university-wisconsin-3842/overall-rankings" >2023 U.S. News美国北部最佳价值大学综合排名</a
target="_blank"
>2022年U.S.News美国大学综合排名277</a
>
<a
href="https://thebestschools.org/rankings/25-best-online-masters-educational-administration-degree-programs/"
target="_blank"
>2022年TheBestSchools全美在线教育（教育管理）硕士排名19</a
> >
<a <a
href="https://blog.cuw.edu/online-masters-in-teaching-and-learning-program-ranked-1-in-the-state/" href="https://www.marywood.edu/news/2019-Master-of-Business-Administration-Program-Top-Ranking"
target="_blank" target="_blank"
>2014年GetEducated.com全美在线教育（教学）硕士排名20</a >2019年Study.com美国MBA项目排名前50</a
> >
</div> </div>
</div> </div>
<div class="footer_logo"> <div class="footer_logo">
<img src="https://zws-imgs-pub.ezijing.com/pc/base/logo.svg" /> <img src="https://zws-imgs-pub.ezijing.com/pc/base/logo.svg" />
<img src="https://webapp-pub.ezijing.com/project/cuw/cuw_logo_blue.svg" /> <img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/marywood_logo%402x%20(1).png" />
</div> </div>
</footer> </footer>
<div class="copyright"> <div class="copyright">
...@@ -109,7 +102,7 @@ export default { ...@@ -109,7 +102,7 @@ export default {
position: absolute; position: absolute;
bottom: -4px; bottom: -4px;
height: 3px; height: 3px;
background: #005596; background: rgba(26, 86, 50, 1);
width: 100%; width: 100%;
} }
} }
......
src/components/layout/header.vue
浏览文件 @ 073f5216
...@@ -5,8 +5,8 @@ ...@@ -5,8 +5,8 @@
<div class="header-main"> <div class="header-main">
<div class="logo"> <div class="logo">
<router-link to="/"> <router-link to="/">
<img src="https://webapp-pub.ezijing.com/project/cuw/cuw_logo_white.svg" v-show="fixed && !isEnter" /> <img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/marywood_logo%402x.png" v-show="fixed && !isEnter" />
<img src="https://webapp-pub.ezijing.com/project/cuw/cuw_logo_blue.svg" v-show="isEnter || !fixed" /> <img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/marywood_logo%402x%20(1).png" v-show="isEnter || !fixed" />
</router-link> </router-link>
</div> </div>
<nav class="nav"> <nav class="nav">
...@@ -31,7 +31,7 @@ export default { ...@@ -31,7 +31,7 @@ export default {
scrollTop: 0, scrollTop: 0,
navList: [ navList: [
{ title: '首页', path: '/index' }, { title: '首页', path: '/index' },
{ title: '家庭教育硕士', path: '/profession' }, { title: '工商管理硕士（MBA)', path: '/profession' },
{ title: '报名申请', path: '/my' }, { title: '报名申请', path: '/my' },
{ title: '最新动态', path: '/news' }, { title: '最新动态', path: '/news' },
{ title: '联系我们', path: '/contact' } { title: '联系我们', path: '/contact' }
...@@ -110,7 +110,7 @@ export default { ...@@ -110,7 +110,7 @@ export default {
display: flex; display: flex;
align-items: center; align-items: center;
a { a {
height: 80%; height: 60%;
} }
img { img {
height: 100%; height: 100%;
......
src/components/layout/headerNews.vue
浏览文件 @ 073f5216
...@@ -54,7 +54,7 @@ export default { ...@@ -54,7 +54,7 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.header-news { .header-news {
height: 40px; height: 40px;
background: #005596; background: rgba(26, 86, 50, 1);
font-family: PingFangSC-Regular, PingFang SC; font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400; font-weight: 400;
color: #fff; color: #fff;
......
src/components/slide-list.vue
浏览文件 @ 073f5216
...@@ -31,7 +31,7 @@ export default { ...@@ -31,7 +31,7 @@ export default {
background: #fff4eeff; background: #fff4eeff;
.slide-list-title { .slide-list-title {
font-weight: 600; font-weight: 600;
color: #005596; color: rgba(26, 86, 50, 1);
} }
} }
.slide-list { .slide-list {
...@@ -61,7 +61,7 @@ export default { ...@@ -61,7 +61,7 @@ export default {
border-top-right-radius: 3px; border-top-right-radius: 3px;
border-bottom-right-radius: 3px; border-bottom-right-radius: 3px;
width: 3px; width: 3px;
background: #005596; background: rgba(26, 86, 50, 1);
} }
} }
} }
......
src/components/teacherInfo.vue 0 → 100644
浏览文件 @ 073f5216
<template>
<div class="layout_com_page_banner major-kc-wm" :style="{ 'min-height': 700 + 'px' }">
<div class="pop"></div>
<h3 style="padding-top:30px;">
<span>师资介绍</span>
</h3>
<div class="major-kc-wm-body" @mouseover="mouseOver" @mouseleave="mouseLeave">
<swiper ref="mySwiper" :options="swiperOptions">
<swiper-slide v-for="(item, index) in wmList" :key="index">
<div>
<div class="major-kc-wm-list" v-for="(cItem, cIndex) in item" :key="cIndex + 's'">
<div class="list-img">
<img :src="cItem.img" style="width: 162px" />
</div>
<div class="list-body">
<span class="font-size-18 nowrap title">{{ cItem.title }}</span>
<span class="font-size-14 wm-red zs">{{ cItem.label }}</span>
<span v-for="sItem in cItem.main" :key="sItem" class="font-size-14 mian-txt">{{ sItem }}</span>
</div>
</div>
</div>
</swiper-slide>
<div class="swiper-pagination" slot="pagination"></div>
</swiper>
</div>
</div>
</template>
<script>
import { Swiper, SwiperSlide, directive } from 'vue-awesome-swiper'
import 'swiper/css/swiper.css'
export default {
components: {
Swiper,
SwiperSlide
},
directives: {
swiper: directive
},
computed: {
swiper() {
return this.$refs.mySwiper.$swiper
}
},
data() {
return {
wmList: [
[
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/teacher1.png',
title: '冯云霞',
label: '',
main: [
'中国人民大学商学院',
'杰出教授博士生导师',
'哈佛商学院、法国INSEA',
'美国百森商学院访问学者',
'荷兰马斯特里赫特管理学院',
'工商管理博士'
]
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/teacher7.png',
title: '王小华',
label: '',
main: ['北京师范大学心理学院副教授', '加拿大西安大略大学工业与组织', '心理学博士']
}
],
[
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/teacher2.png',
title: '高远洋',
label: '',
main: [
'北京航空航天大学',
'经济管理学员副教授',
'美国加州大学伯克利分校',
'Haas商学院访问学者',
'北京航空航天大学管理学博士'
]
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/teacher8.png',
title: '张恩忠',
label: '',
main: ['中国人民大学商学院副教授', '《市场营销学教程》第六版教材主要编写者', '美国普渡大学消费者行为学博士']
}
],
[
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/teacher3.png',
title: '刘晓欧',
label: '',
main: [
'中国人民大学教授',
'博士生导师杰出学者',
'获颁北京市青年英才',
'康涅狄格大学农业与资源经济学博士',
'斯坦福大学统计学博士后'
]
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/teacher9.png',
title: 'Dr. Art Comstock',
label: '',
main: ['玛丽伍德大学金融学副教授', 'Pacer投资基金董事总经理', '里海大学商业和经济学博士']
}
],
[
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/teacher4.png',
title: '吕景胜',
label: '',
main: ['中国人民大学商学院教授', 'MBA最佳教师，博士生导师', '美的集团特聘法律顾问', '中国人民大学法学博士']
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/teacher10.png',
title: 'Dr.Christ Speicher',
label: '',
main: [
'玛丽伍德大学商业与全球创新学院',
'执行院长',
'创新创业学副教授',
'全球最大无人机培训公司',
'「DARTdrones」创始人',
'玛丽伍德大学MBA，天普大学博士'
]
}
],
[
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/teacher5.png',
title: '欧阳桃花',
label: '',
main: [
'北京航空航天大学经济管理学员工商学科',
'责任教授博士生导师',
'教育部学位中心首席案例专家',
'日本神户大学管理学博士',
'清华大学经济管理学院博士后'
]
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/teacher11.png',
title: 'Dr.Rex Dumdum',
label: '',
main: ['玛丽伍德大学管理与领导力副教授', '美国东部大学计算机大会联席主席', '纽约州立大学宾汉姆顿分校博士']
}
],
[
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/teacher6.png',
title: '孙昂',
label: '',
main: ['中国人民大学经济学教授', '斯坦福大学博士后、研究员', '布朗大学经济学博士']
},
{
img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/teacher12.png',
title: 'Michelle Pannone',
label: '',
main: ['玛丽伍德大学助理教授', '「匠·中国」项目总监', '作品存于北京、杭州等城市']
}
]
],
swiperOptions: {
observer: true,
autoHeight: true,
slidesPerView: 3,
// paginationClickable: true,
spaceBetween: 0,
freeMode: true,
autoplay: {
delay: 2000
},
pagination: {
el: '.swiper-pagination',
clickable: true,
type: 'bullets'
}
}
}
},
methods: {
mouseOver() {
this.swiper.autoplay.stop()
},
mouseLeave() {
this.swiper.autoplay.start()
}
}
}
</script>
<style lang="scss" scoped>
.major-kc-wm {
padding-bottom: 20px;
background: url(https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/teacher_bg.png) no-repeat center;
background-size: cover;
position: relative;
align-items: center;
flex-wrap: wrap;
overflow: hidden;
.pop {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.53);
}
&.bg2 {
background: url('~@/assets/images/major-set/teacher_bg22.jpg') no-repeat bottom;
background-size: cover;
}
h3 {
width: 100%;
display: inline-flex;
align-items: center;
justify-content: center;
font-weight: 500;
font-size: 40px;
color: rgba(255, 255, 255, 1);
span {
position: relative;
&::before {
content: '';
position: absolute;
bottom: -8px;
width: 100%;
height: 3px;
background: #ffffff;
}
}
}
.major-kc-wm-body {
::v-deep .swiper-container {
.swiper-pagination-bullet {
opacity: 1;
background: #fff;
}
.swiper-pagination-bullet-active {
background: rgb(174, 14, 63);
}
}
width: 80%;
display: flex;
justify-content: center;
h3 {
color: #ffffffff;
}
.major-kc-wm-list {
display: flex;
flex-direction: column;
position: relative;
padding: 20px 30px;
width: 300px;
margin: 110px auto 0;
.list-img {
z-index: 3;
position: relative;
position: absolute;
left: 50%;
background: #fff;
border-radius: 50%;
top: 7%;
overflow: hidden;
transform: translate(-50%, -50%);
img {
transition: all 0.5s;
transform: scale(0.9);
cursor: pointer;
&:hover {
transform: scale(1);
}
}
}
.list-body {
display: flex;
position: relative;
// align-items: center;
flex-direction: column;
background: #fff;
border-radius: 26px;
width: 300px;
padding: 100px 0px 30px 0px;
height: 185px;
.max-width-180 {
max-width: 180px;
}
span {
padding: 5px 15px 0 40px;
color: #222222ff;
line-height: 20px;
}
&::before {
content: '';
position: absolute;
height: 90%;
width: 90%;
top: 5%;
border: 1px solid rgba(151, 151, 151, 1);
border-radius: 26px;
border-style: dashed;
}
.mian-txt {
position: relative;
&::before {
content: '';
position: absolute;
left: 22px;
top: 10px;
// -webkit-transform: translateX(-50%);
width: 8px;
height: 8px;
border: 2px solid #e27f4d;
border-radius: 50%;
}
}
.title {
padding: 0;
display: block;
width: 100%;
text-align: center;
}
.zs {
padding: 5px 0 0 0;
display: block;
width: 100%;
text-align: center;
color: #e27f4d;
}
&::before {
content: '';
position: absolute;
height: 90%;
width: 90%;
top: 5%;
left: 50%;
-webkit-transform: translateX(-50%);
border: 1px solid rgba(151, 151, 151, 1);
border-radius: 26px;
border-style: dashed;
}
}
}
}
}
.swiper-container {
padding-top: 20px;
padding-bottom: 40px;
}
</style>
src/pages/homepage/index.vue
浏览文件 @ 073f5216
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
<div class="subtitle"> <div class="subtitle">
<h2>大学排名与认证</h2> <h2>大学排名与认证</h2>
</div> </div>
<img src="https://webapp-pub.ezijing.com/project/cuw/top.jpg" /> <img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/school_3.png" />
</section> </section>
<FormBox /> <FormBox />
</div> </div>
......
src/pages/letter/index.vue
浏览文件 @ 073f5216
...@@ -149,7 +149,7 @@ export default { ...@@ -149,7 +149,7 @@ export default {
} }
} }
.nav { .nav {
background-color: #005596; background-color: rgba(26, 86, 50, 1);
.title { .title {
font-size: 24px; font-size: 24px;
font-weight: 600; font-weight: 600;
......
src/pages/login/index.vue
浏览文件 @ 073f5216
...@@ -106,7 +106,7 @@ export default { ...@@ -106,7 +106,7 @@ export default {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
width: 260px; width: 260px;
background-color: #005596; background-color: rgba(26, 86, 50, 1);
color: #fff; color: #fff;
} }
.main .title .icon { .main .title .icon {
......
src/pages/major-set/index.vue
浏览文件 @ 073f5216
<template> <template>
<div class="layout_com_page"> <div class="layout_com_page">
<div class="banner"> <section class="home-banner">
<div class="banner-inner"> <div class="banner-text">
<h1>威斯康星协和大学—家庭教育硕士</h1> <p>传统的领导者注重于对人员和物理资产的管理</p>
<p> <p>数字领导者将人与数字资产相互赋能倍增效益</p>
目前，国内普遍的家庭教育课程结构像是一棵树，父母好比树干，孩子好比枝叶，课程更多的是围绕父母教养孩子的“狭义家庭教育”。然而，深入的家庭教育不应只片面地强调子女养育。家庭好比一片森林（FOREST），科学的家庭教育是将家庭作为一个系统进行研究。 <P>传统的MBA课程体系或许已经不能满足当今数字时代各行各业的发展</P>
</p> <h1>紫荆-玛丽伍德大学数字领导力方向MBA</h1>
<p>系统实用的MBA课程体系与数字时代碰撞</p>
</div> </div>
</div> <el-carousel arrow="never" class="banner-swiper">
<section class="school-top"> <el-carousel-item v-for="item in bannerList" :key="item.src"><img :src="item.src"/></el-carousel-item>
<div class="subtitle"> </el-carousel>
<h2>专业排名与认证</h2>
</div>
<img src="https://webapp-pub.ezijing.com/project/cuw/project_top.jpg" />
</section> </section>
<section class="project-forest"> <section class="introduce">
<h2>项目采用<span>“FOREST（森林）”</span>教学体系</h2> <h3>数字时代课题贯穿的<span>教学内容</span></h3>
<p class="t0"> <h3>从思路到出路，从方法到结果的<span>教学逻辑</span></h3>
引领学生全方位掌握在家庭教育中，个体发展、婚姻关系、家庭发展、性与家庭、儿童和青少年养育等理论与方法，<br /> <h3 class="line">理论学习、实操训练、案例教学、团队协作等多元化的<span>学习体验</span></h3>
以及家庭与社会的文化、政策、法律等关系，让学生从根本上理解并解决家庭的问题。 <p>
项目课程划分为三个模块，遵循商业发展规律，以商业发展为主线，系统科学地把握项目与企业发展中的每个重要环节。
让创业不难，让转型不痛，让方法科学涌现，让执行酣畅到位，让决策有理可依，让管理有的放矢，让结果指日可期。
</p> </p>
<div class="forest-group">
<div
class="forest-item"
:class="{ 'is-active': forestIndex === index }"
v-for="(item, index) in forest"
:key="item.name"
@mouseenter="forestIndex = index"
>
<div class="circle">
<p class="t1">{{ item.eName }}</p>
<p class="t2">{{ item.name }}</p>
</div>
<div class="forest-item-main">
<div class="line"></div>
<dl v-for="child in item.children" :key="child.nam">
<dt>{{ child.name }}</dt>
<dd>{{ child.eName }}</dd>
</dl>
</div>
</div>
</div>
</section> </section>
<courseSystem></courseSystem>
<div class="layout_com_page_banner major-kc-wm" :style="{ 'min-height': 700 + 'px' }"> <teacherInfo></teacherInfo>
<h3 style="padding-top:30px;">
<span>师资介绍</span>
</h3>
<div class="major-kc-wm-body">
<swiper ref="mySwiper" :options="swiperOptions">
<template v-for="(item, index) in wmList">
<swiper-slide :key="index">
<div class="major-kc-wm-list">
<div class="list-img">
<img :src="item.img" style="width: 162px" />
</div>
<div class="list-body">
<span class="font-size-18 nowrap title">{{ item.title }}</span>
<span class="font-size-14 wm-red zs">{{ item.label }}</span>
<template v-for="(sItem, sIndex) in item.main">
<span :key="sIndex + '-' + index" class="font-size-14 mian-txt">{{ sItem }}</span>
</template>
</div>
</div>
</swiper-slide>
</template>
<div class="swiper-pagination" slot="pagination"></div>
</swiper>
</div>
</div>
<div class="layout_com_page_banner major-kc-wm bg2" :style="{ 'min-height': 700 + 'px' }">
<h3>
<span>师资介绍</span>
</h3>
<div class="major-kc-wm-body" @mouseover="mouseOver2" @mouseleave="mouseLeave2">
<swiper ref="mySwiper2" :options="swiperOptions">
<template v-for="(item, index) in wmList2">
<swiper-slide :key="index">
<div class="major-kc-wm-list">
<div class="list-img">
<img :src="item.img" style="width: 162px" />
</div>
<div class="list-body">
<span class="font-size-18 nowrap title">{{ item.title }}</span>
<span class="font-size-14 wm-red zs">{{ item.label }}</span>
<template v-for="(sItem, sIndex) in item.main">
<span :key="sIndex + '-' + index" class="font-size-14 mian-txt">{{ sItem }}</span>
</template>
</div>
</div>
</swiper-slide>
</template>
<div class="swiper-pagination" slot="pagination"></div>
</swiper>
</div>
</div>
<section class="project-card"> <section class="project-card">
<div class="project-card-item" v-for="(item, index) in list" :key="index"> <div class="project-card-item" v-for="(item, index) in list" :key="index">
<div class="project-card-item-header"> <div class="project-card-item-header">
...@@ -103,27 +31,59 @@ ...@@ -103,27 +31,59 @@
<div class="project-card-item-box"> <div class="project-card-item-box">
<img :src="item.bg" /> <img :src="item.bg" />
<ul> <ul>
<li v-for="child in item.children">{{ child }}</li> <li v-for="(child, index) in item.children" :key="index">{{ child }}</li>
</ul> </ul>
</div> </div>
</div> </div>
</section> </section>
<section class="activity-list">
<h1>丰富多彩的学生活动</h1>
<div class="list">
<div class="nav">
<div class="li">开学典礼</div>
<div class="li">论坛</div>
<div class="li">企业采访</div>
<div class="li">班级集体活动</div>
</div>
<div class="imgs w1">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/activity1.png" />
</div>
<div class="imgs">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/activity2.png" />
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/activity3.png" />
</div>
<div class="imgs">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/activity4.png" />
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/activity5.png" />
</div>
<div class="imgs">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/activity6.png" />
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/activity7.png" />
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/activity8.png" />
</div>
<div class="imgs">
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/activity9.png" />
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/activity10.png" />
<img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/activity11.png" />
</div>
</div>
</section>
<section class="project-study"> <section class="project-study">
<div class="subtitle"> <div class="subtitle">
<h2>学习相关</h2> <h2>学习相关</h2>
</div> </div>
<div class="project-study-bd"> <div class="project-study-bd">
<div class="project-study-left"> <div class="project-study-left">
<img src="https://webapp-pub.ezijing.com/project/cuw/project_study.png" width="500px" /> <img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/cert.png" width="500px" />
</div> </div>
<div class="project-study-right"> <div class="project-study-right">
<h3>项目学制</h3> <h3>项目学制</h3>
<ul> <ul>
<li><span>20</span>个月</li> <li><span>16</span>个月</li>
<li>修满<span>30</span>学分</li> <li>修满<span>30</span>学分</li>
</ul> </ul>
<p> <p>
修满全部学分并考核合格后，由威斯康星协和大学授予教育学硕士学位。学位证书与出国留学学习所获得的学位证书相同。 修满全部学分并考核合格后，由玛丽伍德大学授予工商管理硕士(MBA)学位，学位证书与出国留学学习所获得的学位证书相同。
</p> </p>
</div> </div>
</div> </div>
...@@ -133,30 +93,29 @@ ...@@ -133,30 +93,29 @@
</template> </template>
<script> <script>
import courseSystem from '@/components/courseSystem'
import teacherInfo from '@/components/teacherInfo'
import FormBox from '@/components/formBox' import FormBox from '@/components/formBox'
import { Swiper, SwiperSlide, directive } from 'vue-awesome-swiper'
import 'swiper/css/swiper.css'
export default { export default {
name: 'major-set', name: 'major-set',
components: { components: {
Swiper, FormBox,
SwiperSlide, courseSystem,
FormBox teacherInfo
},
directives: {
swiper: directive
}, },
computed: {
swiper() {
return this.$refs.mySwiper.$swiper
},
swiper2() {
return this.$refs.mySwiper2.$swiper
}
},
data() { data() {
return { return {
bannerList: [
{
src: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/profession_banner1.png'
},
{
src: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/profession_banner2.png'
},
{
src: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/profession_banner3.png'
}
],
forestIndex: 0, forestIndex: 0,
forest: [ forest: [
{ {
...@@ -205,153 +164,60 @@ export default { ...@@ -205,153 +164,60 @@ export default {
list: [ list: [
{ {
name: '招生对象', name: '招生对象',
bg: 'https://webapp-pub.ezijing.com/project/cuw/project_bg_01.png', bg: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/project_bg_01.png',
children: [ children: [
'心理咨询师、婚姻家庭治疗师、家庭教育指导师、社区工作者', '不断超越自我，对个人职业发展有追求的职场人',
'幼儿园、小学、中学教师、班主任', '持续企业创新，让企业持续在行业领跑的管理者',
'对科学理解家庭及养育有需求的人群' '破局任何屏障，时刻满怀阳光与进取心的奔跑者'
] ]
}, },
{ {
name: '入学条件', name: '入学条件',
bg: 'https://webapp-pub.ezijing.com/project/cuw/project_bg_02.png', bg: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/project_bg_02.png',
children: ['持有本科学历或学位', '有两年以上相关工作经验的大专学历学生有少量名额，可通过筛选后择优录取'] children: [
}, '持有本科学历或学位',
{ '拥有大专学历者有少量名额',
name: '授课形式', '具备工作经验和职业发展愿景',
bg: 'https://webapp-pub.ezijing.com/project/cuw/project_bg_03.png', '英语成绩不作为入学必要条件'
children: ['双语环境，中文授课', '操作流畅的学习平台', '线上课程+线下工作坊']
},
{
name: '毕业典礼',
bg: 'https://webapp-pub.ezijing.com/project/cuw/project_bg_04.png',
children: ['学生可在学业全部完成后，在国内或赴美参加毕业典礼，共享学有所成的高光时刻']
}
],
wmList: [
{
img: require('@/assets/images/major-set/ent1.png'),
title: 'Dr. Val Keiper',
label: '',
main: ['威斯康星协和大学教育学院教授', '家庭教育项目主任', '在CUW任教40余年', 'CUW棒球队主教练']
},
{
img: require('@/assets/images/major-set/ent2.png'),
title: 'Dr.Roger Sonnenberg',
label: '',
main: [
'威斯康星协和大学家庭教育教授',
'青少年、性、家庭教育专家',
'《501种养育与家庭实用方法系列》等畅销书作家'
]
},
{
img: require('@/assets/images/major-set/ent3.png'),
title: 'Dr. Scott Turansky',
label: '',
main: [
'威斯康星协和大学家庭教育教授',
'美国知名育儿专家',
'《家庭改善：可以读给孩子的育儿书》等数十本畅销书作家'
]
},
{
img: require('@/assets/images/major-set/ent4.png'),
title: 'Dr. Warren Braden',
label: '博士',
main: ['威斯康星协和大学家庭教育教授', '婚姻家庭治疗师', '北伊利诺伊大学教育学博士']
},
{
img: require('@/assets/images/major-set/ent5.png'),
title: 'Josh Kittleman',
label: '',
main: ['威斯康星协和大学家庭教育助理教授', '安娜堡协和大学家庭教育助理教授']
}
],
wmList2: [
{
img: require('@/assets/images/major-set/cnt1.png'),
title: '黄翯青',
label: '博士',
main: ['北京大学心理学博士', '首都师范大学学前教育学院副教授', '北京大学健康中心研究员']
},
{
img: require('@/assets/images/major-set/cnt2.png'),
title: '蔺秀云',
label: '博士',
main: [
'北京师范大学心理学部教授',
'博士生导师',
'青年长江学者',
'家庭治疗与发展心理学博士',
'资深家庭治疗师',
'注册系统督导师'
] ]
}, },
{ {
img: require('@/assets/images/major-set/cnt3.png'), name: '授课形式',
title: '苏彦捷', bg: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/project_bg_03.png',
label: '博士', children: [
main: [ '线上授课 + 线下学习',
'北京大学心理与认知科学学院教授', '在线教学平台由紫荆教育自行研发打造，操作简单、功能完备、使用流畅学生可灵活安排学习时间',
'博士生导师', '可反复观看和查阅课程资料，全方位为学习提供支持'
'长江学者特聘教授',
'享受国务院特殊津贴专家',
'美国心理科学学会会士'
] ]
}, },
{ {
img: require('@/assets/images/major-set/cnt4.png'), name: '毕业典礼',
title: '方刚', bg: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/project_bg_04.png',
label: '博士', children: ['学生可在学业全部完成后，在国内或赴美参加毕业典礼，共享学有所成的精彩时刻']
main: [
'著名性学家',
'性与性别研究专家',
'台湾树德科技大学人类性学研究所兼职教授',
'中国妇女研究会理事',
'中国性学会理事'
]
}
],
swiperOptions: {
observer: true,
autoHeight: true,
slidesPerView: 3,
// paginationClickable: true,
spaceBetween: 0,
freeMode: true,
// autoplay: {
// delay: 2000
// },
pagination: {
el: '.swiper-pagination',
clickable: true,
type: 'bullets'
} }
} ]
}
},
methods: {
mouseOver() {
this.swiper.autoplay.stop()
},
mouseLeave() {
this.swiper.autoplay.start()
},
mouseOver2() {
this.swiper2.autoplay.stop()
},
mouseLeave2() {
this.swiper2.autoplay.start()
} }
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.home-banner {
position: relative;
height: calc(100vh - 10px);
min-height: 600px;
}
.banner-swiper {
height: 100%;
::v-deep .el-carousel__container {
height: 100%;
}
img {
height: 100%;
width: 100%;
object-fit: cover;
}
}
.banner { .banner {
position: relative; position: relative;
height: calc(100vh - 10px); height: calc(100vh - 10px);
...@@ -384,147 +250,6 @@ export default { ...@@ -384,147 +250,6 @@ export default {
line-height: 40px; line-height: 40px;
} }
} }
.school-top {
position: relative;
img {
width: 100%;
}
.subtitle {
position: absolute;
top: 50px;
left: 50%;
padding: 20px 0;
text-align: center;
transform: translateX(-50%);
h2 {
display: inline-block;
padding-bottom: 12px;
font-size: 40px;
font-family: SourceHanSansCN-Medium, SourceHanSansCN;
font-weight: 500;
color: #fff;
line-height: 1;
border-bottom: 3px solid #fff;
}
}
}
.project-forest {
padding: 70px 0;
height: 760px;
background: url(https://webapp-pub.ezijing.com/project/cuw/project_forest.jpg) no-repeat;
background-size: cover;
box-sizing: border-box;
h2 {
font-size: 40px;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #ffffff;
text-align: center;
span {
color: #faa634;
}
}
.t0 {
font-size: 20px;
font-family: SourceHanSansCN-Regular, SourceHanSansCN;
font-weight: 400;
color: #ffffff;
line-height: 30px;
text-align: center;
}
}
.forest-group {
display: flex;
justify-content: center;
margin-top: 65px;
}
.forest-item {
position: relative;
margin: 0 12px;
&:hover,
&.is-active {
.circle {
border-color: #faa634;
}
.forest-item-main {
display: block;
}
}
.circle {
width: 160px;
height: 160px;
border: 6px solid #0d78c6;
border-radius: 50%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
cursor: pointer;
.t1 {
font-size: 30px;
font-family: Lato-Regular, Lato;
font-weight: 400;
color: #ffffff;
&::first-letter {
font-size: 50px;
}
}
.t2 {
font-size: 22px;
font-family: SourceHanSansCN-Regular, SourceHanSansCN;
font-weight: 400;
color: #ffffff;
}
}
}
.forest-item-main {
display: none;
position: absolute;
left: 50%;
transform: translate(-50%);
.line {
position: relative;
margin: 0 auto 22px;
width: 0;
height: 100px;
border-left: 1px dashed #faa634;
&::after {
content: '';
position: absolute;
bottom: 0;
left: 50%;
width: 9px;
height: 9px;
border-radius: 50%;
background-color: #faa634;
transform: translateX(-50%);
}
}
dl {
padding-left: 8px;
border-left: 2px solid #faa634;
}
dl + dl {
margin-top: 30px;
}
dt {
font-size: 16px;
font-family: SourceHanSansCN-Bold, SourceHanSansCN;
font-weight: bold;
color: #ffffff;
line-height: 24px;
white-space: nowrap;
}
dd {
margin-top: 5px;
font-size: 16px;
font-family: Lato-Bold, Lato;
font-weight: bold;
color: #ffffff;
line-height: 19px;
white-space: nowrap;
}
}
.project-card { .project-card {
padding: 120px 0; padding: 120px 0;
...@@ -555,12 +280,13 @@ export default { ...@@ -555,12 +280,13 @@ export default {
color: #ffffff; color: #ffffff;
line-height: 60px; line-height: 60px;
text-align: center; text-align: center;
background: url('https://webapp-pub.ezijing.com/project/cuw/proejct_card_bg.png') no-repeat center top; background: url('https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/proejct_card_bg.png') no-repeat
center top;
background-size: contain; background-size: contain;
} }
.project-card-item-box { .project-card-item-box {
position: relative; position: relative;
background: #0b5a94; background: rgba(26, 86, 50, 1);
border-radius: 13px; border-radius: 13px;
overflow: hidden; overflow: hidden;
padding-bottom: 10px; padding-bottom: 10px;
...@@ -603,7 +329,7 @@ export default { ...@@ -603,7 +329,7 @@ export default {
} }
.project-study { .project-study {
height: 600px; height: 600px;
background: url(https://webapp-pub.ezijing.com/project/cuw/project_study_bg.jpg) no-repeat center center; background: url(https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/cert_bg.png) no-repeat center center;
background-size: cover; background-size: cover;
.subtitle { .subtitle {
padding: 50px 0; padding: 50px 0;
...@@ -665,152 +391,111 @@ export default { ...@@ -665,152 +391,111 @@ export default {
line-height: 30px; line-height: 30px;
} }
} }
.major-kc-wm { .banner-text {
background: url('~@/assets/images/major-set/teacher_bg11.jpg') no-repeat center; position: absolute;
background-size: cover; top: 50%;
position: relative; left: 50%;
align-items: center; transform: translate(-50%, -50%);
flex-wrap: wrap; z-index: 99;
overflow: hidden; text-align: center;
&.bg2 { p {
background: url('~@/assets/images/major-set/teacher_bg22.jpg') no-repeat bottom; font-size: 24px;
background-size: cover; color: #ffffff;
line-height: 41px;
} }
h1 {
font-size: 56px;
font-family: SourceHanSansCN-Bold, SourceHanSansCN;
font-weight: bold;
color: #f6a800;
letter-spacing: 3px;
white-space: nowrap;
}
}
.introduce {
height: 624px;
background: url(https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/introduce_bg.png?v1);
background-size: cover;
padding-top: 150px;
box-sizing: border-box;
h3 { h3 {
width: 100%; font-size: 34px;
display: inline-flex; font-weight: bold;
align-items: center; color: #ffffff;
justify-content: center; line-height: 56px;
font-weight: 500; width: fit-content;
font-size: 40px; margin: 0 auto;
color: rgba(255, 255, 255, 1); &.line {
border-bottom: 1px solid #f6a800;
}
span { span {
position: relative; color: #f6a800;
&::before {
content: '';
position: absolute;
bottom: -8px;
width: 100%;
height: 3px;
background: #ffffff;
}
} }
} }
.major-kc-wm-body { p {
::v-deep .swiper-container { font-size: 22px;
.swiper-pagination-bullet { font-weight: 400;
opacity: 1; color: #ffffff;
background: #fff; line-height: 32px;
} max-width: 1200px;
.swiper-pagination-bullet-active { margin: 30px auto;
background: rgb(174, 14, 63); }
} }
} .activity-list {
width: 80%; height: 789px;
background: url(https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/new-marywood/course_bg.png);
background-size: cover;
h1 {
font-size: 40px;
font-weight: bold;
color: #ffffff;
line-height: 51px;
border-bottom: 3px solid #f6a800;
width: fit-content;
margin: 0 auto;
padding-top: 40px;
}
.list {
position: relative;
width: 1350px;
display: flex; display: flex;
justify-content: center; padding-top: 80px;
h3 { margin: 0 auto;
color: #ffffffff; .nav {
} position: absolute;
.major-kc-wm-list { top: 340px;
left: 440px;
width: 900px;
height: 53px;
background: rgba(246, 168, 0, 0.6);
display: flex; display: flex;
flex-direction: column; // z-index: 999;
position: relative; .li {
padding: 20px 30px; font-size: 24px;
width: 300px; color: #ffffff;
margin: 0 auto; line-height: 53px;
.list-img { min-width: 210px;
z-index: 3; margin-right: 20px;
position: relative; text-align: center;
position: absolute; }
left: 50%; }
background: #fff; .imgs {
border-radius: 50%; margin-right: 20px;
top: 7%; img {
overflow: hidden; width: 210px;
transform: translate(-50%, -50%); display: block;
img { margin-bottom: 6px;
&:hover {
transform: scale(1.05);
transition: all 0.5s; transition: all 0.5s;
transform: scale(0.9);
cursor: pointer;
&:hover {
transform: scale(1);
}
} }
} }
.list-body { }
display: flex; .w1 {
position: relative; img {
// align-items: center; width: 420px;
flex-direction: column;
background: #fff;
border-radius: 26px;
width: 300px;
padding: 100px 0px 30px 0px;
height: 185px;
.max-width-180 {
max-width: 180px;
}
span {
padding: 5px 15px 0 40px;
color: #222222ff;
line-height: 20px;
}
&::before {
content: '';
position: absolute;
height: 90%;
width: 90%;
top: 5%;
border: 1px solid rgba(151, 151, 151, 1);
border-radius: 26px;
border-style: dashed;
}
.mian-txt {
position: relative;
&::before {
content: '';
position: absolute;
left: 22px;
top: 10px;
// -webkit-transform: translateX(-50%);
width: 8px;
height: 8px;
border: 2px solid #e27f4d;
border-radius: 50%;
}
}
.title {
padding: 0;
display: block;
width: 100%;
text-align: center;
}
.zs {
padding: 5px 0 0 0;
display: block;
width: 100%;
text-align: center;
color: #e27f4d;
}
&::before {
content: '';
position: absolute;
height: 90%;
width: 90%;
top: 5%;
left: 50%;
-webkit-transform: translateX(-50%);
border: 1px solid rgba(151, 151, 151, 1);
border-radius: 26px;
border-style: dashed;
}
} }
} }
} }
} }
.swiper-container {
padding-top: 70px;
padding-bottom: 40px;
}
</style> </style>
src/style.scss
浏览文件 @ 073f5216
...@@ -31,7 +31,7 @@ body { ...@@ -31,7 +31,7 @@ body {
} }
/* 改变主题色变量 */ /* 改变主题色变量 */
$--color-primary: #005596; $--color-primary: rgba(26, 86, 50, 1);
/* 改变 icon 字体路径变量，必需 */ /* 改变 icon 字体路径变量，必需 */
$--font-path: '~element-ui/lib/theme-chalk/fonts'; $--font-path: '~element-ui/lib/theme-chalk/fonts';
/* 引入element-ui对应scss文件，重新编译 */ /* 引入element-ui对应scss文件，重新编译 */
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论