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

[improvement] add padding variables (#3911)

Browse Source
This commit is contained in:
neverland 2019-07-20 15:46:27 +08:00 committed by GitHub
parent e400c9b67d
commit 5d83423b34
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
59 changed files with 132 additions and 242 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
docs/site/components/DemoList.vue
View File

@ -77,13 +77,13 @@ export default {
.vant-title, .vant-title,
.vant-desc { .vant-desc {
padding-left: 15px; padding-left: @padding-md;
font-weight: normal; font-weight: normal;
user-select: none; user-select: none;
} }
.vant-title { .vant-title {
margin: 0 0 15px; margin: 0 0 @padding-md;
img, img,
span { span {
@ -96,7 +96,7 @@ export default {
} }
span { span {
margin-left: 15px; margin-left: @padding-md;
font-weight: 500; font-weight: 500;
font-size: 36px; font-size: 36px;
} }

92
docs/site/desktop/App.vue
View File

@ -47,38 +47,7 @@ export default {
} }
}, },
mounted() {
this.showVersionTip();
},
methods: { methods: {
showVersionTip() {
const tip = window.localStorage.getItem('vantVersionTip');
if (!tip && this.$vantLang === 'zh-CN') {
const version = document.querySelector('.van-doc-header__version');
version.insertAdjacentHTML('beforeend', `
<div class="doc-version-tip">
提示：你当前访问的是 Vant 2.0 版本文档，点此切换至旧版文档
<div style="text-align: right;">
<button class="doc-version-tip__button">好哒</button>
</div>
</div>
`);
const tip = document.querySelector('.doc-version-tip');
const removeTip = event => {
event.stopPropagation();
tip.parentNode.removeChild(tip);
};
tip.addEventListener('click', removeTip);
version.addEventListener('click', removeTip);
window.localStorage.setItem('vantVersionTip', 1);
}
},
onChangeDemoURL(url) { onChangeDemoURL(url) {
this.simulators = [this.simulators[0], url]; this.simulators = [this.simulators[0], url];
}, },
@ -102,65 +71,4 @@ export default {
margin-bottom: 20px; margin-bottom: 20px;
} }
} }
.doc-version-tip {
position: absolute;
top: 35px;
left: 50%;
z-index: 100;
box-sizing: border-box;
width: 300px;
margin-left: -150px;
padding: 15px;
color: #333;
text-align: left;
background-color: #fff;
border-radius: 6px;
box-shadow: 0 4px 12px #ebedf0;
transform-origin: top;
cursor: default;
animation: version-tip .25s cubic-bezier(0.175, 0.885, 0.32, 1.375);
&::before {
position: absolute;
top: -4px;
left: 50%;
margin-left: -3px;
border: 6px solid;
border-color: transparent transparent white white;
transform: rotate(135deg);
content: '';
}
&__button {
width: 60px;
color: #fff;
font-size: 12px;
line-height: 24px;
background: #1889f9;
border: none;
border-radius: 15px;
cursor: pointer;
&:hover {
background: darken(#1889f9, 10%);
}
&:focus {
outline: none;
}
}
@keyframes version-tip {
from {
transform: scaleY(0);
opacity: 0;
}
to {
transform: scaleY(1);
opacity: 1;
}
}
}
</style> </style>

2
src/action-sheet/demo/index.vue
View File

@ -134,7 +134,7 @@ export default {
background-color: @white; background-color: @white;
.van-button { .van-button {
margin-left: 15px; margin-left: @padding-md;
} }
p { p {

4
src/address-list/index.less
View File

@ -13,7 +13,7 @@
} }
&__disabled-text { &__disabled-text {
padding: 0 15px; padding: 0 @padding-md;
color: @address-list-disabled-text-color; color: @address-list-disabled-text-color;
font-size: @address-list-disabled-text-font-size; font-size: @address-list-disabled-text-font-size;
line-height: @address-list-disabled-text-line-height; line-height: @address-list-disabled-text-line-height;
@ -24,7 +24,7 @@
padding: @address-list-item-padding; padding: @address-list-item-padding;
&__value { &__value {
padding-right: 34px; padding-right: @padding-xl;
} }
&__name { &__name {

10
src/button/demo/index.vue
View File

@ -180,20 +180,22 @@ export default {
</script> </script>
<style lang="less"> <style lang="less">
@import "../../style/var";
.demo-button { .demo-button {
.van-button { .van-button {
&--large { &--large {
margin-bottom: 15px; margin-bottom: @padding-md;
} }
&--small, &--small,
&--normal:not(:last-child) { &--normal:not(:last-child) {
margin-right: 10px; margin-right: @padding-md;
} }
} }
.van-doc-demo-block { .van-doc-demo-block {
padding: 0 15px; padding: 0 @padding-md;
} }
.van-doc-demo-block__title { .van-doc-demo-block__title {
@ -201,7 +203,7 @@ export default {
} }
&-row { &-row {
margin-bottom: 10px; margin-bottom: @padding-sm;
} }
} }
</style> </style>

2
src/button/index.less
View File

@ -104,7 +104,7 @@
&--small { &--small {
min-width: @button-small-min-width; min-width: @button-small-min-width;
height: @button-small-height; height: @button-small-height;
padding: 0 8px; padding: 0 @padding-xs;
font-size: @button-small-font-size; font-size: @button-small-font-size;
line-height: @button-small-line-height; line-height: @button-small-line-height;
} }

4
src/card/index.less
View File

@ -10,7 +10,7 @@
background-color: @card-background-color; background-color: @card-background-color;
&:not(:first-child) { &:not(:first-child) {
margin-top: 10px; margin-top: @padding-xs;
} }
&__header { &__header {
@ -22,7 +22,7 @@
flex: none; flex: none;
width: @card-thumb-size; width: @card-thumb-size;
height: @card-thumb-size; height: @card-thumb-size;
margin-right: 10px; margin-right: @padding-xs;
} }
&__content { &__content {

4
src/cell/index.less
View File

@ -14,7 +14,7 @@
background-color: @cell-background-color; background-color: @cell-background-color;
&:not(:last-child)::after { &:not(:last-child)::after {
.hairline-bottom(@cell-border-color, 15px); .hairline-bottom(@cell-border-color, @padding-md);
} }
&--borderless::after { &--borderless::after {
@ -74,7 +74,7 @@
&::before { &::before {
position: absolute; position: absolute;
left: 7px; left: @padding-xs;
color: @cell-required-color; color: @cell-required-color;
font-size: @cell-font-size; font-size: @cell-font-size;
content: '*'; content: '*';

8
src/circle/demo/index.vue
View File

@ -75,16 +75,18 @@ export default {
</script> </script>
<style lang="less"> <style lang="less">
@import "../../style/var";
.demo-circle { .demo-circle {
.van-circle { .van-circle {
margin-left: 15px; margin-left: @padding-md;
} }
.van-button { .van-button {
margin: 15px 0 0 10px; margin: @padding-md 0 0 10px;
&:first-of-type { &:first-of-type {
margin-left: 15px; margin-left: @padding-md;
} }
} }
} }

2
src/col/demo/index.vue
View File

@ -104,7 +104,7 @@ export default {
.demo-col { .demo-col {
.van-doc-demo-block { .van-doc-demo-block {
padding: 0 15px; padding: 0 @padding-md;
} }
.van-doc-demo-block__title { .van-doc-demo-block__title {

2
src/count-down/demo/index.vue
View File

@ -127,7 +127,7 @@ export default {
background-color: @white; background-color: @white;
.van-count-down { .van-count-down {
margin-left: 15px; margin-left: @padding-md;
} }
.item { .item {

4
src/coupon-list/index.less
View File

@ -16,7 +16,7 @@
&__list { &__list {
box-sizing: border-box; box-sizing: border-box;
padding: 15px 0; padding: @padding-md 0;
overflow-y: auto; overflow-y: auto;
-webkit-overflow-scrolling: touch; -webkit-overflow-scrolling: touch;
} }
@ -33,7 +33,7 @@
text-align: center; text-align: center;
p { p {
margin: 15px 0; margin: @padding-md 0;
color: @coupon-list-empty-tip-color; color: @coupon-list-empty-tip-color;
font-size: @coupon-list-empty-tip-font-size; font-size: @coupon-list-empty-tip-font-size;
line-height: @coupon-list-empty-tip-line-height; line-height: @coupon-list-empty-tip-line-height;

6
src/coupon/index.less
View File

@ -41,7 +41,7 @@
&__head { &__head {
position: relative; position: relative;
min-width: @coupon-head-width; min-width: @coupon-head-width;
padding-right: 10px; padding-right: @padding-xs;
p { p {
white-space: pre-wrap; white-space: pre-wrap;
@ -73,8 +73,8 @@
&__corner { &__corner {
position: absolute; position: absolute;
top: 16px; top: @padding-md;
right: 15px; right: @padding-md;
} }
&__description { &__description {

2
src/dialog/demo/index.vue
View File

@ -127,7 +127,7 @@ export default {
background-color: @white; background-color: @white;
.van-doc-demo-block > .van-button { .van-doc-demo-block > .van-button {
margin-left: 15px; margin-left: @padding-md;
} }
img { img {

2
src/divider/README.md
View File

@ -38,7 +38,7 @@ Vue.use(Divider);
### Custom Style ### Custom Style
```html ```html
<van-divider :style="{ color: '#1989fa', borderColor: '#1989fa', padding: '0 15px' }"> <van-divider :style="{ color: '#1989fa', borderColor: '#1989fa', padding: '0 16px' }">
Text Text
</van-divider> </van-divider>
``` ```

2
src/divider/README.zh-CN.md
View File

@ -48,7 +48,7 @@ Vue.use(Divider);
可以直接通过`style`属性设置分割线的样式 可以直接通过`style`属性设置分割线的样式
```html ```html
<van-divider :style="{ color: '#1989fa', borderColor: '#1989fa', padding: '0 15px' }"> <van-divider :style="{ color: '#1989fa', borderColor: '#1989fa', padding: '0 16px' }">
文字 文字
</van-divider> </van-divider>
``` ```

8
src/divider/demo/index.vue
View File

@ -30,7 +30,7 @@
</demo-block> </demo-block>
<demo-block :title="$t('customStyle')"> <demo-block :title="$t('customStyle')">
<van-divider :style="{ borderColor: BLUE, color: BLUE, padding: '0 15px' }"> <van-divider :style="{ borderColor: BLUE, color: BLUE, padding: '0 16px' }">
{{ $t('text') }} {{ $t('text') }}
</van-divider> </van-divider>
</demo-block> </demo-block>
@ -67,11 +67,13 @@ export default {
</script> </script>
<style lang="less"> <style lang="less">
@import "../../style/var";
.demo-divider { .demo-divider {
background-color: #fff; background-color: @white;
.van-doc-demo-block__title { .van-doc-demo-block__title {
padding-top: 15px; padding-top: @padding-md;
} }
} }
</style> </style>

2
src/divider/test/__snapshots__/demo.spec.js.snap
View File

@ -24,7 +24,7 @@ exports[`renders demo correctly 1`] = `
</div> </div>
</div> </div>
<div> <div>
<div class="van-divider van-divider--hairline van-divider--content-center" style="border-color: #1989fa; color: rgb(25, 137, 250); padding: 0px 15px;"> <div class="van-divider van-divider--hairline van-divider--content-center" style="border-color: #1989fa; color: rgb(25, 137, 250); padding: 0px 16px;">
文本 文本
</div> </div>
</div> </div>

2
src/dropdown-menu/index.less
View File

@ -32,7 +32,7 @@
position: relative; position: relative;
box-sizing: border-box; box-sizing: border-box;
max-width: 100%; max-width: 100%;
padding: 0 8px; padding: 0 @padding-xs;
font-size: @dropdown-menu-title-font-size; font-size: @dropdown-menu-title-font-size;
&::after { &::after {

6
src/field/index.less
View File

@ -66,8 +66,8 @@
&__clear, &__clear,
&__right-icon { &__right-icon {
margin-right: -10px; margin-right: -@padding-xs;
padding: 0 10px; padding: 0 @padding-xs;
line-height: inherit; line-height: inherit;
} }
@ -93,7 +93,7 @@
} }
&__button { &__button {
padding-left: 10px; padding-left: @padding-xs;
} }
&__error-message { &__error-message {

2
src/grid-item/index.less
View File

@ -55,6 +55,6 @@
} }
&__icon + &__text { &__icon + &__text {
margin-top: 8px; margin-top: @padding-xs;
} }
} }

2
src/image-preview/demo/index.vue
View File

@ -115,7 +115,7 @@ export default {
background-color: @white; background-color: @white;
.van-button { .van-button {
margin-left: 15px; margin-left: @padding-md;
} }
} }

2
src/image/demo/index.vue
View File

@ -140,7 +140,7 @@ export default {
background-color: @white; background-color: @white;
.van-row { .van-row {
padding: 0 15px; padding: 0 @padding-md;
} }
.van-col { .van-col {

2
src/index-bar/index.less
View File

@ -13,7 +13,7 @@
} }
&__index { &__index {
padding: 0 3px 0 15px; padding: 0 @padding-base 0 @padding-md;
font-weight: 500; font-weight: 500;
font-size: @index-bar-index-font-size; font-size: @index-bar-index-font-size;
line-height: @index-bar-index-line-height; line-height: @index-bar-index-line-height;

11
src/lazyload/demo/index.vue
View File

@ -60,19 +60,22 @@ export default {
</script> </script>
<style lang="less"> <style lang="less">
@import "../../style/var";
.demo-lazyload { .demo-lazyload {
padding: 15px; padding-right: @padding-md;
padding-left: @padding-md;
img, img,
div[lazy] { div[lazy] {
box-sizing: border-box; box-sizing: border-box;
width: 100%; width: 100%;
height: 250px; height: 250px;
margin: 10px 0 0; margin-bottom: @padding-md;
padding: 15px; padding: @padding-md;
background-color: white; background-color: white;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: 15px; background-position: @padding-md;
background-size: 315px 250px; background-size: 315px 250px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
} }

4
src/loading/index.less
View File

@ -58,7 +58,7 @@
&__text { &__text {
display: inline-block; display: inline-block;
margin-left: 10px; margin-left: @padding-xs;
color: @loading-text-color; color: @loading-text-color;
font-size: @loading-text-font-size; font-size: @loading-text-font-size;
vertical-align: middle; vertical-align: middle;
@ -70,7 +70,7 @@
align-items: center; align-items: center;
.van-loading__text { .van-loading__text {
margin: 10px 0 0; margin: @padding-xs 0 0;
} }
} }
} }

8
src/nav-bar/index.less
View File

@ -46,17 +46,17 @@
} }
&__left { &__left {
left: 15px; left: @padding-md;
} }
&__right { &__right {
right: 15px; right: @padding-md;
} }
&__text { &__text {
display: inline-block; display: inline-block;
margin: 0 -15px; margin: 0 -@padding-md;
padding: 0 15px; padding: 0 @padding-md;
color: @nav-bar-text-color; color: @nav-bar-text-color;
vertical-align: middle; vertical-align: middle;

2
src/notify/demo/index.vue
View File

@ -58,7 +58,7 @@ export default {
background-color: @white; background-color: @white;
.van-button { .van-button {
margin-left: 15px; margin-left: @padding-md;
} }
} }
</style> </style>

4
src/number-keyboard/demo/index.vue
View File

@ -104,9 +104,11 @@ export default {
</script> </script>
<style lang="less"> <style lang="less">
@import "../../style/var";
.demo-number-keyboard { .demo-number-keyboard {
.van-button { .van-button {
margin-left: 15px; margin-left: @padding-md;
} }
} }
</style> </style>

40
src/overlay/demo/index.vue
View File

@ -4,7 +4,7 @@
<van-button <van-button
type="primary" type="primary"
:text="$t('showOverlay')" :text="$t('showOverlay')"
style="margin-left: 15px;" style="margin-left: 16px;"
@click="show = true" @click="show = true"
/> />
@ -34,41 +34,3 @@ export default {
} }
}; };
</script> </script>
<style lang="less">
.demo-skeleton {
background-color: #fff;
.van-switch {
margin: 0 15px 10px;
}
.demo-preview {
display: flex;
padding: 0 15px;
.demo-content {
padding-top: 6px;
h3 {
margin: 0;
font-size: 18px;
line-height: 20px;
}
p {
margin: 13px 0 0;
font-size: 14px;
line-height: 20px;
}
}
img {
flex-shrink: 0;
width: 32px;
height: 32px;
margin-right: 15px;
}
}
}
</style>

2
src/overlay/test/__snapshots__/demo.spec.js.snap
View File

@ -2,7 +2,7 @@
exports[`renders demo correctly 1`] = ` exports[`renders demo correctly 1`] = `
<div> <div>
<div><button class="van-button van-button--primary van-button--normal" style="margin-left: 15px;"><span class="van-button__text">显示遮罩层</span></button> <div><button class="van-button van-button--primary van-button--normal" style="margin-left: 16px;"><span class="van-button__text">显示遮罩层</span></button>
<div class="van-overlay" style="z-index: 1; display: none;" name="van-fade"></div> <div class="van-overlay" style="z-index: 1; display: none;" name="van-fade"></div>
</div> </div>
</div> </div>

4
src/pagination/demo/index.vue
View File

@ -62,6 +62,8 @@ export default {
</script> </script>
<style lang="less"> <style lang="less">
@import "../../style/var";
.demo-pagination { .demo-pagination {
.van-pagination { .van-pagination {
width: 100%; width: 100%;
@ -69,7 +71,7 @@ export default {
} }
.van-doc-demo-block { .van-doc-demo-block {
padding: 0 15px; padding: 0 @padding-md;
} }
.van-doc-demo-block__title { .van-doc-demo-block__title {

2
src/password-input/index.less
View File

@ -7,7 +7,7 @@
&__info, &__info,
&__error-info { &__error-info {
margin-top: 15px; margin-top: @padding-md;
font-size: @password-input-info-font-size; font-size: @password-input-info-font-size;
text-align: center; text-align: center;
} }

4
src/popup/demo/index.vue
View File

@ -152,11 +152,11 @@ export default {
.demo-popup { .demo-popup {
.van-row { .van-row {
margin-bottom: 15px; margin-bottom: @padding-md;
} }
.van-button { .van-button {
margin-left: 15px; margin-left: @padding-md;
} }
} }
</style> </style>

2
src/pull-refresh/demo/index.vue
View File

@ -57,7 +57,7 @@ export default {
} }
p { p {
margin: 10px 0 0 15px; margin: @padding-xs 0 0 @padding-md;
} }
} }
</style> </style>

4
src/rate/demo/index.vue
View File

@ -90,12 +90,14 @@ export default {
</script> </script>
<style lang="less"> <style lang="less">
@import "../../style/var";
.demo-rate { .demo-rate {
padding-bottom: 20px; padding-bottom: 20px;
background-color: #fff; background-color: #fff;
.van-rate { .van-rate {
margin-left: 15px; margin-left: @padding-md;
} }
} }
</style> </style>

4
src/search/index.less
View File

@ -9,7 +9,7 @@
&__content { &__content {
display: flex; display: flex;
flex: 1; flex: 1;
padding-left: 10px; padding-left: @padding-xs;
background-color: @search-background-color; background-color: @search-background-color;
border-radius: 2px; border-radius: 2px;
@ -27,7 +27,7 @@
.van-cell { .van-cell {
flex: 1; flex: 1;
padding: 5px 10px 5px 0; padding: 5px @padding-xs 5px 0;
background-color: transparent; background-color: transparent;
&__left-icon { &__left-icon {

2
src/sidebar/demo/index.vue
View File

@ -55,7 +55,7 @@ export default {
background-color: @white; background-color: @white;
.van-sidebar { .van-sidebar {
margin-left: 15px; margin-left: @padding-md;
} }
} }
</style> </style>

10
src/skeleton/demo/index.vue
View File

@ -64,16 +64,18 @@ export default {
</script> </script>
<style lang="less"> <style lang="less">
@import "../../style/var";
.demo-skeleton { .demo-skeleton {
background-color: #fff; background-color: @white;
.van-switch { .van-switch {
margin: 0 15px 10px; margin: 0 @padding-md @padding-xs;
} }
.demo-preview { .demo-preview {
display: flex; display: flex;
padding: 0 15px; padding: 0 @padding-md;
.demo-content { .demo-content {
padding-top: 6px; padding-top: 6px;
@ -95,7 +97,7 @@ export default {
flex-shrink: 0; flex-shrink: 0;
width: 32px; width: 32px;
height: 32px; height: 32px;
margin-right: 15px; margin-right: @padding-md;
} }
} }
} }

6
src/skeleton/index.less
View File

@ -2,11 +2,11 @@
.van-skeleton { .van-skeleton {
display: flex; display: flex;
padding: 0 15px; padding: 0 @padding-md;
&__avatar { &__avatar {
flex-shrink: 0; flex-shrink: 0;
margin-right: 15px; margin-right: @padding-md;
background-color: @skeleton-avatar-background-color; background-color: @skeleton-avatar-background-color;
&--round { &--round {
@ -19,7 +19,7 @@
} }
&__avatar + &__content { &__avatar + &__content {
padding-top: 8px; padding-top: @padding-xs;
} }
&__row, &__row,

2
src/sku/demo/index.vue
View File

@ -226,7 +226,7 @@ export default {
background-color: @white; background-color: @white;
.sku-container { .sku-container {
padding: 0 15px; padding: 0 @padding-md;
} }
} }
</style> </style>

2
src/slider/demo/index.vue
View File

@ -118,7 +118,7 @@ export default {
user-select: none; user-select: none;
.van-slider { .van-slider {
margin: 0 15px 30px; margin: 0 @padding-md @padding-xl;
} }
.custom-button { .custom-button {

4
src/step/index.less
View File

@ -48,9 +48,9 @@
.van-step__circle-container { .van-step__circle-container {
position: absolute; position: absolute;
top: 30px; top: 30px;
left: -8px; left: -@padding-xs;
z-index: 1; z-index: 1;
padding: 0 8px; padding: 0 @padding-xs;
background-color: @white; background-color: @white;
transform: translateY(-50%); transform: translateY(-50%);
} }

8
src/stepper/demo/index.vue
View File

@ -115,11 +115,3 @@ export default {
} }
}; };
</script> </script>
<style lang="less">
.demo-stepper {
.van-stepper {
margin-left: 15px;
}
}
</style>

2
src/steps/demo/index.vue
View File

@ -102,7 +102,7 @@ export default {
} }
.van-button { .van-button {
margin: 15px 0 0 15px; margin: @padding-md 0 0 @padding-md;
} }
.van-steps__message + p { .van-steps__message + p {

2
src/steps/index.less
View File

@ -16,6 +16,6 @@
} }
&--vertical { &--vertical {
padding: 0 0 0 35px; padding: 0 0 0 @padding-xl;
} }
} }

4
src/sticky/demo/index.vue
View File

@ -66,11 +66,13 @@ export default {
</script> </script>
<style lang="less"> <style lang="less">
@import "../../style/var";
.demo-sticky { .demo-sticky {
height: 200vh; height: 200vh;
.van-button { .van-button {
margin-left: 15px; margin-left: @padding-md;
} }
} }
</style> </style>

2
src/style/demo/index.vue
View File

@ -90,7 +90,7 @@ export default {
.demo-style { .demo-style {
.van-ellipsis { .van-ellipsis {
max-width: 250px; max-width: 250px;
margin-left: 15px; margin-left: @padding-md;
font-size: 13px; font-size: 13px;
} }

19
src/style/var.less
View File

@ -18,11 +18,14 @@
@active-color: #f2f3f5; @active-color: #f2f3f5;
@background-color: #f8f8f8; @background-color: #f8f8f8;
@background-color-light: #fafafa; @background-color-light: #fafafa;
@padding-xl: 32px;
@padding-lg: 24px; // Padding
@padding-md: 16px; @padding-base: 4px;
@padding-sm: 12px; @padding-xs: @padding-base * 2;
@padding-xs: 8px; @padding-sm: @padding-base * 3;
@padding-md: @padding-base * 4;
@padding-lg: @padding-base * 6;
@padding-xl: @padding-base * 8;
// ActionSheet // ActionSheet
@action-sheet-max-height: 90%; @action-sheet-max-height: 90%;
@ -37,13 +40,13 @@
@action-sheet-subname-font-size: 12px; @action-sheet-subname-font-size: 12px;
@action-sheet-close-icon-size: 18px; @action-sheet-close-icon-size: 18px;
@action-sheet-close-icon-color: @gray-dark; @action-sheet-close-icon-color: @gray-dark;
@action-sheet-close-icon-padding: 0 @padding-md; @action-sheet-close-icon-padding: 0 @padding-sm;
@action-sheet-cancel-padding-top: @padding-xs; @action-sheet-cancel-padding-top: @padding-xs;
@action-sheet-cancel-padding-color: @background-color; @action-sheet-cancel-padding-color: @background-color;
// AddressEdit // AddressEdit
@address-edit-buttons-padding: @padding-xl @padding-md; @address-edit-buttons-padding: @padding-xl @padding-md;
@address-edit-button-margin-bottom: @padding-md; @address-edit-button-margin-bottom: @padding-sm;
@address-edit-detail-finish-color: @blue; @address-edit-detail-finish-color: @blue;
@address-edit-detail-fnish-font-size: 12px; @address-edit-detail-fnish-font-size: 12px;
@ -167,7 +170,7 @@
// ContactEdit // ContactEdit
@contact-edit-buttons-padding: @padding-xl @padding-md; @contact-edit-buttons-padding: @padding-xl @padding-md;
@contact-edit-button-margin-bottom: @padding-md; @contact-edit-button-margin-bottom: @padding-sm;
@contact-edit-field-label-width: 65px; @contact-edit-field-label-width: 65px;
// ContactList // ContactList

2
src/submit-bar/demo/index.vue
View File

@ -102,7 +102,7 @@ export default {
} }
.van-checkbox { .van-checkbox {
margin-left: 15px; margin-left: @padding-sm;
} }
} }
</style> </style>

2
src/submit-bar/index.less
View File

@ -37,7 +37,7 @@
&__text { &__text {
flex: 1; flex: 1;
padding-right: 12px; padding-right: @padding-sm;
color: @submit-bar-text-color; color: @submit-bar-text-color;
font-weight: 500; font-weight: 500;
text-align: right; text-align: right;

4
src/switch/demo/index.vue
View File

@ -84,9 +84,11 @@ export default {
</script> </script>
<style lang="less"> <style lang="less">
@import "../../style/var";
.demo-switch { .demo-switch {
.van-switch { .van-switch {
margin: 0 15px; margin: 0 @padding-md;
} }
} }
</style> </style>

2
src/tabs/index.less
View File

@ -77,7 +77,7 @@
&--card { &--card {
box-sizing: border-box; box-sizing: border-box;
height: @tabs-card-height; height: @tabs-card-height;
margin: 0 15px; margin: 0 @padding-md;
border: 1px solid @tabs-default-color; border: 1px solid @tabs-default-color;
border-radius: 2px; border-radius: 2px;

8
src/tag/demo/index.vue
View File

@ -138,16 +138,18 @@ export default {
</script> </script>
<style lang="less"> <style lang="less">
@import "../../style/var";
.demo-tag { .demo-tag {
background-color: #fff; background-color: @white;
.van-tag + .van-tag { .van-tag + .van-tag {
margin-left: 10px; margin-left: @padding-xs;
} }
.van-tag { .van-tag {
&:first-of-type { &:first-of-type {
margin-left: 15px; margin-left: @padding-md;
} }
} }
} }

2
src/toast/demo/index.vue
View File

@ -161,7 +161,7 @@ export default {
background-color: @white; background-color: @white;
.van-button { .van-button {
margin-left: 15px; margin-left: @padding-md;
} }
} }
</style> </style>

2
src/toast/index.less
View File

@ -64,6 +64,6 @@
} }
&__text { &__text {
margin-top: 10px; margin-top: @padding-xs;
} }
} }

6
src/tree-select/index.less
View File

@ -39,7 +39,7 @@
&__item { &__item {
position: relative; position: relative;
padding-left: 15px; padding-left: @padding-md;
font-weight: bold; font-weight: bold;
line-height: @tree-select-item-height; line-height: @tree-select-item-height;
@ -55,7 +55,7 @@
&__selected { &__selected {
position: absolute; position: absolute;
top: 50%; top: 50%;
right: 15px; right: @padding-md;
margin-top: -8px; margin-top: -@padding-xs;
} }
} }

6
src/uploader/demo/index.vue
View File

@ -87,11 +87,13 @@ export default {
</script> </script>
<style lang="less"> <style lang="less">
@import "../../style/var";
.demo-uploader { .demo-uploader {
background-color: #fff; background-color: @white;
.van-uploader { .van-uploader {
margin-left: 15px; margin-left: @padding-md;
} }
} }
</style> </style>

8
src/uploader/index.less
View File

@ -33,7 +33,7 @@
box-sizing: border-box; box-sizing: border-box;
width: @uploader-size; width: @uploader-size;
height: @uploader-size; height: @uploader-size;
margin: 0 10px 10px 0; margin: 0 @padding-xs @padding-xs 0;
background-color: @uploader-upload-background-color; background-color: @uploader-upload-background-color;
border: 1px dashed @uploader-upload-border-color; border: 1px dashed @uploader-upload-border-color;
@ -43,7 +43,7 @@
} }
&-text { &-text {
margin-top: 10px; margin-top: @padding-xs;
color: @uploader-text-color; color: @uploader-text-color;
font-size: @uploader-text-font-size; font-size: @uploader-text-font-size;
} }
@ -51,7 +51,7 @@
&__preview { &__preview {
position: relative; position: relative;
margin: 0 10px 10px 0; margin: 0 @padding-xs @padding-xs 0;
&-image { &-image {
display: block; display: block;
@ -86,7 +86,7 @@
&-name { &-name {
box-sizing: border-box; box-sizing: border-box;
width: 100%; width: 100%;
margin-top: 5px; margin-top: @padding-xs;
padding: 0 5px; padding: 0 5px;
color: @uploader-file-name-text-color; color: @uploader-file-name-text-color;
font-size: @uploader-file-name-font-size; font-size: @uploader-file-name-font-size;