提交 730c9724 编写于 作者: tao.wu's avatar tao.wu

预热页面ui图新增

上级 9873606b
.index-wrap{
div{
width: 375px;
img{
width: 375px;
display: block;
}
}
.wrap-join{
height: 72.5px;
background: url(../img/img4.png) no-repeat center center;
background-size: 100% 100%;
.wrap-count{
width: 325px;
height: 72.5px;
display: flex;
margin: 0 auto;
h1{
margin-top: 9px;
font-size:23px;
font-weight:700;
color:rgba(255,255,255,1);
line-height:32.5px;
text-align: center;
}
h5{
font-size:14px;
font-weight:400;
color:rgba(255,255,255,0.59);
line-height:20px;
text-align: center;
}
}
}
.btn-app-share{
img{
width: 312px;
height: 51.5px;
margin: 0 auto;
}
}
.btn-appoint{
height: 94.5px;
background: url(../img/img5.png) no-repeat center center;
background-size: 100% 100%;
img{
padding-top: 15px;
}
}
.btn-share{
height: 166px;
background: url(../img/img11.png) no-repeat center center;
background-size: 100% 100%;
img{
padding-top: 81px;
}
}
.rule-show{
background:rgba(254,124,86,1);
.bird{
width: 22.5px;
height: 28.5px;
margin: 0 auto;
padding: 24px 0;
}
.rule-bg{
width:345px;
margin:0 auto;
box-sizing: border-box;
background:rgba(236,107,69,1);
border-radius:12px;
padding: 15px;
section{
h1{
font-size:16px;
font-weight:700;
color:rgba(255,234,136,1);
line-height:18px;
margin-bottom: 12px;
}
p{
font-size:14px;
font-weight:500;
color:rgba(255,246,202,1);
line-height:19px;
margin-bottom: 9px;
span{
font-weight:700;
}
}
}
.margin-top-20{
margin-top: 20px;
}
.line{
margin-top: 20px;
width:309.5px;
height:.5px;
background: #FFF6CA;
}
.btn-rule{
width: 90px;
height: 15px;
font-size:15px;
color:rgba(255,255,255,1);
line-height:15px;
margin: 0 auto;
padding: 16.5px 0 1.5px 0;
}
}
}
}
\ No newline at end of file
<template>
<section class="index-wrap">
<div>
<div id="imgHeight1">
<img src="../assets/img/img1.png" />
<img src="../assets/img/img2.png" />
<img src="../assets/img/img3.png" />
</div>
<div class="wrap-join">
<div class="wrap-join" id="imgHeight2">
<div class="wrap-count">
<div>
<h1>2394847</h1>
......@@ -30,12 +30,19 @@
<div class="rule-show">
<img src="../assets/img/rule_title.png" />
<div class="rule-bg">
<h1>每日任务,攒勤奋分</h1>
<p><span>比赛时间:</span>2019.12.16 10:00-2019.12.30 00:00</p>
<p><span>医生机构:</span>根据机构内注册医生的勤奋分总额排名,活动结束后机构榜单指定名次可获得云鹊豆,榜单第一可获得云鹊机构奖荣誉。</p>
<p><span>医生个人:</span>完成每日学习任务可积攒勤奋分和云鹊豆,每日个人排行榜前十可获得相应实物奖品,个人累计排行第一获得云鹊勤奋之星荣誉、iphone11(64G)一台及云鹊豆奖品。</p>
<h1>公布排名</h1>
<p></p>
<section>
<h1>每日任务,攒勤奋分</h1>
<p><span>比赛时间:</span>2019.12.16 10:00-2019.12.30 00:00</p>
<p><span>医生机构:</span>根据机构内注册医生的勤奋分总额排名,活动结束后机构榜单指定名次可获得云鹊豆,榜单第一可获得云鹊机构奖荣誉。</p>
<p><span>医生个人:</span>完成每日学习任务可积攒勤奋分和云鹊豆,每日个人排行榜前十可获得相应实物奖品,个人累计排行第一获得云鹊勤奋之星荣誉、iphone11(64G)一台及云鹊豆奖品。</p>
</section>
<section class="margin-top-20">
<h1>公布排名</h1>
<p><span>公布时间:</span>2019.12.30 10:00-2020.1.5</p>
<p>公布个人获奖名单和机构获奖名单</p>
</section>
<div class="line"></div>
<div class="btn-rule">查看规则详情</div>
</div>
<img class="bird" src="../assets/img/bird.png">
</div>
......@@ -62,88 +69,17 @@ export default {
},
created() {
},
mounted() {},
mounted() {
const imgHeight1 = document.getElementById('imgHeight1');
// const imgHeight2 = document.getElementById('imgHeight2');
console.log(imgHeight1.offsetHeight)
// console.log(this.$refs.imgHeight1)
},
methods: {
},
}
</script>
<style lang="less">
.index-wrap{
div{
width: 375px;
img{
width: 375px;
display: block;
}
}
.wrap-join{
height: 72.5px;
background: url(../assets/img/img4.png) no-repeat center center;
background-size: 100% 100%;
.wrap-count{
width: 325px;
height: 72.5px;
display: flex;
margin: 0 auto;
h1{
margin-top: 9px;
font-size:23px;
font-weight:700;
color:rgba(255,255,255,1);
line-height:32.5px;
text-align: center;
}
h5{
font-size:14px;
font-weight:400;
color:rgba(255,255,255,0.59);
line-height:20px;
text-align: center;
}
}
}
.btn-app-share{
img{
width: 312px;
height: 51.5px;
margin: 0 auto;
}
}
.btn-appoint{
height: 94.5px;
background: url(../assets/img/img5.png) no-repeat center center;
background-size: 100% 100%;
img{
padding-top: 15px;
}
}
.btn-share{
height: 166px;
background: url(../assets/img/img11.png) no-repeat center center;
background-size: 100% 100%;
img{
padding-top: 81px;
}
}
.rule-show{
background:rgba(254,124,86,1);
.bird{
width: 22.5px;
height: 28.5px;
margin: 0 auto;
padding: 24px 0;
}
.rule-bg{
width:345px;
height:368.5px;
margin:0 auto;
box-sizing: border-box;
background:rgba(236,107,69,1);
border-radius:12px;
padding: 15px;
}
}
}
@import '../assets/style/index.less';
</style>
\ No newline at end of file
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册