更新公共变量

diycp · Dec 24, 2018 · 9bdadc0 · 9bdadc0
1 parent c6e7dbf
commit 9bdadc0
Show file tree

Hide file tree

Showing 21 changed files with 343 additions and 299 deletions.
diff --git a/examples/pages/badge/badge.vue b/examples/pages/badge/badge.vue
@@ -8,26 +8,23 @@
 				<uni-badge text="12" type="primary"></uni-badge>
 				<uni-badge text="123" type="success"></uni-badge>
 				<uni-badge text="3" type="warning"></uni-badge>
-				<uni-badge text="45" type="danger"></uni-badge>
-				<uni-badge text="456" type="royal"></uni-badge>
+				<uni-badge text="45" type="error"></uni-badge>
 			</view>
             <view class="example-title">无底色</view>
 			<view style="background:#FFF; padding:20upx;">
 				<uni-badge text="1" :inverted="true"></uni-badge>
 				<uni-badge text="12" type="primary" :inverted="true"></uni-badge>
 				<uni-badge text="123" type="success" :inverted="true"></uni-badge>
 				<uni-badge text="3" type="warning" :inverted="true"></uni-badge>
-				<uni-badge text="45" type="danger" :inverted="true"></uni-badge>
-				<uni-badge text="456" type="royal" :inverted="true"></uni-badge>
+				<uni-badge text="45" type="error" :inverted="true"></uni-badge>
 			</view>
             <view class="example-title">迷你</view>
             <view style="background:#FFF; padding:20upx;">
             	<uni-badge text="1" size="small"></uni-badge>
             	<uni-badge text="12" type="primary" size="small"></uni-badge>
             	<uni-badge text="123" type="success" size="small"></uni-badge>
             	<uni-badge text="3" type="warning" size="small"></uni-badge>
-            	<uni-badge text="45" type="danger" size="small"></uni-badge>
-            	<uni-badge text="456" type="royal" size="small"></uni-badge>
+            	<uni-badge text="45" type="error" size="small"></uni-badge>
             </view>
 		</view>
 	</view>

diff --git a/examples/pages/tag/tag.vue b/examples/pages/tag/tag.vue
@@ -17,10 +17,7 @@
 					<uni-tag text="标签" type="warning"></uni-tag>
 				</view>
 				<view class="tag-view">
-					<uni-tag text="标签" type="danger" :circle="true"></uni-tag>
-				</view>
-				<view class="tag-view">
-					<uni-tag text="标签" type="royal" :circle="true"></uni-tag>
+					<uni-tag text="标签" type="error" :circle="true"></uni-tag>
 				</view>
 			</view>
             <view class="example-title">空心标签</view>
@@ -38,10 +35,7 @@
 					<uni-tag text="标签" inverted="true" type="warning"></uni-tag>
 				</view>
 				<view class="tag-view">
-					<uni-tag text="标签" inverted="true" type="danger" :circle="true"></uni-tag>
-				</view>
-				<view class="tag-view">
-					<uni-tag text="标签" inverted="true" type="royal" :circle="true"></uni-tag>
+					<uni-tag text="标签" inverted="true" type="error" :circle="true"></uni-tag>
 				</view>
 			</view>
 
@@ -70,10 +64,7 @@
 					<uni-tag text="标签" inverted="true" type="warning" size="small"></uni-tag>
 				</view>
 				<view class="tag-view">
-					<uni-tag text="标签" inverted="true" type="danger" size="small" :circle="true"></uni-tag>
-				</view>
-				<view class="tag-view">
-					<uni-tag text="标签" inverted="true" type="royal" size="small" :circle="true"></uni-tag>
+					<uni-tag text="标签" inverted="true" type="error" size="small" :circle="true"></uni-tag>
 				</view>
 			</view>
 
@@ -86,10 +77,7 @@
 					<uni-tag text="标签" type="primary" :disabled="true"></uni-tag>
 				</view>
 				<view class="tag-view">
-					<uni-tag text="标签" inverted="true" type="danger" size="small" :disabled="true"></uni-tag>
-				</view>
-				<view class="tag-view">
-					<uni-tag text="标签" inverted="true" type="royal" size="small" :circle="true" :disabled="true"></uni-tag>
+					<uni-tag text="标签" inverted="true" type="error" size="small" :disabled="true"></uni-tag>
 				</view>
 			</view>
 		</view>
@@ -107,7 +95,7 @@
 		},
 		methods: {
 			setType() {
-				let types = ['default', 'primary', 'success', 'warning', 'danger', 'royal'];
+				let types = ['default', 'primary', 'success', 'warning', 'error'];
 				let index = types.indexOf(this.type);
 				types.splice(index, 1)
 				let randomIndex = Math.ceil(Math.random() * 5);

diff --git a/examples/uni.scss b/examples/uni.scss
@@ -0,0 +1,25 @@
+//颜色变量
+
+//行为相关
+$uni-color-primary: #007aff;
+$uni-color-success: #4cd964;
+$uni-color-warning: #f0ad4e;
+$uni-color-danger: #dd524d;
+
+//主题相关
+$uni-color-blue: #007aff;
+$uni-color-green: #4cd964;
+$uni-color-yellow: #f0ad4e;
+$uni-color-red: #dd524d;
+
+$uni-text-color:#333
+$uni-border-color:#c8c7cc;
+$uni-background-color:#fff;
+
+//尺寸变量
+$uni-text-size:32upx;
+
+
+$nav-height:60px;
+
+
diff --git a/packages/badge/index.vue b/packages/badge/index.vue
@@ -53,7 +53,7 @@
 		padding: 3px 6px;
 		color: $uni-text-color;
 		border-radius: 100px;
-		background-color: $uni-background-color-hover;
+		background-color: $uni-bg-color-hover;
 
 		&.uni-badge-inverted {
 			padding: 0 5px 0 0;
@@ -62,7 +62,7 @@
 		}
 
 		&-primary {
-			color: #fff;
+			color: $uni-text-color-inverse;
 			background-color: $uni-color-primary;
 
 			&.uni-badge-inverted {
@@ -72,7 +72,7 @@
 		}
 
 		&-success {
-			color: #fff;
+			color: $uni-text-color-inverse;
 			background-color: $uni-color-success;
 
 			&.uni-badge-inverted {
@@ -82,7 +82,7 @@
 		}
 
 		&-warning {
-			color: #fff;
+			color: $uni-text-color-inverse;
 			background-color: $uni-color-warning;
 
 			&.uni-badge-inverted {
@@ -91,22 +91,12 @@
 			}
 		}
 
-		&-danger {
-			color: #fff;
-			background-color: $uni-color-danger;
+		&-error {
+			color: $uni-text-color-inverse;
+			background-color: $uni-color-error;
 
 			&.uni-badge-inverted {
-				color: $uni-color-danger;
-				background-color: transparent
-			}
-		}
-
-		&-royal {
-			color: #fff;
-			background-color: $uni-color-royal;
-
-			&.uni-badge-inverted {
-				color: $uni-color-royal;
+				color: $uni-color-error;
 				background-color: transparent
 			}
 		}

diff --git a/packages/card/index.vue b/packages/card/index.vue
@@ -36,7 +36,6 @@
 </script>
 
 <style lang="scss">
-    $card-head-pd: 18upx 24upx;
     $card-extra-width: 30%;
     
 	@mixin text-omit {
@@ -46,8 +45,8 @@
 	}
 
 	.uni-card {
-		margin: 20upx;
-		background: $uni-background-color;
+		margin: $spacing-col-base;
+		background: $uni-bg-color;
 		position: relative;
 		display: flex;
 		flex-direction: column;
@@ -63,7 +62,7 @@
 			right: -50%;
 			bottom: -50%;
 			border: 1px solid $uni-border-color;
-			border-radius: 6px;
+			border-radius: $uni-border-radius-lg;
 			transform: scale(.5);
 		}
 
@@ -72,7 +71,7 @@
 			position: relative;
 			display: flex;
 			flex-direction: row;
-			padding: $card-head-pd;
+			padding: $spacing-col-base;
 			align-items: center;
 		}
 
@@ -91,7 +90,7 @@
 
 			&-title {
 				flex: 1;
-				margin-right: 20upx;
+				margin-right: $spacing-col-base;
 				display: flex;
 				flex-direction: row;
 				justify-content: flex-start;
@@ -112,13 +111,13 @@
 				&-img {
 					height: $uni-img-size-sm;
 					width: $uni-img-size-sm;
-					margin-right: 20upx;
+					margin-right: $spacing-col-base;
 				}
 
 				&-text {
 					flex: 0 0 auto;
 					width: $card-extra-width;
-					margin-left: 20upx;
+					margin-left: $spacing-col-base;
 					font-size: $uni-font-size-base;
 					text-align: right;
 					@include text-omit;
@@ -129,7 +128,7 @@
 
 		&__content {
 			&--pd {
-				padding: 24upx;
+				padding: $spacing-col-base;
 			}
 		}
 

diff --git a/packages/collapse-item/index.vue b/packages/collapse-item/index.vue
@@ -149,14 +149,14 @@
 
 <style lang="scss">
 	@mixin collapse-hover {
-		background-color: $uni-background-color-hover;
+		background-color: $uni-bg-color-hover;
 	}
 
 	@mixin collapse-disabled {
 		opacity: 0.3;
 	}
 
-	$collapse-title-pd:22upx 30upx;
+	$collapse-title-pd:$spacing-col-base $spacing-col-lg;
 
 	.uni-collapse-cell {
 		position: relative;
@@ -247,7 +247,7 @@
 			position: relative;
 			width: 100%;
 			overflow: hidden;
-			background: #FFFFFF;
+			background: $uni-bg-color;
 
 			view {
 				font-size: $uni-font-size-base;

diff --git a/packages/collapse/index.vue b/packages/collapse/index.vue
@@ -58,7 +58,7 @@
 </script>
 <style lang="scss">
 	.uni-collapse {
-		background-color: $uni-background-color;
+		background-color: $uni-bg-color;
 		position: relative;
 		width: 100%;
 		display: flex;

diff --git a/packages/countdown/index.vue b/packages/countdown/index.vue
@@ -140,7 +140,7 @@
 			line-height: $countdown-height;
 			justify-content: center;
 			height: $countdown-height;
-			border-radius: 8upx;
+			border-radius: $uni-border-radius-base;
 			margin: 0 5upx;
 			font-size: $uni-font-size-base;
 			border: 1px solid #000000;

diff --git a/packages/drawer/index.vue b/packages/drawer/index.vue
@@ -123,7 +123,7 @@
 			left: 0;
 			width: 100%;
 			height: 100%;
-			background: rgba(0, 0, 0, 0.4);
+			background: $uni-bg-color-mask;
 			transition: opacity 0.3s;
 		}
 
@@ -134,7 +134,7 @@
 			left: 0;
 			width: $drawer-width;
 			height: 100%;
-			background: $uni-background-color;
+			background: $uni-bg-color;
 			transition: all 0.3s ease-out;
 			transform: translatex(-100%);
 		}

diff --git a/packages/grid/index.vue b/packages/grid/index.vue
@@ -138,7 +138,7 @@
 			}
 
 			&-hover {
-				background-color: $uni-background-color-hover;
+				background-color: $uni-bg-color-hover;
 			}
 
 			&-image {

diff --git a/packages/list-item/index.vue b/packages/list-item/index.vue
@@ -92,14 +92,14 @@
 
 <style lang="scss">
 	@mixin list-hover {
-		background-color: $uni-background-color-hover;
+		background-color: $uni-bg-color-hover;
 	}
 
 	@mixin list-disabled {
 		opacity: 0.3;
 	}
 
-	$list-cell-pd:22upx 30upx;
+	$list-cell-pd:$spacing-col-base $spacing-col-lg;
 
 	.uni-list-cell {
 		font-size: $uni-font-size-lg;

diff --git a/packages/list/index.vue b/packages/list/index.vue
@@ -10,7 +10,7 @@
 </script>
 <style lang="scss">
 	.uni-list {
-		background-color: $uni-background-color;
+		background-color: $uni-bg-color;
 		position: relative;
 		width: 100%;
 		display: flex;

diff --git a/packages/load-more/index.vue b/packages/load-more/index.vue
@@ -68,7 +68,7 @@
 
 		&__text {
 			font-size: 28upx;
-			color: $uni-text-color-second;
+			color: $uni-text-color-grey;
 		}
 
 		&__img {
@@ -84,7 +84,7 @@
 					height: 2px;
 					border-top-left-radius: 1px;
 					border-bottom-left-radius: 1px;
-					background: $uni-text-color-second;
+					background: $uni-text-color-grey;
 					position: absolute;
 					opacity: 0.2;
 					transform-origin: 50%;

diff --git a/packages/nav-bar/index.vue b/packages/nav-bar/index.vue
@@ -122,7 +122,7 @@
 			display: block;
 			position: relative;
 			width: 100%;
-			background-color: $uni-background-color;
+			background-color: $uni-bg-color;
 			overflow: hidden;
 
 			view {