diff --git a/src/assets/v2/bg-top.png b/src/assets/v2/bg-top.png new file mode 100644 index 0000000..5256bf1 Binary files /dev/null and b/src/assets/v2/bg-top.png differ diff --git a/src/assets/v2/bg.jpg b/src/assets/v2/bg.jpg new file mode 100644 index 0000000..bf14c42 Binary files /dev/null and b/src/assets/v2/bg.jpg differ diff --git a/src/assets/v2/content-bg.png b/src/assets/v2/content-bg.png new file mode 100644 index 0000000..22efaad Binary files /dev/null and b/src/assets/v2/content-bg.png differ diff --git a/src/assets/v2/refresh.png b/src/assets/v2/refresh.png new file mode 100644 index 0000000..b24b92a Binary files /dev/null and b/src/assets/v2/refresh.png differ diff --git a/src/assets/v2/rule-btn.png b/src/assets/v2/rule-btn.png new file mode 100644 index 0000000..0c93663 Binary files /dev/null and b/src/assets/v2/rule-btn.png differ diff --git a/src/assets/v2/scan-icon.png b/src/assets/v2/scan-icon.png new file mode 100644 index 0000000..ebad4d3 Binary files /dev/null and b/src/assets/v2/scan-icon.png differ diff --git a/src/assets/v2/title.png b/src/assets/v2/title.png new file mode 100644 index 0000000..e757d33 Binary files /dev/null and b/src/assets/v2/title.png differ diff --git a/src/pages/index/index.vue b/src/pages/index/index.vue index 29355a2..ce8b3ca 100644 --- a/src/pages/index/index.vue +++ b/src/pages/index/index.vue @@ -1,8 +1,9 @@ @@ -372,20 +377,26 @@ input { .index_page { width: 100%; min-height: 16.32rem; - background: url("@/assets/img/bg.png") top center / 100% 16.32rem no-repeat; + background: url("@/assets/v2/bg.jpg") top center / 100% 100% no-repeat; overflow: hidden; position: relative; + .bg-top { + width: 100%; + height: auto; + display: block; + } .logo { width: 3.32rem; height: 0.66rem; - margin-top: 0.26rem; - margin-left: 0.3rem; + margin: 0.26rem auto 0; + margin-bottom: 0.1rem; + display: block; } .rule { width: 0.55rem; height: 1.66rem; position: absolute; - top: 1.26rem; + top: 2rem; left: 0; cursor: pointer; } @@ -393,29 +404,42 @@ input { width: 0.55rem; height: 1.66rem; position: absolute; - top: 1.26rem; + top: 2rem; right: 0; cursor: pointer; } .title { width: 6.45rem; - height: 1.94rem; margin: 0 auto; display: block; animation: titleAnimate linear 1.5s alternate infinite; } } .money { - width: 100%; + background: #CD3032; + // 内阴影 + box-shadow: inset 0px 0.01rem 0.01rem 0px rgba(0, 0, 0, 0.25); + width: 6.4rem; + height: 1.1rem !important; display: flex; align-items: center; - justify-content: center; - margin: 0.32rem auto 0; + padding-left: 0.3rem; + justify-content: flex-start; + border-top-left-radius: 0.2rem; + border-top-right-radius: 0.2rem; + margin: -1.3rem auto 0; + position: relative; + z-index: 1; .remain { width: 1.02rem; height: 0.53rem; margin-right: 0.1rem; } + .remain-word { + font-size: 0.32rem; + color: #FFE9AA; + margin-right: 0.1rem; + } .my-rolling-text { // --van-rolling-text-background: #1989fa; --van-rolling-text-color: white; @@ -423,11 +447,14 @@ input { --van-rolling-text-gap: 6px; --van-rolling-text-item-border-radius: 5px; --van-rolling-text-item-width: 40px; + display: flex; + align-items: center; + height: 0.84rem; } .item1 { width: 0.6rem; - height: 0.84rem; - line-height: 0.84rem; + height: 0.6rem; + line-height: 0.6rem; font-weight: bold; text-align: center; overflow: hidden; @@ -441,36 +468,40 @@ input { .refresh { width: 0.54rem; height: 0.52rem; - background: url("@/assets/img/refresh.png") top center / 100% 100% no-repeat; + background: url("@/assets/v2/refresh.png") top center / 100% 100% no-repeat; margin-left: 0.1rem; + margin-right: 0.3rem; } } .content-box { width: 6.9rem; - background: #f6b8b8; - border-radius: 0.3rem; + // background: #f6b8b8; + background: url("@/assets/v2/content-bg.png") top center / 100% 100% + no-repeat; + height: auto; margin: 0.46rem auto 0; + margin-top: 0; + margin-bottom: 1rem; overflow: hidden; padding: 0.2rem; box-sizing: border-box; .content-main { width: 100%; height: 100%; - background: #fef5f5; border-radius: 0.2rem; margin: 0 auto 0; overflow: hidden; padding-bottom: 0.5rem; .login-btn { width: 3.2rem; - height: 0.8rem; + height: 0.9rem; background: #ea3a3a; - border-radius: 0.4rem; - font-weight: bold; - font-size: 0.32rem; + border-radius: 0.5rem; + font-weight: 500; + font-size: 0.35rem; color: #ffffff; text-align: center; - line-height: 0.8rem; + line-height: 0.9rem; margin: 0.6rem auto 0; } .content-item { @@ -493,10 +524,11 @@ input { margin: 0 auto 0; } .content-title1 { - width: 3.8rem; + width: 3.4rem; height: 0.53rem; - background: url("@/assets/img/title-bg1.png") top center / 100% 100% - no-repeat; + background-color: #F9E9EA; + border-top-left-radius: 0.2rem; + border-top-right-radius: 0.2rem; font-weight: bold; font-size: 0.3rem; color: #97221a; @@ -507,7 +539,8 @@ input { .input-box { width: 5.76rem; height: 0.9rem; - background: #ffffff; + background: #F9F9F9; + border: 0.02rem solid #EDEDED; border-radius: 0.2rem; font-size: 0.32rem; color: #333333; @@ -527,19 +560,20 @@ input { .input-box1 { width: 2.8rem; margin-left: 0; + background: transparent; } } .input-item { width: 100%; height: 100%; - background: #ffffff; border-radius: 0.2rem; } } .scan-box { width: 5.76rem; height: 0.9rem; - background: #f2dede; + background: #F9F9F9; + border: 0.02rem solid #EDEDED; border-radius: 0.2rem; font-size: 0.28rem; color: #c79f9c; @@ -554,7 +588,7 @@ input { align-items: center; width: 1.99rem; height: 0.62rem; - background: #ffffff; + background: #E8424D; border-radius: 0.1rem; justify-content: space-evenly; margin-left: 0.1rem; @@ -564,7 +598,7 @@ input { } p { font-size: 0.32rem; - color: #ea3a3a; + color: white; } } > p { @@ -600,24 +634,25 @@ input { ::v-deep(.van-rolling-text-item) { width: auto; margin-right: 0; - width: 0.6rem; - height: 0.84rem !important; - background: linear-gradient(0deg, #ff2020, #ff7a4e); + width: 0.5rem; + height: 0.5rem !important; + background: #FFF1CB; box-shadow: 0px 0.06rem 0.1rem 0px rgba(252, 59, 13, 0.45); border-radius: 0.1rem; - border: 0.02rem solid #ffffff; + // border: 0.02rem solid #ffffff; + margin-right: 0.1rem !important; } ::v-deep(.van-rolling-text-item__box) { - line-height: 0.84rem; - font-weight: bold; + font-weight: 500; + line-height: 0.5rem; text-align: center; overflow: hidden; - font-size: 0.71rem; - color: #ffffff; + font-size: 0.4rem; + color: #950D0F; } ::v-deep(.van-rolling-text-item__item) { - height: 0.84rem !important; - line-height: 0.84rem !important; + height: 0.5rem !important; + line-height: 0.5rem !important; overflow: hidden; } diff --git a/src/pages/index/index_old.vue b/src/pages/index/index_old.vue deleted file mode 100644 index a4a413c..0000000 --- a/src/pages/index/index_old.vue +++ /dev/null @@ -1,615 +0,0 @@ - - -