moliparty/peko-h5
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

替换流水链接logo

Browse Source
This commit is contained in:
Dragon
2024-01-04 16:23:38 +08:00
parent 1247af86a4
commit 3c89c7fcfc
5 changed files with 138 additions and 115 deletions
Download Patch File Download Diff File Expand all files Collapse all files

114
view/peko/modules/statistic/css/login.css
View File

@@ -6,10 +6,10 @@ body {
.back { .back {
position: fixed; position: fixed;
z-index: 9; z-index: 9;
width: 0.7466666667rem; width: 0.74667rem;
height: 0.7466666667rem; height: 0.74667rem;
left: 0.5333333333rem; left: 0.53333rem;
top: 0.6666666667rem; top: 0.66667rem;
display: none; display: none;
} }
@@ -21,25 +21,28 @@ body {
position: relative; position: relative;
margin: 0 auto -2rem; margin: 0 auto -2rem;
} }
.header .logo { .header .logo {
position: absolute; position: absolute;
width: 5.7066666667rem; width: 5.70667rem;
height: 5.7066666667rem; height: 5.70667rem;
left: 50%; left: 50%;
top: 2.4266666667rem; top: 2.42667rem;
transform: translateX(-50%); transform: translateX(-50%);
border-radius: 0.53333rem;
} }
.box { .box {
width: 10rem; width: 10rem;
height: 14.6133333333rem; height: 14.61333rem;
border-radius: 0.6666666667rem 0.6666666667rem 0px 0px; border-radius: 0.66667rem 0.66667rem 0px 0px;
margin: 0 auto; margin: 0 auto;
position: relative; position: relative;
z-index: 2; z-index: 2;
background: #fff; background: #fff;
overflow: hidden; overflow: hidden;
} }
.box input { .box input {
background: transparent; background: transparent;
border: none; border: none;
@@ -47,92 +50,106 @@ body {
box-sizing: border-box; box-sizing: border-box;
padding: 0 0.64rem; padding: 0 0.64rem;
} }
.box input::placeholder { .box input::placeholder {
font-size: 0.3733333333rem; font-size: 0.37333rem;
color: #8A8CAB; color: #8A8CAB;
} }
.box .idLogin .id { .box .idLogin .id {
width: 8.08rem; width: 8.08rem;
height: 1.3866666667rem; height: 1.38667rem;
background: #F3F5FA; background: #F3F5FA;
border-radius: 1.3866666667rem; border-radius: 1.38667rem;
margin: 1.28rem auto 0.5333333333rem; margin: 1.28rem auto 0.53333rem;
display: block; display: block;
} }
.box .idLogin .password { .box .idLogin .password {
width: 8.08rem; width: 8.08rem;
height: 1.3866666667rem; height: 1.38667rem;
background: #F3F5FA; background: #F3F5FA;
border-radius: 1.3866666667rem; border-radius: 1.38667rem;
margin: 0rem auto 1.0666666667rem; margin: 0rem auto 1.06667rem;
display: block; display: block;
} }
.box .phone { .box .phone {
display: none; display: none;
} }
.box .phone .phoneNumberBox { .box .phone .phoneNumberBox {
width: 8.08rem; width: 8.08rem;
height: 1.3866666667rem; height: 1.38667rem;
background: #F3F5FA; background: #F3F5FA;
border-radius: 1.3866666667rem; border-radius: 1.38667rem;
margin: 1.28rem auto 0.5333333333rem; margin: 1.28rem auto 0.53333rem;
box-sizing: border-box; box-sizing: border-box;
padding-left: 0.64rem; padding-left: 0.64rem;
} }
.box .phone .phoneNumberBox .prefix { .box .phone .phoneNumberBox .prefix {
float: left; float: left;
font-size: 0.4266666667rem; font-size: 0.42667rem;
color: #1F1B4F; color: #1F1B4F;
font-weight: bold; font-weight: bold;
height: 100%; height: 100%;
line-height: 1.3866666667rem; line-height: 1.38667rem;
} }
.box .phone .phoneNumberBox .prefix b { .box .phone .phoneNumberBox .prefix b {
font-size: 0.4266666667rem; font-size: 0.42667rem;
color: #1F1B4F; color: #1F1B4F;
font-weight: bold; font-weight: bold;
margin-right: 0.1066666667rem; margin-right: 0.10667rem;
} }
.box .phone .phoneNumberBox .prefix img { .box .phone .phoneNumberBox .prefix img {
display: inline-block; display: inline-block;
width: 0.32rem; width: 0.32rem;
height: 0.2133333333rem; height: 0.21333rem;
vertical-align: middle; vertical-align: middle;
} }
.box .phone .phoneNumberBox .phoneNumber { .box .phone .phoneNumberBox .phoneNumber {
float: right; float: right;
height: 100%; height: 100%;
padding: 0; padding: 0;
width: 5.5rem; width: 5.5rem;
} }
.box .phone .codeBox { .box .phone .codeBox {
width: 8.08rem; width: 8.08rem;
height: 1.3866666667rem; height: 1.38667rem;
background: #F3F5FA; background: #F3F5FA;
border-radius: 1.3866666667rem; border-radius: 1.38667rem;
margin: 0rem auto 1.0666666667rem; margin: 0rem auto 1.06667rem;
} }
.box .phone .codeBox .code { .box .phone .codeBox .code {
float: left; float: left;
width: 5rem; width: 5rem;
height: 100%; height: 100%;
} }
.box .phone .codeBox .codeBut { .box .phone .codeBox .codeBut {
text-align: center; text-align: center;
color: #FFFFFF; color: #FFFFFF;
font-size: 0.3733333333rem; font-size: 0.37333rem;
border-radius: 1.0133333333rem; border-radius: 1.01333rem;
width: 2.72rem; width: 2.72rem;
height: 1.0133333333rem; height: 1.01333rem;
line-height: 1.0133333333rem; line-height: 1.01333rem;
float: right; float: right;
margin-top: 0.1866666667rem; margin-top: 0.18667rem;
margin-right: 0.2133333333rem; margin-right: 0.21333rem;
background: #9168FA; background: #9168FA;
} }
.box .phone .codeBox .codeButTime { .box .phone .codeBox .codeButTime {
background: #DED1FD; background: #DED1FD;
} }
.box .but { .box .but {
width: 8.08rem; width: 8.08rem;
height: 1.28rem; height: 1.28rem;
@@ -140,13 +157,15 @@ body {
line-height: 1.28rem; line-height: 1.28rem;
text-align: center; text-align: center;
color: #FFFFFF; color: #FFFFFF;
font-size: 0.4266666667rem; font-size: 0.42667rem;
margin: 0 auto 0.5333333333rem; margin: 0 auto 0.53333rem;
background: linear-gradient(90deg, #EEDCFF 0%, #DEE4FF 50%, #CCF8F9 100%); background: linear-gradient(90deg, #EEDCFF 0%, #DEE4FF 50%, #CCF8F9 100%);
} }
.box .butok { .box .butok {
background: linear-gradient(90deg, #5AECFA 0%, #9DB4FF 49%, #CF70FF 100%); background: linear-gradient(90deg, #5AECFA 0%, #9DB4FF 49%, #CF70FF 100%);
} }
.box .hone { .box .hone {
width: 8.08rem; width: 8.08rem;
height: 1.28rem; height: 1.28rem;
@@ -154,8 +173,8 @@ body {
line-height: 1.28rem; line-height: 1.28rem;
text-align: center; text-align: center;
color: #9168FA; color: #9168FA;
font-size: 0.4266666667rem; font-size: 0.42667rem;
margin: 0 auto 0.5333333333rem; margin: 0 auto 0.53333rem;
background: linear-gradient(270deg, #FAEDFF 0%, #E6FDFF 100%); background: linear-gradient(270deg, #FAEDFF 0%, #E6FDFF 100%);
border: 1px solid #D480FF; border: 1px solid #D480FF;
} }
@@ -170,45 +189,48 @@ body {
background: rgba(0, 0, 0, 0.6); background: rgba(0, 0, 0, 0.6);
display: none; display: none;
} }
.area .box { .area .box {
width: 100%; width: 100%;
height: 8.88rem; height: 8.88rem;
border-radius: 0.7466666667rem 0.7466666667rem 0 0; border-radius: 0.74667rem 0.74667rem 0 0;
background: #fff; background: #fff;
position: absolute; position: absolute;
bottom: 0; bottom: 0;
left: 0; left: 0;
} }
.area .box p { .area .box p {
width: 100%; width: 100%;
text-align: center; text-align: center;
height: 1.8133333333rem; height: 1.81333rem;
line-height: 1.8133333333rem; line-height: 1.81333rem;
border-bottom: 0.0133333333rem solid #EBEEF5; border-bottom: 0.01333rem solid #EBEEF5;
font-size: 0.48rem; font-size: 0.48rem;
font-weight: bold; font-weight: bold;
color: #1F1B4F; color: #1F1B4F;
} }
.area .box .list { .area .box .list {
position: absolute; position: absolute;
left: 0; left: 0;
top: 1.8133333333rem; top: 1.81333rem;
overflow-y: scroll; overflow-y: scroll;
width: 100%; width: 100%;
height: 7rem; height: 7rem;
} }
.area .box .list span { .area .box .list span {
display: block; display: block;
width: 100%; width: 100%;
height: 1.36rem; height: 1.36rem;
line-height: 1.36rem; line-height: 1.36rem;
font-size: 0.4266666667rem; font-size: 0.42667rem;
border-bottom: 0.0133333333rem solid #EBEEF5; border-bottom: 0.01333rem solid #EBEEF5;
text-align: center; text-align: center;
color: #1F1B4F; color: #1F1B4F;
} }
.area .box .list .active { .area .box .list .active {
background: #F3F5FA; background: #F3F5FA;
} }
/*# sourceMappingURL=login.css.map */

137
view/peko/modules/statistic/css/login.scss
View File

@@ -1,5 +1,5 @@
@function px2rem($px, $rem:75) { @function px2rem($px) {
@return $px / $rem+rem; @return $px / 75+rem;
} }
html, html,
@@ -10,16 +10,16 @@ body {
.back { .back {
position: fixed; position: fixed;
z-index: 9; z-index: 9;
width: px2rem(56, ); width: px2rem(56);
height: px2rem(56, ); height: px2rem(56);
left: px2rem(40, ); left: px2rem(40);
top: px2rem(50, ); top: px2rem(50);
display: none; display: none;
} }
.header { .header {
width: 100%; width: 100%;
height: px2rem(666, ); height: px2rem(666);
background: url(../images/login/bg.png) no-repeat; background: url(../images/login/bg.png) no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
position: relative; position: relative;
@@ -27,19 +27,20 @@ body {
.logo { .logo {
position: absolute; position: absolute;
width: px2rem(428, ); width: px2rem(428);
height: px2rem(428, ); height: px2rem(428);
left: 50%; left: 50%;
top: px2rem(182, ); top: px2rem(182);
transform: translateX(-50%); transform: translateX(-50%);
border-radius: px2rem(40);
} }
} }
.box { .box {
width: px2rem(750, ); width: px2rem(750);
height: px2rem(1096, ); height: px2rem(1096);
border-radius: px2rem(50, ) px2rem(50, ) 0px 0px; border-radius: px2rem(50) px2rem(50) 0px 0px;
margin: 0 auto; margin: 0 auto;
position: relative; position: relative;
z-index: 2; z-index: 2;
@@ -51,30 +52,30 @@ body {
border: none; border: none;
outline: none; outline: none;
box-sizing: border-box; box-sizing: border-box;
padding: 0 px2rem(48, ); padding: 0 px2rem(48);
&::placeholder { &::placeholder {
font-size: px2rem(28, ); font-size: px2rem(28);
color: #8A8CAB; color: #8A8CAB;
} }
} }
.idLogin { .idLogin {
.id { .id {
width: px2rem(606, ); width: px2rem(606);
height: px2rem(104, ); height: px2rem(104);
background: #F3F5FA; background: #F3F5FA;
border-radius: px2rem(104, ); border-radius: px2rem(104);
margin: px2rem(96, ) auto px2rem(40, ); margin: px2rem(96) auto px2rem(40);
display: block; display: block;
} }
.password { .password {
width: px2rem(606, ); width: px2rem(606);
height: px2rem(104, ); height: px2rem(104);
background: #F3F5FA; background: #F3F5FA;
border-radius: px2rem(104, ); border-radius: px2rem(104);
margin: px2rem(0, ) auto px2rem(80, ); margin: px2rem(0) auto px2rem(80);
display: block; display: block;
} }
} }
@@ -83,33 +84,33 @@ body {
display: none; display: none;
.phoneNumberBox { .phoneNumberBox {
width: px2rem(606, ); width: px2rem(606);
height: px2rem(104, ); height: px2rem(104);
background: #F3F5FA; background: #F3F5FA;
border-radius: px2rem(104, ); border-radius: px2rem(104);
margin: px2rem(96, ) auto px2rem(40, ); margin: px2rem(96) auto px2rem(40);
box-sizing: border-box; box-sizing: border-box;
padding-left: px2rem(48, ); padding-left: px2rem(48);
.prefix { .prefix {
float: left; float: left;
font-size: px2rem(32, ); font-size: px2rem(32);
color: #1F1B4F; color: #1F1B4F;
font-weight: bold; font-weight: bold;
height: 100%; height: 100%;
line-height: px2rem(104, ); line-height: px2rem(104);
b { b {
font-size: px2rem(32, ); font-size: px2rem(32);
color: #1F1B4F; color: #1F1B4F;
font-weight: bold; font-weight: bold;
margin-right: px2rem(8, ); margin-right: px2rem(8);
} }
img { img {
display: inline-block; display: inline-block;
width: px2rem(24, ); width: px2rem(24);
height: px2rem(16, ); height: px2rem(16);
vertical-align: middle; vertical-align: middle;
} }
} }
@@ -123,11 +124,11 @@ body {
} }
.codeBox { .codeBox {
width: px2rem(606, ); width: px2rem(606);
height: px2rem(104, ); height: px2rem(104);
background: #F3F5FA; background: #F3F5FA;
border-radius: px2rem(104, ); border-radius: px2rem(104);
margin: px2rem(0, ) auto px2rem(80, ); margin: px2rem(0) auto px2rem(80);
.code { .code {
float: left; float: left;
@@ -138,14 +139,14 @@ body {
.codeBut { .codeBut {
text-align: center; text-align: center;
color: #FFFFFF; color: #FFFFFF;
font-size: px2rem(28, ); font-size: px2rem(28);
border-radius: px2rem(76, ); border-radius: px2rem(76);
width: px2rem(204, ); width: px2rem(204);
height: px2rem(76, ); height: px2rem(76);
line-height: px2rem(76, ); line-height: px2rem(76);
float: right; float: right;
margin-top: px2rem(14, ); margin-top: px2rem(14);
margin-right: px2rem(16, ); margin-right: px2rem(16);
background: #9168FA; background: #9168FA;
} }
@@ -158,14 +159,14 @@ body {
.but { .but {
width: px2rem(606, ); width: px2rem(606);
height: px2rem(96, ); height: px2rem(96);
border-radius: px2rem(96, ); border-radius: px2rem(96);
line-height: px2rem(96, ); line-height: px2rem(96);
text-align: center; text-align: center;
color: #FFFFFF; color: #FFFFFF;
font-size: px2rem(32, ); font-size: px2rem(32);
margin: 0 auto px2rem(40, ); margin: 0 auto px2rem(40);
background: linear-gradient(90deg, #EEDCFF 0%, #DEE4FF 50%, #CCF8F9 100%); background: linear-gradient(90deg, #EEDCFF 0%, #DEE4FF 50%, #CCF8F9 100%);
} }
@@ -174,14 +175,14 @@ body {
} }
.hone { .hone {
width: px2rem(606, ); width: px2rem(606);
height: px2rem(96, ); height: px2rem(96);
border-radius: px2rem(96, ); border-radius: px2rem(96);
line-height: px2rem(96, ); line-height: px2rem(96);
text-align: center; text-align: center;
color: #9168FA; color: #9168FA;
font-size: px2rem(32, ); font-size: px2rem(32);
margin: 0 auto px2rem(40, ); margin: 0 auto px2rem(40);
background: linear-gradient(270deg, #FAEDFF 0%, #E6FDFF 100%); background: linear-gradient(270deg, #FAEDFF 0%, #E6FDFF 100%);
border: 1px solid #D480FF; border: 1px solid #D480FF;
} }
@@ -199,8 +200,8 @@ body {
.box { .box {
width: 100%; width: 100%;
height: px2rem(666, ); height: px2rem(666);
border-radius: px2rem(56, ) px2rem(56, ) 0 0; border-radius: px2rem(56) px2rem(56) 0 0;
background: #fff; background: #fff;
position: absolute; position: absolute;
bottom: 0; bottom: 0;
@@ -209,10 +210,10 @@ body {
p { p {
width: 100%; width: 100%;
text-align: center; text-align: center;
height: px2rem(136, ); height: px2rem(136);
line-height: px2rem(136, ); line-height: px2rem(136);
border-bottom: px2rem(1, ) solid #EBEEF5; border-bottom: px2rem(1) solid #EBEEF5;
font-size: px2rem(36, ); font-size: px2rem(36);
font-weight: bold; font-weight: bold;
color: #1F1B4F; color: #1F1B4F;
} }
@@ -220,7 +221,7 @@ body {
.list { .list {
position: absolute; position: absolute;
left: 0; left: 0;
top: px2rem(136, ); top: px2rem(136);
overflow-y: scroll; overflow-y: scroll;
width: 100%; width: 100%;
height: 7rem; height: 7rem;
@@ -228,10 +229,10 @@ body {
span { span {
display: block; display: block;
width: 100%; width: 100%;
height: px2rem(102, ); height: px2rem(102);
line-height: px2rem(102, ); line-height: px2rem(102);
font-size: px2rem(32, ); font-size: px2rem(32);
border-bottom: px2rem(1, ) solid #EBEEF5; border-bottom: px2rem(1) solid #EBEEF5;
text-align: center; text-align: center;
color: #1F1B4F; color: #1F1B4F;
} }

BIN
view/peko/modules/statistic/images/logo.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 9.6 KiB

After

Width:  |  Height:  |  Size: 59 KiB

BIN
view/peko/modules/statistic/images/logo1.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 59 KiB

After

Width:  |  Height:  |  Size: 247 KiB

2
view/peko/modules/statistic/login.html
View File

@@ -17,7 +17,7 @@
<img src="./images/back.png" alt="" class="back"> <img src="./images/back.png" alt="" class="back">
<!-- 頭部 --> <!-- 頭部 -->
<div class="header"> <div class="header">
<img src="./images/login/logo.png" alt="" class="logo"> <img src="./images/logo1.png" alt="" class="logo">
</div> </div>
<!-- 底部登入 --> <!-- 底部登入 -->
<div class="box"> <div class="box">