blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-06 03:57:59 +08:00
Code Issues Projects Releases Wiki Activity

[Doc] update neutral color variables (#2130)

Browse Source
This commit is contained in:
neverland 2018-11-23 20:29:43 +08:00 committed by GitHub
parent ec159b5e47
commit f69c66b439
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
21 changed files with 57 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
docs/markdown/theme.en-US.md
View File

@ -20,12 +20,12 @@ There are some basic variables below, all available variables could be found in
@green: #4b0;
@gray: #c9c9c9;
@gray-light: #e5e5e5;
@gray-darker: #666;
@gray-dark: #999;
@gray-darker: #7d7e80;
@gray-dark: #969799;
// default colors
@text-color: #333;
@border-color: #eee;
@text-color: #323233;
@border-color: #ebedf0;
@active-color: #e8e8e8;
@background-color: #f8f8f8;
@background-color-light: #fafafa;

8
docs/markdown/theme.zh-CN.md
View File

@ -24,12 +24,12 @@ Vant 使用了 [Less](http://lesscss.org/) 对样式进行预处理，并内置
@green: #4b0;
@gray: #c9c9c9;
@gray-light: #e5e5e5;
@gray-darker: #666;
@gray-dark: #999;
@gray-darker: #7d7e80;
@gray-dark: #969799;
// default colors
@text-color: #333;
@border-color: #eee;
@text-color: #323233;
@border-color: #ebedf0;
@active-color: #e8e8e8;
@background-color: #f8f8f8;
@background-color-light: #fafafa;

4
docs/src/WapApp.vue
View File

@ -43,9 +43,11 @@ export default {
</script>
<style lang="less">
@import '../../packages/style/var';
body {
color: #333;
line-height: 1;
color: @text-color;
background-color: #fafafa;
font-family: 'PingFang SC', Helvetica, 'STHeiti STXihei', 'Microsoft YaHei', Tohoma, Arial, sans-serif;
-webkit-font-smoothing: antialiased;

2
docs/src/components/DemoList.vue
View File

@ -128,7 +128,7 @@ export default {
display: inline-block;
&.active {
color: #fff;
color: @white;
background-color: @blue;
}
}

4
packages/badge/demo/index.vue
View File

@ -46,12 +46,14 @@ export default {
</script>
<style lang="less">
@import '../../style/var';
.demo-badge {
.van-badge-group {
width: auto;
margin: 0 15px;
padding: 20px 0;
background-color: #fff;
background-color: @white;
&::after {
display: none;

2
packages/circle/demo/index.vue
View File

@ -14,7 +14,7 @@
fill="#fff"
:rate="rate"
size="120px"
layer-color="#eee"
layer-color="#ebedf0"
:speed="100"
:stroke-width="60"
:clockwise="false"

2
packages/circle/en-US.md
View File

@ -43,7 +43,7 @@ export default {
color="#13ce66"
fill="#fff"
size="120px"
layer-color="#eee"
layer-color="#ebedf0"
:text="text"
:rate="rate"
:speed="100"

2
packages/circle/test/__snapshots__/demo.spec.js.snap
View File

@ -12,7 +12,7 @@ exports[`renders demo correctly 1`] = `
</div>
<div class="van-circle" style="width:120px;height:120px;">
<svg viewBox="0 0 1060 1060">
<path d="M 530 530 m -500, 0 a 500, 500 0 1, 1 1000, 0 a 500, 500 0 1, 1 -1000, 0" class="van-circle__hover" style="fill:#fff;stroke:#eee;stroke-width:60px;"></path>
<path d="M 530 530 m -500, 0 a 500, 500 0 1, 1 1000, 0 a 500, 500 0 1, 1 -1000, 0" class="van-circle__hover" style="fill:#fff;stroke:#ebedf0;stroke-width:60px;"></path>
<path d="M 530 530 m -500, 0 a 500, 500 0 1, 1 1000, 0 a 500, 500 0 1, 1 -1000, 0" class="van-circle__layer" style="stroke:#13ce66;stroke-dashoffset:3140px;stroke-width:61px;"></path>
</svg>
<div class="van-circle__text">0%</div>

2
packages/circle/zh-CN.md
View File

@ -44,7 +44,7 @@ export default {
color="#13ce66"
fill="#fff"
size="120px"
layer-color="#eee"
layer-color="#ebedf0"
:text="text"
:rate="rate"
:speed="100"

4
packages/col/demo/index.vue
View File

@ -97,6 +97,8 @@ export default {
</script>
<style lang="less">
@import '../../style/var';
.demo-col {
.van-doc-demo-block {
padding: 0 15px;
@ -107,7 +109,7 @@ export default {
}
.van-col {
color: #fff;
color: @white;
font-size: 13px;
line-height: 30px;
text-align: center;

2
packages/collapse/demo/index.vue
View File

@ -78,7 +78,7 @@ export default {
</script>
<style lang="less">
@import "../../../packages/style/var";
@import '../../style/var';
.demo-collapse {
.van-collapse-item__content {

4
packages/list/demo/index.vue
View File

@ -70,6 +70,8 @@ export default {
</script>
<style lang="less">
@import '../../style/var';
.demo-list {
.van-cell {
text-align: center;
@ -80,7 +82,7 @@ export default {
line-height: 1.4;
font-size: 14px;
text-align: center;
color: #666;
color: @gray-darker;
}
}
</style>

6
packages/popup/demo/index.vue
View File

@ -104,6 +104,8 @@ export default {
</script>
<style lang="less">
@import '../../style/var';
.demo-popup {
.van-button {
margin: 10px 0 10px 15px;
@ -129,11 +131,11 @@ export default {
.van-tab__pane:not(:first-child) {
padding: 10px;
line-height: 1.4;
color: #666;
color: @gray-darker;
}
&--top {
color: #fff;
color: @white;
width: 100%;
border-radius: 0;
line-height: 20px;

6
packages/style/demo/index.vue
View File

@ -65,6 +65,8 @@ export default {
</script>
<style lang="less">
@import '../../style/var';
.demo-style {
.van-ellipsis {
font-size: 13px;
@ -74,7 +76,7 @@ export default {
.van-hairline--top {
height: 30px;
background-color: #fff;
background-color: @white;
&::after {
top: 5px;
@ -83,7 +85,7 @@ export default {
.van-col {
height: 50px;
color: #fff;
color: @white;
font-size: 14px;
border-radius: 3px;
text-align: center;

4
packages/style/mixins/hairline.less
View File

@ -5,7 +5,7 @@
box-sizing: border-box;
}
.hairline(@border-color: #eee) {
.hairline(@border-color: #ebedf0) {
.hairline-common();
top: -50%;
@ -16,7 +16,7 @@
border: 0 solid @border-color;
}
.hairline-bottom(@border-color: #eee, @left: 0) {
.hairline-bottom(@border-color: #ebedf0, @left: 0) {
.hairline-common();
left: @left;

8
packages/swipe/demo/index.vue
View File

@ -124,6 +124,8 @@ export default {
</script>
<style lang="less">
@import '../../style/var';
.demo-swipe {
padding-bottom: 30px;
@ -131,7 +133,7 @@ export default {
cursor: pointer;
&-item {
color: #fff;
color: @white;
font-size: 20px;
text-align: center;
line-height: 150px;
@ -151,7 +153,7 @@ export default {
display: block;
padding: 30px 60px;
box-sizing: border-box;
background-color: #fff;
background-color: @white;
pointer-events: none;
}
}
@ -170,7 +172,7 @@ export default {
bottom: 5px;
padding: 2px 5px;
font-size: 12px;
color: #fff;
color: @white;
background: rgba(0, 0, 0, .1);
}
}

4
packages/tab/demo/index.vue
View File

@ -176,6 +176,8 @@ export default {
</script>
<style lang="less">
@import '../../style/var';
.demo-tab {
margin-bottom: 300px;
@ -185,7 +187,7 @@ export default {
}
.van-tab__pane {
background-color: #fff;
background-color: @white;
padding: 20px;
}

5
packages/tag/index.vue
View File

@ -16,9 +16,8 @@
<script>
import create from '../utils/create';
import { RED, BLUE, GREEN } from '../utils/color';
import { RED, BLUE, GREEN, GRAY_DARK } from '../utils/color';
const DEFAULT_COLOR = '#999';
const COLOR_MAP = {
danger: RED,
primary: BLUE,
@ -39,7 +38,7 @@ export default create({
computed: {
style() {
const color = this.color || COLOR_MAP[this.type] || DEFAULT_COLOR;
const color = this.color || COLOR_MAP[this.type] || GRAY_DARK;
const key = this.plain ? 'color' : 'backgroundColor';
return { [key]: color };
}

8
packages/tag/test/__snapshots__/demo.spec.js.snap
View File

@ -2,22 +2,22 @@
exports[`renders demo correctly 1`] = `
<div>
<div><span class="van-tag" style="background-color:#999;">标签</span> <span class="van-tag" style="background-color:#f44;">标签</span> <span class="van-tag" style="background-color:#1989fa;">标签</span> <span class="van-tag" style="background-color:#4b0;">标签</span></div>
<div><span class="van-tag van-tag--plain van-hairline--surround" style="color:#999;">标签</span> <span class="van-tag van-tag--plain van-tag--round van-hairline--surround" style="color:#f44;">
<div><span class="van-tag" style="background-color:#969799;">标签</span> <span class="van-tag" style="background-color:#f44;">标签</span> <span class="van-tag" style="background-color:#1989fa;">标签</span> <span class="van-tag" style="background-color:#4b0;">标签</span></div>
<div><span class="van-tag van-tag--plain van-hairline--surround" style="color:#969799;">标签</span> <span class="van-tag van-tag--plain van-tag--round van-hairline--surround" style="color:#f44;">
标签
</span> <span class="van-tag van-tag--plain van-tag--round van-hairline--surround" style="color:#1989fa;">
标签
</span> <span class="van-tag van-tag--plain van-hairline--surround" style="color:#4b0;">
标签
</span></div>
<div><span class="van-tag van-tag--round" style="background-color:#999;">标签</span> <span class="van-tag van-tag--round" style="background-color:#f44;">
<div><span class="van-tag van-tag--round" style="background-color:#969799;">标签</span> <span class="van-tag van-tag--round" style="background-color:#f44;">
标签
</span> <span class="van-tag van-tag--round" style="background-color:#1989fa;">
标签
</span> <span class="van-tag van-tag--round" style="background-color:#4b0;">
标签
</span></div>
<div><span class="van-tag van-tag--mark" style="background-color:#999;">标签</span> <span class="van-tag van-tag--mark" style="background-color:#f44;">
<div><span class="van-tag van-tag--mark" style="background-color:#969799;">标签</span> <span class="van-tag van-tag--mark" style="background-color:#f44;">
标签
</span> <span class="van-tag van-tag--mark" style="background-color:#1989fa;">
标签

1
packages/utils/color.js
View File

@ -1,3 +1,4 @@
export const RED = '#f44';
export const BLUE = '#1989fa';
export const GREEN = '#4b0';
export const GRAY_DARK = '#969799';

10
packages/waterfall/demo/index.vue
View File

@ -55,17 +55,19 @@ export default {
</script>
<style lang="less">
@import '../../style/var';
.demo-waterfall {
ul {
max-height: 360px;
overflow: scroll;
border-top: 1px solid #e5e5e5;
border-top: 1px solid @gray-light;
}
li {
line-height: 50px;
border-bottom: 1px solid #e5e5e5;
background: #fff;
border-bottom: 1px solid @gray-light;
background: @white;
text-align: center;
}
@ -74,7 +76,7 @@ export default {
line-height: 1.4;
font-size: 14px;
text-align: center;
color: #666;
color: @gray-darker;
}
}
</style>