ZQ/laws-sinotruk-mobile
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update 主题色调整，白色头部导航、红色头部导航区分

Browse Source
This commit is contained in:
赵霄
2023-11-30 09:38:47 +08:00
parent 0ced43397a
commit f0e71e0bac
7 changed files with 84 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package-lock.json
Generated
+43 -41
View File
@@ -2805,6 +2805,49 @@
"webpack-merge": "^5.7.3",
"webpack-virtual-modules": "^0.4.2",
"whatwg-fetch": "^3.6.2"
},
"dependencies": {
"@vue/vue-loader-v15": {
"version": "npm:vue-loader@15.11.1",
"resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-15.11.1.tgz",
"integrity": "sha512-0iw4VchYLePqJfJu9s62ACWUXeSqM30SQqlIftbYWM3C+jpPcEHKSPUZBLjSF9au4HTHQ/naF6OGnO3Q/qGR3Q==",
"dev": true,
"requires": {
"@vue/component-compiler-utils": "^3.1.0",
"hash-sum": "^1.0.2",
"loader-utils": "^1.1.0",
"vue-hot-reload-api": "^2.3.0",
"vue-style-loader": "^4.1.0"
},
"dependencies": {
"hash-sum": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/hash-sum/-/hash-sum-1.0.2.tgz",
"integrity": "sha512-fUs4B4L+mlt8/XAtSOGMUO1TXmAelItBPtJG7CyHJfYTdDjwisntGO2JQz7oUsatOY9o68+57eziUVNw/mRHmA==",
"dev": true
}
}
},
"json5": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/json5/-/json5-1.0.2.tgz",
"integrity": "sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==",
"dev": true,
"requires": {
"minimist": "^1.2.0"
}
},
"loader-utils": {
"version": "1.4.2",
"resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.4.2.tgz",
"integrity": "sha512-I5d00Pd/jwMD2QCduo657+YM/6L3KZu++pmX9VFncxaxvHcru9jx1lBaFft+r4Mt2jK0Yhp41XlRAihzPxHNCg==",
"dev": true,
"requires": {
"big.js": "^5.2.2",
"emojis-list": "^3.0.0",
"json5": "^1.0.1"
}
}
}
},
"@vue/cli-shared-utils": {
@@ -2978,47 +3021,6 @@
"eslint-config-standard": "^14.1.0"
}
},
"@vue/vue-loader-v15": {
"version": "npm:vue-loader@15.11.1",
"resolved": "https://registry.npmmirror.com/vue-loader/-/vue-loader-15.11.1.tgz",
"integrity": "sha512-0iw4VchYLePqJfJu9s62ACWUXeSqM30SQqlIftbYWM3C+jpPcEHKSPUZBLjSF9au4HTHQ/naF6OGnO3Q/qGR3Q==",
"dev": true,
"requires": {
"@vue/component-compiler-utils": "^3.1.0",
"hash-sum": "^1.0.2",
"loader-utils": "^1.1.0",
"vue-hot-reload-api": "^2.3.0",
"vue-style-loader": "^4.1.0"
},
"dependencies": {
"hash-sum": {
"version": "1.0.2",
"resolved": "https://registry.npmmirror.com/hash-sum/-/hash-sum-1.0.2.tgz",
"integrity": "sha512-fUs4B4L+mlt8/XAtSOGMUO1TXmAelItBPtJG7CyHJfYTdDjwisntGO2JQz7oUsatOY9o68+57eziUVNw/mRHmA==",
"dev": true
},
"json5": {
"version": "1.0.2",
"resolved": "https://registry.npmmirror.com/json5/-/json5-1.0.2.tgz",
"integrity": "sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==",
"dev": true,
"requires": {
"minimist": "^1.2.0"
}
},
"loader-utils": {
"version": "1.4.2",
"resolved": "https://registry.npmmirror.com/loader-utils/-/loader-utils-1.4.2.tgz",
"integrity": "sha512-I5d00Pd/jwMD2QCduo657+YM/6L3KZu++pmX9VFncxaxvHcru9jx1lBaFft+r4Mt2jK0Yhp41XlRAihzPxHNCg==",
"dev": true,
"requires": {
"big.js": "^5.2.2",
"emojis-list": "^3.0.0",
"json5": "^1.0.1"
}
}
}
},
"@vue/web-component-wrapper": {
"version": "1.3.0",
"resolved": "https://registry.npmmirror.com/@vue/web-component-wrapper/-/web-component-wrapper-1.3.0.tgz",
src/App.vue
+31 -19
View File
@@ -2,6 +2,7 @@
<div id="app">
<van-nav-bar
v-if="hasNavBar"
:class="{'white-style': isWhiteNavBar}"
:title="pageTitle"
:left-text="hasBack ? $t('back') : ''"
:left-arrow="hasBack"
@@ -55,6 +56,10 @@ export default {
return ''
}
return this.$t('pageTitle.' + this.$route.meta.pageTitle)
},
// 是否白色头部导航
isWhiteNavBar () {
return !!this.$route.meta.isWhiteNavBar
}
},
methods: {
@@ -81,34 +86,41 @@ export default {
</script>
<style scoped lang="less">
@import '~@assets/less/common.less';
.van-nav-bar__content {
height: 0.88rem;
}
/deep/ .van-nav-bar__left, /deep/ .van-nav-bar__right, /deep/ .van-nav-bar__arrow {
/*头部导航字号处理*/
/deep/ .van-nav-bar__left, /deep/ .van-nav-bar__right, /deep/ .van-nav-bar__arrow, /deep/ .van-nav-bar__title {
font-size: 0.36rem;
}
@font-color: #34383F;
/deep/ .van-nav-bar {
background-color: #FFFFFF;
.van-nav-bar__title {
color: @font-color;
font-size: 0.36rem;
}
.van-nav-bar__text {
color: @font-color;
}
.van-icon {
color: @font-color;
}
}
/*头部导航固定*/
.scroll-box {
height: calc(100vh - 0.88rem);
overflow: auto;
}
/*处理白色头部导航样式*/
.white-style {
background-color: #FFFFFF !important;
/deep/ .van-nav-bar__title {
color: @font-color !important;
}
/deep/ .van-nav-bar__text {
color: @font-color !important;
}
/deep/ .van-icon {
color: @font-color !important;
}
}
/deep/ .van-hairline--bottom::after {
border: none;
}
</style>
src/assets/less/common.less
+3 -1
View File
@@ -1 +1,3 @@
@primary-color: '#D52C26';
@primary-color: #E63636;
@font-color: #1D2129;
@label-font-color: #767676;
src/router/index.js
+3 -1
View File
@@ -32,7 +32,9 @@ const routes = [
name: 'NoMobile',
meta: {
hasNavBar: true,
hasBack: true
hasBack: true,
// 是否白色头部导航
isWhiteNavBar: true
},
component: () => import('@/views/exception/NoMobile')
},
src/views/user/Login.vue
+1 -1
View File
@@ -130,7 +130,7 @@ export default {
margin: 20px 0;
}
.login-btn {
background-color: #D52C26;
background-color: @primary-color;
}
}
</style>
vant.config.js
+1 -1
View File
@@ -1,4 +1,4 @@
const primaryColor = '#D52C26'
const primaryColor = '#E63636'
const white = '#FFFFFF'
module.exports = {
vue.config.js
+2 -2
View File
@@ -54,8 +54,8 @@ module.exports = {
less: {
modifyVars: {
/* less 变量覆盖，用于自定义 ant design 主题 */
'primary-color': '#D52C26',
'link-color': '#D52C26',
'primary-color': '#E63636',
'link-color': '#E63636',
'border-radius-base': '4px',
/* vant组件变量覆盖 */
...theme