liaoxinyu
/
Bsoccoin_H5
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

新增很背景切换、和修改布局

master
liaoxinyu 8 months ago
parent
10be6d6011
commit
bc0c48ba21
17 changed files with 83 additions and 52 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. BIN
      assets/img/home/home2.png
  2. BIN
      assets/img/home/home3.png
  3. BIN
      assets/img/home/home4.png
  4. BIN
      assets/img/home/home5.png
  5. BIN
      assets/img/home/home6.png
  6. BIN
      assets/img/home/home7.png
  7. BIN
      assets/img/home/logo.png
  8. 2
      components/lb-picker/style/picker-item.scss
  9. 2
      pages/assets/bill.vue
  10. 13
      pages/auth/primary.vue
  11. 81
      pages/base/home.vue
  12. 4
      pages/base/index.vue
  13. 9
      pages/base/mine.vue
  14. 2
      pages/notice/index.vue
  15. 4
      pages/safe/withdrawals-pwd.vue
  16. 18
      plugins/theme-style.js
  17. BIN
      static/img/user-bar1.png

BIN
assets/img/home/home2.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 9.5 KiB

After

Width:  |  Height:  |  Size: 472 KiB

BIN
assets/img/home/home3.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 10 KiB

After

Width:  |  Height:  |  Size: 496 KiB

BIN
assets/img/home/home4.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 502 KiB

BIN
assets/img/home/home5.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 408 KiB

BIN
assets/img/home/home6.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 9.2 KiB

After

Width:  |  Height:  |  Size: 383 KiB

BIN
assets/img/home/home7.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 513 KiB

BIN
assets/img/home/logo.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.8 KiB

2
components/lb-picker/style/picker-item.scss
View File

@ -26,5 +26,5 @@
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
color: #666;
color: var(--text-color);
}

2
pages/assets/bill.vue
View File

@ -2,7 +2,7 @@
<div class="layout-page" :style="themeStyle">
<v-header :title="`${query.coin_name}${$t('assets.a7')}`"></v-header>
<div class="bg-panel-4 d-flex justify-between p-md fn-center">
<div class="d-flex justify-between p-md fn-center">
<div class="item">
<div class="label m-b-xs fn-sm">{{$t('assets.a8')}}（{{query.coin_name}}）</div>
<div class="num color-light fn-lg">{{omitTo(detail.total_assets,4)}}</div>

13
pages/auth/primary.vue
View File

@ -279,4 +279,17 @@ export default {
/deep/.uni-date-x .icon-calendar{
padding-left: 0px;
}
/deep/.uni-date-x{
background-color: transparent;
}
/deep/.uni-calendar__content{
background-color: var(--col1);
}
/deep/.uni-calendar-item__weeks-box-text{
color: var(--col2);
}
/deep/.uni-calendar-item--disable .uni-calendar-item__weeks-box-text-disable{
color: var(--col3);
}
</style>

81
pages/base/home.vue
View File

@ -1,10 +1,11 @@
<template>
<view class="d-flex flex-col" style="background-color: #fff;">
<view class="d-flex flex-col">
<!-- 头部 -->
<v-header class="nav_bar" :left-text="$t('base.a1')" :left-arrow="false" :left-click="personalCenter" style="box-shadow: 0 -7px 20px 0px rgba(0, 0, 0, 0.2);margin-bottom: 2px;">
<template #left>
<!-- <van-icon name="user-circle-o" class="fn-25 color-theme-1" style="color: #EABB71;" /> -->
<img src="@/static/img/user-bar.svg" alt="" width="18px" height="18px">
<img v-if="theme === 'light'" src="@/static/img/user-bar.svg" alt="" width="18px" height="18px">
<img v-else src="@/static/img/user-bar1.png" alt="" width="18px" height="18px">
<span class="circle-pulse" v-if="newscount!==0"></span>
<!-- <view class="d-flex align-center justify-center">
<text class="p-l-md fn-18 color-light">{{ app.appName }}
@ -32,7 +33,7 @@
</view>
</template>
</v-header>
<view class="layout-main" style="background-color: #fff;padding-bottom: 20px;">
<view class="layout-main" style="padding-bottom: 20px;">
<scroll-view @refresherrefresh="onRefresh" :refresher-enabled="refresherEnabled&&scrollTop<50"
:refresher-triggered="refreshing" refresher-background="transparent" :refresher-threshold="50">
<!-- 轮播 -->
@ -131,19 +132,19 @@
<view class="d-flex"
style="margin-top: 30px;justify-content: space-around;flex-wrap: wrap;margin-bottom: 30px;">
<view style="width: 300rpx;text-align: center;">
<view class="num1">Top 10</view>
<view class="num1 manage_text">Top 10</view>
<view class="title1">{{ $t("homeNewText.hh37") }}</view>
</view>
<view style="width: 300rpx;text-align: center;">
<view class="num1">5 million+</view>
<view class="num1 manage_text">5 million+</view>
<view class="title1">{{ $t("homeNewText.hh38") }}</view>
</view>
<view style="width: 300rpx;margin-top: 20px;text-align: center;">
<view class="num1">{{ '<0.10%' }}</view>
<view class="num1 manage_text">{{ '<0.10%' }}</view>
<view class="title1">{{ $t("homeNewText.hh39") }}</view>
</view>
<view style="width: 300rpx;margin-top: 20px;text-align: center;">
<view class="num1">200+</view>
<view class="num1 manage_text">200+</view>
<view class="title1">{{ $t("homeNewText.hh40") }}</view>
</view>
</view>
@ -157,7 +158,7 @@
</view>
<view style="margin-top: 40rpx;">
<view style="font-size: 60rpx;color: #000;padding: 0px 40rpx;font-weight: bold;">
<view class="manage_text" style="font-size: 60rpx;padding: 0px 40rpx;font-weight: bold;">
{{ $t("homeNewText.hh1") }}
</view>
<view style="padding: 0px 20px;margin-top: 10px;margin-bottom: 30px;">{{ $t("homeNewText.hh2") }}
@ -180,15 +181,14 @@
<view class="d-flex align-center">
<image :src="item.coin_icon" mode=""
style="width: 60rpx;height: 60rpx;margin-right: 12rpx;"></image>
<text class="fn-bold fn-14 color-light"
style="color: #000;">{{ item.coin_name }}</text>
<text class="fn-bold fn-14 color-light manage_text">{{ item.coin_name }}</text>
<!-- <text class="fn-bold fn-14 color-light">{{ item.pair_name }}</text> -->
</view>
<view class="d-flex align-center fn-12 m-t-xs" v-if="0">
24H{{ $t("first.b3") }} {{ omitTo(item.vol, 0) }}
</view>
</view>
<view class="fn-right w-4/12 color-light usd-close" style="color: #000;">
<view class="fn-right w-4/12 color-light usd-close manage_text">
{{ item.close }}
</view>
<view class="fn-right w-3/12">
@ -212,48 +212,48 @@
<!-- 了解我们的产品 -->
<view style="margin-top: 180rpx;">
<view style="font-size: 60rpx;color: #000;padding: 0px 40rpx;font-weight: bold;">{{ $t("homeNewText.hh3") }}</view>
<view class="manage_text" style="font-size: 60rpx;padding: 0px 40rpx;font-weight: bold;">{{ $t("homeNewText.hh3") }}</view>
<view style="padding: 0px 20px;margin-top: 10px;margin-bottom: 30px;">{{ $t("homeNewText.hh4") }}
</view>
<view style="display: flex;flex-wrap: wrap;justify-content: center;">
<view class="product">
<view>
<view class="product_text1">{{ $t("homeNewText.hh5") }}</view>
<view class="product_text1 manage_text">{{ $t("homeNewText.hh5") }}</view>
<view class="product_text2">{{ $t("homeNewText.hh6") }}</view>
</view>
<view style="text-align: center;margin: 30px 0px;"><image src="@/assets/img/home/home2.png" mode="" style="width: 121px;height: 120px;"></image></view>
</view>
<view class="product">
<view>
<view class="product_text1">{{ $t("homeNewText.hh7") }}</view>
<view class="product_text1 manage_text">{{ $t("homeNewText.hh7") }}</view>
<view class="product_text2">{{ $t("homeNewText.hh8") }}</view>
</view>
<view style="text-align: center;margin: 30px 0px;"><image src="@/assets/img/home/home3.png" mode="" style="width: 121px;height: 120px;"></image></view>
</view>
<view class="product">
<view>
<view class="product_text1">{{ $t("homeNewText.hh9") }}</view>
<view class="product_text1 manage_text">{{ $t("homeNewText.hh9") }}</view>
<view class="product_text2">{{ $t("homeNewText.hh10") }}</view>
</view>
<view style="text-align: center;margin: 30px 0px;"><image src="@/assets/img/home/home4.png" mode="" style="width: 121px;height: 120px;"></image></view>
</view>
<view class="product">
<view>
<view class="product_text1">{{ $t("homeNewText.hh11") }}</view>
<view class="product_text1 manage_text">{{ $t("homeNewText.hh11") }}</view>
<view class="product_text2">{{ $t("homeNewText.hh12") }}</view>
</view>
<view style="text-align: center;margin: 30px 0px;"><image src="@/assets/img/home/home5.png" mode="" style="width: 121px;height: 120px;"></image></view>
</view>
<view class="product">
<view>
<view class="product_text1">{{ $t("homeNewText.hh13") }}</view>
<view class="product_text1 manage_text">{{ $t("homeNewText.hh13") }}</view>
<view class="product_text2">{{ $t("homeNewText.hh14") }}</view>
</view>
<view style="text-align: center;margin: 30px 0px;"><image src="@/assets/img/home/home6.png" mode="" style="width: 121px;height: 120px;"></image></view>
</view>
<view class="product">
<view>
<view class="product_text1">{{ $t("homeNewText.hh15") }}</view>
<view class="product_text1 manage_text">{{ $t("homeNewText.hh15") }}</view>
<view class="product_text2">{{ $t("homeNewText.hh16") }}</view>
</view>
<view style="text-align: center;margin: 30px 0px;"><image src="@/assets/img/home/home7.png" mode="" style="width: 121px;height: 120px;"></image></view>
@ -262,54 +262,54 @@
</view>
<!-- 为什么选择DFIcoins -->
<view style="margin-top: 180rpx;">
<view style="font-size: 60rpx;color: #000;padding: 0px 40rpx;font-weight: bold;">{{ $t("homeNewText.hh17") }}</view>
<view class="manage_text" style="font-size: 60rpx;padding: 0px 40rpx;font-weight: bold;">{{ $t("homeNewText.hh17") }}</view>
<view style="padding: 0px 20px;margin-top: 10px;margin-bottom: 30px;">{{ $t("homeNewText.hh18") }}</view>
<view style="padding: 0px 20px;">
<view>
<view class="d-flex" style="align-items: center;">
<img src="@/assets/img/home/home8.svg" alt="">
<view class="text_size">{{ $t("homeNewText.hh19") }}</view>
<view class="text_size manage_text">{{ $t("homeNewText.hh19") }}</view>
</view>
<view class="text_width">{{ $t("homeNewText.hh20") }}</view>
</view>
<view style="margin-top: 20px;">
<view class="d-flex" style="align-items: center;">
<img src="@/assets/img/home/home9.svg" alt="">
<view class="text_size">{{ $t("homeNewText.hh21") }}</view>
<view class="text_size manage_text">{{ $t("homeNewText.hh21") }}</view>
</view>
<view class="text_width">{{ $t("homeNewText.hh22") }}</view>
</view>
<view style="margin-top: 20px;">
<view class="d-flex" style="align-items: center;">
<img src="@/assets/img/home/home10.svg" alt="">
<view class="text_size">{{ $t("homeNewText.hh23") }}</view>
<view class="text_size manage_text">{{ $t("homeNewText.hh23") }}</view>
</view>
<view class="text_width">{{ $t("homeNewText.hh24") }}</view>
</view>
<view style="margin-top: 20px;">
<view class="d-flex" style="align-items: center;">
<img src="@/assets/img/home/home11.svg" alt="">
<view class="text_size">{{ $t("homeNewText.hh25") }}</view>
<view class="text_size manage_text">{{ $t("homeNewText.hh25") }}</view>
</view>
<view class="text_width">{{ $t("homeNewText.hh26") }}</view>
</view>
</view>
</view>
<view class="" style="width: 100%;background-color: #F9F9F9;margin-top: 160rpx;color: #000;padding-bottom: 50px;">
<view class="manage_text manage-col" style="width: 100%;margin-top: 160rpx;padding-bottom: 50px;">
<view style="text-align: center;font-size: 30px;font-weight: bold;width: 100%;padding-top: 50px;">{{ $t("homeNewText.hh27") }}</view>
<view style="margin: 10px">
<view style="display: flex;margin-top: 32px;align-items: center;margin-left: 15px;">
<image src="@/assets/img/home/home12.png" style="width: 24px;height: 24px;margin-right: 10px;">
<view class="text_size">{{ $t("homeNewText.hh28") }}</view>
<view class="text_size manage_text">{{ $t("homeNewText.hh28") }}</view>
</view>
<view style="display: flex;margin-top: 30px;align-items: center;margin-left: 15px;">
<image src="@/assets/img/home/home13.png" style="width: 24px;height: 24px;margin-right: 10px;">
<view class="text_size">{{ $t("homeNewText.hh29") }}</view>
<view class="text_size manage_text">{{ $t("homeNewText.hh29") }}</view>
</view>
<view style="display: flex;margin-top: 30px;align-items: center;margin-left: 15px;">
<image src="@/assets/img/home/home14.png" style="width: 24px;height: 24px;margin-right: 10px;">
<view class="text_size">{{ $t("homeNewText.hh30") }}</view>
<view class="text_size manage_text">{{ $t("homeNewText.hh30") }}</view>
</view>
<view v-if="!isLogin" class="jump_btn_one1" @click="goReg" style="margin-top: 32px;">
{{ $t("homeNewText.hh36") }}
@ -321,7 +321,7 @@
</view>
<view style="margin-top: 140rpx;padding: 0px 10px">
<view style="font-size: 60rpx;color: #000;padding: 0px 40rpx;font-weight: bold;">{{ $t("homeNewText.hh31") }}</view>
<view class="manage_text" style="font-size: 60rpx;padding: 0px 40rpx;font-weight: bold;">{{ $t("homeNewText.hh31") }}</view>
<view style="padding: 0px 20px;margin-top: 10px;margin-bottom: 30px;">{{ $t("homeNewText.hh32") }}</view>
<view style="text-align: center;"><image src="@/assets/img/home/home15.png" mode="" style="width: 670rpx;height: 410rpx;"></image></view>
<!-- <view style="margin-top: 10px;margin-left: 20px;color: #000;">{{ $t("homeNewText.hh33") }}</view>
@ -340,7 +340,7 @@
</view>
</a>
</view> -->
<view style="font-size: 30px;text-align: center;color: #000;margin-top: 100px;font-weight: bold;">{{ $t("homeNewText.hh34") }}</view>
<view class="manage_text" style="font-size: 30px;text-align: center;margin-top: 100px;font-weight: bold;">{{ $t("homeNewText.hh34") }}</view>
<view style="display: flex;">
<view v-if="!isLogin" class="jump_btn_one1" @click="goReg" style="margin-top: 32px;">
{{ $t("homeNewText.hh35") }}
@ -526,7 +526,7 @@
<!-- 适合所有人的加密货币交易所 -->
<view style="margin-top: 100rpx;" v-if="0">
<view class="fn-20 fn-bold m-y-md" style="text-align: center; color: #000;">
<view class="fn-20 fn-bold m-y-md manage_text" style="text-align: center;">
{{ $t("homeNewText.bb4") }}
</view>
<view class="fn-12" style="text-align: center;">{{ $t("homeNewText.bb5") }}</view>
@ -662,7 +662,7 @@
</view>
</view> -->
<!-- <img width="25px" height="25px" @click="changtTheme" :src="theme == 'light' ? 'static/img/moon.png' : 'static/img/sun.png'" /> -->
<img width="25px" height="25px" @click="changtTheme" :src="theme == 'light' ? 'static/img/moon.png' : 'static/img/sun.png'" />
</view>
<view class="information p-l-md m-t-xl">
<!-- <img :src="logoMap.login_logo" class="h-50 w-50 d-block m-r-xs rounded-max flex-shrink" /> -->
@ -1779,7 +1779,7 @@
font-size: 30px;
font-weight: bold;
margin-bottom: 40rpx;
color: #000;
color: var(--text-col);
position: relative;
padding: 0px 60rpx;
}
@ -1791,7 +1791,7 @@
}
.left {
color: #000;
color: var(--text-col);
position: absolute;
top: 50rpx;
width: 100%;
@ -1905,7 +1905,7 @@
}
.num1 {
color: #000;
// color: #000;
font-size: 40rpx;
font-weight: bold;
margin-bottom: 5px;
@ -1960,15 +1960,14 @@
}
.product {
width: 670rpx;
border: 2px solid #F0F0F0;
// border: 2px solid #F0F0F0;
// min-height: 600rpx;
margin-bottom: 45px;
padding: 15px 0px;
border-radius: 10px;
box-shadow: 0px 0px 10px 0px #ccc;
box-shadow: 0px 0px 10px 0px var(--col4);
.product_text1 {
color: #000;
// color: #000;
margin-left: 60rpx;
margin-top: 60rpx;
font-weight: bold;
@ -1984,7 +1983,6 @@
}
}
.text_size {
color: #000;
font-size: 20px;
font-weight: bold;
}
@ -1994,6 +1992,9 @@
color: #A5A5A5;
}
.manage_text{
color: var(--text-col);
}
.manage-col{
background-color: var(--manage-text-col);
}
</style>

4
pages/base/index.vue
View File

@ -132,13 +132,13 @@
box-shadow: $tab-nav-shadow;
// position: relative;
// z-index:5;
background-color: #f9f9f9;
background-color: var(--manage-text-col);
min-height: 88rpx;
box-sizing: border-box;
}
.router-link-active {
color: #000;
color: var(--text-col);
// color: #326AEB;
}

9
pages/base/mine.vue
View File

@ -216,13 +216,13 @@
<text class="fn-18 fn-bold color-light fn-middle p-l-sm">{{item.coin_name}}
</text>
</view>
<view class="text_width text_align m-title" style="color:#000">
<view class="text_width text_align m-title manage_text_col">
{{ (item.usable_balance).toFixed(2) }}
</view>
<view class="text_width text_align m-title" style="color:#000">
<view class="text_width text_align m-title manage_text_col">
{{ item.freeze_balance }}
</view>
<view class="text_width text_align m-title" style="color:#000">
<view class="text_width text_align m-title manage_text_col">
{{ omitTo(item.usd_estimate, item.priceDecimals) | priceDecimals}}
</view>
</view>
@ -569,4 +569,7 @@
.col-fff{
color: #1684fc;
}
.manage_text_col{
color: var(--text-col);
}
</style>

2
pages/notice/index.vue
View File

@ -22,7 +22,7 @@
<v-paging class="layout-main" :key="1" :ajax="article" :data="{type:'notice'}" v-if="active==0">
<template #box="list">
<view class="list m-t-md" key="ul1">
<v-link tag="li" :to="{path:'/pages/notice/detail',query:{id:item.id}}" class="item d-flex p-md align-center m-x-md m-b-xs bg-panel-3 rounded box-shadow" v-for="item in $list(list)" :key="item.id">
<v-link tag="li" v-if="item.title" :to="{path:'/pages/notice/detail',query:{id:item.id}}" class="item d-flex p-md align-center m-x-md m-b-xs bg-panel-3 rounded box-shadow" v-for="item in $list(list)" :key="item.id">
<view class="flex-fill">
<view class="title color-light eps-2 m-b-xs">{{item.title}}</view>
<view class="time fn-sm">{{item.created_at}}</view>

4
pages/safe/withdrawals-pwd.vue
View File

@ -1,7 +1,7 @@
<template>
<v-page class="pos-login">
<v-header :title="$t('common.c13')"></v-header>
<main class="bg-panel-3 p-x-lg p-y-lg rounded-md box-shadow">
<main class="m-x-xl bg-panel-3 p-x-lg p-y-lg rounded-md box-shadow">
<view class="form-item border-b p-y-md color-light">
<view class="label m-b-xs">{{$t('safe.b3')}}</view>
<view class="input">
@ -70,7 +70,7 @@ export default {
<style lang="scss" scoped>
.layout-page{
// background-color: #121212 !important;
background: none;
// background: none;
}
.bg-panel-3{
// background-color: #121212;

18
plugins/theme-style.js
View File

@ -20,6 +20,13 @@ let light =`
--tab-nav:#fff;
--tab-nav-shadow:0px -9px 14px 0px rgba(0, 0, 0, 0.06);
--nav-tab-active:#EABB71;
--text-col: #000;
--manage-text-col: #F9F9F9;
--col1: #fff;
--col2: #000;
--col3: #D1D1D1;
--col4: #ccc;
`
let dark = `
--light:#fff;
@ -37,11 +44,18 @@ let dark = `
--nei-shadow-5:inset 2px 2px 5px #1a1a1a;
--shadow: 0px 0px 33px 0px rgba(34, 34, 44, 0.25);
--picker-mask:linear-gradient(180deg,#1f1f1f,rgba(70, 70, 70, 0.6)),linear-gradient(0deg,#1f1f1f,rgba(70, 70, 70, 0.6));
--bg-top:#292d39;
--bg-bottom:#292d39;
--bg-top:#181E25;
--bg-bottom:#181E25;
--tab-nav:#292d39;
--tab-nav-shadow:0px -7px 20px 0px rgba(37, 37, 48, 0.83);
--nav-tab-active:#ffffff;
--text-col: #fff;
--manage-text-col: transparent;
--col1: #191923;
--col2: #fff;
--col3: #454040;
--col4: #757070;
`
export default {

BIN
static/img/user-bar1.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 716 B

Write Preview
Loading…
Cancel
Save