修改部分scss类名，新增部分注释以及登录颜色化配置:)
lemon橪
parent
775bf3055d
commit
224eb05703
|
|
@ -2,10 +2,19 @@
|
|||
// launchtype项可配置值为local或remote, local代表前端连本地云函数，remote代表前端连云端云函数
|
||||
"version": "0.0",
|
||||
"configurations": [{
|
||||
"type": "uniCloud",
|
||||
"default": {
|
||||
"default" :
|
||||
{
|
||||
"launchtype" : "remote"
|
||||
}
|
||||
},
|
||||
"h5" :
|
||||
{
|
||||
"launchtype" : "remote"
|
||||
},
|
||||
"mp-weixin" :
|
||||
{
|
||||
"launchtype" : "remote"
|
||||
},
|
||||
"type" : "uniCloud"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -65,7 +65,6 @@ export default {
|
|||
// 可自行调整
|
||||
this.scHight = phone.screenHeight / 2 - 200 + "px";
|
||||
this.getCode();
|
||||
|
||||
},
|
||||
props: {
|
||||
height: {
|
||||
|
|
@ -315,30 +314,6 @@ export default {
|
|||
width: 750rpx;
|
||||
}
|
||||
|
||||
.border-bom {
|
||||
border-bottom: 0.5rpx solid #dddddd;
|
||||
}
|
||||
|
||||
.border-red {
|
||||
border-bottom: 1rpx solid #d33e18;
|
||||
}
|
||||
|
||||
.border-bom-big {
|
||||
border-bottom: 8rpx solid #dddddd;
|
||||
}
|
||||
|
||||
.border-bom-white {
|
||||
border-bottom: 2rpx solid #ffffff;
|
||||
}
|
||||
|
||||
.border-bom-green {
|
||||
border-bottom: 4rpx solid #f8f9bd;
|
||||
}
|
||||
|
||||
.border-bom-index {
|
||||
border-bottom: 4rpx solid #27d9b3;
|
||||
}
|
||||
|
||||
.padding-left {
|
||||
padding-left: 20rpx;
|
||||
}
|
||||
|
|
|
|||
22
main.js
22
main.js
|
|
@ -4,13 +4,23 @@ import * as filters from "./utils/filters.js"; // global filter
|
|||
import uView from "uview-ui";
|
||||
import store from "./store";
|
||||
|
||||
|
||||
/**
|
||||
* 仅在h5中显示唤醒app功能
|
||||
* 在h5页面手动挂载
|
||||
*
|
||||
*/
|
||||
// #ifdef H5
|
||||
// 在h5页面手动挂载 h5唤醒app插件
|
||||
import airBtn from "@/components/m-airbtn/index.vue";
|
||||
let btn = Vue.component("airBtn", airBtn); //全局注册
|
||||
document.body.appendChild(new btn().$mount().$el);
|
||||
// #endif
|
||||
|
||||
|
||||
/**
|
||||
* 全局filters
|
||||
*/
|
||||
|
||||
Object.keys(filters).forEach((key) => {
|
||||
Vue.filter(key, filters[key]);
|
||||
});
|
||||
|
|
@ -19,10 +29,20 @@ Object.keys(filters).forEach((key) => {
|
|||
Vue.prototype.$store = store;
|
||||
Vue.use(uView);
|
||||
Vue.config.productionTip = false;
|
||||
|
||||
|
||||
/**
|
||||
* 注意！
|
||||
* 此处将常用的颜色嵌入到原型链上面
|
||||
* 颜色使用驼峰命名对应 uni.scss中全局颜色变量名
|
||||
* 如需更换主题请修改此处以及uni.scss中的全局颜色
|
||||
*/
|
||||
// 主题色
|
||||
Vue.prototype.$mainColor = "#ff3c2a";
|
||||
// 高亮主题色
|
||||
Vue.prototype.$lightColor = "#ff6b35";
|
||||
// 辅助高亮颜色
|
||||
Vue.prototype.$aiderLightColor = "#ff9f28";
|
||||
|
||||
|
||||
App.mpType = "app";
|
||||
|
|
|
|||
|
|
@ -2,8 +2,8 @@
|
|||
"name" : "lili商城",
|
||||
"appid" : "__UNI__C100675",
|
||||
"description" : "",
|
||||
"versionName" : "4.0.29",
|
||||
"versionCode" : 4000029,
|
||||
"versionName" : "4.0.30",
|
||||
"versionCode" : 4000030,
|
||||
"transformPx" : false,
|
||||
"app-plus" : {
|
||||
"compatible" : {
|
||||
|
|
|
|||
|
|
@ -322,10 +322,10 @@ export default {
|
|||
}
|
||||
|
||||
.active {
|
||||
background: $jd-light-color !important;
|
||||
border: 2rpx solid $jd-color;
|
||||
background: $price-light-color !important;
|
||||
border: 2rpx solid $price-color;
|
||||
font-weight: bold;
|
||||
color: $jd-color !important;
|
||||
color: $price-color !important;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
|
|
@ -377,7 +377,7 @@ export default {
|
|||
}
|
||||
|
||||
.goods-price {
|
||||
color: $jd-color;
|
||||
color: $price-color;
|
||||
line-height: 80rpx;
|
||||
display: flex;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
line-height: 80rpx;
|
||||
height: 80rpx;
|
||||
|
||||
background: $jd-color;
|
||||
background: $price-color;
|
||||
color: #fff;
|
||||
border-radius: 200px;
|
||||
text-align: center;
|
||||
|
|
|
|||
|
|
@ -12,6 +12,10 @@
|
|||
<view @click="handleAll" :style="{ color: $mainColor }">全部</view>
|
||||
<view style="font-size: 24rpx; color: #999">可提现金额<span>{{ walletNum | unitPrice }}</span>元</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="tips">
|
||||
最低提现金额为1.00元
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
|
@ -67,4 +71,8 @@ export default {
|
|||
</script>
|
||||
<style lang="scss" scoped>
|
||||
@import "./style.scss";
|
||||
.tips {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -454,7 +454,7 @@ export default {
|
|||
overflow: hidden;
|
||||
}
|
||||
> .-item-price {
|
||||
color: $jd-color;
|
||||
color: $price-color;
|
||||
> span {
|
||||
font-size: 36rpx;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
.sort-active {
|
||||
border: 1px solid $light-color;
|
||||
color: $light-color;
|
||||
background: $jd-light-color !important;
|
||||
background: $price-light-color !important;
|
||||
}
|
||||
|
||||
.oldKeyList {
|
||||
|
|
|
|||
|
|
@ -205,13 +205,6 @@ export default {
|
|||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
font-size: 34rpx;
|
||||
margin: 60rpx 20rpx;
|
||||
&::after {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
.u-cell {
|
||||
padding: 35rpx 20rpx;
|
||||
height: 110rpx;
|
||||
|
|
|
|||
|
|
@ -9,12 +9,13 @@
|
|||
<div style="display:flex; with:100%;">
|
||||
<u-input maxlength="6" v-model="codeForm.code" placeholder="请输入验证码" />
|
||||
<u-verification-code keep-running unique-key="page-login" :seconds="seconds" @end="end" @start="start" ref="uCode" @change="codeChange"></u-verification-code>
|
||||
<view @tap="getCode" class="text-tips">{{ tips }}</view>
|
||||
<view @tap="getCode" :style="{color:aiderLightColor}" class="text-tips">{{ tips }}</view>
|
||||
|
||||
</div>
|
||||
</u-form-item>
|
||||
|
||||
<view class="submit" @click="submit">登录</view>
|
||||
<view class="text-tips cell" @click="clickLogin">一键登录</view>
|
||||
<view class="submit bg-linear-gradient" @click="submit">登录</view>
|
||||
<view :style="{color:aiderLightColor}" class="text-tips cell" @click="clickLogin">一键登录</view>
|
||||
<myVerification v-if="codeFlag" @send="verification" class="verification" ref="verification" business="LOGIN" />
|
||||
</u-form>
|
||||
</div>
|
||||
|
|
@ -34,6 +35,7 @@ export default {
|
|||
props: ["status"], //是否勾选 《用户隐私》和《隐私政策》
|
||||
data() {
|
||||
return {
|
||||
aiderLightColor: this.$aiderLightColor,
|
||||
uuid,
|
||||
flage: false, //是否验证码验证
|
||||
codeFlag: true, //验证开关，用于是否展示验证码
|
||||
|
|
|
|||
|
|
@ -6,7 +6,6 @@
|
|||
margin: 40rpx 0;
|
||||
}
|
||||
.login-ball {
|
||||
background-image: linear-gradient(25deg, #fa123b, #ff6b35, #ff9f28, #ffcc03);
|
||||
border-bottom-left-radius: 300rpx;
|
||||
height: 400rpx;
|
||||
position: relative;
|
||||
|
|
@ -43,8 +42,6 @@ span {
|
|||
.submit {
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
|
||||
background-image: linear-gradient(90deg, #ff6b35, #ff9f28, #ffcc03);
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
font-size: 30rpx;
|
||||
|
|
@ -61,7 +58,6 @@ span {
|
|||
}
|
||||
.text-tips {
|
||||
text-align: center;
|
||||
color: #ff9f28;
|
||||
}
|
||||
.tips {
|
||||
position: absolute;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<view v-if="mpWechatLogin">
|
||||
<!-- 背景 -->
|
||||
<view class="login-ball small"></view>
|
||||
<view class="login-ball bg-linear-gradient small"></view>
|
||||
|
||||
<view class="logo-cell">
|
||||
<image class="logo" src="/static/logo.png" mode="aspectFit"></image>
|
||||
|
|
@ -17,7 +17,7 @@
|
|||
<!-- 隐私政策 -->
|
||||
<div class="privacy">
|
||||
<u-checkbox-group :icon-size="24" width="45rpx">
|
||||
<u-checkbox v-model="value" active-color="rgb(255, 107, 53)"></u-checkbox>
|
||||
<u-checkbox v-model="value" :active-color="lightColor"></u-checkbox>
|
||||
|
||||
</u-checkbox-group>
|
||||
同意<span @click="handleClick('user')">《用户协议》</span>和<span @click="handleClick('privacy')">《隐私政策》</span>
|
||||
|
|
@ -32,6 +32,7 @@ import storage from "@/utils/storage.js";
|
|||
import { loginCallback } from "@/api/connect.js";
|
||||
import { webConnect } from "@/api/connect.js";
|
||||
export default {
|
||||
|
||||
onShow() {
|
||||
// #ifdef MP-WEIXIN
|
||||
this.mpWechatLogin = false;
|
||||
|
|
@ -64,6 +65,7 @@ export default {
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
lightColor:this.$lightColor,
|
||||
mpWechatLogin: true, //是否加载微信登录
|
||||
value: true, //隐私政策
|
||||
loginData: {
|
||||
|
|
|
|||
|
|
@ -1,5 +1,4 @@
|
|||
.verification {
|
||||
}
|
||||
|
||||
/deep/ .u-form-item {
|
||||
margin: 40rpx 0 !important;
|
||||
padding: 40rpx 0 !important;
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
<u-icon :color="item.color" size="80" :name="item.icon" @click="navigateLogin(item)"></u-icon>
|
||||
</div>
|
||||
</div>
|
||||
<view class="text-tips cell" @click="clickCodeLogin">账号密码登录</view>
|
||||
<view :style="{color:aiderLightColor}" class="text-tips cell" @click="clickCodeLogin">账号密码登录</view>
|
||||
</u-form>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -22,6 +22,7 @@ import api from "@/config/api.js";
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
aiderLightColor: this.$aiderLightColor,
|
||||
loginList: [
|
||||
{
|
||||
icon: "weixin-circle-fill",
|
||||
|
|
|
|||
|
|
@ -223,15 +223,11 @@ text.shop {
|
|||
}
|
||||
|
||||
.register {
|
||||
color: #00a327 !important;
|
||||
color: $weChat-color !important;
|
||||
border: none !important;
|
||||
background: #fff !important;
|
||||
}
|
||||
|
||||
.btn {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.btn-auth {
|
||||
width: 92%;
|
||||
|
|
|
|||
|
|
@ -125,7 +125,7 @@ export default {
|
|||
width: 52rpx;
|
||||
height: 6rpx;
|
||||
|
||||
background-image: linear-gradient(90deg, $jd-color, $jd-light-color);
|
||||
background-image: linear-gradient(90deg, $price-color, $price-light-color);
|
||||
}
|
||||
}
|
||||
> .goods-detail-item {
|
||||
|
|
|
|||
|
|
@ -148,7 +148,7 @@ export default {
|
|||
white-space: nowrap;
|
||||
font-size: 26rpx;
|
||||
text-align: left;
|
||||
color: $jd-color;
|
||||
color: $price-color;
|
||||
line-height: 23px;
|
||||
font-weight: bold;
|
||||
> span {
|
||||
|
|
|
|||
|
|
@ -144,7 +144,7 @@ export default {
|
|||
font-size: 28rpx;
|
||||
}
|
||||
.checked {
|
||||
background: $jd-color;
|
||||
background: $price-color;
|
||||
}
|
||||
.active {
|
||||
color: #fff;
|
||||
|
|
|
|||
|
|
@ -322,10 +322,10 @@ export default {
|
|||
}
|
||||
|
||||
.active {
|
||||
background: $jd-light-color !important;
|
||||
border: 2rpx solid $jd-color;
|
||||
background: $price-light-color !important;
|
||||
border: 2rpx solid $price-color;
|
||||
font-weight: bold;
|
||||
color: $jd-color !important;
|
||||
color: $price-color !important;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
|
|
@ -377,7 +377,7 @@ export default {
|
|||
}
|
||||
|
||||
.goods-price {
|
||||
color: $jd-color;
|
||||
color: $price-color;
|
||||
line-height: 80rpx;
|
||||
display: flex;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
line-height: 80rpx;
|
||||
height: 80rpx;
|
||||
|
||||
background: $jd-color;
|
||||
background: $price-color;
|
||||
color: #fff;
|
||||
border-radius: 200px;
|
||||
text-align: center;
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@
|
|||
padding-left: 14rpx;
|
||||
position: relative;
|
||||
&::before {
|
||||
background-image: linear-gradient(180deg, $jd-color, $jd-light-color);
|
||||
background-image: linear-gradient(180deg, $price-color, $price-light-color);
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
|
|
|
|||
|
|
@ -94,9 +94,9 @@ export default {
|
|||
|
||||
<style lang="scss" scoped>
|
||||
.deg_tag {
|
||||
color: $jd-color;
|
||||
color: $price-color;
|
||||
padding: 0 4rpx;
|
||||
border: 2rpx solid $jd-color;
|
||||
border: 2rpx solid $price-color;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -73,7 +73,7 @@
|
|||
}
|
||||
.promotion {
|
||||
font-size: 22rpx;
|
||||
border: 2rpx solid $jd-light-color;
|
||||
border: 2rpx solid $price-light-color;
|
||||
padding: 2rpx 6rpx;
|
||||
margin-left: 10rpx;
|
||||
line-height: 1;
|
||||
|
|
|
|||
|
|
@ -209,7 +209,7 @@ export default {
|
|||
white-space: nowrap;
|
||||
margin: 18rpx 0;
|
||||
font-size: 22rpx;
|
||||
color: $jd-color;
|
||||
color: $price-color;
|
||||
}
|
||||
|
||||
.recommend-list-con {
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
.red {
|
||||
color: $jd-color;
|
||||
color: $price-color;
|
||||
}
|
||||
page {
|
||||
background: #fff;
|
||||
|
|
@ -10,8 +10,8 @@ page {
|
|||
top: 5rpx;
|
||||
padding: 2rpx 6rpx;
|
||||
border-top: 4rpx;
|
||||
border: 2rpx solid $jd-color;
|
||||
color: $jd-color;
|
||||
border: 2rpx solid $price-color;
|
||||
color: $price-color;
|
||||
font-size: 22rpx;
|
||||
border-radius: 200px;
|
||||
line-height: 18rpx;
|
||||
|
|
@ -82,7 +82,7 @@ page {
|
|||
}
|
||||
.-goods-price {
|
||||
flex: 8;
|
||||
color: $jd-color;
|
||||
color: $price-color;
|
||||
font-size: 32rpx;
|
||||
line-height: 1;
|
||||
/deep/ .price {
|
||||
|
|
|
|||
38
uni.scss
38
uni.scss
|
|
@ -26,11 +26,12 @@ $uni-color-warning: #f0ad4e;
|
|||
$uni-color-error: #dd524d;
|
||||
|
||||
/*主题颜色 具体参考 https://ant.design/docs/spec/colors-cn */
|
||||
|
||||
/**微信登录按钮颜色 */
|
||||
$weChat-color:#00a327;
|
||||
/**主颜色*/
|
||||
$main-color: #ff3c2a;
|
||||
/*用于金钱等颜色 */
|
||||
$jd-color: #ff3c2a;
|
||||
$price-color: #ff3c2a;
|
||||
/*主题高亮颜色*/
|
||||
$light-color: #ff6b35;
|
||||
/*辅助高亮颜色*/
|
||||
|
|
@ -38,8 +39,8 @@ $aider-light-color: #ff9f28;
|
|||
|
||||
/*主题高亮背景颜色*/
|
||||
$main-light-color: #edfcf7;
|
||||
/*京东红高亮背景颜色*/
|
||||
$jd-light-color: #fcedeb;
|
||||
/*价格红高亮背景颜色*/
|
||||
$price-light-color: #fcedeb;
|
||||
|
||||
/*辅助色*/
|
||||
$aider-color-red: #ff6262;
|
||||
|
|
@ -71,33 +72,16 @@ $font-weight: 400;
|
|||
.bg-main-color {
|
||||
background-color: $main-color !important;
|
||||
}
|
||||
|
||||
// 渐变主题颜色
|
||||
.bg-linear-gradient {
|
||||
background-image: linear-gradient(25deg, #fa123b, #ff6b35, #ff9f28, #ffcc03);
|
||||
}
|
||||
.uni-tabbar .uni-tabbar__icon {
|
||||
width: 20px;
|
||||
height: 18px;
|
||||
}
|
||||
// 大标题
|
||||
.h1 {
|
||||
font-weight: $font-weight-b;
|
||||
font-style: normal;
|
||||
font-size: 24px;
|
||||
}
|
||||
// 大标题
|
||||
.h2 {
|
||||
font-weight: $font-weight-b;
|
||||
font-style: normal;
|
||||
font-size: 20px;
|
||||
}
|
||||
// 一级标题
|
||||
.h3 {
|
||||
font-weight: $font-weight-b;
|
||||
font-style: normal;
|
||||
font-size: 18px;
|
||||
}
|
||||
.h4 {
|
||||
font-weight: $font-weight-b;
|
||||
font-style: normal;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.flex {
|
||||
display: flex;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue