04-25 更新

2026-03-13 11:34:02 +08:00 · 2019-04-25 22:53:29 +08:00
parent b253da90f8
commit efff75adb9
24 changed files with 183 additions and 313 deletions
--- a/Colorui-UniApp/App.vue
+++ b/Colorui-UniApp/App.vue
@@ -116,8 +116,8 @@
 </script>

 <style>
-	@import "colorui/icon.css";
 	@import "colorui/main.css";
+	@import "colorui/icon.css";

 	.nav-list {
 		display: flex;
@@ -247,7 +247,4 @@
 			transform: translateY(0px);
 		}
 	}
-	html{
-		font-size: 18.75px !important;
-	}
 </style>
--- a/Colorui-UniApp/README-GitHub.md
+++ b/Colorui-UniApp/README-GitHub.md
@@ -1,158 +0,0 @@
-<p style="text-align: center;"><img src="https://image.weilanwl.com/uni/UniAppReadme.jpg" alt="ColorUI简介"></img></p>
-
-## 前言
-ColorUI是一个css库！！！在你引入样式后可以根据class来调用组件，一些含有交互的操作我也有简单写，可以为你开发提供一些思路。
-## 交流
-微信群：加入微信群请先添加开发者微信，备注UniApp插件市场。QQ群：240787041 或扫描二维码。
-<p align="center"><img src="https://image.weilanwl.com/colorui/githubQrcode.jpg" alt="" style="max-width:100%;" width="748"></p>				  
-
-## 素材
-ColorUI在语雀有个群友共同在维护的知识库，里面有一些群友改的模板和UI素材供开发使用哦！
-[语雀-ColorUI群资源](https://www.yuque.com/colorui)
-
-## 使用UniApp开发
-### 开始
-下载源码解压获得`/Colorui-UniApp`文件夹，复制目录下的 `/colorui` 文件夹到你的项目根目录
-
-`App.vue` 引入关键Css `main.css` `icon.css`
-```
-<style>
-    @import "colorui/main.css";
-	@import "colorui/icon.css";
-	@import "app.css"; /* 你的项目css */
-	....
-</style>
-```
-
-### 使用自定义导航栏
-导航栏作为常用组件有做简单封装，当然你也可以直接复制代码结构自己修改，达到个性化目的。
-
-`App.vue` 获得系统信息
-```
-onLaunch: function() {
-	uni.getSystemInfo({
-		success: function(e) {
-			// #ifndef MP
-			Vue.prototype.StatusBar = e.statusBarHeight;
-			if (e.platform == 'android') {
-				Vue.prototype.CustomBar = e.statusBarHeight + 50;
-			} else {
-				Vue.prototype.CustomBar = e.statusBarHeight + 45;
-			};
-			// #endif
-			// #ifdef MP-WEIXIN
-			Vue.prototype.StatusBar = e.statusBarHeight;
-			let custom = wx.getMenuButtonBoundingClientRect();
-			Vue.prototype.Custom = custom;
-			Vue.prototype.CustomBar = custom.bottom + custom.top - e.statusBarHeight;
-			// #endif		
-			// #ifdef MP-ALIPAY
-			Vue.prototype.StatusBar = e.statusBarHeight;
-			Vue.prototype.CustomBar = e.statusBarHeight + e.titleBarHeight;
-			// #endif
-		}
-	})
-},
-```
-
-`pages.json` 配置取消系统导航栏
-```
-"globalStyle": {
-	"navigationStyle": "custom"
-},
-```
-复制代码结构可以直接使用，注意全局变量的获取。
-
-使用封装,在`main.js` 引入 `cu-custom` 组件。
-```
-import cuCustom from './colorui/components/cu-custom.vue'
-Vue.component('cu-custom',cuCustom)
-```
-
-`page.vue` 页面可以直接调用了
-```
-<cu-custom bgColor="bg-gradual-blue" :isBack="true">
-	<block slot="backText">返回</block>
-	<block slot="content">导航栏</block>
-</cu-custom>
-```
-| 参数       | 作用   |类型    |  默认值 |
-| --------   | -----:  |-----:  | :----:  |
-| bgColor    | 背景颜色类名 |String  |   ''    |
-| isBack     | 是否开启返回 | Boolean |   false |
-| bgImage    | 背景图片路径 | String  |  ''     |
-
-| slot块       | 作用   |
-| --------   | -----:  |
-| backText    | 返回时的文字 | 
-| content     | 中间区域 | 
-| right    | 右侧区域(小程序端可使用范围很窄！)  | 
-
-## 使用原生小程序开发
-### 从现有项目开始 
-下载源码解压获得`/demo`，复制目录下的 `/colorui` 文件夹到你的项目根目录
-
-`App.wxss` 引入关键Css `main.wxss` `icon.wxss`
-```
-@import "colorui/main.wxss";
-@import "colorui/icon.wxss";
-@import "app.css"; /* 你的项目css */
-	....
-```
-
-### 使用自定义导航栏
-导航栏作为常用组件有做简单封装，当然你也可以直接复制代码结构自己修改，达到个性化目的。
-
-`App.js` 获得系统信息
-```
- onLaunch: function() {
-    wx.getSystemInfo({
-      success: e => {
-        this.globalData.StatusBar = e.statusBarHeight;
-        let custom = wx.getMenuButtonBoundingClientRect();
-        this.globalData.Custom = custom;  
-        this.globalData.CustomBar = custom.bottom + custom.top - e.statusBarHeight;
-      }
-    })
-},
-```
-
-`App.json` 配置取消系统导航栏,并全局引入组件
-```
-"window": {
-	"navigationStyle": "custom"
-},
-"usingComponents": {
-    "cu-custom":"/colorui/components/cu-custom"
-}
-```
-
-`page.wxml` 页面可以直接调用了
-```
-<cu-custom bgColor="bg-gradual-pink" isBack="{{true}}">
-	<view slot="backText">返回</view>
-	<view slot="content">导航栏</view>
-</cu-custom>
-
-```
-| 参数       | 作用   |类型    |  默认值 |
-| --------   | -----:  |-----:  | :----:  |
-| bgColor    | 背景颜色类名 |String  |   ''    |
-| isBack     | 是否开启返回 | Boolean |   false |
-| isCustom   | 是否开启左侧胶囊 | Boolean |   false |
-| bgImage    | 背景图片路径 | String  |  ''     |
-
-| slot块       | 作用   |
-| --------   | -----:  |
-| backText    | 返回时的文字 | 
-| content     | 中间区域 | 
-| right    | 右侧区域(小程序端可使用范围很窄！)  | 
-
-### 从新项目开始
-下载源码解压获得`/template`，复制`/template`并重命名为你的项目，导入到小程序开发工具既可以开始你的新项目了
-
-## 赞赏
-<p align="center"><img src="https://image.weilanwl.com/colorui/githubAppreciate.jpg" alt="" style="max-width:100%;" width="600"></p>
-
-
-
--- a/Colorui-UniApp/Readme.md
+++ b/Colorui-UniApp/Readme.md
@@ -103,6 +103,14 @@ Vue.component('cu-custom',cuCustom)

 ## 更新日志

+ * 2019年4月25日 v2.1.5
+    *  优化图片上传
+    *  优化一些点击区域过小
+    *  优化图标旋转
+    *  优化demo显示
+    *  优化阴影
+    *  修复支付宝小程序编译出错
+
 * 2019年4月14日 v2.1.4
    *  新增多种阴影
 	*  修复一些var属性的错误
--- a/Colorui-UniApp/colorui/icon.css
+++ b/Colorui-UniApp/colorui/icon.css
@@ -1,4 +1,4 @@
-@keyframes icon-spin {
+@keyframes cuIcon-spin {
 	0% {
 		-webkit-transform: rotate(0);
 		transform: rotate(0);
@@ -11,14 +11,14 @@
 }

 .iconfont-spin {
-	-webkit-animation: icon-spin 2s infinite linear;
-	animation: icon-spin 2s infinite linear;
+	-webkit-animation: cuIcon-spin 2s infinite linear;
+	animation: cuIcon-spin 2s infinite linear;
 	display: inline-block;
 }

 .iconfont-pulse {
-	-webkit-animation: icon-spin 1s infinite steps(8);
-	animation: icon-spin 1s infinite steps(8);
+	-webkit-animation: cuIcon-spin 1s infinite steps(8);
+	animation: cuIcon-spin 1s infinite steps(8);
 	display: inline-block;
 }

--- a/Colorui-UniApp/colorui/main.css
+++ b/Colorui-UniApp/colorui/main.css
@@ -1,7 +1,8 @@
 /*
-  ColorUi for uniApp  v2.1.4 | by 文晓港 2019年04月14日04:16:13
+  ColorUi for uniApp  v2.1.5 | by 文晓港 2019年4月25日18:57:19
  仅供学习交流，如作它用所承受的法律责任一概与作者无关  
-  使用ColorUi开发扩展与插件时，请注明基于ColorUi开发
+  
+  *使用ColorUi开发扩展与插件时，请注明基于ColorUi开发 
  
  （QQ交流群：240787041）
 */
@@ -602,7 +603,7 @@ switch.gray.checked .uni-switch-input,
 checkbox.gray.checked .uni-checkbox-input,
 radio.gray.checked .uni-radio-input {
 	background-color: #f0f0f0 !important;
-	color: var(--) !important;
+	color: var(--black) !important;
 }

 switch.black[checked] .wx-switch-input,
@@ -622,7 +623,7 @@ switch.white.checked .uni-switch-input,
 checkbox.white.checked .uni-checkbox-input,
 radio.white.checked .uni-radio-input {
 	background-color: var(--white) !important;
-	color: var(--) !important;
+	color: var(--black) !important;
 }

 /* ==================
@@ -741,7 +742,7 @@ radio.white.checked .uni-radio-input {

 /* -- 阴影 -- */

-.shadow {
+.shadow[class*='white'] {
 	--ShadowSize: 0 1upx 6upx;
 }

@@ -1152,7 +1153,7 @@ button.icon.lg {
 	align-items: center;
 	display: flex;
 	font-size: 20upx;
-	color: var(--);
+	color: var(--black);
 	text-indent: 10upx;
 }

@@ -1805,7 +1806,7 @@ button.icon.lg {
 	line-height: 64upx;
 	height: 64upx;
 	font-size: 24upx;
-	color: var(--);
+	color: var(--black);
 	flex: 1;
 	display: flex;
 	align-items: center;
@@ -2216,7 +2217,7 @@ button.icon.lg {

 .cu-timeline>.cu-item>.content:not([class*="bg-"]) {
 	background-color: var(--ghostWhite);
-	color: var(--);
+	color: var(--black);
 }

 .cu-timeline>.cu-item>.content+.content {
@@ -2269,7 +2270,7 @@ button.icon.lg {

 .cu-chat .cu-item>.main .content:not([class*="bg-"]) {
 	background-color: var(--white);
-	color: var(--);
+	color: var(--black);
 }

 .cu-chat .cu-item .date {
@@ -2675,7 +2676,11 @@ button.icon.lg {
 .cu-modal.drawer-modal.show .cu-dialog {
 	transform: translateX(0%);
 }
-
+.cu-modal .cu-dialog>.cu-bar:first-child .action{
+  min-width: 100rpx;
+  margin-right: 0;
+  min-height: 100rpx;
+}
 /* ==================
         轮播
 ==================== */
@@ -3105,7 +3110,11 @@ scroll-view.cu-steps .cu-item {
 	position: relative;
 	overflow: hidden;
 }
-
+.grid.grid-square>view.bg-img image {
+	width: 100%;
+	height: 100%;
+	position: absolute;
+}
 .grid.col-1.grid-square>view {
 	padding-bottom: 100%;
 	height: 0;
@@ -3118,36 +3127,31 @@ scroll-view.cu-steps .cu-item {
 	width: calc((100% - 20upx)/2);
 }

-.grid.col-2.grid-square>view:nth-child(2n) {
-	margin-right: 0;
-}
-
 .grid.col-3.grid-square>view {
 	padding-bottom: calc((100% - 40upx)/3);
 	height: 0;
 	width: calc((100% - 40upx)/3);
 }

-.grid.col-3.grid-square>view:nth-child(3n) {
-	margin-right: 0;
-}
-
 .grid.col-4.grid-square>view {
 	padding-bottom: calc((100% - 60upx)/4);
 	height: 0;
 	width: calc((100% - 60upx)/4);
 }

-.grid.col-4.grid-square>view:nth-child(4n) {
-	margin-right: 0;
-}
-
 .grid.col-5.grid-square>view {
 	padding-bottom: calc((100% - 80upx)/5);
 	height: 0;
 	width: calc((100% - 80upx)/5);
 }

+.grid.col-2.grid-square>view:nth-child(2n),
+.grid.col-3.grid-square>view:nth-child(3n),
+.grid.col-4.grid-square>view:nth-child(4n),
+.grid.col-5.grid-square>view:nth-child(5n) {
+	margin-right: 0;
+}
+
 .grid.col-1>view {
 	width: 100%;
 }
@@ -3639,7 +3643,7 @@ scroll-view.cu-steps .cu-item {

 .bg-gray {
 	background-color: #f0f0f0;
-	color: var(--);
+	color: var(--black);
 }

 .bg-black {
--- a/Colorui-UniApp/pages.json
+++ b/Colorui-UniApp/pages.json
@@ -13,12 +13,6 @@
 				"navigationBarTitleText": ""
 			}
 		},
-		{
-			"path": "pages/basics/home",
-			"style": {
-				"navigationBarTitleText": ""
-			}
-		},
 		{
 			"path": "pages/basics/background",
 			"style": {
--- a/Colorui-UniApp/pages/basics/button.vue
+++ b/Colorui-UniApp/pages/basics/button.vue
@@ -61,7 +61,7 @@
 			</view>
 		</view>
 		<view class="grid col-5 padding-sm">
-			<view class="margin-tb-sm text-center" v-for="(item,index) in ColorList" :key="index">
+			<view class="margin-tb-sm text-center" v-for="(item,index) in ColorList" :key="index" v-if="item.name!='white'">
 				<button class="cu-btn round" :class="[bordersize?'lines-' + item.name:'line-' + item.name, shadow?'shadow':'']">{{item.title}}</button>
 			</view>
 		</view>
--- a/Colorui-UniApp/pages/basics/design.vue
+++ b/Colorui-UniApp/pages/basics/design.vue
@@ -6,13 +6,12 @@
 				<button class="cu-btn" :class="[border?bordersize?'lines-' + color:'line-' + color:'bg-'+ color,round?'round':'',size,shadow?'shadow':'']">我是一个按钮</button>
 			</view>
 			<view class="padding text-center">
-				class="cu-btn <text v-if="color">{{' '}} {{border?bordersize?'lines-' + color:'line-' + color:'bg-'+ color}}
-					{{round?'round':''}} {{size}} {{shadow?'shadow':''}}</text>"
+				class="cu-btn <text v-if="color">{{' '}} {{border?bordersize?'lines-' + color:'line-' + color:'bg-'+ color}} {{round?'round':''}} {{size}} {{shadow?'shadow':''}}</text>"
 			</view>
 		</view>
 		<view class="cu-form-group margin-top" @tap="showModal" data-target="ColorModal">
 			<view class="title">选择颜色</view>
-			<view class="padding-sm solid radius shadow-blur" :class="'bg-'+color"></view>
+			<view class="padding solid radius shadow-blur" :class="'bg-'+color"></view>
 		</view>
 		<view class="cu-form-group">
 			<view class="title">是否圆角</view>
@@ -65,7 +64,7 @@
 					</view>
 				</view>
 				<view class="grid col-5 padding">
-					<view class="padding-xs" v-for="(item,index) in ColorList" :key="index" @tap="SetColor" :data-color="item.name">
+					<view class="padding-xs" v-for="(item,index) in ColorList" :key="index" @tap="SetColor" :data-color="item.name" v-if="item.name!='white'">
 						<view class="padding-tb radius" :class="'bg-' + item.name"> {{item.title}} </view>
 					</view>
 				</view>
@@ -82,7 +81,7 @@
 				modalName: '',
 				round: false,
 				size: '',
-				color: '',
+				color: 'red',
 				shadow: false,
 				border: false,
 				bordersize: ''
--- a/Colorui-UniApp/pages/basics/home.vue
+++ b/Colorui-UniApp/pages/basics/home.vue
@@ -18,6 +18,7 @@

 <script>
 	export default {
+		name: "basics",
 		data() {
 			return {
 				elements: [{
--- a/Colorui-UniApp/pages/basics/progress.vue
+++ b/Colorui-UniApp/pages/basics/progress.vue
@@ -39,7 +39,7 @@
 				<text class="cuIcon-title text-blue"></text>进度条颜色
 			</view>
 			<view class="action">
-				<view class="padding-sm solid radius shadow-blur" :class="'bg-' + color"></view>
+				<view class="padding solid radius shadow-blur" :class="'bg-' + color"></view>
 			</view>
 		</view>
 		<view class="padding" :class="color=='white'?'bg-grey':'bg-white'">
@@ -104,8 +104,7 @@
 					</view>
 				</view>
 				<view class="grid col-5 padding">
-					<view class="padding-xs" v-for="(item,index) in ColorList" :key="index" @tap="SetColor" :data-color="item.name"
-					 v-if="item.name!='gray'">
+					<view class="padding-xs" v-for="(item,index) in ColorList" :key="index" @tap="SetColor" :data-color="item.name" v-if="item.name!='gray' && item.name!='white'">
 						<view class="padding-tb radius" :class="'bg-' + item.name"> {{item.title}} </view>
 					</view>
 				</view>
--- a/Colorui-UniApp/pages/basics/tag.vue
+++ b/Colorui-UniApp/pages/basics/tag.vue
@@ -27,10 +27,10 @@
 			</view>
 		</view>
 		<view class='padding-sm flex flex-wrap'>
-			<view class="padding-xs" v-for="(item,index) in ColorList" :key="index">
+			<view class="padding-xs" v-for="(item,index) in ColorList" :key="index" v-if="item.name!='gray'">
 				<view class='cu-tag' :class="'bg-' + item.name">{{item.title}}</view>
 			</view>
-			<view class="padding-xs" v-for="(item,index) in ColorList" :key="index" v-if="index<12">
+			<view class="padding-xs" v-for="(item,index) in ColorList" :key="index" v-if="item.name!='gray' && item.name!='black' && item.name!='white'">
 				<view class='cu-tag light' :class="'bg-' + item.name">{{item.title}}</view>
 			</view>
 		</view>
@@ -40,7 +40,7 @@
 			</view>
 		</view>
 		<view class='padding-sm flex flex-wrap'>
-			<view class="padding-xs" v-for="(item,index) in ColorList" :key="index">
+			<view class="padding-xs" v-for="(item,index) in ColorList" :key="index" v-if="item.name!='white'">
 				<view class='cu-tag' :class="'line-' + item.name">{{item.title}}</view>
 			</view>
 		</view>
--- a/Colorui-UniApp/pages/component/form.vue
+++ b/Colorui-UniApp/pages/component/form.vue
@@ -153,13 +153,13 @@
 			</view>
 			<view class="cu-form-group">
 				<view class="grid col-4 grid-square flex-sub">
-					<view class="padding-xs bg-img" :style="[{backgroundImage:'url(' + imgList[index] +')'}]" v-for="(item,index) in imgList"
-					 :key="index" @tap="ViewImage" :data-url="imgList[index]">
+					<view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
+					 <image :src="imgList[index]" mode="aspectFill"></image>
 						<view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="index">
 							<text class='cuIcon-close'></text>
 						</view>
 					</view>
-					<view class="padding-xs solids" @tap="ChooseImage" v-if="imgList.length<4">
+					<view class="solids" @tap="ChooseImage" v-if="imgList.length<4">
 						<text class='cuIcon-cameraadd'></text>
 					</view>
 				</view>
--- a/Colorui-UniApp/pages/plugin/home.vue
+++ b/Colorui-UniApp/pages/plugin/home.vue
@@ -1,4 +1,4 @@
-<template>
+<template name="components">
 	<view>
 		<scroll-view scroll-y class="page">
 			<cu-custom bgImage="https://image.weilanwl.com/color2.0/plugin/cjkz2329.jpg">
@@ -21,6 +21,7 @@

 <script>
 	export default {
+		name: "components",
 		data() {
 			return {
 				StatusBar: this.StatusBar,
--- a/demo/colorui/icon.wxss
+++ b/demo/colorui/icon.wxss
@@ -1,4 +1,4 @@
-@keyframes icon-spin {
+@keyframes cuIcon-spin {
 	0% {
 		-webkit-transform: rotate(0);
 		transform: rotate(0);
@@ -11,14 +11,14 @@
 }

 .iconfont-spin {
-	-webkit-animation: icon-spin 2s infinite linear;
-	animation: icon-spin 2s infinite linear;
+	-webkit-animation: cuIcon-spin 2s infinite linear;
+	animation: cuIcon-spin 2s infinite linear;
 	display: inline-block;
 }

 .iconfont-pulse {
-	-webkit-animation: icon-spin 1s infinite steps(8);
-	animation: icon-spin 1s infinite steps(8);
+	-webkit-animation: cuIcon-spin 1s infinite steps(8);
+	animation: cuIcon-spin 1s infinite steps(8);
 	display: inline-block;
 }

--- a/demo/colorui/main.wxss
+++ b/demo/colorui/main.wxss
@@ -1,10 +1,9 @@
 /*
-  ColorUi for MP-weixin  v2.1.3 | by 文晓港 2019年4月23日12:51:48
+  ColorUi for MP-weixin  v2.1.4 | by 文晓港 2019年4月25日19:15:42
  仅供学习交流，如作它用所承受的法律责任一概与作者无关
  使用ColorUi开发扩展与插件时，请注明基于ColorUi开发
  
  （QQ交流群：240787041）
-  文档：http://www.color-ui.com/
 */

 /* ==================
@@ -130,8 +129,8 @@ image.loading::after {
 	font-size: 32rpx;
 	margin: auto;
 	color: #ccc;
-	-webkit-animation: icon-spin 2s infinite linear;
-	animation: icon-spin 2s infinite linear;
+	-webkit-animation: cuIcon-spin 2s infinite linear;
+	animation: cuIcon-spin 2s infinite linear;
 	display: block;
 }

@@ -190,6 +189,7 @@ switch.checked::before {
 switch[checked]::before {
 	transform: scale(0, 0);
 }
+
 radio::before,
 checkbox::before {
 	font-family: "cuIcon";
@@ -208,15 +208,16 @@ checkbox::before {
 }

 radio .wx-radio-input,
-checkbox .wx-checkbox-input{
+checkbox .wx-checkbox-input {
 	margin: 0;
 	width: 24px;
 	height: 24px;
 }

-checkbox.round .wx-checkbox-input{
+checkbox.round .wx-checkbox-input {
 	border-radius: 100rpx;
 }
+
 switch .wx-switch-input {
 	border: none;
 	padding: 0 24px;
@@ -226,7 +227,7 @@ switch .wx-switch-input {
 	border-radius: 100rpx;
 }

-switch .wx-switch-input:not([class*="bg-"]){
+switch .wx-switch-input:not([class*="bg-"]) {
 	background: var(--grey) !important;
 }

@@ -266,7 +267,7 @@ switch .wx-switch-input::before,
 radio.radio::before,
 checkbox .wx-checkbox-input::before,
 radio .wx-radio-input::before,
-radio.radio::before{
+radio.radio::before {
 	display: none;
 }

@@ -295,12 +296,12 @@ radio.radio[checked]::after {
 	content: "\e71a";
 }

-.switch-sex .wx-switch-input{
+.switch-sex .wx-switch-input {
 	background: var(--red) !important;
 	border-color: var(--red) !important;
 }

-.switch-sex[checked] .wx-switch-input{
+.switch-sex[checked] .wx-switch-input {
 	background: var(--blue) !important;
 	border-color: var(--blue) !important;
 }
@@ -344,7 +345,7 @@ radio.cyan[checked] .wx-radio-input {

 switch.blue[checked] .wx-switch-input,
 checkbox.blue[checked] .wx-checkbox-input,
-radio.blue[checked] .wx-radio-input{
+radio.blue[checked] .wx-radio-input {
 	border-color: var(--blue) !important;
 }

@@ -368,7 +369,7 @@ radio.pink[checked] .wx-radio-input {

 switch.brown[checked] .wx-switch-input,
 checkbox.brown[checked] .wx-checkbox-input,
-radio.brown[checked] .wx-radio-input{
+radio.brown[checked] .wx-radio-input {
 	border-color: var(--brown) !important;
 }

@@ -620,7 +621,7 @@ radio.white[checked] .wx-radio-input {

 /* -- 阴影 -- */

-.shadow {
+.shadow[class*='white'] {
 	--ShadowSize: 0 1rpx 6rpx;
 }

@@ -1076,7 +1077,7 @@ button.icon.lg {

 .cu-load.loading::before {
 	content: "\e67a";
-	animation: icon-spin 2s infinite linear;
+	animation: cuIcon-spin 2s infinite linear;
 }

 .cu-load.loading::after {
@@ -1153,7 +1154,7 @@ button.icon.lg {
 	border-right: 6rpx solid rgba(0, 0, 0, 0.05);
 	border-bottom: 6rpx solid rgba(0, 0, 0, 0.05);
 	border-left: 6rpx solid var(--orange);
-	animation: icon-spin 1s infinite linear;
+	animation: cuIcon-spin 1s infinite linear;
 	z-index: -1;
 }

@@ -1766,7 +1767,7 @@ button.icon.lg {
 	position: relative;
 	z-index: 2;
 	padding-top: 50rpx;
-	background-color:inherit;
+	background-color: inherit;
 }

 .cu-bar.tabbar .action.add-action [class*="cuIcon-"] {
@@ -2536,7 +2537,11 @@ button.icon.lg {
 .cu-modal.drawer-modal.show .cu-dialog {
 	transform: translateX(0%);
 }
-
+.cu-modal .cu-dialog>.cu-bar:first-child .action{
+  min-width: 100rpx;
+  margin-right: 0;
+  min-height: 100rpx;
+}
 /* ==================
         轮播
 ==================== */
@@ -2565,12 +2570,12 @@ swiper.square-dot .wx-swiper-dot {
 	margin: 0 8rpx !important;
 }

-swiper.square-dot .wx-swiper-dot.wx-swiper-dot-active{
+swiper.square-dot .wx-swiper-dot.wx-swiper-dot-active {
 	opacity: 1;
 	width: 30rpx;
 }

-swiper.round-dot .wx-swiper-dot{
+swiper.round-dot .wx-swiper-dot {
 	width: 10rpx;
 	height: 10rpx;
 	position: relative;
@@ -2591,7 +2596,7 @@ swiper.round-dot .wx-swiper-dot.wx-swiper-dot-active::after {
 	border-radius: 20rpx;
 }

-swiper.round-dot .wx-swiper-dot.wx-swiper-dot-active{
+swiper.round-dot .wx-swiper-dot.wx-swiper-dot-active {
 	width: 18rpx;
 	height: 18rpx;
 }
@@ -2954,6 +2959,7 @@ scroll-view.cu-steps .cu-item {
 	position: relative;
 	overflow: hidden;
 }
+
 .grid.grid-square>view.bg-img image {
 	width: 100%;
 	height: 100%;
@@ -2972,36 +2978,31 @@ scroll-view.cu-steps .cu-item {
 	width: calc((100% - 20rpx)/2);
 }

-.grid.col-2.grid-square>view:nth-child(2n) {
-	margin-right: 0;
-}
-
 .grid.col-3.grid-square>view {
 	padding-bottom: calc((100% - 40rpx)/3);
 	height: 0;
 	width: calc((100% - 40rpx)/3);
 }

-.grid.col-3.grid-square>view:nth-child(3n) {
-	margin-right: 0;
-}
-
 .grid.col-4.grid-square>view {
 	padding-bottom: calc((100% - 60rpx)/4);
 	height: 0;
 	width: calc((100% - 60rpx)/4);
 }

-.grid.col-4.grid-square>view:nth-child(4n) {
-	margin-right: 0;
-}
-
 .grid.col-5.grid-square>view {
 	padding-bottom: calc((100% - 80rpx)/5);
 	height: 0;
 	width: calc((100% - 80rpx)/5);
 }

+.grid.col-2.grid-square>view:nth-child(2n),
+.grid.col-3.grid-square>view:nth-child(3n),
+.grid.col-4.grid-square>view:nth-child(4n),
+.grid.col-5.grid-square>view:nth-child(5n){
+	margin-right: 0;
+}
+
 .grid.col-1>view {
 	width: 100%;
 }
--- a/demo/pages/about/log/log.wxml
+++ b/demo/pages/about/log/log.wxml
@@ -1,7 +1,21 @@
 <cu-custom bgColor="bg-gradual-green" isBack="{{true}}"><view slot="backText">返回</view><view slot="content">日志</view></cu-custom>
 <view class="cu-timeline">
  <view class="cu-item text-green">
-    <view class="bg-gradual-green content shadow-blur">
+    <view class="bg-gradual-green content shadow">
+      <view class="cu-capsule radius">
+        <view class="cu-tag bg-white text-green">v2.1.4</view>
+        <view class="cu-tag line-white">2019/04/25</view>
+      </view>
+      <view class="margin-top-sm text-content">
+        <view>1.优化一些点击区域过小</view>
+        <view>2.优化图标旋转</view>
+        <view>3.优化demo显示</view>
+        <view>4.优化阴影</view>
+      </view>
+    </view>   
+  </view>
+  <view class="cu-item text-green">
+    <view class="bg-green content shadow">
      <view class="cu-capsule radius">
        <view class="cu-tag bg-white text-green">v2.1.3</view>
        <view class="cu-tag line-white">2019/04/23</view>
@@ -16,7 +30,7 @@
    </view>
  </view>
  <view class="cu-item text-green">
-    <view class="bg-green content shadow-blur">
+    <view class="bg-green content shadow">
      <view class="cu-capsule radius">
        <view class="cu-tag bg-white text-green">v2.1.2</view>
        <view class="cu-tag line-white">2019/03/28</view>
@@ -39,7 +53,7 @@
    </view>
  </view>
  <view class="cu-item text-green">
-    <view class="bg-green content shadow-blur">
+    <view class="bg-green content shadow">
      <view class="cu-capsule radius">
        <view class="cu-tag bg-white text-green">v2.0.7</view>
        <view class="cu-tag line-white">2019/02/25</view>
@@ -53,7 +67,7 @@
    </view>
  </view>
  <view class="cu-item text-green">
-    <view class="bg-green content shadow-blur">
+    <view class="bg-green content shadow">
      <view class="cu-capsule radius">
        <view class="cu-tag bg-white text-green">v2.0.6</view>
        <view class="cu-tag line-white">2019/02/09</view>
@@ -68,7 +82,7 @@
    </view>
  </view>
  <view class="cu-item text-green">
-    <view class="bg-green content shadow-blur">
+    <view class="bg-green content shadow">
      <view class="cu-capsule radius">
        <view class="cu-tag bg-white text-green">v2.0.5</view>
        <view class="cu-tag line-white">2019/01/13</view>
@@ -85,7 +99,7 @@
    </view>
  </view>
  <view class="cu-item text-green">
-    <view class="bg-green content shadow-blur">
+    <view class="bg-green content shadow">
      <view class="cu-capsule radius">
        <view class="cu-tag bg-white text-green">v2.0.4</view>
        <view class="cu-tag line-white">2019/01/10</view>
@@ -100,7 +114,7 @@
    </view>
  </view>
  <view class="cu-item text-green">
-    <view class="bg-green content shadow-blur">
+    <view class="bg-green content shadow">
      <view class="cu-capsule radius">
        <view class="cu-tag bg-white text-green">v2.0.3</view>
        <view class="cu-tag line-white">2019/01/06</view>
@@ -116,7 +130,7 @@
    </view>
  </view>
  <view class="cu-item text-green">
-    <view class="bg-green content shadow-blur">
+    <view class="bg-green content shadow">
      <view class="cu-capsule radius">
        <view class="cu-tag bg-white text-green">v2.0.2</view>
        <view class="cu-tag line-white">2018/12/24</view>
@@ -134,7 +148,7 @@
    </view>
  </view>
  <view class="cu-item text-green">
-    <view class="bg-green content shadow-blur">
+    <view class="bg-green content shadow">
      <view class="cu-capsule radius">
        <view class="cu-tag bg-white text-green">v2.0.1</view>
        <view class="cu-tag line-white">2018/12/20</view>
--- a/demo/pages/basics/tag/tag.wxml
+++ b/demo/pages/basics/tag/tag.wxml
@@ -24,10 +24,10 @@
  </view>
 </view>
 <view class="padding-sm flex flex-wrap">
-  <view class="padding-xs" wx:for="{{ColorList}}" wx:key>
+  <view class="padding-xs" wx:for="{{ColorList}}" wx:key  wx:if="{{item.name!='gray'}}">
    <view class="cu-tag bg-{{item.name}}">{{item.title}}</view>
  </view>
-  <view class="padding-xs" wx:for="{{ColorList}}" wx:key wx:if="{{index<12}}">
+  <view class="padding-xs" wx:for="{{ColorList}}" wx:key  wx:if="{{item.name!='gray' && item.name!='black' && item.name!='white'}}">
    <view class="cu-tag bg-{{item.name}} light">{{item.title}}</view>
  </view>
 </view>
@@ -37,7 +37,7 @@
  </view>
 </view>
 <view class="padding-sm flex flex-wrap">
-  <view class="padding-xs" wx:for="{{ColorList}}" wx:key>
+  <view class="padding-xs" wx:for="{{ColorList}}" wx:key  wx:if="{{item.name!='white'}}">
    <view class="cu-tag line-{{item.name}}">{{item.title}}</view>
  </view>
 </view>
--- a/demo/pages/index/index.js
+++ b/demo/pages/index/index.js
@@ -2,14 +2,6 @@ Page({
  data: {
    PageCur: 'basics'
  },
-  onLoad() {
-    // 插屏广告
-
-    // let intersitialAd = wx.createInterstitialAd({
-    //   adUnitId: 'adunit-53f251ff1944e719'
-    // })
-    // intersitialAd.show().catch(err => console.log(err.errMsg)) 
-  },
  NavChange(e) {
    this.setData({
      PageCur: e.currentTarget.dataset.cur
--- a/demo/sitemap.json
+++ b/demo/sitemap.json
@@ -0,0 +1,7 @@
+{
+  "desc": "关于本文件的更多信息，请参考文档 https://developers.weixin.qq.com/miniprogram/dev/framework/sitemap.html",
+  "rules": [{
+  "action": "allow",
+  "page": "*"
+  }]
+}
--- a/template/app.json
+++ b/template/app.json
@@ -1,9 +1,9 @@
 {
-  "pages":[
+  "pages": [
    "pages/index/index"
  ],
-  "window":{
-    "backgroundTextStyle":"light",
+  "window": {
+    "backgroundTextStyle": "light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "ColorUI",
    "navigationStyle": "custom",
@@ -11,5 +11,6 @@
  },
  "usingComponents": {
    "cu-custom": "/colorui/components/cu-custom"
-  }
+  },
+  "sitemapLocation": "sitemap.json"
 }
--- a/template/colorui/icon.wxss
+++ b/template/colorui/icon.wxss
@@ -1,4 +1,4 @@
-@keyframes icon-spin {
+@keyframes cuIcon-spin {
 	0% {
 		-webkit-transform: rotate(0);
 		transform: rotate(0);
@@ -11,14 +11,14 @@
 }

 .iconfont-spin {
-	-webkit-animation: icon-spin 2s infinite linear;
-	animation: icon-spin 2s infinite linear;
+	-webkit-animation: cuIcon-spin 2s infinite linear;
+	animation: cuIcon-spin 2s infinite linear;
 	display: inline-block;
 }

 .iconfont-pulse {
-	-webkit-animation: icon-spin 1s infinite steps(8);
-	animation: icon-spin 1s infinite steps(8);
+	-webkit-animation: cuIcon-spin 1s infinite steps(8);
+	animation: cuIcon-spin 1s infinite steps(8);
 	display: inline-block;
 }

--- a/template/colorui/main.wxss
+++ b/template/colorui/main.wxss
@@ -1,10 +1,9 @@
 /*
-  ColorUi for MP-weixin  v2.1.3 | by 文晓港 2019年4月23日12:51:48
+  ColorUi for MP-weixin  v2.1.4 | by 文晓港 2019年4月25日19:15:42
  仅供学习交流，如作它用所承受的法律责任一概与作者无关
  使用ColorUi开发扩展与插件时，请注明基于ColorUi开发
  
  （QQ交流群：240787041）
-  文档：http://www.color-ui.com/
 */

 /* ==================
@@ -130,8 +129,8 @@ image.loading::after {
 	font-size: 32rpx;
 	margin: auto;
 	color: #ccc;
-	-webkit-animation: icon-spin 2s infinite linear;
-	animation: icon-spin 2s infinite linear;
+	-webkit-animation: cuIcon-spin 2s infinite linear;
+	animation: cuIcon-spin 2s infinite linear;
 	display: block;
 }

@@ -190,6 +189,7 @@ switch.checked::before {
 switch[checked]::before {
 	transform: scale(0, 0);
 }
+
 radio::before,
 checkbox::before {
 	font-family: "cuIcon";
@@ -208,15 +208,16 @@ checkbox::before {
 }

 radio .wx-radio-input,
-checkbox .wx-checkbox-input{
+checkbox .wx-checkbox-input {
 	margin: 0;
 	width: 24px;
 	height: 24px;
 }

-checkbox.round .wx-checkbox-input{
+checkbox.round .wx-checkbox-input {
 	border-radius: 100rpx;
 }
+
 switch .wx-switch-input {
 	border: none;
 	padding: 0 24px;
@@ -226,7 +227,7 @@ switch .wx-switch-input {
 	border-radius: 100rpx;
 }

-switch .wx-switch-input:not([class*="bg-"]){
+switch .wx-switch-input:not([class*="bg-"]) {
 	background: var(--grey) !important;
 }

@@ -266,7 +267,7 @@ switch .wx-switch-input::before,
 radio.radio::before,
 checkbox .wx-checkbox-input::before,
 radio .wx-radio-input::before,
-radio.radio::before{
+radio.radio::before {
 	display: none;
 }

@@ -295,12 +296,12 @@ radio.radio[checked]::after {
 	content: "\e71a";
 }

-.switch-sex .wx-switch-input{
+.switch-sex .wx-switch-input {
 	background: var(--red) !important;
 	border-color: var(--red) !important;
 }

-.switch-sex[checked] .wx-switch-input{
+.switch-sex[checked] .wx-switch-input {
 	background: var(--blue) !important;
 	border-color: var(--blue) !important;
 }
@@ -344,7 +345,7 @@ radio.cyan[checked] .wx-radio-input {

 switch.blue[checked] .wx-switch-input,
 checkbox.blue[checked] .wx-checkbox-input,
-radio.blue[checked] .wx-radio-input{
+radio.blue[checked] .wx-radio-input {
 	border-color: var(--blue) !important;
 }

@@ -368,7 +369,7 @@ radio.pink[checked] .wx-radio-input {

 switch.brown[checked] .wx-switch-input,
 checkbox.brown[checked] .wx-checkbox-input,
-radio.brown[checked] .wx-radio-input{
+radio.brown[checked] .wx-radio-input {
 	border-color: var(--brown) !important;
 }

@@ -620,7 +621,7 @@ radio.white[checked] .wx-radio-input {

 /* -- 阴影 -- */

-.shadow {
+.shadow[class*='white'] {
 	--ShadowSize: 0 1rpx 6rpx;
 }

@@ -1076,7 +1077,7 @@ button.icon.lg {

 .cu-load.loading::before {
 	content: "\e67a";
-	animation: icon-spin 2s infinite linear;
+	animation: cuIcon-spin 2s infinite linear;
 }

 .cu-load.loading::after {
@@ -1153,7 +1154,7 @@ button.icon.lg {
 	border-right: 6rpx solid rgba(0, 0, 0, 0.05);
 	border-bottom: 6rpx solid rgba(0, 0, 0, 0.05);
 	border-left: 6rpx solid var(--orange);
-	animation: icon-spin 1s infinite linear;
+	animation: cuIcon-spin 1s infinite linear;
 	z-index: -1;
 }

@@ -1766,7 +1767,7 @@ button.icon.lg {
 	position: relative;
 	z-index: 2;
 	padding-top: 50rpx;
-	background-color:inherit;
+	background-color: inherit;
 }

 .cu-bar.tabbar .action.add-action [class*="cuIcon-"] {
@@ -2536,7 +2537,11 @@ button.icon.lg {
 .cu-modal.drawer-modal.show .cu-dialog {
 	transform: translateX(0%);
 }
-
+.cu-modal .cu-dialog>.cu-bar:first-child .action{
+  min-width: 100rpx;
+  margin-right: 0;
+  min-height: 100rpx;
+}
 /* ==================
         轮播
 ==================== */
@@ -2565,12 +2570,12 @@ swiper.square-dot .wx-swiper-dot {
 	margin: 0 8rpx !important;
 }

-swiper.square-dot .wx-swiper-dot.wx-swiper-dot-active{
+swiper.square-dot .wx-swiper-dot.wx-swiper-dot-active {
 	opacity: 1;
 	width: 30rpx;
 }

-swiper.round-dot .wx-swiper-dot{
+swiper.round-dot .wx-swiper-dot {
 	width: 10rpx;
 	height: 10rpx;
 	position: relative;
@@ -2591,7 +2596,7 @@ swiper.round-dot .wx-swiper-dot.wx-swiper-dot-active::after {
 	border-radius: 20rpx;
 }

-swiper.round-dot .wx-swiper-dot.wx-swiper-dot-active{
+swiper.round-dot .wx-swiper-dot.wx-swiper-dot-active {
 	width: 18rpx;
 	height: 18rpx;
 }
@@ -2954,6 +2959,7 @@ scroll-view.cu-steps .cu-item {
 	position: relative;
 	overflow: hidden;
 }
+
 .grid.grid-square>view.bg-img image {
 	width: 100%;
 	height: 100%;
@@ -2972,36 +2978,31 @@ scroll-view.cu-steps .cu-item {
 	width: calc((100% - 20rpx)/2);
 }

-.grid.col-2.grid-square>view:nth-child(2n) {
-	margin-right: 0;
-}
-
 .grid.col-3.grid-square>view {
 	padding-bottom: calc((100% - 40rpx)/3);
 	height: 0;
 	width: calc((100% - 40rpx)/3);
 }

-.grid.col-3.grid-square>view:nth-child(3n) {
-	margin-right: 0;
-}
-
 .grid.col-4.grid-square>view {
 	padding-bottom: calc((100% - 60rpx)/4);
 	height: 0;
 	width: calc((100% - 60rpx)/4);
 }

-.grid.col-4.grid-square>view:nth-child(4n) {
-	margin-right: 0;
-}
-
 .grid.col-5.grid-square>view {
 	padding-bottom: calc((100% - 80rpx)/5);
 	height: 0;
 	width: calc((100% - 80rpx)/5);
 }

+.grid.col-2.grid-square>view:nth-child(2n),
+.grid.col-3.grid-square>view:nth-child(3n),
+.grid.col-4.grid-square>view:nth-child(4n),
+.grid.col-5.grid-square>view:nth-child(5n){
+	margin-right: 0;
+}
+
 .grid.col-1>view {
 	width: 100%;
 }
--- a/template/project.config.json
+++ b/template/project.config.json
@@ -19,6 +19,8 @@
 		"hidedInDevtools": []
 	},
 	"isGameTourist": false,
+	"simulatorType": "wechat",
+	"simulatorPluginLibVersion": {},
 	"condition": {
 		"search": {
 			"current": -1,
--- a/template/sitemap.json
+++ b/template/sitemap.json
@@ -0,0 +1,7 @@
+{
+  "desc": "关于本文件的更多信息，请参考文档 https://developers.weixin.qq.com/miniprogram/dev/framework/sitemap.html",
+  "rules": [{
+  "action": "allow",
+  "page": "*"
+  }]
+}