diff --git a/miniprogram/pages/index/index.js b/miniprogram/pages/index/index.js index a7fed012d716295b4206b5c47e519e8f8c495fb3..d3b8f40a2dd357886ed1b0e5e47806a77864be27 100644 --- a/miniprogram/pages/index/index.js +++ b/miniprogram/pages/index/index.js @@ -15,7 +15,8 @@ Page({ userInfo: {}, hasUserInfo: false, isloading: true, - isOldVersion: false + isOldVersion: false, + isShowBottom:true }, getUserInfoBtn: function (info) { wx.showLoading({ @@ -105,7 +106,8 @@ Page({ console.log('res jump', res) // 通过 eventChannel 向被打开页面传送数据 res.eventChannel.emit('setHomePageData', { - userInfo: thisBack.data.userInfo + userInfo: thisBack.data.userInfo, + isShowBottom: thisBack.data.isShowBottom }) } }) @@ -123,7 +125,8 @@ Page({ userName: authorPageConfig.userName, designPlaceholder: authorPageConfig.designPlaceholder, isOldVersion: authorPageConfig.isOldVersion, - joinTitle: authorPageConfig.joinTitle + joinTitle: authorPageConfig.joinTitle, + isShowBottom: authorPageConfig.isShowBottom }) // this.jumpTohome() // 页面创建时执行 diff --git a/miniprogram/pages/index/index.wxml b/miniprogram/pages/index/index.wxml index c59f700e9f48a9407fc03b3ddf6e1a3f960a9ffc..00b9f5bb61edf41b5a8b4ee8ae8c43d8007c5cb4 100644 --- a/miniprogram/pages/index/index.wxml +++ b/miniprogram/pages/index/index.wxml @@ -1,5 +1,10 @@ - {{title}} + + + {{title}} + + + @@ -9,16 +14,15 @@ - - + + + + + diff --git a/miniprogram/pages/index/index.wxss b/miniprogram/pages/index/index.wxss index 512a87c1fea6930544ffe4c9118a9906c17238ef..fb9cd4430ec7ff75d0ef8bd618555b5d62ba9fb8 100644 --- a/miniprogram/pages/index/index.wxss +++ b/miniprogram/pages/index/index.wxss @@ -1,18 +1,23 @@ /**index.wxss**/ page { - padding-top: 54rpx; - background: #05b3ec; - color: #fff; + /* background: #00416A; */ + background: -webkit-linear-gradient(to top, #E4E5E6, #00416A); + background: linear-gradient(to bottom, rgb(119, 119, 119), #076585); /* fallback for old browsers */ - background: -webkit-linear-gradient(to top, #fff, #076585); + /* background: -webkit-linear-gradient(to top, #fff, #076585); */ /* Chrome 10-25, Safari 5.1-6 */ - background: linear-gradient(to top, #fff, #076585); + /* background: linear-gradient(to top, rgb(255, 255, 255), #076585); */ /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ + background-image: url('https://yongma16.xyz/staticFile/common/img/scene.png'); + background-repeat: no-repeat; + background-size: cover; padding-bottom: 60rpx; } - +.l-avatar-text{ + color:#ffffff !important; +} .login-container{ position: absolute; @@ -46,10 +51,12 @@ page { width: 100px; height: 100px; border-radius: 50%; + border: 2px solid #fff; } .title { font-family: PingFang SC; + margin-top:50px; font-weight: 500; font-size: 22px; margin-bottom: 40rpx; @@ -142,7 +149,7 @@ page { text-align: center; font-size: 12px; font-weight: bold; - color: #076585; + color: #ffffff; } @@ -179,19 +186,19 @@ page { left: 0%; top: 0%; animation: rotate-one 1.15s linear infinite; - border-bottom: 3px solid #ffffff; + border-bottom: 3px solid #fff; } .loader-child:nth-of-type(2) { right: 0%; top: 0%; animation: rotate-two 1.15s linear infinite; - border-right: 3px solid #ffffff; + border-right: 3px solid #fff; } .loader-child:nth-of-type(3) { right: 0%; bottom: 0%; animation: rotate-three 1.15s linear infinite; - border-top: 3px solid #ffffff; + border-top: 3px solid #fff; } @keyframes rotate-one { 0% { @@ -218,4 +225,118 @@ page { 100% { transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg); } -} \ No newline at end of file +} + +/* 底层 */ +.text-magic{ + position: relative; + transform:scale(2.4); + font-size: 10px; + text-align: center; + color:#fff; +} +/* 扫描线条黑色 顶层*/ +.white{ + position: relative; + left:0px; + width:100%; + text-align: center; + height: 1px; + background: rgba(255,255,255,.8); + z-index: 4; + animation: whiteMove 2s ease-out infinite; +} +@keyframes whiteMove{ + 8%{ + top:-10px; + } + 14%{ + top:-5px; + } + 18%{ + top:-2px; + } + 20%{ + top:-8px; + } + 32%{ + top:-3px; + } + 60%{ + top:-5px; + } + 80%{ + top:-8px; + } + 99%{ + top:-1px; + } +} +/* 红色阴影左移0.5px 第二层*/ +.text-magic::before{ + position: absolute; + /* 文字内容传递 */ + content: attr(data-word); + width: 100%; + top:0; + left:1px; + height:36px; + color:rgba(255,255,255,.9); + z-index: 6; + /* 羽化 */ + filter: contrast(200%); + text-shadow: 1px 0 0 rgba(255,255,255,.3); + overflow: hidden; + animation: redShadow 2s ease-in infinite; +} +@keyframes redShadow{ + 20%{ + height: 32px; + } + 60%{ + height:6px; + } + 100%{ + height: 42px; + } +} +/* 左移错位-3px 第三层*/ +.text-magic::after { + content: attr(data-word); + position: absolute; + top: 0; + left: -0.5px; + height: 36px; + color: rgba(255, 255, 255, 0.5); + overflow: hidden; + z-index: 3; + /* background: rgba(0, 0, 0, 0.9); */ + animation: redHeight 2s ease-out infinite; + filter: contrast(200%); + text-shadow: -1px 0 0 rgba(255,255,255,.3); + mix-blend-mode: darken; +} + +@keyframes redHeight { + 20% { + height: 42px; + } + 35% { + height: 12px; + } + 50% { + height: 40px; + } + 60% { + height: 20px; + } + 70% { + height: 34px; + } + 80% { + height: 22px; + } + 100% { + height: 0px; + } +}