alighasami/vant
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

feat(style): component using basic css variables

Browse Source
This commit is contained in:
chenjiahan
2021-06-12 15:52:22 +08:00
committed by neverland
parent aef2579a95
commit 710aebaee4
117 changed files with 707 additions and 705 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/share-sheet/index.less
+12 -12
View File
@@ -26,7 +26,7 @@
}
&__title {
margin-top: @padding-xs;
margin-top: var(--van-padding-xs);
color: var(--van-share-sheet-title-color);
font-weight: normal;
font-size: var(--van-share-sheet-title-font-size);
@@ -35,7 +35,7 @@
&__description {
display: block;
margin-top: @padding-xs;
margin-top: var(--van-padding-xs);
color: var(--van-share-sheet-description-color);
font-size: var(--van-share-sheet-description-font-size);
line-height: var(--van-share-sheet-description-line-height);
@@ -44,13 +44,13 @@
&__options {
position: relative;
display: flex;
padding: @padding-md 0 @padding-md @padding-xs;
padding: var(--van-padding-md) 0 var(--van-padding-md) var(--van-padding-xs);
overflow-x: auto;
overflow-y: visible;
-webkit-overflow-scrolling: touch;
&--border::before {
.hairline-top(@border-color, @padding-md);
.hairline-top(var(--van-border-color), var(--van-padding-md));
}
&::-webkit-scrollbar {
@@ -66,25 +66,25 @@
user-select: none;
&:active {
opacity: @active-opacity;
opacity: var(--van-active-opacity);
}
}
&__icon {
width: var(--van-share-sheet-icon-size);
height: var(--van-share-sheet-icon-size);
margin: 0 @padding-md;
margin: 0 var(--van-padding-md);
}
&__name {
margin-top: @padding-xs;
padding: 0 @padding-base;
margin-top: var(--van-padding-xs);
padding: 0 var(--van-padding-base);
color: var(--van-share-sheet-option-name-color);
font-size: var(--van-share-sheet-option-name-font-size);
}
&__option-description {
padding: 0 @padding-base;
padding: 0 var(--van-padding-base);
color: var(--van-share-sheet-option-description-color);
font-size: var(--van-share-sheet-option-description-font-size);
}
@@ -102,13 +102,13 @@
&::before {
display: block;
height: @padding-xs;
background-color: @background-color;
height: var(--van-padding-xs);
background-color: var(--van-background-color);
content: ' ';
}
&:active {
background-color: @active-color;
background-color: var(--van-active-color);
}
}
}
src/share-sheet/var.less
+13 -12
View File
@@ -1,17 +1,18 @@
@import '../style/var.less';
@share-sheet-header-padding: @padding-sm @padding-md @padding-base;
@share-sheet-title-color: @text-color;
@share-sheet-title-font-size: @font-size-md;
@share-sheet-title-line-height: @line-height-md;
@share-sheet-description-color: @gray-6;
@share-sheet-description-font-size: @font-size-sm;
@share-sheet-header-padding: var(--van-padding-sm) var(--van-padding-md)
var(--van-padding-base);
@share-sheet-title-color: var(--van-text-color);
@share-sheet-title-font-size: var(--van-font-size-md);
@share-sheet-title-line-height: var(--van-line-height-md);
@share-sheet-description-color: var(--van-gray-6);
@share-sheet-description-font-size: var(--van-font-size-sm);
@share-sheet-description-line-height: 16px;
@share-sheet-icon-size: 48px;
@share-sheet-option-name-color: @gray-7;
@share-sheet-option-name-font-size: @font-size-sm;
@share-sheet-option-description-color: @gray-5;
@share-sheet-option-description-font-size: @font-size-sm;
@share-sheet-cancel-button-font-size: @font-size-lg;
@share-sheet-option-name-color: var(--van-gray-7);
@share-sheet-option-name-font-size: var(--van-font-size-sm);
@share-sheet-option-description-color: var(--van-gray-5);
@share-sheet-option-description-font-size: var(--van-font-size-sm);
@share-sheet-cancel-button-font-size: var(--van-font-size-lg);
@share-sheet-cancel-button-height: 48px;
@share-sheet-cancel-button-background: @white;
@share-sheet-cancel-button-background: var(--van-white);