Commit 7854e4d3 authored by liaili's avatar liaili

6

parent 01c48048
This diff is collapsed.
......@@ -9,10 +9,10 @@
</head>
<body>
<section>
<div class="banner">
<img src="https://res.fudou6.com/c/4/20160805/rggYmFubmVyXzAz_264x237.png" alt=""/>
<span>抱歉,详细信息只对已在富豆平台认证成功的理财师开放</span>
</div>
<header>
<!--<img src="https://res.fudou6.com/c/4/20160805/rggYmFubmVyXzAz_264x237.png" alt=""/>-->
抱歉,详细信息只对已在富豆平台认证成功的理财师开放
</header>
<div class="certification-process">
<h4>认证流程</h4>
<p>Step 01 : 下载富豆优投APP并登录</p>
......@@ -22,11 +22,9 @@
<p>Step 03 : 提交认证材料 , 等待审核即可</p>
<img src="https://res.fudou6.com/c/4/20160805/2jycGFnZS0wM18wMw==_660x1173.png" alt="">
</div>
<a href="" class="loading-app">点击下载富豆优投APP</a>
</section>
<a href="" class="loading-app">点击下载富豆优投APP</a>
<script src="./common.js"></script>
<script src="certification-process.js"></script>
<script src="./flexible.debug.js"></script>
</body>
</html>
......@@ -6,47 +6,68 @@
body {
color: #494949;
}
section {
.banner {
padding: 1rem 0.5rem;
background: #353950;
position: relative;
img {
width: 4rem;
}
section{
max-width: 768px;
margin: 0 auto;
padding-bottom: 50px;
header {
padding:80px 20px 80px 180px;
background: #353950 url(https://res.fudou6.com/c/4/20160805/rggYmFubmVyXzAz_264x237.png)no-repeat 30px center;
background-size: 132px 118px;
font-size: 16px;
line-height: 28px;
color: #fefefe;
span {
width: 4.5rem;
width: 50%;
display: block;
position: absolute;
right: 0.5rem;
right: 20px;
top:2rem;
font-size: 0.5rem;
line-height: 0.7rem;
font-size: 16px;
line-height: 28px;
color: #fefefe;
}
}
.certification-process {
padding: 0.5rem;
padding: 20px 54px ;
h4 {
margin: 0;
font-size: 0.6rem;
font-size: 20px;
color: #000;
}
p {
padding: 0.5rem 0;
font-size: 0.4rem;
padding: 10px 0;
font-size: 14px;
}
img {
width: 9rem;
max-width: 100%;
margin: 0 auto;
}
}
}
.loading-app {
display: block;
position: fixed;
bottom:0;
width: 100%;
height: 50px;
line-height: 50px;
text-align: center;
padding:0.5rem 0;
font-size: 0.5rem;
font-size: 18px;
color: #fff;
background: #ff494b;
}
@media screen and (min-width: 1023px) {
.loading-app {
position: static;
display: block;
width: 660px;
margin: 0 auto 20px;
height: 60px;
line-height: 60px;
border-radius: 4px;
}
section {
padding-bottom: 0;
}
}
}
......@@ -31,5 +31,4 @@
</body>
<script src="./common.js"></script>
<script src="./index.js"></script>
<!--<script src="./flexible.debug.js"></script>-->
</html>
*{
box-sizing: border-box;
}
body {
color: #fff;
font-family: Microsoft YaHei, simhei, Tahoma, Arial;
margin: 0;
background: #313139;
}
@import 'normalize.less';
:global {
body {
background: #313139;
color: #fff;
}
article {
max-width:768px;
margin: 0 auto;
......
......@@ -16,5 +16,4 @@
</body>
<script src="./common.js"></script>
<script src="./navitation-friend.js"></script>
<script src="./flexible.debug.js"></script>
</html>
......@@ -4,6 +4,8 @@
text-decoration: none;
}
article {
max-width: 768px;
margin: 0 auto;
background: #fff;
padding:20px;
color: #000;
......
......@@ -10,7 +10,7 @@
<body>
<section>
<div class="navitation">
<h1>尊敬的维基,您好</h1>
<h1>尊敬的维基,您好!</h1>
<div class="navitation-amount">
<a href="javascript:;">绑定成功:2人</a>
<a href="javascript:;">邀请人数:10人</a>
......@@ -67,16 +67,17 @@
</table>
</div>
<div class="explain">
<h3>说明</h3>
<h3></h3>
<h5>绑定状态释义如下:</h5>
<p>-抢到了:被邀请用户下载注册富豆优投APP时使用了您的邀请码;</p>
<p>-未绑定:被邀请用户未下载注册富豆优投APP或注册时未填写邀请码;</p>
<p>-被抢了:被邀请用户下载注册富豆优投APP时使用了其它邀请码。</p>
<p>
-抢到了:被邀请用户下载注册富豆优投APP时使用了您的邀请码; <br/>
-未绑定:被邀请用户未下载注册富豆优投APP或注册时未填写邀请码;<br/>
-被抢了:被邀请用户下载注册富豆优投APP时使用了其它邀请码。
</p>
</div>
<a href="javascript:;" class="navitation-friend">邀请好友入驻</a>
</section>
<a href="javascript:;" class="navitation-friend">邀请好友入驻</a>
</body>
<script src="./common.js"></script>
<script src="./navitation-record.js"></script>
<script src="./flexible.debug.js"></script>
</html>
@import 'normalize.less';
:global {
section{
max-width: 768px;
margin: 0 auto 60px;
.navitation {
background: #353950 url(https://res.fudou6.com/c/4/20160804/udmYmctMDFfMDM=_749x66.png)no-repeat center bottom;
padding:1rem 0 2rem;
padding:30px 0 60px;
h1 {
font-size: 0.55rem;
margin-bottom: 0.5rem;
font-size: 18px;
margin-bottom: 16px;
text-align: center;
color: #fff;
}
.navitation-amount {
width: 8rem;
width: 250px;
margin: 0 auto;
&:after {
content:'';
......@@ -19,10 +22,10 @@
clear: both;
}
a {
padding: 0.157rem 0.26rem;
border-radius: 0.11rem;
padding: 8px 10px;
border-radius: 4px;
text-decoration: none;
font-size: 0.4rem;
font-size: 14px;
background: #494d68;
color: #fff;
float: left;
......@@ -42,7 +45,7 @@
thead tr {
border-bottom: 1px solid #969696;
color: #222228;
font-size: 0.4rem;
font-size: 14px;
th {
padding: 10px 0;
......@@ -50,15 +53,15 @@
width: 10%;
}
&:nth-child(2) {
width: 25%;
width: 30%;
}
&:nth-child(3) {
width: 22.5%;
width: 20%;
}
&:nth-child(1) {
width: 22.5%;
&:nth-child(4) {
width: 20%;
}
&:nth-child(1) {
&:nth-child(5) {
width: 10%;
}
}
......@@ -72,6 +75,7 @@
font-size: 14px;
padding: 10px 0;
a {
font-size: 20px;
font-weight: bolder;
color: #c3c3c3;
text-decoration: none;
......@@ -94,10 +98,9 @@
color: #969696;
font-size: 14px;
h3 {
padding-bottom: 14px;
font-size: 18px;
text-align: center;
position: relative;
padding: 0;
&:before {
content: '';
display: block;
......@@ -105,36 +108,53 @@
height: 0;
border-bottom: 1px solid #969696;
position: absolute;
top:0.26rem;
top:9px;
left:0;
z-index: -2;
}
&:after {
content: '';
content: '说明';
display: block;
width: 1.8rem;
height: 1px;
padding: 6px 10px;
background: #fff;
position: absolute;
top:0.26rem;
left:3.5rem;
top:-5px;
left:40%;
z-index: -1;
font-size: 18px;
}
}
h5 {
font-size: 0.5rem;
padding: 0.16rem 0 0.26rem;
margin: 0;
font-size: 16px;
}
p {
line-height: 0.55rem;
line-height: 24px;
}
}
}
.navitation-friend {
width: 100%;
position: fixed;
bottom: 0;
padding:16px 0;
text-align: center;
font-size: 20px;
font-weight: bold;
background: #ff494b;
color: #fff;
text-decoration: none;
}
@media screen and (min-width: 1023px) {
.navitation-friend {
position: static;
display: block;
padding:0.55rem 0;
width: 768px;
height: 60px;
line-height: 60px;
margin: 0 auto;
text-align: center;
font-size: 0.485rem;
font-size: 20px;
font-weight: bold;
background: #ff494b;
color: #fff;
......
......@@ -9,18 +9,15 @@
</head>
<body>
<section>
<div class="banner">
<img src="https://res.fudou6.com/c/4/20160805/m9pYmFubmVyLTAy_179x179.png" alt="">
<span>
被邀请人手机号码 <br>
<header>
被邀请人手机号码
<strong>18766773541</strong>
</span>
</div>
<div class="info">
<div>
<h3>绑定信息</h3>
</header>
<section class="user-info">
<h3>
绑定信息
<a href="javascript:;">抢到了</a>
</div>
</h3>
<div>
<span class="fl">受邀时间:</span>
<time class="fr">2016-7-30 10:23:33</time>
......@@ -29,8 +26,8 @@
<span class="fl">注册时间:</span>
<time class="fr">2016-7-30 10:23:33</time>
</div>
</div>
<div class="order-record">
</section>
<section class="user-info">
<h3>成单记录</h3>
<div>
<span class="fl">成交单数:</span>
......@@ -44,10 +41,9 @@
<span class="fl">累计获佣:</span>
<span class="fr">10000元</span>
</div>
</div>
</section>
</section>
<script src="./common.js"></script>
<script src="./register-info.js"></script>
<script src="./flexible.debug.js"></script>
</body>
</html>
......@@ -3,83 +3,53 @@
a {
text-decoration:none;
}
.banner {
padding: 1rem;
background: #353950;
position: relative;
section {
max-width: 768px;
margin: 0 auto;
header {
padding: 70px 20px 70px 150px;
background: #353950 url(https://res.fudou6.com/c/4/20160805/m9pYmFubmVyLTAy_179x179.png)no-repeat 30px center;
background-size: 100px;
font-size: 18px;
line-height: 28px;
color: #fff;
img {
width: 3rem;
}
span {
display: block;
position: absolute;
top:1.5rem;
right: 1.2rem;
font-size: 0.5rem;
line-height: 0.8rem;
strong {
font-size: 0.6rem;
font-weight: normal;
}
}
}
.info {
.user-info {
background: #ececec;
div {
&:nth-child(1) {
height: 1.6rem;
padding: 0 0.5rem;
border-bottom: 2px solid #b2b2b2;
margin-bottom: 30px;
h3 {
float: left;
line-height: 1.6rem;
font-size: 0.6rem;
padding: 20px;
border-bottom: 2px solid #b2b2b2;
font-size: 22px;
margin: 0;
}
position: relative;
a {
padding: 0.2rem 0.3rem;
font-size: 0.5rem;
float: right;
padding: 8px 10px;
font-size: 20px;
position: absolute;
right: 20px;
top:14px;
background: #ff494b;
border-radius: 0.1rem;
border-radius: 4px;
color: #fff;
margin-top: 0.3rem;
}
}
&:nth-child(2),
&:nth-child(3) {
width: 9rem;
margin: 0 auto;
height: 1.5rem;
line-height: 1.3rem;
font-size: 0.5rem;
}
&:nth-child(2) {
div {
border-bottom: 1px solid #cecece;
padding: 12px 20px;
font-size: 16px;
span,
time {
display: block;
width: 40%;
&:last-child {
text-align: right;
}
}
}
.order-record {
margin-top: 0.5rem;
background: #ececec;
h3 {
height: 1.6rem;
line-height: 1.6rem;
font-size: 0.6rem;
padding-left: 0.5rem;
border-bottom: 2px solid #b2b2b2;
margin: 0;
}
div {
width: 9rem;
margin: 0 auto;
height: 1.3rem;
line-height: 1.3rem;
font-size: 0.5rem;
border-top:1px solid #cecece;
&:first-child {
border-top: 0;
&:after {
content: '';
display: block;
clear: both;
}
}
}
......@@ -89,4 +59,6 @@
.fr {
float: right;
}
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment