update demo

AlloyTeam · Feb 5, 2015 · 45ce10d · 45ce10d
1 parent ff4e6e2
commit 45ce10d
Show file tree

Hide file tree

Showing 44 changed files with 3,659 additions and 1,382 deletions.
diff --git a/Gruntfile.js b/Gruntfile.js
@@ -1,13 +1,17 @@
 var path = require('path');
 
 module.exports = function (grunt) {
+
+    require('load-grunt-tasks')(grunt);
+    require('time-grunt')(grunt);
+
     grunt.initConfig({
         // pkg: grunt.file.readJSON('package.json'),
 
         clean: ['dist/**/*', 'js/jmui.js'],
 
         stylus: {
-            compile: {
+            all: {
                 options: {
                     compress: false
                 },
@@ -64,6 +68,9 @@ module.exports = function (grunt) {
         },
 
         concat: {
+            options: {
+                separator: ';'
+            },
             // TODO 这里的 zepto 来自 coupon/js/lib/zepto 含业务代码，应抽离
             zepto: {
                 src: ['lib/zeptojs/zepto.js',
@@ -73,7 +80,7 @@ module.exports = function (grunt) {
                     'lib/zeptojs/extend/util.js',
                     'lib/zeptojs/data.js'
                     //'lib/zeptojs/animate.js',
-                    //'lib/zeptojs/extend/ajax.js',      // modify fix 跨域ajax bort触发error
+                    //'lib/zeptojs/extend/ajax.js',    // modify fix 跨域ajax bort触发error
                 ],
                 dest: 'lib/zeptojs/zepto.min.js'
             },
@@ -83,8 +90,8 @@ module.exports = function (grunt) {
                     'js/core/component.js',
                     'js/util/*.js',
                     'js/component/*.js',
-                    '!js/component/carousel.js',
-                    '!js/component/mult-selector.js'
+                    // TODO 以下组件未整理好
+                    '!js/component/carousel.js'
                 ],
                 dest: 'js/jmui.js'
             }
@@ -94,11 +101,11 @@ module.exports = function (grunt) {
             dist: {
                 files: [
                     {src: 'index.html', dest: 'dist/'},
-                    {src: 'demo/**', dest: 'dist/'},
-                    {src: 'img/**', dest: 'dist/'},
-                    {src: 'css/**', dest: 'dist/'},
-                    {src: 'js/**', dest: 'dist/'},
-                    {src: 'lib/**', dest: 'dist/'}
+                    {src: 'demo/**/*', dest: 'dist/'},
+                    {src: 'img/**/*', dest: 'dist/'},
+                    {src: 'css/**/*', dest: 'dist/'},
+                    {src: 'js/**/*', dest: 'dist/'},
+                    {src: 'lib/**/*', dest: 'dist/'}
                 ]
             }
         },
@@ -134,18 +141,8 @@ module.exports = function (grunt) {
         }
     });
 
-    grunt.loadNpmTasks('grunt-contrib-watch');
-    grunt.loadNpmTasks('grunt-contrib-clean');
-    grunt.loadNpmTasks('grunt-contrib-jshint');
-    grunt.loadNpmTasks('grunt-contrib-stylus');
-    grunt.loadNpmTasks('grunt-contrib-copy');
-    grunt.loadNpmTasks('grunt-contrib-uglify');
-    grunt.loadNpmTasks('grunt-contrib-cssmin');
-    grunt.loadNpmTasks('grunt-contrib-concat');
-    grunt.loadNpmTasks('grunt-jsdoc');
-    grunt.loadNpmTasks('grunt-newer');
 
-    grunt.registerTask('default', ['clean', 'stylus', 'concat:js', 'copy:dist', 'uglify', 'cssmin']);
-    grunt.registerTask('build', ['clean', 'stylus', 'concat:js', 'copy:dist', 'uglify', 'cssmin']);
-    grunt.registerTask('dev', ['build', 'watch']);
+    grunt.registerTask('default', ['dist']);
+    grunt.registerTask('dist', ['clean', 'stylus', 'concat', 'copy:dist', 'cssmin']);
+    grunt.registerTask('dev', ['dist', 'watch']);
 };
diff --git a/README.md b/README.md
@@ -36,11 +36,11 @@
     $ npm install 
 
     // 生成 JMUI/dist/ 文件夹
-    $ grunt build
+    $ grunt dist
 
 ## 构建
 
-    $ grunt build
+    $ grunt dist
 
 `grunt build` 后将生成 JMUI/dist/ 目录.
 

diff --git a/css/base-1px.css b/css/base-1px.css
@@ -21,17 +21,17 @@
   }
 }
 .jmu-border-1px.border-all:after {
-  border: 1px solid #808080;
+  border: 1px solid #dedfe0;
 }
 .jmu-border-1px.border-top:after {
-  border-top: 1px solid #808080;
+  border-top: 1px solid #dedfe0;
 }
 .jmu-border-1px.border-bottom:after {
-  border-bottom: 1px solid #808080;
+  border-bottom: 1px solid #dedfe0;
 }
 .jmu-border-1px.border-left:after {
-  border-left: 1px solid #808080;
+  border-left: 1px solid #dedfe0;
 }
 .jmu-border-1px.border-right:after {
-  border-right: 1px solid #808080;
+  border-right: 1px solid #dedfe0;
 }
diff --git a/css/button.css b/css/button.css
@@ -37,29 +37,29 @@
   left: 0;
   right: 0;
 }
-.jmu-btn-primary {
+.jmu-btn-blue {
   background-color: #18b4ed;
   border-color: #0baae4;
   background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.5, #1fbaf3), to(#18b4ed));
   color: #fff;
   background-clip: padding-box;
 }
-.jmu-btn-primary:not(.disabled):not(:disabled):active,
-.jmu-btn-primary.active {
+.jmu-btn-blue:not(.disabled):not(:disabled):active,
+.jmu-btn-blue.active {
   background: #1ca7da;
   border-color: #1ca7da;
   color: rgba(255,255,255,0.5);
   background-clip: padding-box;
 }
-.jmu-btn-danger {
+.jmu-btn-red {
   background-color: #f75549;
   background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.5, #fc6156), to(#f75549));
   color: #fff;
   border-color: #f43d30;
   background-clip: padding-box;
 }
-.jmu-btn-danger:not(.disabled):active,
-.jmu-btn-danger.active {
+.jmu-btn-red:not(.disabled):active,
+.jmu-btn-red.active {
   background: #e2574d;
   border-color: #e2574d;
   color: rgba(255,255,255,0.5);
@@ -81,9 +81,6 @@
   width: 100%;
   border-radius: 5px;
 }
-.jmu-btn-wrap {
-  padding: 20px 15px;
-}
 @media screen and (-webkit-min-device-pixel-ratio: 2) {
   .jmu-btn,
   .jmu-btn.disabled,
@@ -107,10 +104,10 @@
   .jmu-btn-lg:before {
     border-radius: 12px;
   }
-  .jmu-btn-primary:before {
+  .jmu-btn-blue:before {
     border: 1px solid #0baae4;
   }
-  .jmu-btn-danger:before {
+  .jmu-btn-red:before {
     border: 1px solid #f43d30;
   }
   .jmu-btn.disabled:before,

diff --git a/css/demo.css b/css/demo.css
@@ -39,32 +39,48 @@
   }
 }
 .jmu-border-1px.border-all:after {
-  border: 1px solid #808080;
+  border: 1px solid #dedfe0;
 }
 .jmu-border-1px.border-top:after {
-  border-top: 1px solid #808080;
+  border-top: 1px solid #dedfe0;
 }
 .jmu-border-1px.border-bottom:after {
-  border-bottom: 1px solid #808080;
+  border-bottom: 1px solid #dedfe0;
 }
 .jmu-border-1px.border-left:after {
-  border-left: 1px solid #808080;
+  border-left: 1px solid #dedfe0;
 }
 .jmu-border-1px.border-right:after {
-  border-right: 1px solid #808080;
+  border-right: 1px solid #dedfe0;
+}
+.jmu-horizental-center,
+.jmu-vertical-center {
+  display: -webkit-box;
+}
+.jmu-horizental-center {
+  -webkit-box-pack: center;
+}
+.jmu-vertical-center {
+  -webkit-box-align: center;
 }
 ::-webkit-scrollbar {
   width: 0;
 }
 .demo-border-1px,
 .jmu-header,
+#demo-page .jmu-list-item-link,
 #base-color .demo-block p,
 #base-clearfix .jmu-clear-fix,
 #base-clearfix .jmu-clear-fix div,
 #base-center .jmu-horizental-center,
+#base-center .jmu-horizental-center p,
 #base-nowrap .demo-block p,
+#tab .demo-item,
 #dot .demo-block > div,
-#form .jmu-form {
+#form .jmu-form,
+#list .demo-item,
+#progress .demo-item,
+#range .demo-item {
   border: 1px solid #eee;
 }
 .jmu-header {
@@ -79,14 +95,30 @@
 }
 .demo-padding,
 #demo-page a,
+#base-1px .demo-borders li,
+#base-clearfix .jmu-clear-fix div,
+#base-center .jmu-horizental-center p,
+#base-nowrap .demo-block p,
+#tab .demo-item,
 #dot .demo-block > div,
 #form .jmu-form {
   padding: 10px;
 }
 .demo-margin,
+.demo-show,
+#demo-page .jmu-list-item-link,
+#base-clearfix .jmu-clear-fix div,
 #base-nowrap .demo-block p,
-#dot .demo-block > div,
-#form .jmu-form {
+#button .jmu-btn,
+#button .jmu-btn-lg,
+#table .demo-item,
+#form .jmu-form,
+#list .demo-item,
+#loading .demo-show,
+#progress .demo-item,
+#progress .jmu-progress-img,
+#progress .jmu-progress-circle,
+#range .demo-item {
   margin: 10px auto;
 }
 h2 {
@@ -134,14 +166,12 @@ h2 {
   text-align: center;
   margin: 10px;
 }
-#base-clearfix .jmu-clear-fix {
-  height: 40px;
-  line-height: 40px;
-  padding: 10px 0;
-}
 #base-center .jmu-horizental-center {
   height: 100px;
 }
+#base-nowrap .demo-block p {
+  line-height: 2;
+}
 #corner-tag .jmu-corner-tag {
   display: inline-block;
 }
@@ -158,8 +188,11 @@ h2 {
 }
 #dot .demo-block > div {
   position: relative;
+  margin: 30px auto;
+  text-align: center;
   height: 40px;
   line-height: 40px;
+  background: #eee;
 }
 #grid .jmu-col {
   outline: 1px solid #eee;