项目选择页面调整

chengdu
liangliang.Li 4 years ago
parent 55782907b9
commit f614454c34
  1. BIN
      src/assets/img/content.jpg
  2. BIN
      src/assets/img/indexBg.jpg
  3. 3
      src/components/page/ClientLogin.vue
  4. 2
      src/components/page/Index.vue
  5. 93
      src/components/page/ProjectPattern.vue

Binary file not shown.

Before

Width:  |  Height:  |  Size: 441 KiB

After

Width:  |  Height:  |  Size: 44 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 198 KiB

After

Width:  |  Height:  |  Size: 134 KiB

@ -202,7 +202,8 @@ export default {
},
methods: {
backIndex(){
this.$router.go(-1);
// this.$router.go(-1);
this.$router.push('login');
},
getSchool(form) {
this.$refs[form].validate(valid => {

@ -64,7 +64,7 @@ export default {
margin-left: 250px;
display: flex;
// color: #002E66;
color: white;
color: #7AA0B7;
font-size: 27px;
letter-spacing:4px;
line-height:1.5

@ -5,19 +5,19 @@
{{projectList[pattern].title}}
</div>
<div class="content_one_text">
<div class="principle_wrap">
<div class="principle_wrap text_wrap">
<div class="one_title">实验原理</div>
<div class="one_text">
{{projectList[pattern].principle}}
</div>
</div>
<div class="step_wrap">
<div class="step_wrap text_wrap">
<div class="one_title">实验步骤</div>
<div class="one_text">
{{projectList[pattern].step}}
</div>
</div>
<div class="prepare_wrap">
<div class="prepare_wrap text_wrap">
<div class="one_title">实验准备</div>
<div class="one_text">
{{projectList[pattern].prepare}}
@ -63,7 +63,7 @@ export default {
};
},
mounted(){
this.patternId = this.$route.query.type
},
methods: {
toIndex() {
@ -104,71 +104,85 @@ export default {
.wrap{
width: 100%;
height: 100%;
display: flex;
// display: flex;
font-family: '微软雅黑';
}
.content_one{
// margin-top: 60px;
width: 100%;
height: 900px;
background: white;
// height: 600px;
// background: red;
background: url('../../assets/img/content.jpg');
background-size: 100% 100%;
.content_one_title{
width: 100%;
height: 130px;
line-height: 130px;
height: 100px;
line-height: 100px;
text-align: center;
font-size: 50px;
letter-spacing:8px;
font-weight: 550;
color: white;
color: #FF5288;
}
.content_one_text{
width: 95%;
margin: auto;
background-size: 100% ;
border-radius: 20px;
height: 400px;
overflow: hidden;
background: url('../../assets/img/content.jpg');
}
}
.one_title{
width: 280px;
height: 40px;
line-height: 40px;
font-size: 25px;
color: #FF5288;
letter-spacing:4px;
padding-left: 100px;
box-sizing: border-box;
font-weight: 550;
border-radius: 0px 20px 20px 0px;
background: white;
}
.one_text{
width: 900px;
height: 200px;
padding: 45px 60px;
box-sizing: border-box;
// background: red;
font-size: 23px;
line-height: 1.5;
color: white;
letter-spacing:2px;
font-weight: 60;
.text_wrap{
display: flex;
.one_title{
width: 280px;
height: 130px;
line-height: 130px;
font-size: 28px;
color: #FF5288;
letter-spacing:4px;
padding-left: 100px;
box-sizing: border-box;
font-weight: 550;
// border-radius: 0px 20px 20px 0px;
// background: white;
}
.one_text{
width: 1500px;
height: 130px;
padding: 45px 0px;
box-sizing: border-box;
// background: red;
font-size: 23px;
line-height: 2;
color: #4D4D4F;
letter-spacing:2px;
font-weight: 60;
}
}
.pattern_wrap{
width: 100%;
// height: 150px;
// background: red;
border-top: 2px solid #FF5288;
// border-top: 2px solid #FF5288;
padding: 0px 100px;
display: flex;
justify-content: space-between;
box-sizing: border-box;
margin-top: 80px;
// margin-top: 20px;
.img_wrap{
margin-top: 30px;
width: 500px;
height: 380px;
height: 370px;
text-align: center;
box-shadow: -2px 6px 10px -4px rgba(136,80,98,0.75);
-webkit-box-shadow: -2px 6px 10px -4px rgba(136,80,98,0.75);
-moz-box-shadow: -2px 6px 10px -4px rgba(136,80,98,0.75);
margin-bottom: 80px;
// margin-bottom: 10px;
font-size: 23px;
color: #FF5288;
font-weight: 550;
@ -178,6 +192,7 @@ export default {
box-shadow: -2px 6px 10px -6px rgba(136,80,98,0.75);
-webkit-box-shadow: -2px 6px 10px -6px rgba(136,80,98,0.75);
-moz-box-shadow: -2px 6px 10px -6px rgba(136,80,98,0.75);
cursor: pointer;
img{
opacity: 0.9;

Loading…
Cancel
Save