基础样式优化;分页组件样式优化;增加4个图标字体;

css/basic-elem.scss

@@ -6,16 +6,7 @@
  * @version $Id$
  */
 
-$cg: #1abc9c #48c9b0 #16a085;
+@import "var.scss";
-$cb: #3498db #5dade2 #2c81ba;
-$cr: #e74c3c #ec7063 #c54133;
-$co: #f39c12 #f1c40f #e67e22;
-$cp: #e7e8eb #ecf0f1 #bdc3c7;
-$cgr: #34495e #5d6d7e #2c3e50;
-
-@mixin ts($c: all, $t: .1s, $m: ease-in-out){
-    transition:$c $t $m;
-}
 
 
 /*--------各种按钮---------*/
@@ -60,6 +51,8 @@ $cgr: #34495e #5d6d7e #2c3e50;
     &.icon-del::after {content:"\e6f0"}
     &.icon-add::after {content:"\e64c"}
     &.icon-send::after {content:"\e64b"}
+    &.icon-confirm::after {content:"\e60f"}
+    &.icon-share::after {content:"\e631"}
     &.icon-bad::after {content:"\e8ee"}
     &.icon-good::after {content:"\e62d"}
     &.icon-download::after {content:"\e611"}
@@ -79,18 +72,33 @@ $cgr: #34495e #5d6d7e #2c3e50;
 /*--------各种input---------*/
 
 
-.do-ui-input {display:inline-block;min-height:30px;padding:0 5px;border:1px solid nth($cp, 3);background:#fff;color:nth($cgr, 1);outline:none;@include ts;
+.do-ui-input {position:relative;min-height:30px;padding:0 5px;border:1px solid nth($cp, 3);background:#fff;color:nth($cgr, 1);outline:none;@include ts;
     
     &::-webkit-input-placeholder {color:nth($cp, 3);}
     
+    &.area {padding:5px;}
+
     &.radius-3 {border-radius:3px;}
     &.radius-5 {border-radius:5px;}
     
-    &:focus {border-color:nth($cg, 1);}
+    &:focus,&:hover {border-color:nth($cg, 1);color:nth($cg, 1);}
-    &.alert {border-color:nth($cr, 1);color:nth($cr, 1)}
+    &.alert {border-color:nth($cr, 1);color:nth($cr, 1);
+        input {color:nth($cr, 1);}
+    }
     &.disabled {border-color:transparent;background:nth($cp, 1);color:nth($cp, 3)}
     
-    &.area {padding:5px;}
+    &.with-style {display:inline-block;padding:0;
+
+        input {width:100%;height:100%;min-height:30px;padding:0 30px 0 5px;border: 0;background:transparent;}
+
+        &::after {position:absolute;right:0;top:0;width:35px;height:30px;line-height:30px;text-align:center;font-family:"ui font" !important;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
+
+        &.icon-user::after {content:"\e6f4"}
+        &.icon-pwd::after {content:"\e655"}
+        &.icon-mail::after {content:"\e66e"}
+        &.icon-date::after {content:"\e650"}
+        &.icon-phone::after {content:"\e651"}
+    }
 }
 
 
@@ -171,7 +179,7 @@ $cgr: #34495e #5d6d7e #2c3e50;
 }
 
 /* 引用文本 */
-.do-ui-quote {position:relative;min-height:60px;margin:10px 0;padding:15px 5px 5px 50px;border:1px solid #ddd;border-radius:10px;background:#f7f7f7;
+.do-ui-quote {display:block;position:relative;min-height:60px;margin:10px 0;padding:15px 5px 5px 50px;border:1px solid #ddd;border-radius:10px;background:#f7f7f7;
 
     &::before {position:absolute;left:8px;top:0;font:30px/1.5 "ui font";color:nth($cp, 3);content:"\e61b";}
 }
@@ -179,6 +187,7 @@ $cgr: #34495e #5d6d7e #2c3e50;
 /* 提醒文本 */
 .do-ui-warn,.do-ui-mark {display:inline-block;position:relative;min-height:50px;margin:10px 0;padding:8px 8px 8px 50px;border:1px solid nth($co, 1);border-radius:10px;background:#fffbed;color:nth($co, 3);
     
+    p {margin:0!important;}
     &::before {position:absolute;left:8px;top:0;font:30px/1.5 "ui font";color:nth($cr, 1);content:"\e6f6";}
 }
 .do-ui-mark {border-color:nth($cg, 2);color:nth($cg, 3);background:#edfbf8;

css/var.scss

@@ -0,0 +1,10 @@
+$cg: #1abc9c #48c9b0 #16a085;
+$cb: #3498db #5dade2 #2c81ba;
+$cr: #e74c3c #ec7063 #c54133;
+$co: #f39c12 #fbbb56 #e67e22;
+$cp: #e7e8eb #ecf0f1 #bdc3c7;
+$cgr: #34495e #5d6d7e #2c3e50;
+
+@mixin ts($c: all, $t: .1s, $m: ease-in-out){
+    transition:$c $t $m;
+}

js/lib/marked/main.js

@@ -852,7 +852,7 @@ Renderer.prototype.blockquote = function(quote) {
     return '<blockquote>\n' + quote + '</blockquote>\n';
 };
 Renderer.prototype.mark = function(mark, t) {
-    return '<mark class="' + (t ? 'do-ui-mark' : 'do-ui-warn') + '">\n' + mark + '</mark>\n';
+    return '<mark class="' + (t ? 'do-ui-warn' : 'do-ui-mark') + '">\n' + mark + '</mark>\n';
 };
 
 Renderer.prototype.task = function(task, t) {

js/lib/meditor/main.js

@@ -10,8 +10,8 @@
 var log = console.log;
 define([
     'yua',
-    'lib/prism/main',
+    'lib/prism/base',
-    'lib/marked',
+    'lib/marked/main',
     'css!./skin/main',
 ], function(yua){
 

js/lib/pages/main.css

@@ -1,60 +1 @@
-.do-pages {height:auto;text-align:center;font-size:13px;}
+.do-pages{height:auto;text-align:center;font-size:13px}.do-pages a{display:inline-block;width:auto;min-width:40px;height:40px;line-height:40px;color:#34495e;text-decoration:none;cursor:pointer}.do-pages a.curr,.do-pages a.disabled{cursor:default}.do-pages.skin-1{width:100%}.do-pages.skin-1 a.normal,.do-pages.skin-1 a.disabled,.do-pages.skin-1 a.curr{padding:0 10px;margin:0 3px}.do-pages.skin-1 a.curr{font-weight:bold;font-size:15px}.do-pages.skin-1 a.disabled{min-width:0;padding:0}.do-pages.skin-1 .input-box,.do-pages.skin-1 .input-box span,.do-pages.skin-1 .input-box input{display:inline-block}.do-pages.skin-1 .input-box input{width:25px;height:20px;padding:0 3px;background:#fff;border:1px solid #ddd}.do-pages.skin-1 .input-box a.normal{height:30px;line-height:30px}.do-pages.skin-2{float:right;width:auto}.do-pages.skin-2 a.normal,.do-pages.skin-2 a.disabled,.do-pages.skin-2 a.curr{float:left;margin:0;padding:0 5px;color:#fff}.do-pages.skin-2 a.disabled{display:none}.do-pages.skin-2 .input-box{display:none}.do-pages.plain a.normal{background:#e7e8eb}.do-pages.plain a.normal:hover{background:#ecf0f1}.do-pages.skin-2.plain a.curr,.do-pages.plain a.normal:active{background:#bdc3c7}.do-pages.grey a.normal{background:#34495e;color:#fff}.do-pages.grey a.normal:hover{background:#5d6d7e}.do-pages.skin-2.grey a.curr,.do-pages.grey a.normal:active{background:#2c3e50}.do-pages.red a.normal{background:#e74c3c;color:#fff}.do-pages.red a.normal:hover{background:#ec7063}.do-pages.skin-2.red a.curr,.do-pages.red a.normal:active{background:#c54133}.do-pages.orange a.normal{background:#f39c12;color:#fff}.do-pages.orange a.normal:hover{background:#fbbb56}.do-pages.skin-2.orange a.curr,.do-pages.orange a.normal:active{background:#e67e22}.do-pages.green a.normal{background:#1abc9c;color:#fff}.do-pages.green a.normal:hover{background:#48c9b0}.do-pages.skin-2.green a.curr,.do-pages.green a.normal:active{background:#16a085}.do-pages.blue a.normal{background:#3498db;color:#fff}.do-pages.blue a.normal:hover{background:#5dade2}.do-pages.skin-2.blue a.curr,.do-pages.blue a.normal:active{background:#2c81ba}
-.do-pages a {color:#34495e;}
-.do-pages.skin-1 {width:100%;}
-.do-pages.skin-2 {float:right;width:auto;}
-.do-pages.skin-1 a.normal,
-.do-pages.skin-1 a.disabled,
-.do-pages.skin-1 a.curr {display:inline-block;width:auto;min-width:40px;height:40px;padding:0 10px;margin:0 3px;line-height:40px;text-decoration:none;cursor:pointer;}
-.do-pages.skin-2 a.normal,
-.do-pages.skin-2 a.disabled,
-.do-pages.skin-2 a.curr {float:left;width:auto;min-width:40px;height:40px;margin:0;padding:0 5px;line-height:40px;}
-
-
-.do-pages.green a.normal {background: #1abc9c;color: #fff; }
-.do-pages.green a.normal:hover {background: #48c9b0; }
-.do-pages.green.skin-2 a.curr,
-.do-pages.green a.normal:active {background: #16a085;color: #fff;}
-
-.do-pages.blue a.normal {background: #3498db;color: #fff; }
-.do-pages.blue a.normal:hover {background: #5dade2; }
-.do-pages.blue.skin-2 a.curr,
-.do-pages.blue a.normal:active {background: #2c81ba;color: #fff;}
-
-.do-pages.red a.normal {background: #e74c3c;color: #fff; }
-.do-pages.red a.normal:hover {background: #ec7063; }
-.do-pages.red.skin-2 a.curr,
-.do-pages.red a.normal:active {background: #c54133;color: #fff;}
-
-.do-pages.orange a.normal {background: #f39c12;color: #fff; }
-.do-pages.orange a.normal:hover {background: #f1c40f; }
-.do-pages.orange.skin-2 a.curr,
-.do-pages.orange a.normal:active {background: #e67e22;color: #fff;}
-
-.do-pages.plain a.normal {background: #e7e8eb;color: #34495e; }
-.do-pages.plain a.normal:hover {background: #ecf0f1; }
-.do-pages.plain.skin-2 a.curr,
-.do-pages.plain a.normal:active {background: #bdc3c7;color: #34495e; }
-
-.do-pages.grey a.normal {background: #34495e;color: #fff; }
-
-.do-pages.grey a.normal:hover {background: #5d6d7e; }
-.do-pages.grey.skin-2 a.curr,
-.do-pages.grey a.normal:active {background: #2c3e50; color: #fff;}
-
-.do-pages.skin-1 a.disabled,
-.do-pages.skin-1 a.curr {background:none;color:#666;cursor:default}
-
-.do-pages.skin-1 a.disabled {min-width:0;padding:0;}
-.do-pages.skin-1 a.curr {font-weight:bold;font-size:15px;}
-
-.do-pages.skin-2 a.disabled {display:none;}
-
-
-.do-pages.skin-1 .input-box,
-.do-pages.skin-1 .input-box span,
-.do-pages.skin-1 .input-box input {display:inline-block}
-.do-pages.skin-1 .input-box input {width:25px;height:20px;padding:0 3px;background:#fff;border:1px solid #ddd}
-.do-pages.skin-1 .input-box a.normal{height:30px;line-height:30px;}
-
-.do-pages.skin-2 .input-box {display:none;}
-

js/lib/pages/main.js

@@ -1,7 +1,7 @@
 "use strict";
 define(["yua","text!./main.htm", "css!./main"], function(yua, tpl) {
 
-    yua.ui.pages = '0.0.1'
+    yua.ui.pages = '1.0.0'
     var colors = {plain: 1, green: 1, blue: 1, red: 1, orange: 1, grey: 1},
         themes = ['skin-1 ', 'skin-2 '];
     //计算页码列表

js/lib/pages/main.scss

@@ -0,0 +1,77 @@
+@charset "UTF-8";
+/**
+ * 
+ * @authors yutent (yutent@doui.cc)
+ * @date    2017-09-08 20:03:06
+ * @version $Id$
+ */
+
+@import "../../../css/var.scss";
+
+
+.do-pages {height:auto;text-align:center;font-size:13px;
+    
+    a {display:inline-block;width:auto;min-width:40px;height:40px;line-height:40px;color: nth($cgr, 1);text-decoration:none;cursor:pointer;}
+    a.curr, a.disabled {cursor:default;}
+    
+    &.skin-1 {width:100%;
+
+        a.normal,
+        a.disabled,
+        a.curr {padding:0 10px;margin:0 3px;}
+        
+        a.curr {font-weight:bold;font-size:15px;}
+        a.disabled {min-width:0;padding:0}
+
+        .input-box,
+        .input-box span,
+        .input-box input {display:inline-block}
+        .input-box input {width:25px;height:20px;padding:0 3px;background:#fff;border:1px solid #ddd}
+        .input-box a.normal{height:30px;line-height:30px;}
+    }
+
+
+    &.skin-2 {float:right;width:auto;
+        
+        a.normal,
+        a.disabled,
+        a.curr {float:left;margin:0;padding:0 5px;color:#fff;}
+
+        a.disabled {display:none;}
+        
+        .input-box {display:none;}
+    }
+
+    &.plain a.normal {background:nth($cp, 1)}
+    &.plain a.normal:hover {background:nth($cp, 2)}
+    &.skin-2.plain a.curr,
+    &.plain a.normal:active {background:nth($cp, 3)}
+
+    &.grey a.normal {background:nth($cgr, 1);color: #fff;}
+    &.grey a.normal:hover {background:nth($cgr, 2)}
+    &.skin-2.grey a.curr,
+    &.grey a.normal:active {background:nth($cgr, 3)}
+
+    &.red a.normal {background:nth($cr, 1);color: #fff;}
+    &.red a.normal:hover {background:nth($cr, 2)}
+    &.skin-2.red a.curr,
+    &.red a.normal:active {background:nth($cr, 3)}
+
+    &.orange a.normal {background:nth($co, 1);color: #fff;}
+    &.orange a.normal:hover {background:nth($co, 2)}
+    &.skin-2.orange a.curr,
+    &.orange a.normal:active {background:nth($co, 3)}
+
+    &.green a.normal {background:nth($cg, 1);color: #fff;}
+    &.green a.normal:hover {background:nth($cg, 2)}
+    &.skin-2.green a.curr,
+    &.green a.normal:active {background:nth($cg, 3)}
+
+    &.blue a.normal {background:nth($cb, 1);color: #fff;}
+    &.blue a.normal:hover {background:nth($cb, 2)}
+    &.skin-2.blue a.curr,
+    &.blue a.normal:active {background:nth($cb, 3)}
+
+}
+
+

js/lib/router/router.min.js

@@ -1 +0,0 @@
-define(["yua"],function(){function t(){this.table={get:[]},this.errorFn=null,this.history=null,this.hash="",this.started=!1,this.init={}}function e(t){return!t||t===window.name||"_self"===t||"top"===t&&window==window.top}var r={prefix:/^(#!|#)[\/]?/,historyOpen:!0,allowReload:!0},i=!0,a=/(:id)|(\{id\})|(\{id:([A-z\d\,\[\]\{\}\-\+\*\?\!:\^\$]*)\})/g;return t.prototype={error:function(t){this.errorFn=t},config:function(t){if(this.started)return console.error("Router config has been set");this.started=!0,t.allowReload||(t.historyOpen=!0),this.init=yua.mix({},r,t)},_getRegExp:function(t,e){var r=t.replace(a,function(t,e,r,i,a){var n="([\\w.-]";return e||r?n+"+)":(/^\{[\d\,]+\}$/.test(a)||(n="("),n+a+")")});return r=r.replace(/(([^\\])([\/]+))/g,"$2\\/").replace(/(([^\\])([\.]+))/g,"$2\\.").replace(/(([^\\])([\-]+))/g,"$2\\-").replace(/(\(.*)(\\[\-]+)(.*\))/g,"$1-$3"),r="^"+r+"$",e.regexp=new RegExp(r),e},_add:function(t,e,r){this.started||this.config({});var i=this.table[t.toLowerCase()];if("/"===e.charAt(0)){e=e.replace(/^[\/]+|[\/]+$|\s+/g,"");var a={};a.rule=e,a.callback=r,yua.Array.ensure(i,this._getRegExp(e,a))}else console.error('char "/" must be in front of router rule')},_route:function(t,e){var e=e.trim(),r=this.table[t],i=this.init;if(i.allowReload||e!==this.history){i.historyOpen&&(this.history=e,yua.ls&&yua.ls("lastHash",e));for(var a,n=0;a=r[n++];){var o=e.match(a.regexp);if(o)return o.shift(),a.callback.apply(a,o)}this.errorFn&&this.errorFn(e)}},on:function(t,e){var r=this;Array.isArray(t)?t.forEach(function(t){r._add("get",t,e)}):this._add("get",t,e)}},yua.bind(window,"load",function(){if(yua.router.started){var t=yua.router.init.prefix,e=location.hash;e=e.replace(t,"").trim(),yua.router._route("get",e)}}),"onhashchange"in window&&window.addEventListener("hashchange",function(t){if(i){var e=yua.router.init.prefix,r=location.hash.replace(e,"").trim();yua.router._route("get",r)}}),yua.bind(document,"mousedown",function(t){if(!(("defaultPrevented"in t?t.defaultPrevented:!1===t.returnValue)||t.ctrlKey||t.metaKey||2===t.which)){for(var r=t.target;"A"!==r.nodeName;)if(!(r=r.parentNode)||"BODY"===r.tagName)return;if(e(r.target)){if(!yua.router.started)return;var a=r.getAttribute("href")||r.getAttribute("xlink:href"),n=yua.router.init.prefix;if(null===a||!n.test(a))return;yua.router.hash=a.replace(n,"").trim(),t.preventDefault(),location.hash=a,i=!1}}}),yua.bind(document,"mouseup",function(){i||(yua.router._route("get",yua.router.hash),i=!0)}),yua.ui.router="0.0.1",yua.router=new t});