From 49bec63ded2863c4fb4e868fe8c4381f69f399e7 Mon Sep 17 00:00:00 2001
From: life <lifephp@gmail.com>
Date: Sun, 8 Mar 2015 01:52:30 +0800
Subject: [PATCH] =?UTF-8?q?=E5=86=99=E4=BD=9C=E6=A8=A1=E5=BC=8F,=20sync?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 login.html                               |    6 +-
 node_modules/api.js                      |    2 +-
 node_modules/file.js                     |   12 +-
 node_modules/note.js                     |   43 +-
 node_modules/sync.js                     |    6 +-
 node_modules/web.js                      |    4 +
 note.html                                |   31 +-
 package.json                             |    4 +-
 public/css/theme/basic.less              |   77 +-
 public/css/theme/default.css             |   47 +-
 public/css/theme/simple.css              |   50 +-
 public/css/theme/simple.less             |    4 +-
 public/css/theme/writting-overwrite.css  | 2651 ----------------------
 public/css/theme/writting-overwrite.less | 1157 ----------
 public/css/theme/writting.css            | 2338 +------------------
 public/css/theme/writting.less           |  895 +-------
 public/dist/themes/default.css           |    3 +-
 public/js/app/note.js                    |   52 +-
 public/js/app/page.js                    |  434 +---
 public/js/common.js                      |   24 +-
 20 files changed, 522 insertions(+), 7318 deletions(-)
 delete mode 100644 public/css/theme/writting-overwrite.css
 delete mode 100644 public/css/theme/writting-overwrite.less

diff --git a/login.html b/login.html
index 91f93aaa..3c4dd08a 100644
--- a/login.html
+++ b/login.html
@@ -109,9 +109,9 @@ var win = gui.Window.get();
 win.resizeTo(258, 326);
 win.setPosition('center');
 
-$('body').on('keydown', function(e) {
-	commonCmd(e);
-});
+// $('body').on('keydown', function(e) {
+	// commonCmd(e);
+// });
 
 </script>
 
diff --git a/node_modules/api.js b/node_modules/api.js
index eb816631..1e332ac4 100644
--- a/node_modules/api.js
+++ b/node_modules/api.js
@@ -226,7 +226,7 @@ var Api = {
 	getNoteContent: function(noteId, callback) {
 		var me = this;
 		var url = this.getUrl('note/getNoteContent', {noteId: noteId});
-		log(url);
+		console.log(url);
 		needle.get(url, function(error, response) {
 			me.checkError(error, response);
 			if(error) {
diff --git a/node_modules/file.js b/node_modules/file.js
index 80678726..5d48258b 100644
--- a/node_modules/file.js
+++ b/node_modules/file.js
@@ -258,16 +258,16 @@ var File = {
 
 		// 访问api, 得到图片
 		function getImageFromApi() {
-			log('从远程得到图片 ' + fileId);
+			console.log('fetch servers image ' + fileId);
 			Api.getImage(fileId, function(fileLocalPath, filename) { 
 				if(fileLocalPath) {
-					log('图片保存到本地成功');
+					console.log('save image to local');
 					// 保存到本地数据库中
 					me.addImageForce(fileId, fileLocalPath, function(doc) {
 						if(doc) {
-							log('保存到本地数据库成功');
+							console.log('save image to local success');
 						} else {
-							log('保存到数据库失败');
+							console.log('save image to local error');
 						}
 						callback(fileLocalPath);
 						// return me.retImage(fileLocalPath, res);
@@ -275,7 +275,7 @@ var File = {
 				} else {
 					// 远程取不到图片, 是没有网络? 还是远程真的没有了
 					// TODO
-					log('取不远程的图片' + fileId);
+					console.log("cann't get server's image" + fileId);
 					callback(false);
 					// return me.e404(res);
 				}
@@ -285,7 +285,7 @@ var File = {
 		// has表示本地数据库有记录
 		me.getImageLocalPath(fileId, function(has, fileLocalPath) {
 			// 本地有
-			log('re img')
+			console.log('re img')
 			console.log(fileLocalPath);
 			// console.log(fs.exists(fileLocalPath));
 			if(has && fileLocalPath) {
diff --git a/node_modules/note.js b/node_modules/note.js
index 3decdb63..3f1acb91 100644
--- a/node_modules/note.js
+++ b/node_modules/note.js
@@ -429,37 +429,52 @@ var Note = {
 	// 得到笔记内容
 	// noteId是本地Id
 	inSyncContent: {}, // 正在同步中的
+	inSyncTimes: {}, // 10次就要再尝试了
 	getNoteContent: function(noteId, callback) {
 		var me = this;
-		console.log('getNoteContent------')
+		console.log('getNoteContent------' + noteId);
 		// 如果是正在sync的话, 返回
+		/*
 		if(me.inSyncContent[noteId]) {
+			console.log('in sync now' + noteId); // 下周分享 node-webkit
 			return;
 		}
+		*/
 		me.inSyncContent[noteId] = true;
+		me.inSyncTimes[noteId]++;
+		if(me.inSyncTimes[noteId] > 10) {
+			callback && callback(false);
+		}
+
 		me.getNote(noteId, function(note) {
+			
 			if(!Common.isOk(note)) {
-				log('not ok');
-				log(note);
+				me.inSyncContent[noteId] = false;
+				console.log('not ok');
+				console.log(note);
 				callback && callback(false);
 			} else {
 				// 如果笔记是刚同步过来的, 那么内容要重新获取
 				if(note.InitSync) {
-					log('need load from server');
+					console.log('need load from server');
 
 					if(!Api) {
 						Api = require('api')
 					}
 
+					var serverNoteId = note.ServerNoteId;
+
 					// 远程获取
-					me.getServerNoteIdByNoteId(noteId, function(serverNoteId) {
+					// me.getServerNoteIdByNoteId(noteId, function(serverNoteId) {
 						if(!serverNoteId) {
+							console.error(noteId + ' getServerNoteIdByNoteId error');
 							me.inSyncContent[noteId] = false;
 							return callback && callback(false);
 						}
 
 						Api.getNoteContent(serverNoteId, function(noteContent) {
 							me.inSyncContent[noteId] = false;
+
 							// 同步到本地
 							if(Common.isOk(noteContent)) {
 								me.updateNoteContentForce(noteId, noteContent.Content, function(content) {
@@ -468,15 +483,25 @@ var Note = {
 									callback && callback(noteContent);
 								});
 							} else {
-								callback && callback(false);
+
+								console.error(noteId + ' api.getNoteContent error');
+
+								// 这里, 可能太多的要同步了
+								setTimeout(function() {
+									me.getNoteContent(noteId, callback);
+								}, 500);
+
+								// callback && callback(false);
 							}
 						});
 
-					});
+					// });
 				} else {
 					me.inSyncContent[noteId] = false;
-					log('not need');
+					console.log('not need');
 					callback && callback(note);
+
+					// Web.alertWeb("NONO");
 				}
 			}
 		});
@@ -1266,6 +1291,8 @@ var Note = {
 					if(content) {
 						me.syncImages(content);
 					}
+				} else {
+					// Web.alertWeb(note.NoteId + ' ' + note.Title  + ' getContent error!!');
 				}
 			});
 
diff --git a/node_modules/sync.js b/node_modules/sync.js
index 00380da8..dceacd07 100644
--- a/node_modules/sync.js
+++ b/node_modules/sync.js
@@ -36,17 +36,17 @@ var Sync = {
 	_syncNotebookIsLastChunk: false,
 	_totalSyncNotebookNum: 0, // 需要同步的数量
 	_tocalHasSyncNotebookNum: 0, // 已同步的数量
-	_notebookMaxEntry: 1,
+	_notebookMaxEntry: 200,
 
 	// note
 	_syncNoteIsLastChunk: false,
 	_totalSyncNoteNum: 0, // 需要同步的数量
-	_noteMaxEntry: 1,
+	_noteMaxEntry: 200,
 
 	// tag
 	_syncTagIsLastChunk: false,
 	_totalSyncTagNum: 0, // 需要同步的数量
-	_tagMaxEntry: 1,
+	_tagMaxEntry: 200,
 
 	_initSyncInfo: function() { 
 		var me = this;
diff --git a/node_modules/web.js b/node_modules/web.js
index e7f2026f..fff641b3 100644
--- a/node_modules/web.js
+++ b/node_modules/web.js
@@ -20,6 +20,10 @@ var Web = {
 		me.Note.notLogin();
 	},
 
+	alertWeb: function(msg) {
+		var me = this;
+		me.Note.alertWeb(msg);
+	},
 
 	// 注入前端变量
 	set: function(notebook, note, attach, tag) {
diff --git a/note.html b/note.html
index 73872019..87ef4958 100755
--- a/note.html
+++ b/note.html
@@ -21,6 +21,7 @@
 <link rel="stylesheet" href="public/css/theme/simple.css" type="text/css"/>
 <link rel="stylesheet" href="public/css/theme/blue.css" type="text/css" id="theme"/>
 <link rel="stylesheet" href="public/css/theme/presentation.css" type="text/css" disabled id="themePresentation"/>
+<link rel="stylesheet" href="public/css/theme/writting.css" type="text/css" disabled id="themeWritting"/>
 
 <!-- context-menu -->
 <link rel="stylesheet" href="public/js/contextmenu/css/contextmenu.css" type="text/css" />
@@ -37,6 +38,7 @@ function log(o) {
 </script>
 </head>
 <body class="clearfix init">
+  <div id="topDrag"></div>
   <!-- 关闭, 最小化, 最大 -->
   <div id="winTool" class="win-tool clearfix">
     <a class="tool-close"></a>
@@ -413,8 +415,8 @@ function log(o) {
                   <span class="fa fa-history"></span>
                   </a></li>
 
-                  <li><a class="ios7-a " id="expand"
-                  data-toggle="dropdown" title="Expand">
+                  <li><a class="ios7-a " id="writtingToggle"
+                  data-toggle="dropdown" title="Toggle writting mode">
                   <span class="fa fa-expand"></span>
                   </a></li>
               </ul>
@@ -428,7 +430,8 @@ function log(o) {
                 style="position: absolute; right: 30px; left: 0"></div>
               <a
                 style="dispaly: block; position: absolute; cursor: pointer; right: 10px; padding: 3px 10px"
-                id="moreBtn"> <i class="fa fa-angle-down"></i>
+                id="moreBtn"> 
+                <i class="more-fa fa fa-angle-down"></i>
               </a>
             </div>
             <div class="editorBg"></div>
@@ -443,18 +446,20 @@ function log(o) {
             
             <!-- leaui image drop image to editor-->
             <form id="upload" method="post" action="/file/uploadImageLeaui" enctype="multipart/form-data" style="margin-top: 5px;">
-                      <div id="drop">
-                             Drop images to here
-                          <input type="file" name="file" multiple style="display: none"/>
-                      </div>
-                      <ul id="uploadMsg">
-                      </ul>
-                  </form>
+                <div id="drop">
+                       Drop images to here
+                    <input type="file" name="file" multiple style="display: none"/>
+                </div>
+                <ul id="uploadMsg">
+                </ul>
+            </form>
               
             <!-- 由此可以算高度 -->
-            <div id="editorContent" name="editorContent" tabindex="2" />
-              {{.noteContent}}
-               </div>
+            <div id="editorContentWrap">
+              <div id="editorContent" name="editorContent" tabindex="2" >
+                {{.noteContent}}
+              </div>
+            </div>
           </div>
           
           <div id="mdEditor">
diff --git a/package.json b/package.json
index 9629f248..b403f267 100755
--- a/package.json
+++ b/package.json
@@ -6,8 +6,8 @@
   "window": {
     "toolbar": true,
     
-    "frame": false,
-    "transparent": true,
+    "frame": true,
+    "transparent": false,
 
     "min_width": 400,
     "min_height": 200,
diff --git a/public/css/theme/basic.less b/public/css/theme/basic.less
index 1cd1ded2..4da48bbb 100644
--- a/public/css/theme/basic.less
+++ b/public/css/theme/basic.less
@@ -1577,7 +1577,7 @@ html,body, #page, #pageInner {
 body {
 	// display: none;
 	-webkit-user-select: none; // input, textarea还是可以选择的
-    -webkit-app-region: drag;
+    // -webkit-app-region: drag;
     border: 1px solid #ccc;
     // for shadow
     left: 5px;
@@ -1604,10 +1604,46 @@ body {
 		}
 	}
 }
+
+#topDrag {
+	-webkit-app-region: drag;
+	position: absolute;
+	top: 0;
+	left: 0;
+	right: 0;
+	height: 10px;
+	z-index: 1000;
+	cursor: move;
+	// background-color: red;
+}
+
+#searchNoteInput, 
+#searchNotebookForList, 
+#addTagInput, 
+.noteSplit,	
+#notebook,
+#editor,
+#mdEditor,
+#right-column *
+{
+	// -webkit-app-region: no-drag;
+}
+
 #page {
 	#pageInner {
 	}
 }
+#noteList {
+	top: 5px;
+}
+#note {
+	top: 5px;
+}
+#noteAndEditor {
+	// top: 5px !important;
+	// padding-top: 50px;
+	// background-color: #fff;
+}
 #leftNotebook {
 	overflow: hidden;
 	// opacity: 0.5;
@@ -1618,8 +1654,13 @@ body {
 	border-radius: 5px 0 0 0;
 }
 #notebook {
-	top: 25px !important;
+	top: 40px !important;
 	background: transparent !important;
+	#myStarredNotes {
+		.folderHeader {
+			border-top: 1px solid rgba(0, 0, 0, 0.05);
+		}
+	}
 }
 #leftNotebook {
 	// background-color: rgba(245, 246, 248, 0.98) !important;
@@ -1635,17 +1676,6 @@ body {
     // -webkit-app-region: drag;
 }
 
-#noteTitle, 
-#searchNoteInput, 
-#searchNotebookForList, 
-#addTagInput, 
-#wmd-input, 
-#editorContent,
-.noteSplit,
-#notebook
-{
-	-webkit-app-region: no-drag;
-}
 
 #mainMask {
 	position: absolute;
@@ -1682,6 +1712,27 @@ body {
 	display: none;
 }
 
+#editor {
+	#mceToolbar {
+		height: 30px;
+	}
+	// 所有都展开
+	&.all-tool {
+		#mceToolbar {
+			height: 60px;
+		}
+		.more-fa:before {
+			content: "\f106";
+		}
+		#editorContent {
+			top: 60px;
+		}
+	}
+	.more-fa:before {
+		content: "\f107";
+	}
+}
+
 
 @import '../traffic.less';
 @import '../ani.less';
diff --git a/public/css/theme/default.css b/public/css/theme/default.css
index 70333051..0336bec9 100644
--- a/public/css/theme/default.css
+++ b/public/css/theme/default.css
@@ -1429,7 +1429,6 @@ body,
 }
 body {
   -webkit-user-select: none;
-  -webkit-app-region: drag;
   border: 1px solid #ccc;
   left: 5px;
   right: 5px;
@@ -1450,6 +1449,22 @@ body.init .loading-footer {
 body.init #pageInner {
   display: none;
 }
+#topDrag {
+  -webkit-app-region: drag;
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  height: 10px;
+  z-index: 1000;
+  cursor: move;
+}
+#noteList {
+  top: 5px;
+}
+#note {
+  top: 5px;
+}
 #leftNotebook {
   overflow: hidden;
   border-radius: 5px 0 0 0;
@@ -1460,9 +1475,12 @@ body.init #pageInner {
   border-radius: 5px 0 0 0;
 }
 #notebook {
-  top: 25px !important;
+  top: 40px !important;
   background: transparent !important;
 }
+#notebook #myStarredNotes .folderHeader {
+  border-top: 1px solid rgba(0, 0, 0, 0.05);
+}
 #leftNotebook {
   background: url(images/mohu.png) !important;
   background-repeat: repeat;
@@ -1474,16 +1492,6 @@ body.init #pageInner {
 .win-tool {
   -webkit-user-select: none;
 }
-#noteTitle,
-#searchNoteInput,
-#searchNotebookForList,
-#addTagInput,
-#wmd-input,
-#editorContent,
-.noteSplit,
-#notebook {
-  -webkit-app-region: no-drag;
-}
 #mainMask {
   position: absolute;
   left: 0;
@@ -1518,6 +1526,21 @@ body.init #pageInner {
 #presentation {
   display: none;
 }
+#editor #mceToolbar {
+  height: 30px;
+}
+#editor.all-tool #mceToolbar {
+  height: 60px;
+}
+#editor.all-tool .more-fa:before {
+  content: "\f106";
+}
+#editor.all-tool #editorContent {
+  top: 60px;
+}
+#editor .more-fa:before {
+  content: "\f107";
+}
 .win-tool {
   padding: 5px;
   position: absolute;
diff --git a/public/css/theme/simple.css b/public/css/theme/simple.css
index 9f9d64ba..111125be 100644
--- a/public/css/theme/simple.css
+++ b/public/css/theme/simple.css
@@ -1429,7 +1429,6 @@ body,
 }
 body {
   -webkit-user-select: none;
-  -webkit-app-region: drag;
   border: 1px solid #ccc;
   left: 5px;
   right: 5px;
@@ -1450,6 +1449,22 @@ body.init .loading-footer {
 body.init #pageInner {
   display: none;
 }
+#topDrag {
+  -webkit-app-region: drag;
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  height: 10px;
+  z-index: 1000;
+  cursor: move;
+}
+#noteList {
+  top: 5px;
+}
+#note {
+  top: 5px;
+}
 #leftNotebook {
   overflow: hidden;
   border-radius: 5px 0 0 0;
@@ -1460,9 +1475,12 @@ body.init #pageInner {
   border-radius: 5px 0 0 0;
 }
 #notebook {
-  top: 25px !important;
+  top: 40px !important;
   background: transparent !important;
 }
+#notebook #myStarredNotes .folderHeader {
+  border-top: 1px solid rgba(0, 0, 0, 0.05);
+}
 #leftNotebook {
   background: url(images/mohu.png) !important;
   background-repeat: repeat;
@@ -1474,16 +1492,6 @@ body.init #pageInner {
 .win-tool {
   -webkit-user-select: none;
 }
-#noteTitle,
-#searchNoteInput,
-#searchNotebookForList,
-#addTagInput,
-#wmd-input,
-#editorContent,
-.noteSplit,
-#notebook {
-  -webkit-app-region: no-drag;
-}
 #mainMask {
   position: absolute;
   left: 0;
@@ -1518,6 +1526,21 @@ body.init #pageInner {
 #presentation {
   display: none;
 }
+#editor #mceToolbar {
+  height: 30px;
+}
+#editor.all-tool #mceToolbar {
+  height: 60px;
+}
+#editor.all-tool .more-fa:before {
+  content: "\f106";
+}
+#editor.all-tool #editorContent {
+  top: 60px;
+}
+#editor .more-fa:before {
+  content: "\f107";
+}
 .win-tool {
   padding: 5px;
   position: absolute;
@@ -1820,16 +1843,15 @@ a.raw:hover {
   top: 0;
   right: 0;
   left: 170px;
+  border-left: 1px solid #ebeff2;
 }
 #noteList {
   width: 250px;
   border-right: 1px solid #ebeff2;
-  border-left: 1px solid #ebeff2;
 }
 #note {
   position: absolute;
   bottom: 0;
-  top: 0;
   left: 250px;
   right: 0;
   padding-left: 0;
diff --git a/public/css/theme/simple.less b/public/css/theme/simple.less
index 30464a51..e2ae8149 100644
--- a/public/css/theme/simple.less
+++ b/public/css/theme/simple.less
@@ -253,18 +253,18 @@ a.raw:hover {
   top: 0;
   right: 0;
   left: @leftNotebookWidth;
+  border-left: 1px solid @borderColor;
 }
 
 #noteList {
   width: @noteListWidth;
   border-right: 1px solid @borderColor;
-  border-left: 1px solid @borderColor;
+  // border-left: 1px solid @borderColor;
 }
 
 #note {
   position: absolute;
   bottom: 0;
-  top: 0;
   left: @noteListWidth;
   right: 0;
   padding-left: 0;
diff --git a/public/css/theme/writting-overwrite.css b/public/css/theme/writting-overwrite.css
deleted file mode 100644
index c344fa10..00000000
--- a/public/css/theme/writting-overwrite.css
+++ /dev/null
@@ -1,2651 +0,0 @@
-@font-face {
-  font-family: 'Open Sans';
-  font-style: normal;
-  font-weight: 300;
-  src: local('Open Sans Light'), local('OpenSans-Light'), url('../../fonts/open-sans2/DXI1ORHCpsQm3Vp6mXoaTXhCUOGz7vYGh680lGh-uXM.woff') format('woff');
-}
-@font-face {
-  font-family: 'Open Sans';
-  font-style: normal;
-  font-weight: 400;
-  src: local('Open Sans'), local('OpenSans'), url('../../fonts/open-sans2/cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff') format('woff');
-}
-@font-face {
-  font-family: 'Open Sans';
-  font-style: normal;
-  font-weight: 700;
-  src: local('Open Sans Bold'), local('OpenSans-Bold'), url('../../fonts/open-sans2/k3k702ZOKiLJc3WVjuplzHhCUOGz7vYGh680lGh-uXM.woff') format('woff');
-}
-@font-face {
-  font-family: 'Open Sans';
-  font-style: italic;
-  font-weight: 400;
-  src: local('Open Sans Italic'), local('OpenSans-Italic'), url('../../fonts/open-sans2/xjAJXh38I15wypJXxuGMBobN6UDyHWBl620a-IRfuBk.woff') format('woff');
-}
-/* leanote */
-@font-face {
-  font-family: 'leanoteregular';
-  src: url('../../fonts/leanote/leanote-regular-webfont.eot');
-  src: url('../../fonts/leanote/leanote-regular-webfont.eot?#iefix') format('embedded-opentype'), url('../../fonts/leanote/leanote-regular-webfont.woff') format('woff'), url('../../fonts/leanote/leanote-regular-webfont.ttf') format('truetype'), url('../../fonts/leanote/leanote-regular-webfont.svg#leanoteregular') format('svg');
-  font-weight: normal;
-  font-style: normal;
-}
-#pageInner {
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  top: 0;
-  overflow: hidden;
-}
-*,
-.h1,
-.h2,
-.h3,
-.h4,
-.h5,
-.h6 {
-  font-family: 'Open Sans', 'Helvetica Neue', Arial, 'Hiragino Sans GB', 'Microsoft YaHei', 'WenQuanYi Micro Hei', sans-serif;
-}
-body {
-  font-family: 'Open Sans', 'Helvetica Neue', Arial, 'Hiragino Sans GB', 'Microsoft YaHei', 'WenQuanYi Micro Hei', sans-serif;
-  font-weight: 300;
-  font-size: 16px;
-}
-h1,
-h2,
-h3 {
-  font-family: 'Open Sans', 'Helvetica Neue', Arial, 'Hiragino Sans GB', 'Microsoft YaHei', 'WenQuanYi Micro Hei', sans-serif;
-  font-weight: 300 !important;
-}
-/*"HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue", Helvetica, "Microsoft Yahei", Verdana, Simsun, "Segoe UI", "Segoe UI Web Regular", "Segoe UI Symbol",  "BBAlpha Sans", "S60 Sans", Arial, sans-serif;*/
-#noteItemList,
-#notebook,
-#leftNotebook,
-.slimScrollDiv,
-#editorContent,
-#editorContent_ifr,
-.mce-edit-area,
-.mce-container-body,
-.mce-tinymce,
-#editor .mce-ifr,
-.wmd-input,
-#noteReadContent,
-#attachList,
-#tags,
-.editor-content,
-.preview-container {
-  -webkit-overflow-scrolling: touch !important;
-}
-.ios7-a {
-  display: inline-block;
-  padding: 0 10px 0 5px;
-  height: 36px;
-  vertical-align: middle;
-  line-height: 36px;
-  cursor: pointer;
-}
-#tool {
-  border-bottom: 1px solid #ddd;
-  height: 36px;
-  margin-left: -5px;
-}
-#tag {
-  height: 36px;
-  line-height: 36px;
-}
-#tags {
-  display: block;
-  float: left;
-  line-height: 25px;
-  height: 25px;
-  margin-top: 0;
-}
-#tags .label {
-  margin-right: 2px;
-}
-#tagDropdown {
-  float: left;
-}
-#editor,
-#mdEditor {
-  position: absolute;
-  z-index: 2;
-  top: 36px;
-  bottom: 30px;
-  right: 0;
-  left: 0;
-  padding: 0;
-  display: none;
-}
-#mdEditor {
-  z-index: 1;
-  background-color: #fff;
-}
-#mdEditor #md-section-helper,
-#mdEditor #wmd-input {
-  font-size: 14px;
-  line-height: 22px;
-}
-#tag .dropdown {
-  line-height: 30px;
-}
-.btn {
-  border-radius: 2px;
-}
-.alert {
-  margin-bottom: 10px;
-}
-#logo {
-  font-family: "leanoteregular";
-  font-size: 36px;
-}
-#logo:before {
-  content: "a";
-}
-#switcher span {
-  font-family: "leanoteregular";
-  border-radius: 5px;
-  display: inline-block;
-  cursor: pointer;
-  font-size: 18px;
-  height: 34px;
-  line-height: 34px;
-  margin-top: 8px;
-  padding: 0 5px;
-}
-#switcher span:before {
-  content: "b";
-}
-.noteSplit {
-  position: absolute;
-  top: 0;
-  width: 5px;
-  height: 100%;
-  overflow: hidden;
-  z-index: 5;
-  cursor: col-resize;
-}
-.dropdown-menu {
-  border-radius: 3px;
-  margin: 0;
-  /*overflow-x: hidden; */
-  /*overflow-y: scroll;*/
-  box-shadow: rgba(0, 0, 0, 0.172549) 0px 6px 12px 0px;
-}
-.dropdown-menu:before {
-  content: "";
-  width: 20px;
-  height: 12px;
-  position: absolute;
-  top: -12px;
-  right: 20px;
-  background-image: url("../../images/triangle_2x.png");
-  background-size: 20px 12px;
-}
-.dropdown-submenu .dropdown-menu:before {
-  background: none;
-}
-#searchNotebookForAddDropdownList,
-#searchNotebookForAddShareDropdownList {
-  left: -200px;
-}
-#searchNotebookForAddDropdownList:before,
-#searchNotebookForAddShareDropdownList:before {
-  left: 190px;
-  right: inherit;
-}
-.sync-icon {
-  margin-left: 10px;
-}
-#syncWarning {
-  color: #f0ad4e;
-  display: none;
-  cursor: pointer;
-}
-#myProfile {
-  position: absolute;
-  left: 45px;
-  right: 0;
-  text-align: right;
-}
-#myProfile .dropdown-menu {
-  top: -110px;
-}
-#myProfile .dropdown-menu:before {
-  top: auto;
-  bottom: -12px;
-  transform: rotate(180deg);
-}
-#myProfile .dropdown-toggle {
-  position: relative;
-  width: 100%;
-  display: block;
-}
-#myProfile .dropdown-toggle .username {
-  position: absolute;
-  display: block;
-  left: 0;
-  right: 18px;
-  line-height: 30px;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  overflow: hidden;
-}
-#myProfile .dropdown-toggle .account-more {
-  position: absolute;
-  right: 3px;
-  line-height: 30px;
-}
-.dropdown-menu li {
-  list-style: none;
-  padding-left: 10px;
-  width: 100%;
-  height: 30px;
-  line-height: 30px;
-}
-.dropdown-menu li > a {
-  color: #000000;
-  display: block;
-  padding-right: 20px;
-}
-.dropdown-menu > li > a {
-  padding: 3px 20px 3px 0;
-}
-#notebookNavForNewNote li:hover {
-  background: none;
-}
-#noteList {
-  position: absolute;
-  bottom: 0;
-  top: 0;
-  /*
-  overflow-x: hidden;
-  overflow-y: hidden;
-  */
-  background: #fcfcfc;
-}
-#noteAndEditorMask {
-  position: absolute;
-  left: 0;
-  right: 0;
-  top: 0;
-  bottom: 0;
-  background: #fff;
-  text-align: center;
-  padding-top: 60px;
-  opacity: .3;
-  z-index: 20;
-  display: none;
-}
-.dropdown-submenu {
-  position: relative;
-}
-.dropdown-submenu > ul.dropdown-menu {
-  top: 0;
-  left: 100%;
-  margin-left: -3px !important;
-  -webkit-border-radius: 3px;
-  -moz-border-radius: 3px;
-  border-radius: 3px;
-  padding-top: 10px !important;
-}
-.dropdown-submenu:hover > .dropdown-menu {
-  display: block;
-}
-.dropdown-submenu:after {
-  display: block;
-  content: " ";
-  position: absolute;
-  right: 0;
-  top: 10px;
-  width: 0;
-  height: 0;
-  border-color: transparent;
-  border-style: solid;
-  border-width: 5px 0 5px 5px;
-  border-left-color: #666;
-}
-.dropdown-submenu:hover > a:after {
-  border-left-color: #fff;
-}
-.dropdown-submenu.pull-left {
-  float: none;
-}
-.dropdown-submenu.pull-left > .dropdown-menu {
-  left: -100%;
-  margin-left: 10px;
-  -webkit-border-radius: 6px 0 6px 6px;
-  -moz-border-radius: 6px 0 6px 6px;
-  border-radius: 6px 0 6px 6px;
-}
-.open > .dropdown-menu,
-.dropdown-submenu:hover > .dropdown-menu {
-  opacity: 1;
-  transform: scale(1, 1);
-  -webkit-transform: scale(1, 1);
-  -moz-transform: scale(1, 1);
-  -o-transform: scale(1, 1);
-}
-.dropdown-menu {
-  opacity: 0;
-  display: block;
-  -webkit-transform: scale(0, 0);
-  -webkit-transform-origin: top;
-  -webkit-animation-fill-mode: forwards;
-  -webkit-transition: all 0.2s cubic-bezier(0.34, 1.21, 0.4, 1);
-  -o-transform: scale(0, 0);
-  -o-transform-origin: top;
-  -o-animation-fill-mode: forwards;
-  -o-transition: all 0.2s cubic-bezier(0.34, 1.21, 0.4, 1);
-  -moz-transform: scale(0, 0);
-  -moz-transform-origin: top;
-  -moz-animation-fill-mode: forwards;
-  -moz-transition: all 0.2s cubic-bezier(0.34, 1.21, 0.4, 1);
-  transform: scale(0, 0);
-  transform-origin: top;
-  animation-fill-mode: forwards;
-  transition: all 0.2s cubic-bezier(0.34, 1.21, 0.4, 1);
-}
-.dropdown-list {
-  width: 530px;
-  border-radius: 3px;
-}
-.dropdown-list ul {
-  margin: 0;
-  padding: 0;
-}
-.dropdown-list ul li {
-  float: left;
-  width: 120px;
-  margin-left: 10px;
-  margin-bottom: 10px;
-  border: 1px dashed #ccc;
-}
-.new-note-right {
-  padding: 0 5px;
-  padding-left: 3px;
-}
-#leanoteMsg {
-  line-height: 40px;
-  margin-top: 10px;
-  margin-left: 10px;
-}
-#newNoteWrap {
-  line-height: 40px;
-  margin-top: 10px;
-}
-#searchNotebookForAdd {
-  line-height: normal;
-  width: 200px;
-  margin: 0 10px;
-  margin-bottom: 10px;
-  height: 30px;
-  border-color: #ebeff2;
-  box-shadow: none;
-}
-#myNotebooks .folderBody {
-  padding-top: 3px;
-}
-.folderBody {
-  overflow-x: hidden;
-}
-#searchNotebookForList {
-  height: 30px;
-  width: 90%;
-  margin: 3px auto;
-  margin-top: 0;
-  border-color: #ebeff2;
-  box-shadow: none;
-}
-#noteItemList .item-setting,
-#noteItemList .item-blog,
-#noteItemList .item-star,
-#noteItemList .item-conflict-info {
-  position: absolute;
-  right: 1px;
-  font-size: 10px;
-  z-index: 2;
-  padding: 3px;
-  border-radius: 5px;
-  cursor: pointer;
-  width: 20px;
-  text-align: center;
-  opacity: 0.5;
-  background-color: #464C5E;
-}
-#noteItemList .item-setting .fa,
-#noteItemList .item-blog .fa,
-#noteItemList .item-star .fa,
-#noteItemList .item-conflict-info .fa {
-  color: #fff;
-}
-#noteItemList .item-setting:hover,
-#noteItemList .item-blog:hover,
-#noteItemList .item-star:hover,
-#noteItemList .item-conflict-info:hover {
-  opacity: 0.8;
-}
-#noteItemList .item-blog {
-  top: 1px;
-  display: none;
-}
-#noteItemList .item-setting {
-  bottom: 0;
-  display: none;
-}
-#noteItemList .item-star {
-  bottom: 0;
-  right: 23px;
-  display: none;
-}
-#noteItemList .item-conflict-info {
-  bottom: 0;
-  right: 45px;
-  display: none;
-}
-#noteItemList .item-conflict-info .fa {
-  color: #f0ad4e !important;
-}
-#noteItemList .item-is-star .item-star .fa:before {
-  content: "\f005";
-}
-#noteItemList .item-is-star .item-star .fa {
-  color: yellow !important;
-}
-#noteItemList .item:hover .item-setting,
-#noteItemList .item:hover .item-star {
-  display: block;
-}
-#noteItemList .item:hover.item-conflict .item-conflict-info {
-  display: block;
-}
-.friend-header {
-  position: relative;
-}
-.friend-header .notebook-setting {
-  display: none;
-}
-.friend-header:hover .notebook-setting {
-  display: block;
-}
-.each-user {
-  margin-bottom: 5px;
-  margin-left: 5px;
-  margin-right: 5px;
-  margin-top: 3px;
-  border: 1px solid #eee;
-  border-radius: 3px;
-}
-.notebook-number-notes {
-  position: absolute;
-  right: 10px;
-  top: 0;
-  bottom: 0;
-  z-index: 1;
-  display: inline-block;
-  line-height: 20px !important;
-  height: 20px;
-  margin-top: 5px;
-  padding: 0 3px;
-}
-.notebook-setting {
-  display: none;
-  position: absolute;
-  right: 1px;
-  top: 0;
-  bottom: 0;
-  z-index: 2;
-  line-height: 30px;
-}
-.notebook-setting:before {
-  content: "\f013";
-}
-.ztree li a:hover .notebook-setting {
-  display: block;
-}
-#myTag .folderBody {
-  padding: 0 3px;
-  padding-bottom: 3px;
-  padding-left: 5px;
-}
-#myTag .folderBody li {
-  padding: 3px;
-  line-height: normal;
-}
-#notebookList {
-  border-top: 1px solid rgba(255, 255, 255, 0.05);
-}
-.ztree {
-  padding: 0px;
-}
-#upload {
-  position: absolute;
-  z-index: 0;
-  bottom: 0;
-  right: 0;
-  left: 0px;
-  padding: 0;
-  background-color: #fff;
-  text-align: center;
-  display: none;
-}
-#upload #drop {
-  width: 100%;
-  height: 100%;
-  padding-top: 100px;
-}
-#drop.in {
-  border: 1px solid #000000;
-}
-#drop.hover {
-  border: 2px solid #000000;
-}
-#uploadMsg {
-  position: absolute;
-  top: 3px;
-  right: 3px;
-  bottom: 10px;
-  overflow: scroll;
-  list-style: none;
-}
-#uploadAttach {
-  position: relative;
-  margin-top: 5px;
-}
-.dropzone {
-  text-align: center;
-}
-.dropzone input {
-  display: none;
-}
-.dropzone.in {
-  border: 1px solid #000000;
-}
-.dropzone.hover {
-  border: 2px solid #000000;
-}
-#attachUploadMsg,
-#avatarUploadMsg {
-  list-style-type: none;
-  margin: 0;
-  padding: 0;
-  max-height: 240px;
-  z-index: 3;
-}
-#attachUploadMsg .alert,
-#avatarUploadMsg .alert {
-  margin: 0;
-  padding: 0 3px;
-  margin-top: 10px;
-}
-#attachMenu {
-  width: 450px;
-  padding: 10px 5px;
-}
-#attachList {
-  margin: 0;
-  padding: 0;
-  max-height: 450px;
-  overflow-y: auto;
-}
-#attachList li {
-  display: block;
-  margin: 0;
-  padding: 0 3px;
-  border-radius: 3px;
-  border-bottom: 1px dashed #eee;
-  height: 45px;
-  line-height: 45px;
-}
-#attachList li div {
-  float: left;
-}
-#attachList li .attach-title {
-  width: 290px;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  overflow: hidden;
-}
-#attachList li .attach-process {
-  float: right;
-}
-#attachList li.loading {
-  text-align: center;
-}
-.animated {
-  -webkit-animation-fill-mode: both;
-  -moz-animation-fill-mode: both;
-  -ms-animation-fill-mode: both;
-  -o-animation-fill-mode: both;
-  animation-fill-mode: both;
-  -webkit-animation-duration: 0.5s;
-  -moz-animation-duration: 0.5s;
-  -ms-animation-duration: 0.5s;
-  -o-animation-duration: 0.5s;
-  animation-duration: 0.5s;
-}
-@-webkit-keyframes fadeIn {
-  0% {
-    opacity: 0;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-@-moz-keyframes fadeIn {
-  0% {
-    opacity: 0;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-@-o-keyframes fadeIn {
-  0% {
-    opacity: 0;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-@keyframes fadeIn {
-  0% {
-    opacity: 0;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-.fadeIn {
-  -webkit-animation-name: fadeIn;
-  -moz-animation-name: fadeIn;
-  -o-animation-name: fadeIn;
-  animation-name: fadeIn;
-}
-@-webkit-keyframes fadeInUp {
-  0% {
-    opacity: 0;
-    -webkit-transform: translateY(20px);
-  }
-  100% {
-    opacity: 1;
-    -webkit-transform: translateY(0);
-  }
-}
-@-moz-keyframes fadeInUp {
-  0% {
-    opacity: 0;
-    -moz-transform: translateY(20px);
-  }
-  100% {
-    opacity: 1;
-    -moz-transform: translateY(0);
-  }
-}
-@-o-keyframes fadeInUp {
-  0% {
-    opacity: 0;
-    -o-transform: translateY(20px);
-  }
-  100% {
-    opacity: 1;
-    -o-transform: translateY(0);
-  }
-}
-@keyframes fadeInUp {
-  0% {
-    opacity: 0;
-    transform: translateY(20px);
-  }
-  100% {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-.fadeInUp {
-  -webkit-animation-name: fadeInUp;
-  -moz-animation-name: fadeInUp;
-  -o-animation-name: fadeInUp;
-  animation-name: fadeInUp;
-}
-#historyList img {
-  max-width: 100%;
-}
-#avatar {
-  height: 60px;
-  max-width: 200px;
-  display: inline-block;
-  margin: 10px;
-}
-#noteReadTitle {
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  overflow: hidden;
-}
-#noteReadInfo {
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  overflow: hidden;
-  color: #666;
-}
-.my-link,
-.new-markdown-text-abbr,
-.new-note-text-abbr {
-  display: none;
-}
-#myAvatar {
-  height: 30px;
-  max-width: 30px;
-  overflow: hidden;
-  border-radius: 50%;
-}
-#tool {
-  position: relative;
-}
-#editorBottom {
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  height: 30px;
-  border-top: 1px solid #eee;
-}
-#tag {
-  position: absolute;
-  right: 0;
-  top: 0;
-  left: 5px;
-  bottom: 0;
-}
-#tagColor {
-  left: 10px;
-  top: -130px;
-}
-#tagColor:before {
-  content: "";
-  background-image: none;
-}
-#addTagInput {
-  width: 100px;
-}
-#notesAndSort {
-  height: 36px;
-}
-#noteItemListWrap {
-  position: absolute;
-  left: 0;
-  right: 0;
-  top: 69px;
-  bottom: 3px;
-}
-#mdEditorPreview {
-  position: absolute;
-  top: 35px;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-#left-column,
-#right-column,
-#mdSplitter {
-  position: absolute;
-  top: 0;
-  bottom: 0;
-}
-#mdSplitter {
-  width: 5px;
-  height: 100%;
-  overflow: hidden;
-  z-index: 5;
-  cursor: col-resize;
-  left: 450px;
-  background: none;
-}
-#left-column {
-  left: 0;
-  width: 450px;
-}
-#right-column {
-  left: 450px;
-  right: 0;
-  overflow: hidden;
-}
-.wmd-panel-editor,
-.preview-container,
-#wmd-input {
-  height: 100%;
-}
-.wmd-input,
-.wmd-input:focus,
-#md-section-helper {
-  width: 100%;
-  border: 1px #eee solid;
-  border-radius: 5px;
-  outline: none;
-  font-size: 14px;
-  resize: none;
-  overflow-x: hidden;
-}
-/* 不能为display: none */
-#md-section-helper {
-  position: absolute;
-  height: 0;
-  overflow-y: scroll;
-  padding: 0 6px;
-  top: 10px;
-  /*一条横线....*/
-  z-index: -1;
-  opacity: none;
-}
-.preview-container {
-  overflow: auto;
-}
-.wmd-preview {
-  width: 100%;
-  font-size: 14px;
-  overflow: auto;
-  overflow-x: hidden;
-}
-.wmd-button-row,
-.preview-button-row {
-  padding: 0px;
-  height: auto;
-  margin: 0;
-}
-.wmd-spacer {
-  width: 0px;
-  height: 20px;
-  margin-left: 10px;
-  background-color: Silver;
-  display: inline-block;
-  list-style: none;
-}
-.wmd-button,
-.preview-button {
-  width: 20px;
-  height: 20px;
-  display: inline-block;
-  list-style: none;
-  cursor: pointer;
-  font-size: 17px;
-}
-.wmd-button {
-  margin-left: 10px;
-}
-.preview-button {
-  margin-right: 10px;
-}
-.wmd-button > span,
-.preview-button > span {
-  width: 20px;
-  height: 20px;
-  display: inline-block;
-  font-size: 14px;
-}
-.top-nav {
-  margin: 0 10px;
-  display: inline-block;
-  line-height: 60px;
-}
-.cm-item {
-  position: relative;
-}
-.cm-item .cm-text {
-  position: absolute;
-  left: 23px;
-  right: 10px;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  overflow: hidden;
-}
-.cm-item .cm-text .c-text {
-  display: initial;
-}
-.b-m-mpanel {
-  border-radius: 3px;
-}
-/* item list */
-#noteItemList {
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  width: 100%;
-  overflow-y: scroll;
-  padding: 0 5px;
-}
-#noteItemList .item {
-  position: relative;
-  height: 110px;
-  overflow: hidden;
-  cursor: default;
-  border: 1px solid #ebeff2;
-  border-radius: 3px;
-  margin-top: 5px;
-  background-color: #fff;
-}
-#noteItemList .item:hover,
-#noteItemList .contextmenu-hover {
-  background-color: #ddd !important;
-}
-.item-active,
-#noteItemList .item-active:hover {
-  background-color: #65bd77 !important;
-  color: #fff;
-}
-.item-active .fa,
-#noteItemList .item-active:hover .fa {
-  color: #eee;
-}
-.item-active .item-info .fa,
-#noteItemList .item-active:hover .item-info .fa {
-  color: #eee !important;
-}
-.item-active .item-title,
-#noteItemList .item-active:hover .item-title {
-  color: #fff;
-}
-#noteItemList .item-thumb {
-  width: 100px;
-  overflow: hidden;
-  position: absolute;
-  z-index: 1;
-  right: 0px;
-  top: 4px;
-  height: 100px;
-  background-color: #fff;
-  margin-right: 5px;
-  line-height: 100px;
-  text-align: center;
-}
-.item-thumb img {
-  max-width: 100px;
-}
-.item-title {
-  /*font-weight: 400;*/
-  font-size: 16px;
-  height: 22px;
-  line-height: 20px;
-  overflow: hidden;
-  margin-bottom: 0px;
-  color: #000000;
-  border-bottom: dashed 1px #ebeff2;
-}
-#noteItemList .item-desc {
-  position: absolute;
-  left: 0;
-  top: 4px;
-  right: 0px;
-  margin-left: 4px;
-}
-#noteItemList .item-desc .fa {
-  color: #666;
-}
-#noteItemList .item-image .item-desc {
-  right: 100px;
-}
-.item-info {
-  margin: 0;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  overflow: hidden;
-}
-.desc {
-  margin: 0;
-}
-#editorMask {
-  position: absolute;
-  top: 0px;
-  bottom: 0px;
-  right: 0;
-  left: 0;
-  background-color: #fff;
-  display: none;
-  z-index: -10;
-  padding-top: 50px;
-  text-align: center;
-}
-#editorMask .fa,
-#editorMask a {
-  font-size: 24px;
-}
-#editorMask a {
-  display: inline-block;
-  border-radius: 3px;
-  border: 1px solid #ebeff2;
-  padding: 10px;
-}
-#editorMask a:hover {
-  background-color: #65bd77;
-  color: #fff;
-}
-.note-mask {
-  position: absolute;
-  top: 0px;
-  bottom: 0px;
-  right: 0;
-  left: 3px;
-  z-index: -1;
-}
-#noteMaskForLoading {
-  padding-top: 60px;
-  background: #fff;
-  text-align: center;
-  opacity: .3;
-}
-#themeForm td {
-  padding: 5px;
-  text-align: center;
-}
-#themeForm img {
-  border: 1px solid #eee;
-  padding: 2px;
-}
-.dropdown-menu .divider {
-  margin: 3px 0;
-}
-.ace_eidtor,
-.ace_editor * {
-  font: 12px / normal 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', monospace;
-}
-/* leanote nav */
-.leanoteNav {
-  position: absolute;
-  right: 0px;
-  border: 1px solid #ccc;
-  border-radius: 3px;
-  background-color: #fff;
-  opacity: 0.5;
-  z-index: 11;
-  margin-top: 4px;
-}
-.leanoteNav h1 {
-  margin: 0;
-  font-size: 16px;
-  padding: 3px;
-  cursor: pointer;
-}
-.leanoteNav i {
-  padding: 3px;
-}
-.leanoteNav span {
-  display: none;
-}
-.leanoteNav .leanoteNavContent {
-  display: none;
-  overflow: auto;
-}
-.leanoteNav.unfolder {
-  min-width: 200px;
-  max-width: 300px;
-  opacity: 0.8;
-}
-.leanoteNav.unfolder h1 {
-  border-bottom: 1px dashed #ebeff2;
-}
-.leanoteNav.unfolder span {
-  display: inline;
-}
-.leanoteNav.unfolder .leanoteNavContent {
-  display: block;
-  min-height: 30px;
-}
-.leanoteNav ul {
-  margin: 0;
-  padding-left: 23px;
-}
-.leanoteNav ul li {
-  list-style-type: disc;
-}
-.leanoteNav ul li a:hover {
-  color: #0fb264;
-}
-.leanoteNav ul .nav-h2 {
-  margin-left: 20px;
-}
-.leanoteNav ul .nav-h3 {
-  margin-left: 30px;
-}
-.leanoteNav ul .nav-h4 {
-  margin-left: 40px;
-}
-.leanoteNav ul .nav-h5 {
-  margin-left: 50px;
-}
-.scrollTo-a {
-  cursor: pointer !important;
-}
-#editorContent {
-  padding: 5px;
-  outline: none;
-  margin-top: 5px;
-  bottom: 5px !important;
-}
-#editorContent pre {
-  position: relative;
-  -mo-height: auto !important;
-}
-#editorContent pre .toggle-raw {
-  position: absolute;
-  left: 2px;
-  top: -2px;
-  z-index: 100;
-  display: none;
-}
-#editorContent pre:hover .toggle-raw {
-  display: block;
-}
-.ace_invisible_space {
-  visibility: hidden !important;
-}
-.mce-tinymce-inline {
-  border-width: 0 !important;
-}
-#editorContent a {
-  color: #2a6496;
-  text-decoration: underline;
-}
-#editorContent pre {
-  font: 12px / normal 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', monospace;
-  color: #4D4D4C;
-}
-#editorContent .ace-tomorrow {
-  padding: 0;
-  padding-left: 44px;
-}
-#editorContent .ace-to-pre {
-  padding: 0;
-  padding-left: 5px;
-}
-#editorContent .ace_scrollbar-v {
-  overflow-y: hidden;
-}
-#editorContent .leanote-image-container {
-  display: inline-block;
-  width: 100px;
-}
-#editorContent .leanote-image-container .loader {
-  display: inline-block;
-  vertical-align: top;
-  margin-right: 3px;
-  margin-top: 5px;
-}
-#editorContent .leanote-image-container .progress {
-  display: inline-block;
-  margin: 0;
-  width: 80px;
-}
-.close:focus {
-  outline: none;
-}
-#newMyNote {
-  position: absolute;
-  right: 3px;
-  top: 0;
-  bottom: 0;
-  line-height: 30px;
-  width: 50px;
-}
-#newMyNote * {
-  font-size: 14px;
-}
-#newMyNote .new-split {
-  color: #ccc;
-  display: none;
-}
-#newMyNote #newNoteBtn {
-  display: inline-block;
-  border: 1px solid #eee;
-  border-radius: 5px;
-  text-align: center;
-  height: 25px;
-  width: 20px;
-  line-height: initial;
-}
-#newMyNote #newNoteMarkdownBtn {
-  display: inline-block;
-  border: 1px solid #eee;
-  border-radius: 5px;
-  /* width: 100px; */
-  margin-left: 1px;
-  padding: 0 1px;
-  height: 25px;
-  line-height: initial;
-  text-align: center;
-}
-#myNotebookNavForListNav {
-  position: absolute;
-  line-height: 30px;
-  left: 55px;
-  right: 55px;
-  text-align: center;
-  font-style: 16px;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  overflow: hidden;
-}
-#myNotebookNavForListNav span {
-  cursor: default;
-}
-#searchNote {
-  margin-top: 2px;
-}
-#sortType {
-  position: absolute;
-  left: 4px;
-  line-height: 36px;
-  color: #ccc;
-}
-#starNotes li {
-  position: relative;
-  margin: 0;
-  height: 30px;
-  border-bottom: 1px dashed #eee;
-}
-#starNotes li.selected {
-  background: #eee;
-}
-#starNotes li a {
-  padding-left: 20px;
-  line-height: 30px;
-  display: block;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  overflow: hidden;
-}
-#starNotes li .delete-star {
-  position: absolute;
-  right: 10px;
-  bottom: 0;
-  color: #ccc;
-  display: none;
-  cursor: pointer;
-}
-#starNotes li .delete-star:hover {
-  color: #000;
-}
-#starNotes li:hover .delete-star {
-  display: block;
-}
-#notebookBottom {
-  position: absolute;
-  bottom: 0px;
-  height: 30px;
-  right: 0;
-  left: 0;
-  line-height: 30px;
-  text-align: right;
-  padding-right: 5px;
-  background-color: #f5f6f7;
-  border-top: 1px solid transparent;
-  border-color: rgba(0, 0, 0, 0.05);
-}
-/* editor */
-#editorTool {
-  margin: 0;
-  padding: 0;
-  list-style: none;
-}
-#editorTool li {
-  display: inline-block;
-}
-#noteTitleDiv {
-  position: absolute;
-  left: 0;
-  right: 120px;
-  height: 35px;
-  line-height: 35px;
-  padding-left: 10px;
-}
-#noteTitle {
-  height: 100%;
-  width: 100%;
-  border: none;
-  font-size: 20px;
-}
-#noteTitle:focus {
-  outline: none !important;
-}
-#editorContent {
-  position: absolute;
-  top: 30px;
-  bottom: 10px;
-  right: 0;
-  left: 0;
-  overflow: auto;
-}
-#mdEditor .layout-wrapper-l3 {
-  top: 30px;
-  margin-top: 0 !important;
-  border: none !important;
-  border-radius: 0 !important;
-}
-#noteItemList .item-conflict {
-  border: 2px solid #DBB624;
-}
-#tagNav i,
-#tagNav em {
-  font-style: normal;
-}
-#tagNav .tag-delete {
-  display: none;
-  margin-left: 3px;
-  font-size: 12px;
-}
-#tagNav li:hover .tag-delete {
-  display: inline-block;
-}
-#tagNav a:hover {
-  background: none !important;
-}
-.fa-spin {
-  -webkit-animation: fa-spin 1s infinite linear !important;
-  animation: fa-spin 1s infinite linear !important;
-}
-.context-tips {
-  position: absolute;
-  z-index: 99999;
-  background: #fff;
-  border: 1px solid #ccc;
-  padding: 5px;
-  border-radius: 5px;
-  left: 0px;
-  top: 0px;
-  /* shaddow */
-  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
-  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
-  background-clip: padding-box;
-  overflow: auto;
-  width: 100px;
-  height: 100px;
-  display: none;
-}
-#conflictTips {
-  width: 230px;
-  height: 80px;
-}
-.conflict-title {
-  display: block;
-  text-decoration: underline;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  overflow: hidden;
-}
-/*
- *  STYLE 2
- */
-/*
-*::-webkit-scrollbar-track
-{
-	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
-	border-radius: 10px;
-	background-color: #F5F5F5;
-}
-
-*::-webkit-scrollbar
-{
-	width: 10px;
-	background-color: #F5F5F5;
-	position: absolute;
-	-webkit-transform: translatez(0);
-}
-
-*::-webkit-scrollbar-thumb
-{
-	border-radius: 10px;
-	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
-	background-color: #D62929;
-}
-*/
-html,
-body,
-#page,
-#pageInner {
-  position: absolute;
-  left: 0px;
-  right: 0px;
-  bottom: 0;
-  top: 0;
-  padding: 0;
-  margin: 0;
-  border-radius: 5px;
-  overflow: hidden;
-  background: transparent;
-}
-.modal-backdrop {
-  right: 5px;
-  left: 5px;
-  bottom: 5px;
-  border-radius: 5px;
-}
-#mainContainer,
-#mainMask {
-  border-radius: 5px;
-}
-#noteAndEditor {
-  background-color: #fff;
-}
-body {
-  -webkit-user-select: none;
-  -webkit-app-region: drag;
-  border: 1px solid #ccc;
-  left: 5px;
-  right: 5px;
-  bottom: 5px;
-  box-shadow: 0px 0px 5px rgba(66, 66, 66, 0.5);
-}
-body.no-drag {
-  -webkit-app-region: no-drag;
-}
-body.init #winTool {
-  display: none;
-}
-body.init #allProcess,
-body.init #syncProcess,
-body.init .loading-footer {
-  display: none;
-}
-body.init #pageInner {
-  display: none;
-}
-#leftNotebook {
-  overflow: hidden;
-  border-radius: 5px 0 0 0;
-}
-#notebook,
-#winTool {
-  overflow: hidden;
-  border-radius: 5px 0 0 0;
-}
-#notebook {
-  top: 25px !important;
-  background: transparent !important;
-}
-#leftNotebook {
-  background: url(images/mohu.png) !important;
-  background-repeat: repeat;
-}
-#notebookBottom {
-  background: transparent !important;
-}
-#notesAndSort,
-.win-tool {
-  -webkit-user-select: none;
-}
-#noteTitle,
-#searchNoteInput,
-#searchNotebookForList,
-#addTagInput,
-#wmd-input,
-#editorContent,
-.noteSplit,
-#notebook {
-  -webkit-app-region: no-drag;
-}
-#mainMask {
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  top: 0;
-  background-color: rgba(255, 255, 255, 0.95);
-  text-align: center;
-  padding-top: 10px;
-  z-index: 1000;
-}
-#mainMask table,
-#mainMask td {
-  width: 100%;
-  height: 100%;
-  border: none;
-  vertical-align: middle;
-}
-#mainMask #syncProcess {
-  margin-top: 20px;
-}
-#mainMask .loading-footer {
-  text-align: center;
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 10px;
-}
-#mainMask .loading-footer a {
-  color: #ccc;
-}
-#presentation {
-  display: none;
-}
-.win-tool {
-  padding: 5px;
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 99999;
-}
-.win-tool a {
-  display: block;
-  float: left;
-  width: 14px;
-  height: 14px;
-  background-size: 14px 14px !important;
-  margin-right: 5px;
-}
-.win-tool .tool-close {
-  background: url(icon/traffic-close@2x.png);
-}
-.win-tool .tool-close:before {
-  content: ' ';
-  background: url(icon/traffic-close-hover@2x.png);
-}
-.win-tool .tool-close-blur {
-  background: url(icon/traffic-disabled@2x.png);
-}
-.win-tool .tool-close-blur:before {
-  content: ' ';
-  background: url(icon/traffic-close-hover@2x.png);
-}
-.win-tool .tool-min {
-  background: url(icon/traffic-minimise@2x.png);
-}
-.win-tool .tool-min:before {
-  content: ' ';
-  background: url(icon/traffic-minimise-hover@2x.png);
-}
-.win-tool .tool-max {
-  background: url(icon/traffic-fullscreen@2x.png);
-}
-.win-tool .tool-max:before {
-  content: ' ';
-  background: url(icon/traffic-zoom-hover@2x.png);
-}
-.win-tool:hover .tool-close,
-.win-tool:hover .tool-close-blur {
-  background: url(icon/traffic-close-hover@2x.png);
-}
-.win-tool:hover .tool-min {
-  background: url(icon/traffic-minimise-hover@2x.png);
-}
-.win-tool:hover .tool-max {
-  background: url(icon/traffic-zoom-hover@2x.png);
-}
-.blur .win-tool a {
-  background: url(icon/traffic-disabled@2x.png);
-}
-@keyframes rond {
-  0% {
-    transform: rotate(0deg);
-  }
-  100% {
-    transform: rotate(360deg);
-  }
-}
-@-webkit-keyframes rond {
-  0% {
-    -webkit-transform: rotate(0deg);
-  }
-  100% {
-    -webkit-transform: rotate(360deg);
-  }
-}
-#loadingLogo {
-  position: relative;
-  width: 100px;
-  display: block;
-  margin: auto;
-  border: 1px solid #4092C5;
-  border-radius: 50%;
-}
-#loadingLogo img {
-  width: 100px;
-  padding: 20px;
-}
-#loadingLogo.loading {
-  animation: rond 2s infinite;
-  -webkit-animation: rond 2s infinite;
-}
-@font-face {
-  font-family: 'Open Sans';
-  font-style: normal;
-  font-weight: 300;
-  src: local('Open Sans Light'), local('OpenSans-Light'), url('../../fonts/open-sans2/DXI1ORHCpsQm3Vp6mXoaTXhCUOGz7vYGh680lGh-uXM.woff') format('woff');
-}
-@font-face {
-  font-family: 'Open Sans';
-  font-style: normal;
-  font-weight: 400;
-  src: local('Open Sans'), local('OpenSans'), url('../../fonts/open-sans2/cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff') format('woff');
-}
-@font-face {
-  font-family: 'Open Sans';
-  font-style: normal;
-  font-weight: 700;
-  src: local('Open Sans Bold'), local('OpenSans-Bold'), url('../../fonts/open-sans2/k3k702ZOKiLJc3WVjuplzHhCUOGz7vYGh680lGh-uXM.woff') format('woff');
-}
-@font-face {
-  font-family: 'Open Sans';
-  font-style: italic;
-  font-weight: 400;
-  src: local('Open Sans Italic'), local('OpenSans-Italic'), url('../../fonts/open-sans2/xjAJXh38I15wypJXxuGMBobN6UDyHWBl620a-IRfuBk.woff') format('woff');
-}
-/*"HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue", Helvetica, "Microsoft Yahei", Verdana, Simsun, "Segoe UI", "Segoe UI Web Regular", "Segoe UI Symbol",  "BBAlpha Sans", "S60 Sans", Arial, sans-serif;*/
-::selection {
-  background: #000000;
-  color: #ffffff;
-}
-::-moz-selection {
-  background: #000000;
-  color: #ffffff;
-}
-::-webkit-selection {
-  background: #000000;
-  color: #ffffff;
-}
-html,
-body {
-  background-color: #fbfcf7;
-}
-body {
-  font-family: 'Open Sans', 'Helvetica Neue', Arial, 'Hiragino Sans GB', 'Microsoft YaHei', 'WenQuanYi Micro Hei', sans-serif;
-  font-weight: 300;
-  font-size: 16px;
-}
-a {
-  color: #000000;
-  cursor: pointer;
-}
-a:hover {
-  text-decoration: none !important;
-  color: #000000;
-}
-a.raw {
-  color: #428bca;
-}
-a.raw:hover {
-  color: #2a6496;
-}
-/* header */
-#header {
-  height: 60px;
-  background-color: #fbfcf7;
-  color: #ffffff;
-  border-bottom: 1px solid #ebeff2;
-  /* for app */
-  webkit-user-select: none;
-  /* 还不知 */
-  -webkit-app-region: drag;
-  /* -webkit-app-region: no-drag; */
-}
-#header a {
-  color: #ccc;
-}
-#header li {
-  color: #000000;
-}
-#header li a {
-  color: #000000;
-}
-#searchWrap,
-#logo,
-#switcher,
-#leftNotebook,
-.noteSplit {
-  display: none;
-}
-#header ul {
-  margin: 0;
-  padding: 0;
-  list-style: none;
-}
-#header ul li.dropdown {
-  display: inline-block;
-  height: 60px;
-}
-#header ul > li > a.dropdown-toggle {
-  display: block;
-  padding: 15px 5px 0 0;
-  position: relative;
-}
-#header span.icon {
-  display: inline-block;
-  font-size: 28px;
-  color: #999999;
-}
-.dropdown-menu {
-  border-radius: 0;
-  margin: 0;
-  -webkit-box-shadow: none;
-  box-shadow: none;
-  border: 1px solid #0fb264;
-  overflow: visible;
-}
-.dropdown-menu li {
-  padding-left: 10px;
-  width: 100%;
-  height: 30px;
-  line-height: 30px;
-}
-.dropdown-menu > li > a {
-  color: #000000;
-  display: inline-block;
-  padding: 3px 3px;
-}
-.dropdown-menu > li:hover,
-.dropdown-menu > li:focus {
-  background-color: #ebeff2;
-}
-.dropdown-menu > li > a:hover,
-.dropdown-menu > li > a:focus {
-  background-color: #ebeff2;
-}
-.ios7-a {
-  display: inline-block;
-  padding: 0 10px 0 5px;
-  height: 40px;
-  vertical-align: middle;
-  line-height: 38px;
-  cursor: pointer;
-}
-/*********************/
-#page {
-  overflow: auto;
-  position: absolute;
-  top: 0;
-  left: 0;
-  bottom: 0;
-  right: 0;
-}
-#pageInner {
-  position: absolute;
-  top: 0;
-  left: 0;
-  height: 100%;
-  width: 100%;
-  overflow: hidden;
-}
-#mainContainer {
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  overflow: auto;
-  zoom: 1;
-}
-#search {
-  border: #bababa 1px solid;
-  background-color: #fff;
-  white-space: nowrap;
-  position: absolute;
-  height: 30px;
-  left: 3px;
-  right: 60px;
-  margin-top: 3px;
-}
-#search label {
-  display: none;
-}
-#searchButton {
-  border: 0 none;
-  width: 16px;
-  height: 16px;
-  overflow: hidden;
-  cursor: pointer;
-  position: absolute;
-  right: 3px;
-  top: 5px;
-}
-#searchInput {
-  border: 0 none;
-  overflow: hidden;
-  position: absolute;
-  right: 20px;
-  left: 0px;
-  padding-left: 10px;
-  height: 28px;
-}
-#searchInput:focus {
-  border: none;
-  outline: thin dotted #333;
-  outline: 5px auto -webkit-focus-ring-color;
-  outline-offset: -2px;
-}
-#notesAndSort {
-  background-color: #eee;
-  border-bottom: 1px solid #ebeff2;
-}
-/* item list */
-#noteItemList {
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  top: 0;
-  width: 100%;
-  overflow-y: hidden;
-  background-color: #f7f7f7;
-  padding: 0 5px;
-}
-#noteItemList .item {
-  position: relative;
-  height: 110px;
-  overflow: hidden;
-  cursor: pointer;
-  padding: 5px;
-  border: 1px solid #ebeff2;
-  border-radius: 3px;
-  margin-top: 5px;
-  background-color: #fff;
-}
-#noteItemList .item:hover,
-#noteItemList .contextmenu-hover {
-  background-color: #ddd !important;
-  color: #000000;
-}
-#noteItemList .item-thumb {
-  padding-left: 10px;
-  width: 100px;
-  overflow: hidden;
-  position: absolute;
-  right: 0px;
-  height: 100px;
-  background-color: #fff;
-  margin-right: 5px;
-}
-.item-thumb img {
-  width: 100px;
-}
-#noteItemList .item-desc {
-  position: absolute;
-  left: 0;
-  right: 100px;
-  margin-left: 4px;
-}
-#noteItemList .item-desc .fa {
-  color: #666;
-}
-#noteItemList .item-blog {
-  position: absolute;
-  right: 1px;
-  font-size: 10px;
-  z-index: 2;
-  top: 1px;
-  padding: 3px;
-  cursor: pointer;
-  width: 20px;
-  text-align: center;
-  opacity: 0.5;
-  background-color: #464C5E;
-}
-#noteItemList .item-blog .fa {
-  color: #fff !important;
-}
-#noteItemList .item-blog:hover {
-  opacity: 0.8;
-}
-.item-title {
-  /*font-weight: 400;*/
-  font-size: 16px;
-  height: 22px;
-  line-height: 20px;
-  overflow: hidden;
-  margin-bottom: 0px;
-  color: #000000;
-  border-bottom: dashed 1px #ebeff2;
-}
-/* note */
-/* editor */
-#editorTool {
-  margin: 0;
-  padding: 0;
-  list-style: none;
-}
-#editorTool li {
-  display: inline-block;
-}
-#noteTitle:focus {
-  outline: none !important;
-}
-#editor,
-#mdEditor {
-  z-index: 2;
-  top: 71px;
-  bottom: 0px;
-  right: 0;
-  left: 0;
-  padding: 0;
-  display: none;
-}
-#mdEditor {
-  z-index: 1;
-  background-color: #fff;
-  bottom: 10px;
-}
-#mdEditor #md-section-helper,
-#mdEditor #wmd-input {
-  font-size: 14px;
-  line-height: 22px;
-}
-#mdEditor .navbar-default {
-  height: auto !important;
-  border: none !important;
-}
-#mdEditor .layout-wrapper-l3 {
-  border: none !important;
-}
-#editorContent {
-  position: absolute;
-  top: 30px;
-  bottom: 10px;
-  right: 0;
-  left: 0;
-  overflow: auto;
-}
-/* 包裹iframe */
-#editor .mce-ifr {
-  border: none;
-  overflow: hidden !important;
-  /*不知道哪里设置了auto*/
-  /*border-radius: 5px;*/
-}
-/* 最顶层 */
-#editor .mce-tinymce {
-  border: none;
-}
-/*编辑器按钮*/
-#mceToolbar,
-#wmd-button-bar {
-  position: relative;
-  height: 30px;
-  overflow: hidden;
-  background-color: #fbfcf7;
-}
-/* 编辑器工具 需要important, 因为mce还要有js加载css, 肯定在此之后 */
-/*加高, 之前显得拥挤*/
-.mce-btn-small button {
-  padding: 5px 5px !important;
-  line-height: 20px !important;
-}
-.mce-btn {
-  background-color: #fbfcf7 !important;
-}
-.mce-menubtn.mce-btn-small span {
-  line-height: 20px !important;
-}
-.mce-btn span {
-  font-family: 'Open Sans', 'Helvetica Neue', Arial, 'Hiragino Sans GB', 'Microsoft YaHei', 'WenQuanYi Micro Hei', sans-serif !important;
-}
-.mce-primary button,
-.mce-primary button i {
-  text-shadow: none;
-}
-.mce-primary {
-  background-color: #47a447 !important;
-  border-color: #398439 !important;
-}
-.mce-menu-item:hover,
-.mce-menu-item.mce-selected,
-.mce-menu-item:focus {
-  background-color: #ebeff2;
-}
-.mce-menu-item:hover span,
-.mce-menu-item.mce-selected span,
-.mce-menu-item:focus span {
-  color: #000 !important;
-}
-.mce-menu-item-normal.mce-active {
-  background-color: #ebeff2;
-}
-.tool-split {
-  display: inline-block;
-  line-height: 25px;
-  color: #ddd;
-}
-/*标签与其它工具*/
-#tool {
-  display: none;
-  border-bottom: 1px solid #ddd;
-}
-/* tag */
-#tag {
-  height: 40px;
-  line-height: 38px;
-}
-#tag .dropdown {
-  line-height: 30px;
-}
-#addTagInput {
-  line-height: 25px;
-  display: none;
-  padding: 0;
-  border: none;
-  background-color: #fbfcf7;
-}
-#addTagInput:focus {
-  outline: none;
-}
-.label-default {
-  background-color: #464C5E;
-}
-.label-red {
-  background-color: #d9534f;
-}
-.label-yellow {
-  background-color: #f0ad4e;
-}
-.label-blue {
-  background-color: #428bca;
-}
-.label-green {
-  background-color: #5cb85c;
-}
-.label {
-  border-radius: 0;
-  font-weight: normal;
-}
-.label i {
-  width: 10px;
-  cursor: pointer;
-  font-style: normal;
-  /*border-left: 1px solid #ccc;*/
-  display: inline-block;
-  padding-left: 3px;
-  opacity: 0;
-}
-.label i:hover {
-  opacity: 1;
-}
-/* leanote nav */
-.leanoteNav {
-  position: absolute;
-  right: 5px;
-  border: 1px solid #ccc;
-  border-radius: 3px;
-  background-color: #fff;
-  opacity: 0.5;
-  z-index: 11;
-  margin-right: 2px;
-}
-.leanoteNav h1 {
-  margin: 0;
-  font-size: 18px;
-  padding: 3px;
-  cursor: pointer;
-}
-.leanoteNav i {
-  padding: 3px;
-}
-.leanoteNav span {
-  display: none;
-}
-.leanoteNav .leanoteNavContent {
-  display: none;
-  overflow: auto;
-}
-.leanoteNav.unfolder {
-  min-width: 200px;
-  max-width: 300px;
-  opacity: 0.8;
-}
-.leanoteNav.unfolder h1 {
-  border-bottom: 1px dashed #ebeff2;
-}
-.leanoteNav.unfolder span {
-  display: inline;
-}
-.leanoteNav.unfolder .leanoteNavContent {
-  display: block;
-  min-height: 30px;
-}
-.leanoteNav ul {
-  margin: 0;
-  padding-left: 23px;
-}
-.leanoteNav ul li {
-  list-style-type: disc;
-}
-.leanoteNav ul li a:hover {
-  color: #0fb264;
-}
-.leanoteNav ul .nav-h2 {
-  margin-left: 20px;
-}
-.leanoteNav ul .nav-h3 {
-  margin-left: 30px;
-}
-.leanoteNav ul .nav-h4 {
-  margin-left: 40px;
-}
-.leanoteNav ul .nav-h5 {
-  margin-left: 50px;
-}
-.scrollTo-a {
-  cursor: pointer !important;
-}
-#mdEditor .leanoteNav {
-  top: 10px;
-  right: 0px;
-}
-#noteRead {
-  position: absolute;
-  left: 0;
-  right: 0;
-  top: 0;
-  bottom: 0;
-  display: none;
-  z-index: 100;
-  padding-left: 5px;
-  background-color: #fff;
-}
-#noteReadContainer {
-  position: relative;
-  width: 100%;
-  height: 100%;
-}
-#noteReadTop {
-  position: absolute;
-  height: 60px;
-  left: 0;
-  right: 0;
-  border-bottom: 1px solid #ebeff2;
-}
-#noteReadTitle {
-  margin: 3px 0;
-}
-#noteReadContent {
-  position: absolute;
-  top: 60px;
-  bottom: 0;
-  right: 0;
-  left: 0;
-  overflow: auto;
-  padding: 3px;
-}
-/*scroll*/
-/*
-::-webkit-scrollbar {
-  width: 5px;
-  height: 8px;
-  background: none;
-}
-
-::-webkit-scrollbar-thumb {
-  background-color: #41586e;
-  opacity: 0.1;
-}
-::-webkit-scrollbar-thumb:hover {
-  background-color:#dadada
-}
-::-webkit-scrollbar-thumb:active {
-  background-color:#606060
-}
-::-webkit-scrollbar-thumb:disabled {
-  background-color:#f9f9f9
-}
-::-webkit-scrollbar-corner {
-  background-color:#f0f0f0
-}
-::-webkit-scrollbar-button {
-  height: 0;
-  background-color:#f0f0f0;
-  background-repeat:no-repeat
-}
-::-webkit-scrollbar-button:vertical {
-  height:0px
-}
-::-webkit-scrollbar-button:horizontal {
-  width:33px
-}
-::-webkit-scrollbar-button:horizontal:increment {
-  background-position:0 -444px
-}
-::-webkit-scrollbar-button:horizontal:decrement {
-  background-position:12px -425px
-}
-::-webkit-scrollbar-button:vertical:increment {
-  background-position:-1px -391px
-}
-::-webkit-scrollbar-button:vertical:decrement {
-  background-position:-1px -358px
-}
-::-webkit-scrollbar-button:hover {
-  background-color:#dadada
-}
-::-webkit-scrollbar-button:horizontal:increment:hover {
-  background-position:0 -548px
-}
-::-webkit-scrollbar-button:horizontal:decrement:hover {
-  background-position:12px -529px
-}
-::-webkit-scrollbar-button:vertical:increment:hover {
-  background-position:-1px -495px
-}
-::-webkit-scrollbar-button:vertical:decrement:hover {
-  background-position:-1px -462px
-}
-::-webkit-scrollbar-button:active {
-  background-color:#606060
-}
-::-webkit-scrollbar-button:horizontal:increment:active {
-  background-position:0 -652px
-}
-::-webkit-scrollbar-button:horizontal:decrement:active {
-background-position:12px -633px
-}
-::-webkit-scrollbar-button:vertical:increment:active {
-background-position:-1px -599px
-}
-::-webkit-scrollbar-button:vertical:decrement:active {
-background-position:-1px -566px
-}
-::-webkit-scrollbar-button:disabled {
-background-color:#f9f9f9
-}
-::-webkit-scrollbar-button:horizontal:increment:disabled {
-background-position:0 -756px
-}
-::-webkit-scrollbar-button:horizontal:decrement:disabled {
-background-position:12px -737px
-}
-::-webkit-scrollbar-button:vertical:increment:disabled {
-background-position:-1px -703px
-}
-::-webkit-scrollbar-button:vertical:decrement:disabled {
-background-position:-1px -670px
-}
-*/
-/*from notebook*/
-/*::-webkit-scrollbar{width:7px;height:7px;}::-webkit-scrollbar-thumb{background-color:rgba(50,50,50,0.3);}::-webkit-scrollbar-thumb:hover{background-color:rgba(50,50,50,0.6);}::-webkit-scrollbar-track{background-color:rgba(50,50,50,0.1);}::-webkit-scrollbar-track:hover{background-color:rgba(50,50,50,0.2);}
-*/
-.fa-calendar {
-  color: #666;
-}
-.dropdown-menu .fa {
-  width: 15px;
-}
-.dropdown-menu span,
-.dropdown-menu a,
-.dropdown-menu li {
-  cursor: default;
-}
-#topNav a {
-  display: inline-block;
-  line-height: 60px;
-}
-.tab-pane {
-  padding: 5px 0 0 0;
-}
-.alert {
-  margin-bottom: 10px;
-}
-.btn {
-  border-radius: 0 !important;
-}
-#notebookNavForNewNote li,
-#notebookNavForNewSharedNote > li {
-  padding-left: 0;
-  border-bottom: 1px solid #ebeff2;
-}
-#notebookNavForNewNote > li:hover,
-#notebookNavForNewNote > li:focus,
-#notebookNavForNewSharedNote > li:hover,
-#notebookNavForNewSharedNote > li:focus {
-  background: none;
-}
-.new-note-left {
-  padding: 0 5px;
-  width: 95px;
-  overflow: hidden;
-  white-space: nowrap;
-  border-right: 1px dashed #ebeff2;
-}
-.new-note-left:hover {
-  background-color: #ebeff2;
-}
-.new-note-right {
-  padding: 0 5px;
-}
-.new-note-right:hover {
-  background-color: #ebeff2;
-}
-#historyList table {
-  width: 100%;
-}
-#historyList .btns {
-  border-top: 1px dashed #eee;
-  padding: 5px 0;
-}
-#left-column {
-  width: 100% !important;
-}
-#editorMask {
-  position: absolute;
-  top: 30px;
-  bottom: 0px;
-  right: -30px;
-  left: 0;
-  background-color: #fbfcf7;
-  z-index: -10;
-  padding-top: 50px;
-  text-align: center;
-}
-#editorMask .fa,
-#editorMask a {
-  font-size: 24px;
-}
-#editorMask a {
-  display: inline-block;
-  border-radius: 3px;
-  border: 1px solid #ebeff2;
-  padding: 10px;
-}
-#editorMask a:hover {
-  background-color: #65bd77;
-  color: #fff;
-}
-html,
-body {
-  background-color: #fbfcf7;
-  overflow: hidden;
-}
-#right-column,
-#newNoteMarkdownBtn,
-#newShareNoteMarkdownBtn,
-.new-split,
-#editorMask,
-#sortType,
-#myProfile,
-#demoRegister {
-  display: none;
-}
-#mainMask {
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  top: 0;
-  background-color: #fbfcf7;
-  text-align: center;
-  padding-top: 100px;
-  z-index: 1000;
-}
-#header {
-  position: absolute;
-  left: 0;
-  right: 0;
-  z-index: 333;
-  color: #ccc;
-}
-#header #leanoteMsg {
-  position: absolute;
-  width: 700px;
-  left: 0;
-  right: 0;
-  text-align: right;
-  line-height: 60px;
-  margin: auto;
-}
-#newNoteWrap {
-  line-height: 40px;
-  margin-top: 10px;
-  margin-left: 10px;
-}
-#newNoteWrap,
-#topNav,
-#lea {
-  opacity: 0;
-}
-#newNoteWrap:hover,
-#topNav:hover,
-#lea:hover {
-  opacity: 1;
-}
-#mainContainer {
-  overflow-y: hidden;
-}
-#newMyNote,
-#newSharedNote {
-  position: relative;
-}
-#newMyNote .dropdown,
-#newSharedNote .dropdown {
-  position: static;
-}
-.dropdown-menu {
-  border: 1px solid #ccc;
-  background-color: #fbfcf7;
-}
-#note {
-  position: absolute;
-  width: 700px;
-  margin: auto;
-  height: 100%;
-  left: 0;
-  right: 0;
-}
-#editor,
-#mdEditor {
-  position: absolute;
-  top: 60px;
-  z-index: 2;
-  background-color: #fbfcf7;
-}
-#wmd-input {
-  border: none;
-  background-color: #fbfcf7 !important;
-  font-size: 16px !important;
-}
-#md-section-helper {
-  display: none;
-}
-#mdEditorPreview {
-  top: 43px !important;
-}
-#mceToolbar,
-#wmd-button-bar {
-  height: 40px;
-  padding: 5px 0;
-}
-.editorBg {
-  height: 3px;
-  background: url(/images/editor/editor-shadow.png) no-repeat center bottom #f9faf4;
-}
-.mce-btn-small i,
-.mce-menubtn.mce-btn-small span,
-.wmd-button > span {
-  opacity: 0.85;
-}
-.mce-ico {
-  font-size: 18px;
-  line-height: 18px;
-  width: 18px;
-  height: 18px;
-}
-.tool-split {
-  line-height: 30px;
-}
-.mce-menubtn.mce-fixed-width.mce-btn-small span {
-  width: 80px;
-}
-.mce-menubtn.mce-btn-small span {
-  font-size: 16px;
-}
-#editorContent_ifr html {
-  border: none !important;
-}
-#noteTop {
-  position: absolute;
-  z-index: 999;
-  left: 0;
-  right: 150px;
-  padding: 15px 0;
-  height: 59px;
-}
-#noteTitleDiv {
-  height: 30px;
-}
-#noteTitle {
-  height: 100%;
-  padding: 0px 3px;
-  width: 100%;
-  border: none;
-  background-color: #fbfcf7;
-}
-#noteList {
-  position: fixed;
-  top: 0;
-  bottom: 0;
-  left: 10px;
-  margin-top: 60px;
-  width: 200px;
-  z-index: 0;
-  opacity: 0.8;
-  overflow-x: hidden;
-  overflow-y: hidden;
-  /*
-	&:hover {
-		#noteItemListWrap {
-			display: block;
-		}
-		#notesAndSort {
-			display: block;
-		}
-	}
-	*/
-}
-#noteList #notesAndSort {
-  display: none;
-}
-#noteList #noteItemListWrap {
-  display: none;
-}
-#notesAndSort {
-  background: none;
-}
-#noteItemList {
-  background: none;
-}
-#noteItemList .item {
-  background: none;
-}
-.item-active,
-#noteItemList .item-active:hover {
-  background-color: #F5F8EA !important;
-  color: #000;
-}
-.item-active .item-desc .fa,
-#noteItemList .item-active:hover .item-desc .fa {
-  color: #666 !important;
-}
-.item-active .item-title,
-#noteItemList .item-active:hover .item-title {
-  color: #000;
-}
-#leanoteNav {
-  background-color: #fbfcf7;
-  opacity: 0.3;
-  right: -30px;
-}
-.new-note-right {
-  padding: 0 2px;
-}
-#loading {
-  display: inline-block;
-  width: 20px;
-  height: 20px;
-  content: url(../../images/loading-a-20-black.gif);
-  margin-top: 10px;
-  visibility: hidden;
-}
-#moreBtn {
-  right: 0 !important;
-}
-#toggleEditorMode {
-  margin: 0 10px !important;
-}
-#upload {
-  position: absolute;
-  z-index: 0;
-  bottom: 0;
-  right: 0;
-  left: 0px;
-  padding: 0;
-  background-color: #fff;
-  text-align: center;
-  display: none;
-}
-#upload #drop {
-  width: 100%;
-  height: 100%;
-  padding-top: 100px;
-}
-#drop.in {
-  border: 1px solid #000000;
-}
-#drop.hover {
-  border: 2px solid #000000;
-}
-#uploadMsg {
-  position: absolute;
-  top: 3px;
-  right: 3px;
-  bottom: 10px;
-  overflow: scroll;
-  list-style: none;
-}
-#searchNotebookForAddDropdownList {
-  left: 0;
-}
-#searchNotebookForAdd {
-  background: none;
-}
-.writting-hide {
-  display: none;
-}
-@media screen and (max-width: 800px) {
-  #leanoteMsg {
-    display: none;
-  }
-  #noteItemList,
-  #notebook,
-  #leftNotebook,
-  .slimScrollDiv,
-  #editorContent_ifr,
-  .mce-edit-area,
-  .mce-container-body,
-  .mce-tinymce,
-  #editor .mce-ifr,
-  .wmd-input,
-  #noteReadContent,
-  #attachList,
-  #tags {
-    overflow: scroll !important;
-    -webkit-overflow-scrolling: touch !important;
-  }
-}
-@media screen and (max-device-width: 1024px) and (orientation: landscape) {
-  #noteItemList,
-  #notebook,
-  #leftNotebook,
-  .slimScrollDiv,
-  #editorContent_ifr,
-  .mce-edit-area,
-  .mce-container-body,
-  .mce-tinymce,
-  #editor .mce-ifr,
-  .wmd-input,
-  #noteReadContent,
-  #attachList,
-  #tags {
-    overflow: scroll !important;
-    -webkit-overflow-scrolling: touch !important;
-  }
-}
-#editorContent {
-  border: none;
-}
-#editorContent .ace-tomorrow {
-  background-color: #fbfcf7;
-}
diff --git a/public/css/theme/writting-overwrite.less b/public/css/theme/writting-overwrite.less
deleted file mode 100644
index 9f6db916..00000000
--- a/public/css/theme/writting-overwrite.less
+++ /dev/null
@@ -1,1157 +0,0 @@
-@import "basic.less";
-
-@bgColor: #fff;
-@headerBgColor: #25313e;
-@fontFamily: 'Open Sans','Helvetica Neue',Arial,'Hiragino Sans GB','Microsoft YaHei','WenQuanYi Micro Hei',sans-serif;
-@aWhiteColor: #fff;
-@aBlackColor: #000;
-@borderColor: #EBEFF2;
-@headerHeight: 60px;
-@headerHeightNoBorder: 59px;
-@hColor: #0fb264; // #47a447;// 更深 #198764; // boostrap: #5cb85c; bootstrap:hover #47a447; // #5AD4A0; // #47a447
-@titleColor: @hColor;
-@fontSize: 14px;
-@leftNotebookWidth: 170px;
-@noteListWidth: 250px;
-@noteActiveBg: #65bd77;
-
-@bgColor: #fbfcf7;
-@headerBgColor: #fbfcf7;
-@fontFamily: 'Open Sans','Helvetica Neue',Arial,'Hiragino Sans GB','Microsoft YaHei','WenQuanYi Micro Hei',sans-serif;
-@aWhiteColor: #fff;
-@aBlackColor: #000;
-@borderColor: #EBEFF2;
-@headerHeight: 60px;
-@hColor: #0fb264; // #47a447;// 更深 #198764; // boostrap: #5cb85c; bootstrap:hover #47a447; // #5AD4A0; // #47a447
-@titleColor: @hColor;
-@fontSize: 16px;
-@leftNotebookWidth: 170px;
-@noteListWidth: 250px;
-@noteActiveBg: #65bd77;
-@editorWidth: 700px;
-
-
-// font
-@font-face {
-  font-family: 'Open Sans';
-  font-style: normal;
-  font-weight: 300;
-  src: local('Open Sans Light'), local('OpenSans-Light'), url('../../fonts/open-sans2/DXI1ORHCpsQm3Vp6mXoaTXhCUOGz7vYGh680lGh-uXM.woff') format('woff');
-}
-@font-face {
-  font-family: 'Open Sans';
-  font-style: normal;
-  font-weight: 400;
-  src: local('Open Sans'), local('OpenSans'), url('../../fonts/open-sans2/cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff') format('woff');
-}
-@font-face {
-  font-family: 'Open Sans';
-  font-style: normal;
-  font-weight: 700;
-  src: local('Open Sans Bold'), local('OpenSans-Bold'), url('../../fonts/open-sans2/k3k702ZOKiLJc3WVjuplzHhCUOGz7vYGh680lGh-uXM.woff') format('woff');
-}
-@font-face {
-  font-family: 'Open Sans';
-  font-style: italic;
-  font-weight: 400;
-  src: local('Open Sans Italic'), local('OpenSans-Italic'), url('../../fonts/open-sans2/xjAJXh38I15wypJXxuGMBobN6UDyHWBl620a-IRfuBk.woff') format('woff');
-}
-
-/*"HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue", Helvetica, "Microsoft Yahei", Verdana, Simsun, "Segoe UI", "Segoe UI Web Regular", "Segoe UI Symbol",  "BBAlpha Sans", "S60 Sans", Arial, sans-serif;*/
-
-@selectionBg: @aBlackColor;
-@selectionColor: #fff;
-::selection { background:@selectionBg; color:@selectionColor; } 
-::-moz-selection { background:@selectionBg; color:@selectionColor; } 
-::-webkit-selection { background:@selectionBg; color:@selectionColor; }
-
-html,body {
-	background-color: @bgColor;
-}
-body {
-  font-family: @fontFamily;
-  font-weight: 300;
-  font-size: @fontSize;
-}
-
-a {
-  color: @aBlackColor;
-  cursor: pointer;
-}
-
-a:hover {
-  text-decoration: none !important;
-  color: @aBlackColor;
-}
-
-// 原生的a
-a.raw {
-	color: #428bca;
-}
-a.raw:hover {
-	color: #2a6496;
-}
-
-/* header */
-
-#header {
-  height: @headerHeight;
-  background-color: @headerBgColor;
-  color: @aWhiteColor;
-  a {
-	  color: #ccc;//@aWhiteColor;
-  }
-  li {
-	  color: @aBlackColor;
-  }
-  li a {
-	  color: @aBlackColor;
-  }
-  border-bottom: 1px solid @borderColor;
-
-  /* for app */
-  webkit-user-select: none; /* 还不知 */
-  -webkit-app-region: drag; /* -webkit-app-region: no-drag; */
-}
-
-#searchWrap, #logo, #switcher, 
-#leftNotebook, 
-.noteSplit
-{
-	display: none;	
-}
-
-#header ul {
-  margin:0;
-  padding:0;
-  list-style: none;
-}
-#header ul li.dropdown {
-  display: inline-block;
-  height: @headerHeight;
-}
-
-#header ul > li > a.dropdown-toggle {
-  display: block;
-  padding: 15px 5px 0 0;
-  position: relative;
-}
-
-#header span.icon {
-  display: inline-block;
-  font-size: 28px;
-  color: #999999;
-}
-
-.dropdown-menu {
-  border-radius: 0;
-  margin:0;
-  -webkit-box-shadow: none;
-  box-shadow: none;
-  border: 1px solid @hColor;
-  overflow: visible;
-}
-.dropdown-menu li {
-  padding-left: 10px;
-  width: 100%;
-  height: 30px; // 父设置了line-height, 子下拉也受影响, "新建笔记"
-  line-height: 30px;
-}
-.dropdown-menu > li > a {
-  color: @aBlackColor;
-  display: inline-block;
-  padding: 3px 3px;
-}
-.dropdown-menu>li:hover, .dropdown-menu>li:focus {
-  background-color: @borderColor;
-}
-.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
-  background-color: @borderColor;
-}
-
-.ios7-a {
-  display: inline-block;
-  padding: 0 10px 0 5px;
-  height: 40px;
-  vertical-align: middle;
-  line-height: 38px;
-  cursor: pointer; 
-}
-
-/*********************/
-#page {
-  overflow: auto;
-  position: absolute;
-  top: 0;
-  left: 0;
-  bottom: 0;
-  right: 0;
-}
-#pageInner {
-  position: absolute;
-  top: 0;
-  left: 0;
-  height: 100%;
-  width: 100%;
-  overflow: hidden;
-}
-#mainContainer {
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  overflow: auto;
-  zoom: 1;
-}
-
-
-
-
-#search {
-  border: #bababa 1px solid;
-  background-color: #fff;
-  white-space: nowrap;
-  position: absolute;
-  height: 30px;
-  left:3px;
-  right:60px;
-  margin-top: 3px;
-}
-#search label {
-  display: none;
-}
-#searchButton {
-  border: 0 none;
-  width: 16px;
-  height: 16px;
-  overflow: hidden;
-  cursor: pointer;
-  position: absolute;
-  right:3px;
-  top: 5px;
-}
-#searchInput {
-  border: 0 none;
-  overflow: hidden;
-  position: absolute;
-  right:20px;
-  left: 0px;
-  padding-left: 10px;
-  height: 28px;
-}
-#searchInput:focus {
-  border: none;
-  outline:thin dotted #333;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px
-}
-
-#notesAndSort {
-  background-color: #eee; // #65bd77; // @bgColor;
-  border-bottom: 1px solid @borderColor;
-  a.dropdown-toggle {
-	  // color: #fff;
-  }
-}
-
-/* item list */
-#noteItemList {
-  position: absolute;
-  left:0;
-  right:0;
-  bottom: 0;
-  top: 0;
-  width: 100%;
-  overflow-y: hidden;
-  background-color: #f7f7f7;
-  padding: 0 5px;
-}
-#noteItemList .item {
-  position: relative;
-  height: 110px;
-  overflow: hidden;
-  cursor: pointer;
-  padding: 5px;
-  border: 1px solid @borderColor;
-  border-radius: 3px;
-  margin-top: 5px;
-  background-color: #fff;
-}
-
-#noteItemList .item:hover, 
-#noteItemList .contextmenu-hover {
-  background-color: #ddd !important;
-  color: @aBlackColor;
-  .item-title {
-    // color: @aBlackColor;
-    //font-weight: 800;
-  }
-}
-
-#noteItemList .item-thumb  {
-  padding-left: 10px;
-  width: 100px; 
-  height: 100px; 
-  overflow: hidden;
-  position: absolute; 
-  right: 0px;
-  height: 100px;
-  background-color: #fff;
-  margin-right: 5px;
-}
-  .item-thumb img {
-     width: 100px;
-  }
-#noteItemList .item-desc {
-  position: absolute; 
-  left: 0;
-  right: 100px;
-  margin-left: 4px;
-  .fa { // folder, calender 颜色暗些
-  	color: #666;
-  }
-}
-// blog
-#noteItemList .item-blog {
-  position: absolute; 
-  right: 1px;
-  font-size: 10px;
-  z-index: 2;
-  top: 1px;
-  padding: 3px;
-  cursor: pointer;
-  .fa {
-	  color: #fff !important;
-  }
-  width: 20px;
-  text-align: center;
-  opacity: 0.5;
-  &:hover {
-	  opacity: 0.8;
-  }
-  background-color: #464C5E;
-}
-.item-title {
-    /*font-weight: 400;*/
-    font-size: 16px;
-    height: 22px;
-    line-height: 20px;
-    overflow: hidden;
-    margin-bottom: 0px;
-    color: @aBlackColor;
-    border-bottom: dashed 1px @borderColor;
-  }
-  
-/* note */
-
-/* editor */
-#editorTool {
-  margin: 0;
-  padding: 0;
-  list-style: none;
-  // width: 200px;
-}
-#editorTool li {
-  display: inline-block;
-}
-
-
-#noteTitle:focus {
-  // outline:thin dotted #333;outline:1px auto -webkit-focus-ring-color;outline-offset:-2px
-  outline: none !important;
-  // border: 1px solid @hColor;
-}
-
-#editor, #mdEditor{
-  z-index: 2;
-  top: 71px; 
-  bottom: 0px; 
-  right: 0; 
-  left: 0;  
-  padding: 0; // 0px 0px 0px 0px;
-	display: none;
-}
-#mdEditor {
-	z-index: 1;
-	background-color: #fff;
-    bottom: 10px; 
-    #md-section-helper, #wmd-input {
-		font-size: 14px;
-		line-height: 22px;			
-    }
-	.navbar-default {
-		height: auto !important;
-		border: none !important;
-	}
-	.layout-wrapper-l3 {
-		border: none !important;
-	}
-}
-#editorContent {
-  position: absolute;
-  top:30px;
-  bottom: 10px; 
-  right: 0; 
-  left: 0;
-  overflow: auto; // 不设置editor隐藏时没有scroll
-}
-#editorContent_ifr {
-	// padding-top: 10px;
-}
-
-/* 包裹iframe */
-#editor .mce-ifr {
-  border: none;
-  // padding: 10px;
-  overflow: hidden !important; /*不知道哪里设置了auto*/
-  /*border-radius: 5px;*/
-  // border: 1px solid @borderColor;
-  // border-top-left-radius: 5px;
-  // border-bottom-left-radius: 5px;
-}
-
-/* 最顶层 */
-#editor .mce-tinymce {
-  border: none;
-}
-#editor iframe {
-}
-/*编辑器按钮*/
-#mceToolbar, #wmd-button-bar {
-  position: relative; 
-  height: 30px; 
-  overflow: hidden; 
-  background-color: @bgColor;
-}
-/* 编辑器工具 需要important, 因为mce还要有js加载css, 肯定在此之后 */
-
-/*加高, 之前显得拥挤*/
-.mce-btn-small button {
-  padding: 5px 5px !important;
-  line-height: 20px !important;
-}
-.mce-btn {
-  background-color: @bgColor !important;
-}
-.mce-menubtn.mce-btn-small span {
-  line-height: 20px !important;
-}
-.mce-btn span {
-  font-family: @fontFamily !important;
-}
-.mce-primary button, .mce-primary button i {
-	text-shadow: none;
-}
-.mce-primary {
-	background-color: #47a447 !important;
-	border-color: #398439 !important;
-}
-// 下拉
-.mce-menu-item:hover, .mce-menu-item.mce-selected, .mce-menu-item:focus {
-	background-color: @borderColor;
-	span {
-		color: #000 !important;
-	}
-}
-// 下拉选中
-.mce-menu-item-normal.mce-active {
-	background-color: @borderColor;
-}
-// tool的分隔
-.tool-split {
-	display: inline-block;
-	line-height: 25px;	
-	color: #ddd;
-}
-
-/*标签与其它工具*/
-#tool {
-	display: none;
-  border-bottom: 1px solid #ddd;
-}
-
-/* tag */
-#tag {
-  height: 40px;
-  line-height: 38px
-}
-// 前面的38影响了dropdown
-#tag .dropdown {
-  line-height: 30px;
-}
-#addTagInput {
-  line-height: 25px;
-  display: none;
-  padding:0;
-  border: none;
-  background-color: @bgColor;
-}
-#addTagInput:focus {
-  outline: none;
-}
-.label-default {
-  background-color: #464C5E;
-}
-.label-red {
-  background-color: #d9534f;
-}
-.label-yellow {
-  background-color: #f0ad4e;
-}
-.label-blue {
-  background-color: #428bca;
-}
-.label-green {
-  background-color: #5cb85c;
-}
-.label {
-  border-radius: 0;
-  font-weight: normal;
-}
-.label i {
-  width: 10px;
-  cursor: pointer;
-  font-style: normal;
-  /*border-left: 1px solid #ccc;*/
-  display: inline-block;
-  padding-left: 3px;
-  opacity: 0;
-}
-.label i:hover {
-  opacity: 1;
-  // font-weight: bold;
-}
-
-/* leanote nav */
-
-.leanoteNav {
-  position: absolute; 
-  right: 5px;
-  border: 1px solid #ccc; 
-  border-radius: 3px;
-  background-color: #fff;
-  opacity: 0.5;
-  // display: none;
-  z-index: 11;
-  margin-right: 2px;
-  h1 {
-	margin:0;
-  	font-size: 18px;
-  	padding: 3px;
-  	cursor: pointer;
-  }
-  i {
-    padding: 3px;
-  }
-  span {
-  	display: none;
-  }
-  .leanoteNavContent {
-  	display: none;
-	overflow: auto;
-  } 
-}
-
-.leanoteNav.unfolder {
-  min-width: 200px;
-  max-width: 300px;
-  // bottom: 1px;
-  opacity: 0.8;
-  h1 {
-  	border-bottom: 1px dashed @borderColor;
-  }
-  span {
-	  display: inline;
-  }
-  
-  .leanoteNavContent {
-  	display: block;
-	min-height: 30px;
-  }
-}
-
-.leanoteNav ul {
-  margin:0;
-  padding-left: 23px;
-  li {
-  	list-style-type: disc;
-  	a {
-  		&:hover {
-  			color: @hColor;
-  		}	
-  	}
-  }
-}
-.leanoteNav ul .nav-h1 {
-}
-.leanoteNav ul .nav-h2 {
-  margin-left: 20px;
-}
-.leanoteNav ul .nav-h3 {
-  margin-left: 30px;
-}
-.leanoteNav ul .nav-h4 {
-  margin-left: 40px;
-}
-.leanoteNav ul .nav-h5 {
-  margin-left: 50px;
-}
-.scrollTo-a {
-  cursor: pointer !important;
-}
-
-#mdEditor .leanoteNav {
-	top: 10px;
-	right: 0px;
-}
-
-//---------------
-// note for read
-#noteRead {
-	position: absolute;
-	left: 0;
-	right: 0;
-	top: 0;
-	bottom: 0;
-	display: none;
-	z-index: 100;
-	padding-left: 5px;
-	background-color: #fff;
-}
-#noteReadContainer {
-	position: relative;
-	width: 100%;
-	height: 100%;
-}
-@noteReadTopHeight: 60px;
-#noteReadTop {
-	position: absolute;
-	height: @noteReadTopHeight;
-	left:0;
-	right: 0;
-	border-bottom: 1px solid @borderColor;
-}
-#noteReadTitle {
-	margin: 3px 0;
-}
-#noteReadContent {
-	position: absolute;
-	top: @noteReadTopHeight;
-	bottom: 0;
-	right: 0;
-	left: 0;
-	overflow: auto;
-	padding: 3px;
-}
-
-@sbc: @bgColor;
-
-/*scroll*/
-/*
-::-webkit-scrollbar {
-  width: 5px;
-  height: 8px;
-  background: none;
-}
-
-::-webkit-scrollbar-thumb {
-  background-color: #41586e;
-  opacity: 0.1;
-}
-::-webkit-scrollbar-thumb:hover {
-  background-color:#dadada
-}
-::-webkit-scrollbar-thumb:active {
-  background-color:#606060
-}
-::-webkit-scrollbar-thumb:disabled {
-  background-color:#f9f9f9
-}
-::-webkit-scrollbar-corner {
-  background-color:#f0f0f0
-}
-::-webkit-scrollbar-button {
-  height: 0;
-  background-color:#f0f0f0;
-  background-repeat:no-repeat
-}
-::-webkit-scrollbar-button:vertical {
-  height:0px
-}
-::-webkit-scrollbar-button:horizontal {
-  width:33px
-}
-::-webkit-scrollbar-button:horizontal:increment {
-  background-position:0 -444px
-}
-::-webkit-scrollbar-button:horizontal:decrement {
-  background-position:12px -425px
-}
-::-webkit-scrollbar-button:vertical:increment {
-  background-position:-1px -391px
-}
-::-webkit-scrollbar-button:vertical:decrement {
-  background-position:-1px -358px
-}
-::-webkit-scrollbar-button:hover {
-  background-color:#dadada
-}
-::-webkit-scrollbar-button:horizontal:increment:hover {
-  background-position:0 -548px
-}
-::-webkit-scrollbar-button:horizontal:decrement:hover {
-  background-position:12px -529px
-}
-::-webkit-scrollbar-button:vertical:increment:hover {
-  background-position:-1px -495px
-}
-::-webkit-scrollbar-button:vertical:decrement:hover {
-  background-position:-1px -462px
-}
-::-webkit-scrollbar-button:active {
-  background-color:#606060
-}
-::-webkit-scrollbar-button:horizontal:increment:active {
-  background-position:0 -652px
-}
-::-webkit-scrollbar-button:horizontal:decrement:active {
-background-position:12px -633px
-}
-::-webkit-scrollbar-button:vertical:increment:active {
-background-position:-1px -599px
-}
-::-webkit-scrollbar-button:vertical:decrement:active {
-background-position:-1px -566px
-}
-::-webkit-scrollbar-button:disabled {
-background-color:#f9f9f9
-}
-::-webkit-scrollbar-button:horizontal:increment:disabled {
-background-position:0 -756px
-}
-::-webkit-scrollbar-button:horizontal:decrement:disabled {
-background-position:12px -737px
-}
-::-webkit-scrollbar-button:vertical:increment:disabled {
-background-position:-1px -703px
-}
-::-webkit-scrollbar-button:vertical:decrement:disabled {
-background-position:-1px -670px
-}
-*/
-
-/*from notebook*/
-/*::-webkit-scrollbar{width:7px;height:7px;}::-webkit-scrollbar-thumb{background-color:rgba(50,50,50,0.3);}::-webkit-scrollbar-thumb:hover{background-color:rgba(50,50,50,0.6);}::-webkit-scrollbar-track{background-color:rgba(50,50,50,0.1);}::-webkit-scrollbar-track:hover{background-color:rgba(50,50,50,0.2);}
-*/
-
-#editorContent_ifr {
-	// border: 1px solid red;
-}
-
-.fa-calendar {
-	color: #666;
-}
-.dropdown-menu .fa {
-	width: 15px;
-}
-.dropdown-menu span, .dropdown-menu a, .dropdown-menu li {
-	cursor: default;
-}
-
-// 顶部导航, 博客
-#topNav a {
-	display: inline-block;
-	line-height: 60px;
-}
-
-.tab-pane {
-	padding: 5px 0 0 0;
-}
-.alert {
-	margin-bottom: 10px;
-}
-
-.btn {
-	border-radius: 0 !important;
-}
-
-.mce-container-body iframe {
-  //overflow-x: hidden; // firefox 不能要
-  //overflow-y: hidden;
-}
-// 新建笔记item
-#notebookNavForNewNote li, #notebookNavForNewSharedNote > li {
-	padding-left: 0;
-	border-bottom: 1px solid @borderColor;
-}
-#notebookNavForNewNote > li:hover, #notebookNavForNewNote > li:focus,
-#notebookNavForNewSharedNote > li:hover, #notebookNavForNewSharedNote > li:focus {
-	background: none;
-}
-
-.new-note-left {
-	padding: 0 5px;
-	width: 95px;
-	overflow: hidden;
-	white-space:nowrap;
-	border-right: 1px dashed @borderColor;
-	&:hover {
-		background-color:@borderColor;
-	}
-}
-.new-note-right {
-	padding: 0 5px;
-	&:hover {
-		background-color:@borderColor;
-	}
-}
-
-// 历史记录
-#historyList {
-	table {
-		width: 100%;
-	}
-	.btns{
-		border-top: 1px dashed #eee;
-		padding: 5px 0;
-	}
-}
-
-#left-column {
-	width: 100% !important;
-}
-#editorMask {
-	position: absolute; 
-  top: 30px; 
-  bottom: 0px; right: -30px; 
-  left: 0; 
-	background-color: #fbfcf7;
-	z-index: -10;
-	.fa, a {
-		font-size: 24px;
-	}
-	padding-top: 50px;
-	text-align: center;
-	a {
-		display: inline-block;
-		border-radius: 3px;
-		border: 1px solid @borderColor;
-		padding: 10px;
-		&:hover {
-			background-color: @noteActiveBg;
-			color: #fff;
-		}
-	}
-}
-
-//---------------
-
-html,body {
-	background-color: @bgColor;
-	overflow: hidden;
-	
-}
-
-#right-column, 
-#newNoteMarkdownBtn, 
-#newShareNoteMarkdownBtn,
-.new-split,
-#editorMask,
-#sortType,
-#myProfile,
-#demoRegister
-{
-	display: none;
-}
-#mainMask {
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  top: 0;
-  background-color: @bgColor;
-  text-align: center;
-  padding-top: 100px;
-  z-index: 1000;
-}
-
-#header {
-	position: absolute;
-	left:0;
-	right:0;
-	z-index:333;
-	#leanoteMsg {
-		position: absolute;
-		width: 700px;
-		left:0;
-		right:0;
-		text-align: right;
-		line-height: 60px;
-		margin:auto;
-	}
-	color: #ccc;
-}
-
-#newNoteWrap {
-	line-height: 40px; margin-top: 10px;
-	margin-left: 10px;
-}
-
-#newNoteWrap, #topNav, #lea {
-	opacity: 0;
-	&:hover {
-		opacity: 1;
-	}
-}
-
-#mainContainer {
-	overflow-y: hidden;
-}
-#newMyNote, #newSharedNote {
-	position: relative;
-	.dropdown-menu {
-	}
-	.dropdown {
-		position: static;
-	}
-}
-.dropdown-menu {
-	border: 1px solid #ccc;
-	background-color: @bgColor;
-}
-
-#note {
-	position: absolute;
-	width: @editorWidth;
-	margin: auto;
-	height: 100%;
-	left: 0;
-	right: 0;
-}
-
-#editor, #mdEditor {
-	position: absolute;
-	top: @headerHeight;
-	z-index: 2;
-  background-color: #fbfcf7;
-}
-#wmd-input {
-	border: none;
-	background-color: @bgColor !important;
-	font-size: 16px !important;
-}
-#md-section-helper {
-	display: none;
-}
-#mdEditorPreview {
-	top: 43px !important; // 为了显示工具栏背景
-}
-
-#mceToolbar, #wmd-button-bar {
-	height: 40px;
-	padding: 5px 0;
-}
-.editorBg {
-	height: 3px;
-	background: url(/images/editor/editor-shadow.png) no-repeat center bottom #F9FAF4;
-}
-.mce-btn-small i, .mce-menubtn.mce-btn-small span, .wmd-button > span {
-	opacity: 0.85;
-}
-.mce-ico {
-	font-size: 18px;
-	line-height: 18px;
-	width: 18px;
-	height: 18px;
-}
-.tool-split {
-	line-height: 30px;
-}
-
-.mce-menubtn.mce-fixed-width.mce-btn-small span {
-	width: 80px;
-}
-.mce-menubtn.mce-btn-small span {
-	font-size: 16px;
-}
-#editorContent_ifr html {
-	border: none !important;
-}
-#noteTop{
-	position: absolute;
-	z-index:999;
-	left:0;
-	right: 150px;
-	padding: 15px 0;
-	height: @headerHeightNoBorder;
-}
-#noteTitleDiv {
-  height: 30px;
-}
-#noteTitle {
-  height: 100%;
-  padding: 0px 3px;
-  width: 100%;
-  border: none;
-  background-color: @bgColor;
-}
-
-//--------
-
-#noteList {
-	position: fixed;
-	top:0;
-	bottom:0;
-	left: 10px;
-	margin-top: @headerHeight;
-	width: 200px;
-	z-index: 0;
-	opacity: 0.8;
-	overflow-x: hidden;
-	overflow-y: hidden;
-	#notesAndSort {
-		display: none;
-	}
-	#noteItemListWrap {
-		display: none;
-	}
-	/*
-	&:hover {
-		#noteItemListWrap {
-			display: block;
-		}
-		#notesAndSort {
-			display: block;
-		}
-	}
-	*/
-}
-#notesAndSort {
-	background: none;
-}
-#noteItemList {
-	background: none;
-	.item {
-		background: none;
-	}
-}
-.item-active, #noteItemList .item-active:hover {
-	background-color: #F5F8EA !important;
-	color: #000;
-	.item-desc .fa {
-		 color: #666 !important;
-	  }
-  .item-title {
-    color: #000;
-    // font-weight: 800;
-  }
-}
-
-#leanoteNav {
-	background-color: @bgColor;
-	opacity: 0.3;
-	right: -30px;
-}
-
-.new-note-right {
-	padding: 0 2px;
-}
-#loading {
-	display: inline-block;
-	width: 20px;
-	height: 20px;
-	content: url(../../images/loading-a-20-black.gif);
-	margin-top:10px;
-	visibility: hidden;
-}
-body {
-}
-#moreBtn {
-	right: 0 !important;
-}
-
-#toggleEditorMode {
-	margin: 0 10px !important;
-}
-// leaui image drop drag
-#upload {
-	position: absolute;
-	z-index: 0;
-	bottom: 0;
-	right: 0;
-	left: 0px;
-	padding: 0;
-	background-color: #fff;
-	text-align: center;
-	display: none;
-}
-#upload #drop {
-	width: 100%;
-	height: 100%;
-	padding-top: 100px;
-}
-#drop.in {
-    border: 1px solid #000000;
-}
-#drop.hover {
-    border: 2px solid #000000;
-}
-#uploadMsg {
-	position: absolute;
-	top: 3px;
-	right: 3px;
-	bottom: 10px;
-	overflow: scroll;
-	list-style: none;
-}
-
-#searchNotebookForAddDropdownList {
-	left: 0;
-}
-#searchNotebookForAdd {
-	background: none;
-}
-.writting-hide {
-	display: none;
-}
-
-@media screen and (max-width: 800px) {
-#leanoteMsg {
-	display: none;
-}
-#noteItemList, #notebook, #leftNotebook, 
-.slimScrollDiv,
-#editorContent_ifr,
-.mce-edit-area,.mce-container-body,.mce-tinymce,
-#editor .mce-ifr,
-.wmd-input,
-#noteReadContent,
-#attachList,
-#tags
-{
-	overflow: scroll !important;
-	-webkit-overflow-scrolling: touch !important; // for iphone
-}
-}
-
-@media screen and (max-device-width: 1024px) and (orientation: landscape) {
-#noteItemList, #notebook, #leftNotebook, 
-.slimScrollDiv,
-#editorContent_ifr,
-.mce-edit-area,.mce-container-body,.mce-tinymce,
-#editor .mce-ifr,
-.wmd-input,
-#noteReadContent,
-#attachList,
-#tags
-{
-	overflow: scroll !important;
-	-webkit-overflow-scrolling: touch !important; // for iphone
-}
-}
-
-#editorContent {
-  border: none;
-}
-#editorContent .ace-tomorrow {
-  background-color: #fbfcf7;
-}
\ No newline at end of file
diff --git a/public/css/theme/writting.css b/public/css/theme/writting.css
index 5aeb4d70..67aa3b66 100644
--- a/public/css/theme/writting.css
+++ b/public/css/theme/writting.css
@@ -1,1967 +1,93 @@
-@font-face {
-  font-family: 'Open Sans';
-  font-style: normal;
-  font-weight: 300;
-  src: local('Open Sans Light'), local('OpenSans-Light'), url('../../fonts/open-sans2/DXI1ORHCpsQm3Vp6mXoaTXhCUOGz7vYGh680lGh-uXM.woff') format('woff');
-}
-@font-face {
-  font-family: 'Open Sans';
-  font-style: normal;
-  font-weight: 400;
-  src: local('Open Sans'), local('OpenSans'), url('../../fonts/open-sans2/cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff') format('woff');
-}
-@font-face {
-  font-family: 'Open Sans';
-  font-style: normal;
-  font-weight: 700;
-  src: local('Open Sans Bold'), local('OpenSans-Bold'), url('../../fonts/open-sans2/k3k702ZOKiLJc3WVjuplzHhCUOGz7vYGh680lGh-uXM.woff') format('woff');
-}
-@font-face {
-  font-family: 'Open Sans';
-  font-style: italic;
-  font-weight: 400;
-  src: local('Open Sans Italic'), local('OpenSans-Italic'), url('../../fonts/open-sans2/xjAJXh38I15wypJXxuGMBobN6UDyHWBl620a-IRfuBk.woff') format('woff');
-}
-/* leanote */
-@font-face {
-  font-family: 'leanoteregular';
-  src: url('../../fonts/leanote/leanote-regular-webfont.eot');
-  src: url('../../fonts/leanote/leanote-regular-webfont.eot?#iefix') format('embedded-opentype'), url('../../fonts/leanote/leanote-regular-webfont.woff') format('woff'), url('../../fonts/leanote/leanote-regular-webfont.ttf') format('truetype'), url('../../fonts/leanote/leanote-regular-webfont.svg#leanoteregular') format('svg');
-  font-weight: normal;
-  font-style: normal;
-}
-#pageInner {
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  top: 0;
-  overflow: hidden;
-}
-*,
-.h1,
-.h2,
-.h3,
-.h4,
-.h5,
-.h6 {
-  font-family: 'Open Sans', 'Helvetica Neue', Arial, 'Hiragino Sans GB', 'Microsoft YaHei', 'WenQuanYi Micro Hei', sans-serif;
-}
-body {
-  font-family: 'Open Sans', 'Helvetica Neue', Arial, 'Hiragino Sans GB', 'Microsoft YaHei', 'WenQuanYi Micro Hei', sans-serif;
-  font-weight: 300;
-  font-size: 16px;
-}
-h1,
-h2,
-h3 {
-  font-family: 'Open Sans', 'Helvetica Neue', Arial, 'Hiragino Sans GB', 'Microsoft YaHei', 'WenQuanYi Micro Hei', sans-serif;
-  font-weight: 300 !important;
-}
-/*"HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue", Helvetica, "Microsoft Yahei", Verdana, Simsun, "Segoe UI", "Segoe UI Web Regular", "Segoe UI Symbol",  "BBAlpha Sans", "S60 Sans", Arial, sans-serif;*/
-#noteItemList,
-#notebook,
-#leftNotebook,
-.slimScrollDiv,
-#editorContent,
-#editorContent_ifr,
-.mce-edit-area,
-.mce-container-body,
-.mce-tinymce,
-#editor .mce-ifr,
-.wmd-input,
-#noteReadContent,
-#attachList,
-#tags,
-.editor-content,
-.preview-container {
-  -webkit-overflow-scrolling: touch !important;
-}
-.ios7-a {
-  display: inline-block;
-  padding: 0 10px 0 5px;
-  height: 36px;
-  vertical-align: middle;
-  line-height: 36px;
-  cursor: pointer;
-}
-#tool {
-  border-bottom: 1px solid #ddd;
-  height: 36px;
-  margin-left: -5px;
-}
-#tag {
-  height: 36px;
-  line-height: 36px;
-}
-#tags {
-  display: block;
-  float: left;
-  line-height: 25px;
-  height: 25px;
-  margin-top: 0;
-}
-#tags .label {
-  margin-right: 2px;
-}
-#tagDropdown {
-  float: left;
-}
-#editor,
-#mdEditor {
-  position: absolute;
-  z-index: 2;
-  top: 36px;
-  bottom: 30px;
-  right: 0;
-  left: 0;
-  padding: 0;
-  display: none;
-}
-#mdEditor {
-  z-index: 1;
-  background-color: #fff;
-}
-#mdEditor #md-section-helper,
-#mdEditor #wmd-input {
-  font-size: 14px;
-  line-height: 22px;
-}
-#tag .dropdown {
-  line-height: 30px;
-}
-.btn {
-  border-radius: 2px;
-}
-.alert {
-  margin-bottom: 10px;
-}
-#logo {
-  font-family: "leanoteregular";
-  font-size: 36px;
-}
-#logo:before {
-  content: "a";
-}
-#switcher span {
-  font-family: "leanoteregular";
-  border-radius: 5px;
-  display: inline-block;
-  cursor: pointer;
-  font-size: 18px;
-  height: 34px;
-  line-height: 34px;
-  margin-top: 8px;
-  padding: 0 5px;
-}
-#switcher span:before {
-  content: "b";
-}
-.noteSplit {
-  position: absolute;
-  top: 0;
-  width: 5px;
-  height: 100%;
-  overflow: hidden;
-  z-index: 5;
-  cursor: col-resize;
-}
-.dropdown-menu {
-  border-radius: 3px;
-  margin: 0;
-  /*overflow-x: hidden; */
-  /*overflow-y: scroll;*/
-  box-shadow: rgba(0, 0, 0, 0.172549) 0px 6px 12px 0px;
-}
-.dropdown-menu:before {
-  content: "";
-  width: 20px;
-  height: 12px;
-  position: absolute;
-  top: -12px;
-  right: 20px;
-  background-image: url("../../images/triangle_2x.png");
-  background-size: 20px 12px;
-}
-.dropdown-submenu .dropdown-menu:before {
-  background: none;
-}
-#searchNotebookForAddDropdownList,
-#searchNotebookForAddShareDropdownList {
-  left: -200px;
-}
-#searchNotebookForAddDropdownList:before,
-#searchNotebookForAddShareDropdownList:before {
-  left: 190px;
-  right: inherit;
-}
-.sync-icon {
-  margin-left: 10px;
-}
-#syncWarning {
-  color: #f0ad4e;
-  display: none;
-  cursor: pointer;
-}
-#myProfile {
-  position: absolute;
-  left: 45px;
-  right: 0;
-  text-align: right;
-}
-#myProfile .dropdown-menu {
-  top: -110px;
-}
-#myProfile .dropdown-menu:before {
-  top: auto;
-  bottom: -12px;
-  transform: rotate(180deg);
-}
-#myProfile .dropdown-toggle {
-  position: relative;
-  width: 100%;
-  display: block;
-}
-#myProfile .dropdown-toggle .username {
-  position: absolute;
-  display: block;
-  left: 0;
-  right: 18px;
-  line-height: 30px;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  overflow: hidden;
-}
-#myProfile .dropdown-toggle .account-more {
-  position: absolute;
-  right: 3px;
-  line-height: 30px;
-}
-.dropdown-menu li {
-  list-style: none;
-  padding-left: 10px;
-  width: 100%;
-  height: 30px;
-  line-height: 30px;
-}
-.dropdown-menu li > a {
-  color: #000000;
-  display: block;
-  padding-right: 20px;
-}
-.dropdown-menu > li > a {
-  padding: 3px 20px 3px 0;
-}
-#notebookNavForNewNote li:hover {
-  background: none;
-}
-#noteList {
-  position: absolute;
-  bottom: 0;
-  top: 0;
-  /*
-  overflow-x: hidden;
-  overflow-y: hidden;
-  */
-  background: #fcfcfc;
-}
-#noteAndEditorMask {
-  position: absolute;
-  left: 0;
-  right: 0;
-  top: 0;
-  bottom: 0;
-  background: #fff;
-  text-align: center;
-  padding-top: 60px;
-  opacity: .3;
-  z-index: 20;
-  display: none;
-}
-.dropdown-submenu {
-  position: relative;
-}
-.dropdown-submenu > ul.dropdown-menu {
-  top: 0;
-  left: 100%;
-  margin-left: -3px !important;
-  -webkit-border-radius: 3px;
-  -moz-border-radius: 3px;
-  border-radius: 3px;
-  padding-top: 10px !important;
-}
-.dropdown-submenu:hover > .dropdown-menu {
-  display: block;
-}
-.dropdown-submenu:after {
-  display: block;
-  content: " ";
-  position: absolute;
-  right: 0;
-  top: 10px;
-  width: 0;
-  height: 0;
-  border-color: transparent;
-  border-style: solid;
-  border-width: 5px 0 5px 5px;
-  border-left-color: #666;
-}
-.dropdown-submenu:hover > a:after {
-  border-left-color: #fff;
-}
-.dropdown-submenu.pull-left {
-  float: none;
-}
-.dropdown-submenu.pull-left > .dropdown-menu {
-  left: -100%;
-  margin-left: 10px;
-  -webkit-border-radius: 6px 0 6px 6px;
-  -moz-border-radius: 6px 0 6px 6px;
-  border-radius: 6px 0 6px 6px;
-}
-.open > .dropdown-menu,
-.dropdown-submenu:hover > .dropdown-menu {
-  opacity: 1;
-  transform: scale(1, 1);
-  -webkit-transform: scale(1, 1);
-  -moz-transform: scale(1, 1);
-  -o-transform: scale(1, 1);
-}
-.dropdown-menu {
-  opacity: 0;
-  display: block;
-  -webkit-transform: scale(0, 0);
-  -webkit-transform-origin: top;
-  -webkit-animation-fill-mode: forwards;
-  -webkit-transition: all 0.2s cubic-bezier(0.34, 1.21, 0.4, 1);
-  -o-transform: scale(0, 0);
-  -o-transform-origin: top;
-  -o-animation-fill-mode: forwards;
-  -o-transition: all 0.2s cubic-bezier(0.34, 1.21, 0.4, 1);
-  -moz-transform: scale(0, 0);
-  -moz-transform-origin: top;
-  -moz-animation-fill-mode: forwards;
-  -moz-transition: all 0.2s cubic-bezier(0.34, 1.21, 0.4, 1);
-  transform: scale(0, 0);
-  transform-origin: top;
-  animation-fill-mode: forwards;
-  transition: all 0.2s cubic-bezier(0.34, 1.21, 0.4, 1);
-}
-.dropdown-list {
-  width: 530px;
-  border-radius: 3px;
-}
-.dropdown-list ul {
-  margin: 0;
-  padding: 0;
-}
-.dropdown-list ul li {
-  float: left;
-  width: 120px;
-  margin-left: 10px;
-  margin-bottom: 10px;
-  border: 1px dashed #ccc;
-}
-.new-note-right {
-  padding: 0 5px;
-  padding-left: 3px;
-}
-#leanoteMsg {
-  line-height: 40px;
-  margin-top: 10px;
-  margin-left: 10px;
-}
-#newNoteWrap {
-  line-height: 40px;
-  margin-top: 10px;
-}
-#searchNotebookForAdd {
-  line-height: normal;
-  width: 200px;
-  margin: 0 10px;
-  margin-bottom: 10px;
-  height: 30px;
-  border-color: #ebeff2;
-  box-shadow: none;
-}
-#myNotebooks .folderBody {
-  padding-top: 3px;
-}
-.folderBody {
-  overflow-x: hidden;
-}
-#searchNotebookForList {
-  height: 30px;
-  width: 90%;
-  margin: 3px auto;
-  margin-top: 0;
-  border-color: #ebeff2;
-  box-shadow: none;
-}
-#noteItemList .item-setting,
-#noteItemList .item-blog,
-#noteItemList .item-star,
-#noteItemList .item-conflict-info {
-  position: absolute;
-  right: 1px;
-  font-size: 10px;
-  z-index: 2;
-  padding: 3px;
-  border-radius: 5px;
-  cursor: pointer;
-  width: 20px;
-  text-align: center;
-  opacity: 0.5;
-  background-color: #464C5E;
-}
-#noteItemList .item-setting .fa,
-#noteItemList .item-blog .fa,
-#noteItemList .item-star .fa,
-#noteItemList .item-conflict-info .fa {
-  color: #fff;
-}
-#noteItemList .item-setting:hover,
-#noteItemList .item-blog:hover,
-#noteItemList .item-star:hover,
-#noteItemList .item-conflict-info:hover {
-  opacity: 0.8;
-}
-#noteItemList .item-blog {
-  top: 1px;
-  display: none;
-}
-#noteItemList .item-setting {
-  bottom: 0;
-  display: none;
-}
-#noteItemList .item-star {
-  bottom: 0;
-  right: 23px;
-  display: none;
-}
-#noteItemList .item-conflict-info {
-  bottom: 0;
-  right: 45px;
-  display: none;
-}
-#noteItemList .item-conflict-info .fa {
-  color: #f0ad4e !important;
-}
-#noteItemList .item-is-star .item-star .fa:before {
-  content: "\f005";
-}
-#noteItemList .item-is-star .item-star .fa {
-  color: yellow !important;
-}
-#noteItemList .item:hover .item-setting,
-#noteItemList .item:hover .item-star {
-  display: block;
-}
-#noteItemList .item:hover.item-conflict .item-conflict-info {
-  display: block;
-}
-.friend-header {
-  position: relative;
-}
-.friend-header .notebook-setting {
-  display: none;
-}
-.friend-header:hover .notebook-setting {
-  display: block;
-}
-.each-user {
-  margin-bottom: 5px;
-  margin-left: 5px;
-  margin-right: 5px;
-  margin-top: 3px;
-  border: 1px solid #eee;
-  border-radius: 3px;
-}
-.notebook-number-notes {
-  position: absolute;
-  right: 10px;
-  top: 0;
-  bottom: 0;
-  z-index: 1;
-  display: inline-block;
-  line-height: 20px !important;
-  height: 20px;
-  margin-top: 5px;
-  padding: 0 3px;
-}
-.notebook-setting {
-  display: none;
-  position: absolute;
-  right: 1px;
-  top: 0;
-  bottom: 0;
-  z-index: 2;
-  line-height: 30px;
-}
-.notebook-setting:before {
-  content: "\f013";
-}
-.ztree li a:hover .notebook-setting {
-  display: block;
-}
-#myTag .folderBody {
-  padding: 0 3px;
-  padding-bottom: 3px;
-  padding-left: 5px;
-}
-#myTag .folderBody li {
-  padding: 3px;
-  line-height: normal;
-}
-#notebookList {
-  border-top: 1px solid rgba(255, 255, 255, 0.05);
-}
-.ztree {
-  padding: 0px;
-}
-#upload {
-  position: absolute;
-  z-index: 0;
-  bottom: 0;
-  right: 0;
-  left: 0px;
-  padding: 0;
-  background-color: #fff;
-  text-align: center;
-  display: none;
-}
-#upload #drop {
-  width: 100%;
-  height: 100%;
-  padding-top: 100px;
-}
-#drop.in {
-  border: 1px solid #000000;
-}
-#drop.hover {
-  border: 2px solid #000000;
-}
-#uploadMsg {
-  position: absolute;
-  top: 3px;
-  right: 3px;
-  bottom: 10px;
-  overflow: scroll;
-  list-style: none;
-}
-#uploadAttach {
-  position: relative;
-  margin-top: 5px;
-}
-.dropzone {
-  text-align: center;
-}
-.dropzone input {
-  display: none;
-}
-.dropzone.in {
-  border: 1px solid #000000;
-}
-.dropzone.hover {
-  border: 2px solid #000000;
-}
-#attachUploadMsg,
-#avatarUploadMsg {
-  list-style-type: none;
-  margin: 0;
-  padding: 0;
-  max-height: 240px;
-  z-index: 3;
-}
-#attachUploadMsg .alert,
-#avatarUploadMsg .alert {
-  margin: 0;
-  padding: 0 3px;
-  margin-top: 10px;
-}
-#attachMenu {
-  width: 450px;
-  padding: 10px 5px;
-}
-#attachList {
-  margin: 0;
-  padding: 0;
-  max-height: 450px;
-  overflow-y: auto;
-}
-#attachList li {
-  display: block;
-  margin: 0;
-  padding: 0 3px;
-  border-radius: 3px;
-  border-bottom: 1px dashed #eee;
-  height: 45px;
-  line-height: 45px;
-}
-#attachList li div {
-  float: left;
-}
-#attachList li .attach-title {
-  width: 290px;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  overflow: hidden;
-}
-#attachList li .attach-process {
-  float: right;
-}
-#attachList li.loading {
-  text-align: center;
-}
-.animated {
-  -webkit-animation-fill-mode: both;
-  -moz-animation-fill-mode: both;
-  -ms-animation-fill-mode: both;
-  -o-animation-fill-mode: both;
-  animation-fill-mode: both;
-  -webkit-animation-duration: 0.5s;
-  -moz-animation-duration: 0.5s;
-  -ms-animation-duration: 0.5s;
-  -o-animation-duration: 0.5s;
-  animation-duration: 0.5s;
-}
-@-webkit-keyframes fadeIn {
-  0% {
-    opacity: 0;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-@-moz-keyframes fadeIn {
-  0% {
-    opacity: 0;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-@-o-keyframes fadeIn {
-  0% {
-    opacity: 0;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-@keyframes fadeIn {
-  0% {
-    opacity: 0;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-.fadeIn {
-  -webkit-animation-name: fadeIn;
-  -moz-animation-name: fadeIn;
-  -o-animation-name: fadeIn;
-  animation-name: fadeIn;
-}
-@-webkit-keyframes fadeInUp {
-  0% {
-    opacity: 0;
-    -webkit-transform: translateY(20px);
-  }
-  100% {
-    opacity: 1;
-    -webkit-transform: translateY(0);
-  }
-}
-@-moz-keyframes fadeInUp {
-  0% {
-    opacity: 0;
-    -moz-transform: translateY(20px);
-  }
-  100% {
-    opacity: 1;
-    -moz-transform: translateY(0);
-  }
-}
-@-o-keyframes fadeInUp {
-  0% {
-    opacity: 0;
-    -o-transform: translateY(20px);
-  }
-  100% {
-    opacity: 1;
-    -o-transform: translateY(0);
-  }
-}
-@keyframes fadeInUp {
-  0% {
-    opacity: 0;
-    transform: translateY(20px);
-  }
-  100% {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-.fadeInUp {
-  -webkit-animation-name: fadeInUp;
-  -moz-animation-name: fadeInUp;
-  -o-animation-name: fadeInUp;
-  animation-name: fadeInUp;
-}
-#historyList img {
-  max-width: 100%;
-}
-#avatar {
-  height: 60px;
-  max-width: 200px;
-  display: inline-block;
-  margin: 10px;
-}
-#noteReadTitle {
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  overflow: hidden;
-}
-#noteReadInfo {
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  overflow: hidden;
-  color: #666;
-}
-.my-link,
-.new-markdown-text-abbr,
-.new-note-text-abbr {
-  display: none;
-}
-#myAvatar {
-  height: 30px;
-  max-width: 30px;
-  overflow: hidden;
-  border-radius: 50%;
-}
-#tool {
-  position: relative;
-}
-#editorBottom {
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  height: 30px;
-  border-top: 1px solid #eee;
-}
-#tag {
-  position: absolute;
-  right: 0;
-  top: 0;
-  left: 5px;
-  bottom: 0;
-}
-#tagColor {
-  left: 10px;
-  top: -130px;
-}
-#tagColor:before {
-  content: "";
-  background-image: none;
-}
-#addTagInput {
-  width: 100px;
-}
-#notesAndSort {
-  height: 36px;
-}
-#noteItemListWrap {
-  position: absolute;
-  left: 0;
-  right: 0;
-  top: 69px;
-  bottom: 3px;
-}
-#mdEditorPreview {
-  position: absolute;
-  top: 35px;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-#left-column,
-#right-column,
-#mdSplitter {
-  position: absolute;
-  top: 0;
-  bottom: 0;
-}
-#mdSplitter {
-  width: 5px;
-  height: 100%;
-  overflow: hidden;
-  z-index: 5;
-  cursor: col-resize;
-  left: 450px;
-  background: none;
-}
-#left-column {
-  left: 0;
-  width: 450px;
-}
-#right-column {
-  left: 450px;
-  right: 0;
-  overflow: hidden;
-}
-.wmd-panel-editor,
-.preview-container,
-#wmd-input {
-  height: 100%;
-}
-.wmd-input,
-.wmd-input:focus,
-#md-section-helper {
-  width: 100%;
-  border: 1px #eee solid;
-  border-radius: 5px;
-  outline: none;
-  font-size: 14px;
-  resize: none;
-  overflow-x: hidden;
-}
-/* 不能为display: none */
-#md-section-helper {
-  position: absolute;
-  height: 0;
-  overflow-y: scroll;
-  padding: 0 6px;
-  top: 10px;
-  /*一条横线....*/
-  z-index: -1;
-  opacity: none;
-}
-.preview-container {
-  overflow: auto;
-}
-.wmd-preview {
-  width: 100%;
-  font-size: 14px;
-  overflow: auto;
-  overflow-x: hidden;
-}
-.wmd-button-row,
-.preview-button-row {
-  padding: 0px;
-  height: auto;
-  margin: 0;
-}
-.wmd-spacer {
-  width: 0px;
-  height: 20px;
-  margin-left: 10px;
-  background-color: Silver;
-  display: inline-block;
-  list-style: none;
-}
-.wmd-button,
-.preview-button {
-  width: 20px;
-  height: 20px;
-  display: inline-block;
-  list-style: none;
-  cursor: pointer;
-  font-size: 17px;
-}
-.wmd-button {
-  margin-left: 10px;
-}
-.preview-button {
-  margin-right: 10px;
-}
-.wmd-button > span,
-.preview-button > span {
-  width: 20px;
-  height: 20px;
-  display: inline-block;
-  font-size: 14px;
-}
-.top-nav {
-  margin: 0 10px;
-  display: inline-block;
-  line-height: 60px;
-}
-.cm-item {
-  position: relative;
-}
-.cm-item .cm-text {
-  position: absolute;
-  left: 23px;
-  right: 10px;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  overflow: hidden;
-}
-.cm-item .cm-text .c-text {
-  display: initial;
-}
-.b-m-mpanel {
-  border-radius: 3px;
-}
-/* item list */
-#noteItemList {
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  width: 100%;
-  overflow-y: scroll;
-  padding: 0 5px;
-}
-#noteItemList .item {
-  position: relative;
-  height: 110px;
-  overflow: hidden;
-  cursor: default;
-  border: 1px solid #ebeff2;
-  border-radius: 3px;
-  margin-top: 5px;
-  background-color: #fff;
-}
-#noteItemList .item:hover,
-#noteItemList .contextmenu-hover {
-  background-color: #ddd !important;
-}
-.item-active,
-#noteItemList .item-active:hover {
-  background-color: #65bd77 !important;
-  color: #fff;
-}
-.item-active .fa,
-#noteItemList .item-active:hover .fa {
-  color: #eee;
-}
-.item-active .item-info .fa,
-#noteItemList .item-active:hover .item-info .fa {
-  color: #eee !important;
-}
-.item-active .item-title,
-#noteItemList .item-active:hover .item-title {
-  color: #fff;
-}
-#noteItemList .item-thumb {
-  width: 100px;
-  overflow: hidden;
-  position: absolute;
-  z-index: 1;
-  right: 0px;
-  top: 4px;
-  height: 100px;
-  background-color: #fff;
-  margin-right: 5px;
-  line-height: 100px;
-  text-align: center;
-}
-.item-thumb img {
-  max-width: 100px;
-}
-.item-title {
-  /*font-weight: 400;*/
-  font-size: 16px;
-  height: 22px;
-  line-height: 20px;
-  overflow: hidden;
-  margin-bottom: 0px;
-  color: #000000;
-  border-bottom: dashed 1px #ebeff2;
-}
-#noteItemList .item-desc {
-  position: absolute;
-  left: 0;
-  top: 4px;
-  right: 0px;
-  margin-left: 4px;
-}
-#noteItemList .item-desc .fa {
-  color: #666;
-}
-#noteItemList .item-image .item-desc {
-  right: 100px;
-}
-.item-info {
-  margin: 0;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  overflow: hidden;
-}
-.desc {
-  margin: 0;
-}
-#editorMask {
-  position: absolute;
-  top: 0px;
-  bottom: 0px;
-  right: 0;
-  left: 0;
-  background-color: #fff;
-  display: none;
-  z-index: -10;
-  padding-top: 50px;
-  text-align: center;
-}
-#editorMask .fa,
-#editorMask a {
-  font-size: 24px;
-}
-#editorMask a {
-  display: inline-block;
-  border-radius: 3px;
-  border: 1px solid #ebeff2;
-  padding: 10px;
-}
-#editorMask a:hover {
-  background-color: #65bd77;
-  color: #fff;
-}
-.note-mask {
-  position: absolute;
-  top: 0px;
-  bottom: 0px;
-  right: 0;
-  left: 3px;
-  z-index: -1;
-}
-#noteMaskForLoading {
-  padding-top: 60px;
-  background: #fff;
-  text-align: center;
-  opacity: .3;
-}
-#themeForm td {
-  padding: 5px;
-  text-align: center;
-}
-#themeForm img {
-  border: 1px solid #eee;
-  padding: 2px;
-}
-.dropdown-menu .divider {
-  margin: 3px 0;
-}
-.ace_eidtor,
-.ace_editor * {
-  font: 12px / normal 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', monospace;
-}
-/* leanote nav */
-.leanoteNav {
-  position: absolute;
-  right: 0px;
-  border: 1px solid #ccc;
-  border-radius: 3px;
-  background-color: #fff;
-  opacity: 0.5;
-  z-index: 11;
-  margin-top: 4px;
-}
-.leanoteNav h1 {
-  margin: 0;
-  font-size: 16px;
-  padding: 3px;
-  cursor: pointer;
-}
-.leanoteNav i {
-  padding: 3px;
-}
-.leanoteNav span {
-  display: none;
-}
-.leanoteNav .leanoteNavContent {
-  display: none;
-  overflow: auto;
-}
-.leanoteNav.unfolder {
-  min-width: 200px;
-  max-width: 300px;
-  opacity: 0.8;
-}
-.leanoteNav.unfolder h1 {
-  border-bottom: 1px dashed #ebeff2;
-}
-.leanoteNav.unfolder span {
-  display: inline;
-}
-.leanoteNav.unfolder .leanoteNavContent {
-  display: block;
-  min-height: 30px;
-}
-.leanoteNav ul {
-  margin: 0;
-  padding-left: 23px;
-}
-.leanoteNav ul li {
-  list-style-type: disc;
-}
-.leanoteNav ul li a:hover {
-  color: #0fb264;
-}
-.leanoteNav ul .nav-h2 {
-  margin-left: 20px;
-}
-.leanoteNav ul .nav-h3 {
-  margin-left: 30px;
-}
-.leanoteNav ul .nav-h4 {
-  margin-left: 40px;
-}
-.leanoteNav ul .nav-h5 {
-  margin-left: 50px;
-}
-.scrollTo-a {
-  cursor: pointer !important;
-}
-#editorContent {
-  padding: 5px;
-  outline: none;
-  margin-top: 5px;
-  bottom: 5px !important;
-}
-#editorContent pre {
-  position: relative;
-  -mo-height: auto !important;
-}
-#editorContent pre .toggle-raw {
-  position: absolute;
-  left: 2px;
-  top: -2px;
-  z-index: 100;
-  display: none;
-}
-#editorContent pre:hover .toggle-raw {
-  display: block;
-}
-.ace_invisible_space {
-  visibility: hidden !important;
-}
-.mce-tinymce-inline {
-  border-width: 0 !important;
-}
-#editorContent a {
-  color: #2a6496;
-  text-decoration: underline;
-}
-#editorContent pre {
-  font: 12px / normal 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', monospace;
-  color: #4D4D4C;
-}
-#editorContent .ace-tomorrow {
-  padding: 0;
-  padding-left: 44px;
-}
-#editorContent .ace-to-pre {
-  padding: 0;
-  padding-left: 5px;
-}
-#editorContent .ace_scrollbar-v {
-  overflow-y: hidden;
-}
-#editorContent .leanote-image-container {
-  display: inline-block;
-  width: 100px;
-}
-#editorContent .leanote-image-container .loader {
-  display: inline-block;
-  vertical-align: top;
-  margin-right: 3px;
-  margin-top: 5px;
-}
-#editorContent .leanote-image-container .progress {
-  display: inline-block;
-  margin: 0;
-  width: 80px;
-}
-.close:focus {
-  outline: none;
-}
-#newMyNote {
-  position: absolute;
-  right: 3px;
-  top: 0;
-  bottom: 0;
-  line-height: 30px;
-  width: 50px;
-}
-#newMyNote * {
-  font-size: 14px;
-}
-#newMyNote .new-split {
-  color: #ccc;
-  display: none;
-}
-#newMyNote #newNoteBtn {
-  display: inline-block;
-  border: 1px solid #eee;
-  border-radius: 5px;
-  text-align: center;
-  height: 25px;
-  width: 20px;
-  line-height: initial;
-}
-#newMyNote #newNoteMarkdownBtn {
-  display: inline-block;
-  border: 1px solid #eee;
-  border-radius: 5px;
-  /* width: 100px; */
-  margin-left: 1px;
-  padding: 0 1px;
-  height: 25px;
-  line-height: initial;
-  text-align: center;
-}
-#myNotebookNavForListNav {
-  position: absolute;
-  line-height: 30px;
-  left: 55px;
-  right: 55px;
-  text-align: center;
-  font-style: 16px;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  overflow: hidden;
-}
-#myNotebookNavForListNav span {
-  cursor: default;
-}
-#searchNote {
-  margin-top: 2px;
-}
-#sortType {
-  position: absolute;
-  left: 4px;
-  line-height: 36px;
-  color: #ccc;
-}
-#starNotes li {
-  position: relative;
-  margin: 0;
-  height: 30px;
-  border-bottom: 1px dashed #eee;
-}
-#starNotes li.selected {
-  background: #eee;
-}
-#starNotes li a {
-  padding-left: 20px;
-  line-height: 30px;
-  display: block;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  overflow: hidden;
-}
-#starNotes li .delete-star {
-  position: absolute;
-  right: 10px;
-  bottom: 0;
-  color: #ccc;
-  display: none;
-  cursor: pointer;
-}
-#starNotes li .delete-star:hover {
-  color: #000;
-}
-#starNotes li:hover .delete-star {
-  display: block;
-}
-#notebookBottom {
-  position: absolute;
-  bottom: 0px;
-  height: 30px;
-  right: 0;
-  left: 0;
-  line-height: 30px;
-  text-align: right;
-  padding-right: 5px;
-  background-color: #f5f6f7;
-  border-top: 1px solid transparent;
-  border-color: rgba(0, 0, 0, 0.05);
-}
-/* editor */
-#editorTool {
-  margin: 0;
-  padding: 0;
-  list-style: none;
-}
-#editorTool li {
-  display: inline-block;
-}
-#noteTitleDiv {
-  position: absolute;
-  left: 0;
-  right: 120px;
-  height: 35px;
-  line-height: 35px;
-  padding-left: 10px;
-}
-#noteTitle {
-  height: 100%;
-  width: 100%;
-  border: none;
-  font-size: 20px;
-}
-#noteTitle:focus {
-  outline: none !important;
-}
-#editorContent {
-  position: absolute;
-  top: 30px;
-  bottom: 10px;
-  right: 0;
-  left: 0;
-  overflow: auto;
-}
-#mdEditor .layout-wrapper-l3 {
-  top: 30px;
-  margin-top: 0 !important;
-  border: none !important;
-  border-radius: 0 !important;
-}
-#noteItemList .item-conflict {
-  border: 2px solid #DBB624;
-}
-#tagNav i,
-#tagNav em {
-  font-style: normal;
-}
-#tagNav .tag-delete {
-  display: none;
-  margin-left: 3px;
-  font-size: 12px;
-}
-#tagNav li:hover .tag-delete {
-  display: inline-block;
-}
-#tagNav a:hover {
-  background: none !important;
-}
-.fa-spin {
-  -webkit-animation: fa-spin 1s infinite linear !important;
-  animation: fa-spin 1s infinite linear !important;
-}
-.context-tips {
-  position: absolute;
-  z-index: 99999;
-  background: #fff;
-  border: 1px solid #ccc;
-  padding: 5px;
-  border-radius: 5px;
-  left: 0px;
-  top: 0px;
-  /* shaddow */
-  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
-  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
-  background-clip: padding-box;
-  overflow: auto;
-  width: 100px;
-  height: 100px;
-  display: none;
-}
-#conflictTips {
-  width: 230px;
-  height: 80px;
-}
-.conflict-title {
-  display: block;
-  text-decoration: underline;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  overflow: hidden;
-}
-/*
- *  STYLE 2
+/**
+ * 写作模式
  */
-/*
-*::-webkit-scrollbar-track
-{
-	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
-	border-radius: 10px;
-	background-color: #F5F5F5;
+body.writting.init #pageInner {
+  display: block;
 }
-
-*::-webkit-scrollbar
-{
-	width: 10px;
-	background-color: #F5F5F5;
-	position: absolute;
-	-webkit-transform: translatez(0);
+body.writting #mainMask,
+body.writting #leftNotebook,
+body.writting .noteSplit,
+body.writting #noteList {
+  display: none;
 }
-
-*::-webkit-scrollbar-thumb
-{
-	border-radius: 10px;
-	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
-	background-color: #D62929;
+body.writting #noteAndEditor {
+  left: 0 !important;
 }
-*/
-html,
-body,
-#page,
-#pageInner {
-  position: absolute;
-  left: 0px;
-  right: 0px;
+body.writting #note {
+  left: 0 !important;
+}
+body.writting #note #noteTitleDiv {
+  left: 100px;
+}
+body.writting #note #noteTitle {
+  text-align: center;
+}
+body.writting #note #editor,
+body.writting #note #mdEditor {
   bottom: 0;
-  top: 0;
-  padding: 0;
-  margin: 0;
-  border-radius: 5px;
-  overflow: hidden;
-  background: transparent;
 }
-.modal-backdrop {
-  right: 5px;
-  left: 5px;
-  bottom: 5px;
-  border-radius: 5px;
+body.writting #note #editor {
+  background-color: #fbfcf7;
 }
-#mainContainer,
-#mainMask {
-  border-radius: 5px;
-}
-#noteAndEditor {
-  background-color: #fff;
-}
-body {
-  -webkit-user-select: none;
-  -webkit-app-region: drag;
-  border: 1px solid #ccc;
-  left: 5px;
-  right: 5px;
-  bottom: 5px;
-  box-shadow: 0px 0px 5px rgba(66, 66, 66, 0.5);
-}
-body.no-drag {
-  -webkit-app-region: no-drag;
-}
-body.init #winTool {
-  display: none;
-}
-body.init #allProcess,
-body.init #syncProcess,
-body.init .loading-footer {
-  display: none;
-}
-body.init #pageInner {
-  display: none;
-}
-#leftNotebook {
-  overflow: hidden;
-  border-radius: 5px 0 0 0;
-}
-#notebook,
-#winTool {
-  overflow: hidden;
-  border-radius: 5px 0 0 0;
-}
-#notebook {
-  top: 25px !important;
-  background: transparent !important;
-}
-#leftNotebook {
-  background: url(images/mohu.png) !important;
-  background-repeat: repeat;
-}
-#notebookBottom {
-  background: transparent !important;
-}
-#notesAndSort,
-.win-tool {
-  -webkit-user-select: none;
-}
-#noteTitle,
-#searchNoteInput,
-#searchNotebookForList,
-#addTagInput,
-#wmd-input,
-#editorContent,
-.noteSplit,
-#notebook {
-  -webkit-app-region: no-drag;
-}
-#mainMask {
+body.writting #note #editorContentWrap {
   position: absolute;
+  padding: 5px 0;
+  top: 40px;
   left: 0;
   right: 0;
   bottom: 0;
-  top: 0;
-  background-color: rgba(255, 255, 255, 0.95);
-  text-align: center;
-  padding-top: 10px;
-  z-index: 1000;
-}
-#mainMask table,
-#mainMask td {
-  width: 100%;
-  height: 100%;
-  border: none;
-  vertical-align: middle;
-}
-#mainMask #syncProcess {
-  margin-top: 20px;
-}
-#mainMask .loading-footer {
-  text-align: center;
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 10px;
-}
-#mainMask .loading-footer a {
-  color: #ccc;
-}
-#presentation {
-  display: none;
-}
-.win-tool {
-  padding: 5px;
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 99999;
-}
-.win-tool a {
-  display: block;
-  float: left;
-  width: 14px;
-  height: 14px;
-  background-size: 14px 14px !important;
-  margin-right: 5px;
-}
-.win-tool .tool-close {
-  background: url(icon/traffic-close@2x.png);
-}
-.win-tool .tool-close:before {
-  content: ' ';
-  background: url(icon/traffic-close-hover@2x.png);
-}
-.win-tool .tool-close-blur {
-  background: url(icon/traffic-disabled@2x.png);
-}
-.win-tool .tool-close-blur:before {
-  content: ' ';
-  background: url(icon/traffic-close-hover@2x.png);
-}
-.win-tool .tool-min {
-  background: url(icon/traffic-minimise@2x.png);
-}
-.win-tool .tool-min:before {
-  content: ' ';
-  background: url(icon/traffic-minimise-hover@2x.png);
-}
-.win-tool .tool-max {
-  background: url(icon/traffic-fullscreen@2x.png);
-}
-.win-tool .tool-max:before {
-  content: ' ';
-  background: url(icon/traffic-zoom-hover@2x.png);
-}
-.win-tool:hover .tool-close,
-.win-tool:hover .tool-close-blur {
-  background: url(icon/traffic-close-hover@2x.png);
-}
-.win-tool:hover .tool-min {
-  background: url(icon/traffic-minimise-hover@2x.png);
-}
-.win-tool:hover .tool-max {
-  background: url(icon/traffic-zoom-hover@2x.png);
-}
-.blur .win-tool a {
-  background: url(icon/traffic-disabled@2x.png);
-}
-@keyframes rond {
-  0% {
-    transform: rotate(0deg);
-  }
-  100% {
-    transform: rotate(360deg);
-  }
-}
-@-webkit-keyframes rond {
-  0% {
-    -webkit-transform: rotate(0deg);
-  }
-  100% {
-    -webkit-transform: rotate(360deg);
-  }
-}
-#loadingLogo {
-  position: relative;
-  width: 100px;
-  display: block;
-  margin: auto;
-  border: 1px solid #4092C5;
-  border-radius: 50%;
-}
-#loadingLogo img {
-  width: 100px;
-  padding: 20px;
-}
-#loadingLogo.loading {
-  animation: rond 2s infinite;
-  -webkit-animation: rond 2s infinite;
-}
-@font-face {
-  font-family: 'Open Sans';
-  font-style: normal;
-  font-weight: 300;
-  src: local('Open Sans Light'), local('OpenSans-Light'), url('../../fonts/open-sans2/DXI1ORHCpsQm3Vp6mXoaTXhCUOGz7vYGh680lGh-uXM.woff') format('woff');
-}
-@font-face {
-  font-family: 'Open Sans';
-  font-style: normal;
-  font-weight: 400;
-  src: local('Open Sans'), local('OpenSans'), url('../../fonts/open-sans2/cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff') format('woff');
-}
-@font-face {
-  font-family: 'Open Sans';
-  font-style: normal;
-  font-weight: 700;
-  src: local('Open Sans Bold'), local('OpenSans-Bold'), url('../../fonts/open-sans2/k3k702ZOKiLJc3WVjuplzHhCUOGz7vYGh680lGh-uXM.woff') format('woff');
-}
-@font-face {
-  font-family: 'Open Sans';
-  font-style: italic;
-  font-weight: 400;
-  src: local('Open Sans Italic'), local('OpenSans-Italic'), url('../../fonts/open-sans2/xjAJXh38I15wypJXxuGMBobN6UDyHWBl620a-IRfuBk.woff') format('woff');
-}
-/*"HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue", Helvetica, "Microsoft Yahei", Verdana, Simsun, "Segoe UI", "Segoe UI Web Regular", "Segoe UI Symbol",  "BBAlpha Sans", "S60 Sans", Arial, sans-serif;*/
-::selection {
-  background: #000000;
-  color: #ffffff;
-}
-::-moz-selection {
-  background: #000000;
-  color: #ffffff;
-}
-::-webkit-selection {
-  background: #000000;
-  color: #ffffff;
-}
-html,
-body {
-  background-color: #fbfcf7;
-}
-*,
-body {
-  font-family: 'Open Sans', 'Helvetica Neue', Arial, 'Hiragino Sans GB', 'Microsoft YaHei', 'WenQuanYi Micro Hei', sans-serif;
-  font-weight: 300;
-  font-size: 16px;
-}
-h1,
-h2,
-h3 {
-  font-family: 'Open Sans', 'Helvetica Neue', Arial, 'Hiragino Sans GB', 'Microsoft YaHei', 'WenQuanYi Micro Hei', sans-serif;
-  font-weight: 300 !important;
-}
-a {
-  color: #000000;
-  cursor: pointer;
-}
-a:hover {
-  text-decoration: none !important;
-  color: #000000;
-}
-a.raw {
-  color: #428bca;
-}
-a.raw:hover {
-  color: #2a6496;
-}
-/* header */
-#header {
-  height: 60px;
-  background-color: #fbfcf7;
-  color: #ffffff;
-  border-bottom: 1px solid #ebeff2;
-  /* for app */
-  webkit-user-select: none;
-  /* 还不知 */
-  -webkit-app-region: drag;
-  /* -webkit-app-region: no-drag; */
-}
-#header a {
-  color: #ccc;
-}
-#header li {
-  color: #000000;
-}
-#header li a {
-  color: #000000;
-}
-#searchWrap,
-#logo,
-#switcher,
-#leftNotebook,
-.noteSplit {
-  display: none;
-}
-#header ul {
-  margin: 0;
-  padding: 0;
-  list-style: none;
-}
-#header ul li.dropdown {
-  display: inline-block;
-  height: 60px;
-}
-#header ul > li > a.dropdown-toggle {
-  display: block;
-  padding: 15px 5px 0 0;
-  position: relative;
-}
-#header span.icon {
-  display: inline-block;
-  font-size: 28px;
-  color: #999999;
-}
-.dropdown-menu {
-  border-radius: 0;
-  margin: 0;
-  -webkit-box-shadow: none;
-  box-shadow: none;
-  border: 1px solid #0fb264;
-  overflow-x: hidden;
   overflow-y: auto;
 }
-.dropdown-menu li {
-  padding-left: 10px;
-  width: 100%;
-  height: 30px;
-  line-height: 30px;
-}
-.dropdown-menu > li > a {
-  color: #000000;
-  display: inline-block;
-  padding: 3px 3px;
-}
-.dropdown-menu > li:hover,
-.dropdown-menu > li:focus {
-  background-color: #ebeff2;
-}
-.dropdown-menu > li > a:hover,
-.dropdown-menu > li > a:focus {
-  background-color: #ebeff2;
-}
-.ios7-a {
-  display: inline-block;
-  padding: 0 10px 0 5px;
-  height: 40px;
-  vertical-align: middle;
-  line-height: 38px;
-  cursor: pointer;
-}
-/*********************/
-#page {
-  overflow: auto;
-  position: absolute;
-  top: 0;
-  left: 0;
-  bottom: 0;
-  right: 0;
-}
-#pageInner {
-  position: absolute;
-  top: 0;
-  left: 0;
-  height: 100%;
-  width: 100%;
-  overflow: hidden;
-}
-#mainContainer {
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  overflow: auto;
-  zoom: 1;
-}
-#search {
-  border: #bababa 1px solid;
-  background-color: #fff;
-  white-space: nowrap;
-  position: absolute;
-  height: 30px;
-  left: 3px;
-  right: 60px;
-  margin-top: 3px;
-}
-#search label {
-  display: none;
-}
-#searchButton {
-  border: 0 none;
-  width: 16px;
-  height: 16px;
-  overflow: hidden;
-  cursor: pointer;
-  position: absolute;
-  right: 3px;
-  top: 5px;
-}
-#searchInput {
-  border: 0 none;
-  overflow: hidden;
-  position: absolute;
-  right: 20px;
-  left: 0px;
-  padding-left: 10px;
-  height: 28px;
-}
-#searchInput:focus {
-  border: none;
-  outline: thin dotted #333;
-  outline: 5px auto -webkit-focus-ring-color;
-  outline-offset: -2px;
-}
-#notesAndSort {
-  background-color: #eee;
-  border-bottom: 1px solid #ebeff2;
-}
-/* item list */
-#noteItemList {
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  top: 0;
-  width: 100%;
-  overflow-y: hidden;
-  background-color: #f7f7f7;
-  padding: 0 5px;
-}
-#noteItemList .item {
+body.writting #note #editorContent {
   position: relative;
-  height: 110px;
-  overflow: hidden;
-  cursor: pointer;
-  padding: 5px;
-  border: 1px solid #ebeff2;
-  border-radius: 3px;
-  margin-top: 5px;
+  max-width: 800px;
+  margin: auto;
   background-color: #fff;
-}
-#noteItemList .item:hover,
-#noteItemList .contextmenu-hover {
-  background-color: #ddd !important;
-  color: #000000;
-}
-#noteItemList .item-thumb {
-  padding-left: 10px;
-  width: 100px;
-  overflow: hidden;
-  position: absolute;
-  right: 0px;
-  height: 100px;
-  background-color: #fff;
-  margin-right: 5px;
-}
-.item-thumb img {
-  width: 100px;
-}
-#noteItemList .item-desc {
-  position: absolute;
-  left: 0;
-  right: 100px;
-  margin-left: 4px;
-}
-#noteItemList .item-desc .fa {
-  color: #666;
-}
-#noteItemList .item-blog {
-  position: absolute;
-  right: 1px;
-  font-size: 10px;
-  z-index: 2;
-  top: 1px;
-  padding: 3px;
-  cursor: pointer;
-  width: 20px;
-  text-align: center;
-  opacity: 0.5;
-  background-color: #464C5E;
-}
-#noteItemList .item-blog .fa {
-  color: #fff !important;
-}
-#noteItemList .item-blog:hover {
-  opacity: 0.8;
-}
-.item-title {
-  /*font-weight: 400;*/
+  top: 0 !important;
+  border-radius: 5px;
+  min-height: 100%;
+  box-shadow: 0 1px 10px #ccc;
   font-size: 16px;
-  height: 22px;
-  line-height: 20px;
-  overflow: hidden;
-  margin-bottom: 0px;
-  color: #000000;
-  border-bottom: dashed 1px #ebeff2;
 }
-/* note */
-/* editor */
-#editorTool {
-  margin: 0;
-  padding: 0;
-  list-style: none;
+body.writting #note #editorContent p {
+  margin: 10px 0;
 }
-#editorTool li {
-  display: inline-block;
-}
-#noteTitle:focus {
-  outline: none !important;
-}
-#editor,
-#mdEditor {
-  z-index: 2;
-  top: 71px;
-  bottom: 0px;
-  right: 0;
-  left: 0;
-  padding: 0;
+body.writting #note #editorBottom {
   display: none;
 }
-#mdEditor {
-  z-index: 1;
-  background-color: #fff;
-  bottom: 10px;
+body.writting #editor #mceToolbar {
+  height: 40px;
 }
-#mdEditor #md-section-helper,
-#mdEditor #wmd-input {
-  font-size: 14px;
-  line-height: 22px;
+body.writting #editor.all-tool #mceToolbar {
+  height: 70px;
 }
-#editorContent {
-  position: absolute;
-  top: 30px;
-  bottom: 10px;
-  right: 0;
-  left: 0;
-  overflow: auto;
+body.writting #editor.all-tool #editorContentWrap {
+  top: 70px;
 }
-/* 包裹iframe */
-#editor .mce-ifr {
-  border: none;
-  overflow: hidden !important;
-  /*不知道哪里设置了auto*/
-  /*border-radius: 5px;*/
-}
-/* 最顶层 */
 #editor .mce-tinymce {
   border: none;
 }
 /*编辑器按钮*/
 #mceToolbar,
+#mdEditor .navbar-default,
 #wmd-button-bar {
   position: relative;
-  height: 30px;
+  height: 40px;
+  padding: 5px 0;
   overflow: hidden;
   background-color: #fbfcf7;
+  border: none;
+  box-shadow: 0 3px 10px #eee;
+  z-index: 10;
+}
+#mdEditor .extension-preview-buttons,
+#mdEditor .layout-wrapper-l3 {
+  top: 40px !important;
+}
+#left-column,
+#right-column,
+#mdSplitter {
+  top: 3px;
 }
 /* 编辑器工具 需要important, 因为mce还要有js加载css, 肯定在此之后 */
 /*加高, 之前显得拥挤*/
@@ -1999,346 +125,14 @@ a.raw:hover {
 .mce-menu-item-normal.mce-active {
   background-color: #ebeff2;
 }
-.tool-split {
-  display: inline-block;
-  line-height: 25px;
-  color: #ddd;
+.mce-menubtn.mce-fixed-width.mce-btn-small span {
+  width: 80px;
 }
-/*标签与其它工具*/
-#tool {
-  display: none;
-  border-bottom: 1px solid #ddd;
+.mce-menubtn.mce-btn-small span {
+  font-size: 16px;
 }
-/* tag */
-#tag {
-  height: 40px;
-  line-height: 38px;
-}
-#tag .dropdown {
-  line-height: 30px;
-}
-#addTagInput {
-  line-height: 25px;
-  display: none;
-  padding: 0;
-  border: none;
-  background-color: #fbfcf7;
-}
-#addTagInput:focus {
-  outline: none;
-}
-.label-default {
-  background-color: #464C5E;
-}
-.label-red {
-  background-color: #d9534f;
-}
-.label-yellow {
-  background-color: #f0ad4e;
-}
-.label-blue {
-  background-color: #428bca;
-}
-.label-green {
-  background-color: #5cb85c;
-}
-.label {
-  border-radius: 0;
-  font-weight: normal;
-}
-.label i {
-  width: 10px;
-  cursor: pointer;
-  font-style: normal;
-  /*border-left: 1px solid #ccc;*/
-  display: inline-block;
-  padding-left: 3px;
-  opacity: 0;
-}
-.label i:hover {
-  opacity: 1;
-}
-/* leanote nav */
-#leanoteNav {
-  position: absolute;
-  right: 5px;
-  border: 1px solid #ccc;
-  border-radius: 3px;
-  background-color: #fff;
-  opacity: 0.5;
-  z-index: 11;
-  margin-right: 2px;
-}
-#leanoteNav h1 {
-  margin: 0;
-  font-size: 18px;
-  padding: 3px;
-  cursor: pointer;
-}
-#leanoteNav i {
-  padding: 3px;
-}
-#leanoteNav span {
-  display: none;
-}
-#leanoteNav #leanoteNavContent {
-  display: none;
-  overflow: auto;
-}
-#leanoteNav.unfolder {
-  min-width: 200px;
-  max-width: 300px;
-  opacity: 0.8;
-}
-#leanoteNav.unfolder h1 {
-  border-bottom: 1px dashed #ebeff2;
-}
-#leanoteNav.unfolder span {
-  display: inline;
-}
-#leanoteNav.unfolder #leanoteNavContent {
-  display: block;
-  min-height: 30px;
-}
-#leanoteNav ul {
-  margin: 0;
-  padding-left: 23px;
-}
-#leanoteNav ul li {
-  list-style-type: disc;
-}
-#leanoteNav ul li a:hover {
-  color: #0fb264;
-}
-#leanoteNav ul .nav-h2 {
-  margin-left: 20px;
-}
-#leanoteNav ul .nav-h3 {
-  margin-left: 30px;
-}
-#leanoteNav ul .nav-h4 {
-  margin-left: 40px;
-}
-#leanoteNav ul .nav-h5 {
-  margin-left: 50px;
-}
-.scrollTo-a {
-  cursor: pointer !important;
-}
-#noteRead {
-  position: absolute;
-  left: 0;
-  right: 0;
-  top: 0;
-  bottom: 0;
-  display: none;
-  z-index: 100;
-  padding-left: 5px;
-  background-color: #fff;
-}
-#noteReadContainer {
-  position: relative;
-  width: 100%;
-  height: 100%;
-}
-#noteReadTop {
-  position: absolute;
-  height: 60px;
-  left: 0;
-  right: 0;
-  border-bottom: 1px solid #ebeff2;
-}
-#noteReadTitle {
-  margin: 3px 0;
-}
-#noteReadContent {
-  position: absolute;
-  top: 60px;
-  bottom: 0;
-  right: 0;
-  left: 0;
-  overflow: auto;
-  padding: 3px;
-}
-/*scroll*/
-/*
-::-webkit-scrollbar {
-  width: 5px;
-  height: 8px;
-  background: none;
-}
-
-::-webkit-scrollbar-thumb {
-  background-color: #41586e;
-  opacity: 0.1;
-}
-::-webkit-scrollbar-thumb:hover {
-  background-color:#dadada
-}
-::-webkit-scrollbar-thumb:active {
-  background-color:#606060
-}
-::-webkit-scrollbar-thumb:disabled {
-  background-color:#f9f9f9
-}
-::-webkit-scrollbar-corner {
-  background-color:#f0f0f0
-}
-::-webkit-scrollbar-button {
-  height: 0;
-  background-color:#f0f0f0;
-  background-repeat:no-repeat
-}
-::-webkit-scrollbar-button:vertical {
-  height:0px
-}
-::-webkit-scrollbar-button:horizontal {
-  width:33px
-}
-::-webkit-scrollbar-button:horizontal:increment {
-  background-position:0 -444px
-}
-::-webkit-scrollbar-button:horizontal:decrement {
-  background-position:12px -425px
-}
-::-webkit-scrollbar-button:vertical:increment {
-  background-position:-1px -391px
-}
-::-webkit-scrollbar-button:vertical:decrement {
-  background-position:-1px -358px
-}
-::-webkit-scrollbar-button:hover {
-  background-color:#dadada
-}
-::-webkit-scrollbar-button:horizontal:increment:hover {
-  background-position:0 -548px
-}
-::-webkit-scrollbar-button:horizontal:decrement:hover {
-  background-position:12px -529px
-}
-::-webkit-scrollbar-button:vertical:increment:hover {
-  background-position:-1px -495px
-}
-::-webkit-scrollbar-button:vertical:decrement:hover {
-  background-position:-1px -462px
-}
-::-webkit-scrollbar-button:active {
-  background-color:#606060
-}
-::-webkit-scrollbar-button:horizontal:increment:active {
-  background-position:0 -652px
-}
-::-webkit-scrollbar-button:horizontal:decrement:active {
-background-position:12px -633px
-}
-::-webkit-scrollbar-button:vertical:increment:active {
-background-position:-1px -599px
-}
-::-webkit-scrollbar-button:vertical:decrement:active {
-background-position:-1px -566px
-}
-::-webkit-scrollbar-button:disabled {
-background-color:#f9f9f9
-}
-::-webkit-scrollbar-button:horizontal:increment:disabled {
-background-position:0 -756px
-}
-::-webkit-scrollbar-button:horizontal:decrement:disabled {
-background-position:12px -737px
-}
-::-webkit-scrollbar-button:vertical:increment:disabled {
-background-position:-1px -703px
-}
-::-webkit-scrollbar-button:vertical:decrement:disabled {
-background-position:-1px -670px
-}
-*/
-/*from notebook*/
-/*::-webkit-scrollbar{width:7px;height:7px;}::-webkit-scrollbar-thumb{background-color:rgba(50,50,50,0.3);}::-webkit-scrollbar-thumb:hover{background-color:rgba(50,50,50,0.6);}::-webkit-scrollbar-track{background-color:rgba(50,50,50,0.1);}::-webkit-scrollbar-track:hover{background-color:rgba(50,50,50,0.2);}
-*/
-.fa-calendar {
-  color: #666;
-}
-.dropdown-menu .fa {
-  width: 15px;
-}
-.dropdown-menu span,
-.dropdown-menu a,
-.dropdown-menu li {
-  cursor: default;
-}
-#topNav a {
-  display: inline-block;
-  line-height: 60px;
-}
-.tab-pane {
-  padding: 5px 0 0 0;
-}
-.alert {
-  margin-bottom: 10px;
-}
-.btn {
-  border-radius: 0 !important;
-}
-#notebookNavForNewNote li,
-#notebookNavForNewSharedNote > li {
-  padding-left: 0;
-  border-bottom: 1px solid #ebeff2;
-}
-#notebookNavForNewNote > li:hover,
-#notebookNavForNewNote > li:focus,
-#notebookNavForNewSharedNote > li:hover,
-#notebookNavForNewSharedNote > li:focus {
-  background: none;
-}
-.new-note-left {
-  padding: 0 5px;
-  width: 95px;
-  overflow: hidden;
-  white-space: nowrap;
-  border-right: 1px dashed #ebeff2;
-}
-.new-note-left:hover {
-  background-color: #ebeff2;
-}
-.new-note-right {
-  padding: 0 5px;
-}
-.new-note-right:hover {
-  background-color: #ebeff2;
-}
-#historyList table {
-  width: 100%;
-}
-#historyList .btns {
-  border-top: 1px dashed #eee;
-  padding: 5px 0;
-}
-#left-column {
-  width: 100% !important;
-}
-#editorMask {
-  position: absolute;
-  top: 0px;
-  bottom: 0px;
-  right: 0;
-  left: 0;
-  background-color: #fff;
-  z-index: -10;
-  padding-top: 50px;
-  text-align: center;
-}
-#editorMask .fa,
-#editorMask a {
-  font-size: 24px;
-}
-#editorMask a {
-  display: inline-block;
-  border-radius: 3px;
-  border: 1px solid #ebeff2;
-  padding: 10px;
-}
-#editorMask a:hover {
-  background-color: #65bd77;
-  color: #fff;
+#wmd-input > .editor-content,
+.preview-container {
+  font-size: 16px;
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
 }
diff --git a/public/css/theme/writting.less b/public/css/theme/writting.less
index 7e754924..c129767e 100644
--- a/public/css/theme/writting.less
+++ b/public/css/theme/writting.less
@@ -1,423 +1,120 @@
-@import "basic.less";
-
-@bgColor: #fff;
-@headerBgColor: #25313e;
-@fontFamily: 'Open Sans','Helvetica Neue',Arial,'Hiragino Sans GB','Microsoft YaHei','WenQuanYi Micro Hei',sans-serif;
-@aWhiteColor: #fff;
-@aBlackColor: #000;
-@borderColor: #EBEFF2;
-@headerHeight: 60px;
-@headerHeightNoBorder: 59px;
-@hColor: #0fb264; // #47a447;// 更深 #198764; // boostrap: #5cb85c; bootstrap:hover #47a447; // #5AD4A0; // #47a447
-@titleColor: @hColor;
-@fontSize: 14px;
-@leftNotebookWidth: 170px;
-@noteListWidth: 250px;
-@noteActiveBg: #65bd77;
-
 @bgColor: #fbfcf7;
-@headerBgColor: #fbfcf7;
 @fontFamily: 'Open Sans','Helvetica Neue',Arial,'Hiragino Sans GB','Microsoft YaHei','WenQuanYi Micro Hei',sans-serif;
-@aWhiteColor: #fff;
-@aBlackColor: #000;
 @borderColor: #EBEFF2;
-@headerHeight: 60px;
-@hColor: #0fb264; // #47a447;// 更深 #198764; // boostrap: #5cb85c; bootstrap:hover #47a447; // #5AD4A0; // #47a447
-@titleColor: @hColor;
-@fontSize: 16px;
-@leftNotebookWidth: 170px;
-@noteListWidth: 250px;
-@noteActiveBg: #65bd77;
-@editorWidth: 700px;
 
-
-// font
-@font-face {
-  font-family: 'Open Sans';
-  font-style: normal;
-  font-weight: 300;
-  src: local('Open Sans Light'), local('OpenSans-Light'), url('../../fonts/open-sans2/DXI1ORHCpsQm3Vp6mXoaTXhCUOGz7vYGh680lGh-uXM.woff') format('woff');
-}
-@font-face {
-  font-family: 'Open Sans';
-  font-style: normal;
-  font-weight: 400;
-  src: local('Open Sans'), local('OpenSans'), url('../../fonts/open-sans2/cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff') format('woff');
-}
-@font-face {
-  font-family: 'Open Sans';
-  font-style: normal;
-  font-weight: 700;
-  src: local('Open Sans Bold'), local('OpenSans-Bold'), url('../../fonts/open-sans2/k3k702ZOKiLJc3WVjuplzHhCUOGz7vYGh680lGh-uXM.woff') format('woff');
-}
-@font-face {
-  font-family: 'Open Sans';
-  font-style: italic;
-  font-weight: 400;
-  src: local('Open Sans Italic'), local('OpenSans-Italic'), url('../../fonts/open-sans2/xjAJXh38I15wypJXxuGMBobN6UDyHWBl620a-IRfuBk.woff') format('woff');
-}
-
-/*"HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue", Helvetica, "Microsoft Yahei", Verdana, Simsun, "Segoe UI", "Segoe UI Web Regular", "Segoe UI Symbol",  "BBAlpha Sans", "S60 Sans", Arial, sans-serif;*/
-
-@selectionBg: @aBlackColor;
-@selectionColor: #fff;
-::selection { background:@selectionBg; color:@selectionColor; } 
-::-moz-selection { background:@selectionBg; color:@selectionColor; } 
-::-webkit-selection { background:@selectionBg; color:@selectionColor; }
-
-html,body {
-	background-color: @bgColor;
-}
-*, body {
-  font-family: @fontFamily;
-  font-weight: 300;
-  font-size: @fontSize;
-}
-h1, h2, h3 {
-  font-family: @fontFamily;
-  font-weight: 300 !important;
-}
-a {
-  color: @aBlackColor;
-  cursor: pointer;
-}
-
-a:hover {
-  text-decoration: none !important;
-  color: @aBlackColor;
-}
-
-// 原生的a
-a.raw {
-	color: #428bca;
-}
-a.raw:hover {
-	color: #2a6496;
-}
-
-/* header */
-
-#header {
-  height: @headerHeight;
-  background-color: @headerBgColor;
-  color: @aWhiteColor;
-  a {
-	  color: #ccc;//@aWhiteColor;
+/**
+ * 写作模式
+ */
+body.writting {
+  &.init #pageInner {
+    display: block;
   }
-  li {
-	  color: @aBlackColor;
+  #mainMask,
+  #leftNotebook,
+  .noteSplit,
+  #noteList
+  {
+    display: none;
   }
-  li a {
-	  color: @aBlackColor;
+
+  #noteAndEditor {
+    left: 0 !important;
   }
-  border-bottom: 1px solid @borderColor;
 
-  /* for app */
-  webkit-user-select: none; /* 还不知 */
-  -webkit-app-region: drag; /* -webkit-app-region: no-drag; */
-}
+  #note {
+    left: 0 !important;
+  // left: 100px !important;
+  // right: 100px !important;
 
-#searchWrap, #logo, #switcher, 
-#leftNotebook, 
-.noteSplit
-{
-	display: none;	
-}
+  // padding: 0 100px;
 
-#header ul {
-  margin:0;
-  padding:0;
-  list-style: none;
-}
-#header ul li.dropdown {
-  display: inline-block;
-  height: @headerHeight;
-}
-
-#header ul > li > a.dropdown-toggle {
-  display: block;
-  padding: 15px 5px 0 0;
-  position: relative;
-}
-
-#header span.icon {
-  display: inline-block;
-  font-size: 28px;
-  color: #999999;
-}
-
-.dropdown-menu {
-  border-radius: 0;
-  margin:0;
-  -webkit-box-shadow: none;
-  box-shadow: none;
-  border: 1px solid @hColor;
-  overflow-x: hidden; 
-  overflow-y: auto;
-}
-.dropdown-menu li {
-  padding-left: 10px;
-  width: 100%;
-  height: 30px; // 父设置了line-height, 子下拉也受影响, "新建笔记"
-  line-height: 30px;
-}
-.dropdown-menu > li > a {
-  color: @aBlackColor;
-  display: inline-block;
-  padding: 3px 3px;
-}
-.dropdown-menu>li:hover, .dropdown-menu>li:focus {
-  background-color: @borderColor;
-}
-.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
-  background-color: @borderColor;
-}
-
-.ios7-a {
-  display: inline-block;
-  padding: 0 10px 0 5px;
-  height: 40px;
-  vertical-align: middle;
-  line-height: 38px;
-  cursor: pointer; 
-}
-
-/*********************/
-#page {
-  overflow: auto;
-  position: absolute;
-  top: 0;
-  left: 0;
-  bottom: 0;
-  right: 0;
-}
-#pageInner {
-  position: absolute;
-  top: 0;
-  left: 0;
-  height: 100%;
-  width: 100%;
-  overflow: hidden;
-}
-#mainContainer {
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  overflow: auto;
-  zoom: 1;
-}
-
-
-
-
-#search {
-  border: #bababa 1px solid;
-  background-color: #fff;
-  white-space: nowrap;
-  position: absolute;
-  height: 30px;
-  left:3px;
-  right:60px;
-  margin-top: 3px;
-}
-#search label {
-  display: none;
-}
-#searchButton {
-  border: 0 none;
-  width: 16px;
-  height: 16px;
-  overflow: hidden;
-  cursor: pointer;
-  position: absolute;
-  right:3px;
-  top: 5px;
-}
-#searchInput {
-  border: 0 none;
-  overflow: hidden;
-  position: absolute;
-  right:20px;
-  left: 0px;
-  padding-left: 10px;
-  height: 28px;
-}
-#searchInput:focus {
-  border: none;
-  outline:thin dotted #333;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px
-}
-
-#notesAndSort {
-  background-color: #eee; // #65bd77; // @bgColor;
-  border-bottom: 1px solid @borderColor;
-  a.dropdown-toggle {
-	  // color: #fff;
-  }
-}
-
-/* item list */
-#noteItemList {
-  position: absolute;
-  left:0;
-  right:0;
-  bottom: 0;
-  top: 0;
-  width: 100%;
-  overflow-y: hidden;
-  background-color: #f7f7f7;
-  padding: 0 5px;
-}
-#noteItemList .item {
-  position: relative;
-  height: 110px;
-  overflow: hidden;
-  cursor: pointer;
-  padding: 5px;
-  border: 1px solid @borderColor;
-  border-radius: 3px;
-  margin-top: 5px;
-  background-color: #fff;
-}
-
-#noteItemList .item:hover, 
-#noteItemList .contextmenu-hover {
-  background-color: #ddd !important;
-  color: @aBlackColor;
-  .item-title {
-    // color: @aBlackColor;
-    //font-weight: 800;
-  }
-}
-
-#noteItemList .item-thumb  {
-  padding-left: 10px;
-  width: 100px; 
-  height: 100px; 
-  overflow: hidden;
-  position: absolute; 
-  right: 0px;
-  height: 100px;
-  background-color: #fff;
-  margin-right: 5px;
-}
-  .item-thumb img {
-     width: 100px;
-  }
-#noteItemList .item-desc {
-  position: absolute; 
-  left: 0;
-  right: 100px;
-  margin-left: 4px;
-  .fa { // folder, calender 颜色暗些
-  	color: #666;
-  }
-}
-// blog
-#noteItemList .item-blog {
-  position: absolute; 
-  right: 1px;
-  font-size: 10px;
-  z-index: 2;
-  top: 1px;
-  padding: 3px;
-  cursor: pointer;
-  .fa {
-	  color: #fff !important;
-  }
-  width: 20px;
-  text-align: center;
-  opacity: 0.5;
-  &:hover {
-	  opacity: 0.8;
-  }
-  background-color: #464C5E;
-}
-.item-title {
-    /*font-weight: 400;*/
-    font-size: 16px;
-    height: 22px;
-    line-height: 20px;
-    overflow: hidden;
-    margin-bottom: 0px;
-    color: @aBlackColor;
-    border-bottom: dashed 1px @borderColor;
-  }
-  
-/* note */
-
-/* editor */
-#editorTool {
-  margin: 0;
-  padding: 0;
-  list-style: none;
-  // width: 200px;
-}
-#editorTool li {
-  display: inline-block;
-}
-
-
-#noteTitle:focus {
-  // outline:thin dotted #333;outline:1px auto -webkit-focus-ring-color;outline-offset:-2px
-  outline: none !important;
-  // border: 1px solid @hColor;
-}
-
-#editor, #mdEditor{
-  z-index: 2;
-  top: 71px; 
-  bottom: 0px; 
-  right: 0; 
-  left: 0;  
-  padding: 0; // 0px 0px 0px 0px;
-	display: none;
-}
-#mdEditor {
-	z-index: 1;
-	background-color: #fff;
-    bottom: 10px; 
-    #md-section-helper, #wmd-input {
-		font-size: 14px;
-		line-height: 22px;			
+    #tool {
     }
-}
-#editorContent {
-  position: absolute;
-  top:30px;
-  bottom: 10px; 
-  right: 0; 
-  left: 0;
-  overflow: auto; // 不设置editor隐藏时没有scroll
-}
-#editorContent_ifr {
-	// padding-top: 10px;
+    #noteTitleDiv {
+      left: 100px;
+
+    }
+    #noteTitle {
+      text-align: center;
+    }
+
+    #editor, #mdEditor {
+      bottom: 0;
+    }
+
+    #editor {
+      background-color: @bgColor;
+    }
+    #editorContentWrap {
+      position: absolute;
+      padding: 5px 0;
+      top: 40px;
+      left: 0;
+      right: 0;
+      bottom: 0;
+      overflow-y: auto;
+    }
+    #editorContent {
+      position: relative;
+      max-width: 800px;
+      margin: auto;
+      background-color: #fff;
+      top: 0 !important;
+      // margin-top: 5px;
+      border-radius: 5px;
+      min-height: 100%;
+      box-shadow: 0 1px 10px #ccc;
+      font-size: 16px;
+      p {
+        margin: 10px 0;
+      }
+    }
+    #editorBottom {
+      display: none;
+    }
+  }
+
+  #editor {
+    #mceToolbar {
+      height: 40px;
+    }
+
+    // 所有都展开
+    &.all-tool {
+      #mceToolbar {
+        height: 70px;
+      }
+      #editorContentWrap {
+        top: 70px;
+      }
+    }
+  }
 }
 
-/* 包裹iframe */
-#editor .mce-ifr {
-  border: none;
-  // padding: 10px;
-  overflow: hidden !important; /*不知道哪里设置了auto*/
-  /*border-radius: 5px;*/
-  // border: 1px solid @borderColor;
-  // border-top-left-radius: 5px;
-  // border-bottom-left-radius: 5px;
-}
-
-/* 最顶层 */
 #editor .mce-tinymce {
   border: none;
 }
-#editor iframe {
-}
 /*编辑器按钮*/
-#mceToolbar, #wmd-button-bar {
+#mceToolbar, 
+#mdEditor .navbar-default, 
+#wmd-button-bar {
   position: relative; 
-  height: 30px; 
+  height: 40px;
+  padding: 5px 0;
   overflow: hidden; 
   background-color: @bgColor;
+  background-color: #fbfcf7;
+  border: none;
+  box-shadow: 0 3px 10px #eee;
+  z-index: 10; // 把content覆盖
+}
+#mdEditor {
+  .extension-preview-buttons, .layout-wrapper-l3 {
+    top: 40px !important;
+  }
+}
+#left-column, #right-column, #mdSplitter {
+  top: 3px;
 }
 /* 编辑器工具 需要important, 因为mce还要有js加载css, 肯定在此之后 */
 
@@ -436,398 +133,32 @@ a.raw:hover {
   font-family: @fontFamily !important;
 }
 .mce-primary button, .mce-primary button i {
-	text-shadow: none;
+  text-shadow: none;
 }
 .mce-primary {
-	background-color: #47a447 !important;
-	border-color: #398439 !important;
+  background-color: #47a447 !important;
+  border-color: #398439 !important;
 }
 // 下拉
 .mce-menu-item:hover, .mce-menu-item.mce-selected, .mce-menu-item:focus {
-	background-color: @borderColor;
-	span {
-		color: #000 !important;
-	}
+  background-color: @borderColor;
+  span {
+    color: #000 !important;
+  }
 }
 // 下拉选中
 .mce-menu-item-normal.mce-active {
-	background-color: @borderColor;
-}
-// tool的分隔
-.tool-split {
-	display: inline-block;
-	line-height: 25px;	
-	color: #ddd;
+  background-color: @borderColor;
 }
 
-/*标签与其它工具*/
-#tool {
-	display: none;
-  border-bottom: 1px solid #ddd;
+.mce-menubtn.mce-fixed-width.mce-btn-small span {
+  width: 80px;
+}
+.mce-menubtn.mce-btn-small span {
+  font-size: 16px;
 }
 
-/* tag */
-#tag {
-  height: 40px;
-  line-height: 38px
+#wmd-input > .editor-content, .preview-container {
+  font-size: 16px;
+  font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
 }
-// 前面的38影响了dropdown
-#tag .dropdown {
-  line-height: 30px;
-}
-#addTagInput {
-  line-height: 25px;
-  display: none;
-  padding:0;
-  border: none;
-  background-color: @bgColor;
-}
-#addTagInput:focus {
-  outline: none;
-}
-.label-default {
-  background-color: #464C5E;
-}
-.label-red {
-  background-color: #d9534f;
-}
-.label-yellow {
-  background-color: #f0ad4e;
-}
-.label-blue {
-  background-color: #428bca;
-}
-.label-green {
-  background-color: #5cb85c;
-}
-.label {
-  border-radius: 0;
-  font-weight: normal;
-}
-.label i {
-  width: 10px;
-  cursor: pointer;
-  font-style: normal;
-  /*border-left: 1px solid #ccc;*/
-  display: inline-block;
-  padding-left: 3px;
-  opacity: 0;
-}
-.label i:hover {
-  opacity: 1;
-  // font-weight: bold;
-}
-
-/* leanote nav */
-
-#leanoteNav {
-  position: absolute; 
-  right: 5px;
-  border: 1px solid #ccc; 
-  border-radius: 3px;
-  background-color: #fff;
-  opacity: 0.5;
-  // display: none;
-  z-index: 11;
-  margin-right: 2px;
-  h1 {
-	margin:0;
-  	font-size: 18px;
-  	padding: 3px;
-  	cursor: pointer;
-  }
-  i {
-    padding: 3px;
-  }
-  span {
-  	display: none;
-  }
-  #leanoteNavContent {
-  	display: none;
-	overflow: auto;
-  } 
-}
-
-#leanoteNav.unfolder {
-  min-width: 200px;
-  max-width: 300px;
-  // bottom: 1px;
-  opacity: 0.8;
-  h1 {
-  	border-bottom: 1px dashed @borderColor;
-  }
-  span {
-	  display: inline;
-  }
-  
-  #leanoteNavContent {
-  	display: block;
-	min-height: 30px;
-  }
-}
-
-#leanoteNav ul {
-  margin:0;
-  padding-left: 23px;
-  li {
-  	list-style-type: disc;
-  	a {
-  		&:hover {
-  			color: @hColor;
-  		}	
-  	}
-  }
-}
-#leanoteNav ul .nav-h1 {
-}
-#leanoteNav ul .nav-h2 {
-  margin-left: 20px;
-}
-#leanoteNav ul .nav-h3 {
-  margin-left: 30px;
-}
-#leanoteNav ul .nav-h4 {
-  margin-left: 40px;
-}
-#leanoteNav ul .nav-h5 {
-  margin-left: 50px;
-}
-.scrollTo-a {
-  cursor: pointer !important;
-}
-
-//---------------
-// note for read
-#noteRead {
-	position: absolute;
-	left: 0;
-	right: 0;
-	top: 0;
-	bottom: 0;
-	display: none;
-	z-index: 100;
-	padding-left: 5px;
-	background-color: #fff;
-}
-#noteReadContainer {
-	position: relative;
-	width: 100%;
-	height: 100%;
-}
-@noteReadTopHeight: 60px;
-#noteReadTop {
-	position: absolute;
-	height: @noteReadTopHeight;
-	left:0;
-	right: 0;
-	border-bottom: 1px solid @borderColor;
-}
-#noteReadTitle {
-	margin: 3px 0;
-}
-#noteReadContent {
-	position: absolute;
-	top: @noteReadTopHeight;
-	bottom: 0;
-	right: 0;
-	left: 0;
-	overflow: auto;
-	padding: 3px;
-}
-
-@sbc: @bgColor;
-
-/*scroll*/
-/*
-::-webkit-scrollbar {
-  width: 5px;
-  height: 8px;
-  background: none;
-}
-
-::-webkit-scrollbar-thumb {
-  background-color: #41586e;
-  opacity: 0.1;
-}
-::-webkit-scrollbar-thumb:hover {
-  background-color:#dadada
-}
-::-webkit-scrollbar-thumb:active {
-  background-color:#606060
-}
-::-webkit-scrollbar-thumb:disabled {
-  background-color:#f9f9f9
-}
-::-webkit-scrollbar-corner {
-  background-color:#f0f0f0
-}
-::-webkit-scrollbar-button {
-  height: 0;
-  background-color:#f0f0f0;
-  background-repeat:no-repeat
-}
-::-webkit-scrollbar-button:vertical {
-  height:0px
-}
-::-webkit-scrollbar-button:horizontal {
-  width:33px
-}
-::-webkit-scrollbar-button:horizontal:increment {
-  background-position:0 -444px
-}
-::-webkit-scrollbar-button:horizontal:decrement {
-  background-position:12px -425px
-}
-::-webkit-scrollbar-button:vertical:increment {
-  background-position:-1px -391px
-}
-::-webkit-scrollbar-button:vertical:decrement {
-  background-position:-1px -358px
-}
-::-webkit-scrollbar-button:hover {
-  background-color:#dadada
-}
-::-webkit-scrollbar-button:horizontal:increment:hover {
-  background-position:0 -548px
-}
-::-webkit-scrollbar-button:horizontal:decrement:hover {
-  background-position:12px -529px
-}
-::-webkit-scrollbar-button:vertical:increment:hover {
-  background-position:-1px -495px
-}
-::-webkit-scrollbar-button:vertical:decrement:hover {
-  background-position:-1px -462px
-}
-::-webkit-scrollbar-button:active {
-  background-color:#606060
-}
-::-webkit-scrollbar-button:horizontal:increment:active {
-  background-position:0 -652px
-}
-::-webkit-scrollbar-button:horizontal:decrement:active {
-background-position:12px -633px
-}
-::-webkit-scrollbar-button:vertical:increment:active {
-background-position:-1px -599px
-}
-::-webkit-scrollbar-button:vertical:decrement:active {
-background-position:-1px -566px
-}
-::-webkit-scrollbar-button:disabled {
-background-color:#f9f9f9
-}
-::-webkit-scrollbar-button:horizontal:increment:disabled {
-background-position:0 -756px
-}
-::-webkit-scrollbar-button:horizontal:decrement:disabled {
-background-position:12px -737px
-}
-::-webkit-scrollbar-button:vertical:increment:disabled {
-background-position:-1px -703px
-}
-::-webkit-scrollbar-button:vertical:decrement:disabled {
-background-position:-1px -670px
-}
-*/
-
-/*from notebook*/
-/*::-webkit-scrollbar{width:7px;height:7px;}::-webkit-scrollbar-thumb{background-color:rgba(50,50,50,0.3);}::-webkit-scrollbar-thumb:hover{background-color:rgba(50,50,50,0.6);}::-webkit-scrollbar-track{background-color:rgba(50,50,50,0.1);}::-webkit-scrollbar-track:hover{background-color:rgba(50,50,50,0.2);}
-*/
-
-#editorContent_ifr {
-	// border: 1px solid red;
-}
-
-.fa-calendar {
-	color: #666;
-}
-.dropdown-menu .fa {
-	width: 15px;
-}
-.dropdown-menu span, .dropdown-menu a, .dropdown-menu li {
-	cursor: default;
-}
-
-// 顶部导航, 博客
-#topNav a {
-	display: inline-block;
-	line-height: 60px;
-}
-
-.tab-pane {
-	padding: 5px 0 0 0;
-}
-.alert {
-	margin-bottom: 10px;
-}
-
-.btn {
-	border-radius: 0 !important;
-}
-
-.mce-container-body iframe {
-  //overflow-x: hidden; // firefox 不能要
-  //overflow-y: hidden;
-}
-// 新建笔记item
-#notebookNavForNewNote li, #notebookNavForNewSharedNote > li {
-	padding-left: 0;
-	border-bottom: 1px solid @borderColor;
-}
-#notebookNavForNewNote > li:hover, #notebookNavForNewNote > li:focus,
-#notebookNavForNewSharedNote > li:hover, #notebookNavForNewSharedNote > li:focus {
-	background: none;
-}
-
-.new-note-left {
-	padding: 0 5px;
-	width: 95px;
-	overflow: hidden;
-	white-space:nowrap;
-	border-right: 1px dashed @borderColor;
-	&:hover {
-		background-color:@borderColor;
-	}
-}
-.new-note-right {
-	padding: 0 5px;
-	&:hover {
-		background-color:@borderColor;
-	}
-}
-
-// 历史记录
-#historyList {
-	table {
-		width: 100%;
-	}
-	.btns{
-		border-top: 1px dashed #eee;
-		padding: 5px 0;
-	}
-}
-
-#left-column {
-	width: 100% !important;
-}
-#editorMask {
-	position: absolute; top: 0px; bottom: 0px; right: 0; left: 0; 
-	background-color: #fff;
-	z-index: -10;
-	.fa, a {
-		font-size: 24px;
-	}
-	padding-top: 50px;
-	text-align: center;
-	a {
-		display: inline-block;
-		border-radius: 3px;
-		border: 1px solid @borderColor;
-		padding: 10px;
-		&:hover {
-			background-color: @noteActiveBg;
-			color: #fff;
-		}
-	}
-}
\ No newline at end of file
diff --git a/public/dist/themes/default.css b/public/dist/themes/default.css
index 73371bea..83031048 100644
--- a/public/dist/themes/default.css
+++ b/public/dist/themes/default.css
@@ -1152,7 +1152,8 @@ a.input-group-addon {
   line-height: 1.65;
   letter-spacing: normal;
   border-radius: 0;
-  color: #5a5a5a;
+  /*color: #5a5a5a;*/
+  color: #000;
   -webkit-box-shadow: none;
   box-shadow: none;
   resize: none;
diff --git a/public/js/app/note.js b/public/js/app/note.js
index 7029c21f..14e0ac2e 100644
--- a/public/js/app/note.js
+++ b/public/js/app/note.js
@@ -227,6 +227,10 @@ Note.renderNotesAndTargetNote = function(ret, noteId) {
 	}
 };
 
+Note.alertWeb = function(msg) {
+	alert(msg);
+};
+
 // 当前的note是否改变过了?
 // 返回已改变的信息
 // force bool true表示content比较是比较HTML, 否则比较text, 默认为true
@@ -630,6 +634,7 @@ Note.changeNoteForPjax = function(noteId, mustPush, needTargetNotebook) {
 // 点击notebook时调用, 渲染第一个笔记
 Note.contentAjax = null;
 Note.contentAjaxSeq = 1;
+Note.inChangeNoteId = '';
 Note.changeNote = function(selectNoteId, isShare, needSaveChanged, callback) {
 	var self = this;
 	
@@ -651,6 +656,7 @@ Note.changeNote = function(selectNoteId, isShare, needSaveChanged, callback) {
 	
 	// 2. 设空, 防止在内容得到之前又发生保存
 	Note.curNoteId = "";
+	Note.inChangeNoteId = selectNoteId;
 	
 	// 2 得到现在的
 	// ajax之
@@ -718,8 +724,8 @@ Note.changeNote = function(selectNoteId, isShare, needSaveChanged, callback) {
 	
 	self.showContentLoading();
 
-	console.error('chage note..........');
-	console.trace();
+	// console.error('chage note..........');
+	// console.trace();
 
 	Service.noteService.getNoteContent(cacheNote.NoteId, setContent); // ajaxGet(url, param, setContent);
 }
@@ -812,8 +818,8 @@ Note.renderNote = function(note) {
 
 // render content
 Note.renderNoteContent = function(content) {
-	console.error('---------------- note:' + note.Title);
-	console.trace();
+	// console.error('---------------- note:' + note.Title);
+	// console.trace();
 	setEditorContent(content.Content, content.IsMarkdown, content.Preview);
 
 	// 只有在renderNoteContent时才设置curNoteId
@@ -825,6 +831,14 @@ Note.renderNoteContent = function(content) {
 	Note.renderChangedNote(content);
 };
 
+Note.renderNoteDesc = function(note) {
+	// life
+	// 重新渲染到左侧 desc, 因为笔记传过来是没有desc的
+	note.Desc = Note.genDesc(note.Content);
+	note.ImgSrc = Note.getImgSrc(note.Content);
+	Note.renderChangedNote(note);
+};
+
 // 初始化时渲染最初的notes
 /**
     <div id="noteItemList">
@@ -917,8 +931,9 @@ Note.renderNotes = function(notes, forNewNote, isShared) {
 				}
 			})(i), i*2000);
 	}
-}
-;
+};
+
+
 Note._getNoteHtmlObjct = function(note, isShared) {
 	var baseClasses = "item-my";
 	if(isShared) {
@@ -958,6 +973,10 @@ Note._renderNotes = function(notes, forNewNote, isShared, tang) { // 第几趟
 		}
 		var note = notes[i];
 
+		if(note.InitSync) {
+			Note.getNoteContentLazy(note.NoteId);
+		}
+
 		if(!note.Desc && note.Content) {
 			note.Desc = Note.genDesc(note.Content);
 		}
@@ -1897,21 +1916,38 @@ Note.showConflictInfo = function(target, e) {
 // 内容已同步成功
 Note.contentSynced = function(noteId, content) {
 	var me = this;
-	var note = me.getCurNote();
+	var note = me.getNote(noteId);
 	if(!note) {
+		// 可能之前还没有
+		// me.setNoteCache(noteId, {Content: content});
 		return;
 	}
 	if(note.InitSync) {
 		// 重新render内容
 		note.InitSync = false;
 		note.Content = content;
-		if(me.curNoteId == noteId) {
+		if(me.curNoteId == noteId || me.inChangeNoteId == noteId) {
+			// alert(note.Title);
 			// 重新渲染
 			Note.changeNote(noteId);
+		} else {
+			// 生成desc
+			me.renderNoteDesc(note);
 		}
 	}
 };
 
+// 延迟加载内容
+Note.getNoteContentLazy = function(noteId) {
+	setTimeout(function() {
+		NoteService.getNoteContent(noteId, function(contentO) {
+			if(typeof contentO == 'object') {
+				Note.contentSynced(noteId, contentO.Content);
+			}
+		});
+	}, 10);
+};
+
 
 // 这里速度不慢, 很快
 Note.getContextNotebooks = function(notebooks) {
diff --git a/public/js/app/page.js b/public/js/app/page.js
index d844d47e..8fa3aae2 100644
--- a/public/js/app/page.js
+++ b/public/js/app/page.js
@@ -1,138 +1,60 @@
 // 主页渲染
 //-------------
 
-//----------------------
-// 编辑器模式
-function editorMode() {
-	this.writingHash = "writing";
-	this.normalHash = "normal";
-	this.isWritingMode = location.hash.indexOf(this.writingHash) >= 0;
-	this.toggleA = null;
-}
+var Resize;
 
-editorMode.prototype.toggleAText = function(isWriting) {
-	var self = this;
-	setTimeout(function() {
-		var toggleA = $(".toggle-editor-mode a");
-		var toggleSpan = $(".toggle-editor-mode span");
-		if(isWriting) {
-			toggleA.attr("href", "#" + self.normalHash);
-			toggleSpan.text(getMsg("normalMode"));
-		} else {
-			toggleA.attr("href", "#" + self.writingHash);
-			toggleSpan.text(getMsg("writingMode"));
-		}	
-	}, 0);
-}
-editorMode.prototype.isWriting = function(hash) {
-	return hash.indexOf(this.writingHash) >= 0
-}
-editorMode.prototype.init = function() {
-	this.changeMode(this.isWritingMode);
-	var self = this;
-	$(".toggle-editor-mode").click(function(e) {
-		e.preventDefault();
-		saveBookmark();
-		var $a = $(this).find("a");
-		var isWriting = self.isWriting($a.attr("href"));
-		self.changeMode(isWriting);
-		// 
-		if(isWriting) {
-			setHash("m", self.writingHash);
-		} else {
-			setHash("m", self.normalHash);
+// 写作模式
+var Writting = {
+	_mode: 'normal', // writting
+	themeWrittingO: $('#themeWritting'),
+	writtingToggleO: $('#writtingToggle'),
+	bodyO: $('body'),
+	isWriting: function() {
+		return this._mode != 'normal';
+	},
+	init: function() {
+		var me = this;
+		me.writtingToggleO.click(function() {
+			me.toggle();
+		});
+	},
+
+	// 初始化写作
+	// 主要是markdown两列宽度问题
+	initWritting: function() {
+		var width = UserInfo.MdEditorWidthForWritting;
+		// 设中间
+		if(!width) {
+			width = this.bodyO.width() / 2;
 		}
-		
-		restoreBookmark();
-	});
-}
-// 改变模式
-editorMode.prototype.changeMode = function(isWritingMode) {
-	this.toggleAText(isWritingMode);
-	if(isWritingMode) {
-		this.writtingMode();
-	} else {
-		this.normalMode();
-	}
-	
-	$("#moreBtn i").removeClass("fa-angle-up").addClass("fa-angle-down");
-}
-
-editorMode.prototype.resizeEditor = function() {
-	// css还没渲染完
-	setTimeout(function() {
+		Resize.setMdColumnWidth(width);
+		// $("#mceToolbar").css("height", "40px");
 		resizeEditor();
-	}, 10);
-	setTimeout(function() {
+	},
+	initNormal: function() {
+		Resize.setMdColumnWidth(UserInfo.MdEditorWidth);
+		// $("#mceToolbar").css("height", "30px");
 		resizeEditor();
-	}, 20);
-	setTimeout(function() {
-		resizeEditor();
-	}, 500);
-}
-editorMode.prototype.normalMode = function() {
-	/*
-	var w = $(document).width();
-	var h = $(document).height();
-	$("#lock").css({right:0, bottom:0});
-	*/
-	
-	var $c = $("#editorContent_ifr").contents();
-	
-	$c.contents().find("#writtingMode").remove();
-	$c.contents().find('link[href$="editor-writting-mode.css"]').remove();
-			
-	$("#noteItemListWrap, #notesAndSort").show();
-	$("#noteList").unbind("mouseenter").unbind("mouseleave"); 
-	
-	var theme = UserInfo.Theme || "default";
-	theme += ".css";
-	$("#themeLink").attr("href", "/css/theme/" + theme);
-	
-	$("#mceToolbar").css("height", "30px");
-	
-//	$("#lock").animate({right:w},1000);
-	
-	this.resizeEditor();
-	
-	$("#noteList").width(UserInfo.NoteListWidth);
-	$("#note").css("left", UserInfo.NoteListWidth + 2);
-}
-editorMode.prototype.writtingMode = function() {
-	// $("#pageInner").removeClass("animated fadeInUp");
-	
-	$("#themeLink").attr("href", "/css/theme/writting-overwrite.css");
-	
-	setTimeout(function() {
-		var $c = $("#editorContent_ifr").contents();
-		$c.contents().find("head").append('<link type="text/css" rel="stylesheet" href="/css/editor/editor-writting-mode.css" id="writtingMode">');
-	}, 0);
-		
-	$("#noteItemListWrap, #notesAndSort").fadeOut();
-	$("#noteList").hover(function() {
-		$("#noteItemListWrap, #notesAndSort").fadeIn();
-	}, function() {
-		$("#noteItemListWrap, #notesAndSort").fadeOut();
-	});
-	
-	// 点击扩展会使html的height生成, 切换后会覆盖css文件的
-	$("#mceToolbar").css("height", "40px");
-	
-	//$("#pageInner").addClass("animated fadeInUp");
+	},
 
-	this.resizeEditor();
-	
-	$("#noteList").width(250);
-	$("#note").css("left", 0);
-}
+	toggle: function() {
+		var me = this;
+		me.themeWrittingO.attr('disabled', me._mode != 'normal');
+		me._mode = me._mode == 'normal' ? 'writting' : 'normal';
 
-editorMode.prototype.getWritingCss = function() {
-	if(this.isWritingMode) {
-		return ["/css/editor/editor-writting-mode.css"];
-	}
-	return [];
-}
-var em = new editorMode();
+		// 改变icon
+		if(me._mode != 'normal') {
+			$('body').addClass('writting');
+			me.writtingToggleO.find('.fa').removeClass('fa-expand').addClass('fa-compress');
+
+			me.initWritting();
+		} else {
+			$('body').removeClass('writting');
+			me.writtingToggleO.find('.fa').removeClass('fa-compress').addClass('fa-expand');
+			me.initNormal();
+		}
+	},
+};
 
 //----------------
 // 拖拉改变变宽度
@@ -233,7 +155,12 @@ var Resize = {
 		var self = this;
 		if(self.lineMove || self.mdLineMove) {
 			// ajax保存
-			UserService.updateG({MdEditorWidth: UserInfo.MdEditorWidth, NotebookWidth: UserInfo.NotebookWidth, NoteListWidth: UserInfo.NoteListWidth}, function() {
+			UserService.updateG({
+				MdEditorWidth: UserInfo.MdEditorWidth, 
+				MdEditorWidthForWritting: UserInfo.MdEditorWidthForWritting,
+				NotebookWidth: UserInfo.NotebookWidth, 
+				NoteListWidth: UserInfo.NoteListWidth
+			}, function() {
 			});
 		}
 		self.lineMove = false;
@@ -294,11 +221,17 @@ var Resize = {
 			self.setMdColumnWidth(mdEditorWidth);
 		}
 	},
+
 	// 设置宽度
 	setMdColumnWidth: function(mdEditorWidth) { 
 		var self = this;
 		if(mdEditorWidth > 100) {
-			UserInfo.MdEditorWidth = mdEditorWidth;
+			if(Writting.isWriting()) {
+				UserInfo.MdEditorWidthForWritting = mdEditorWidth;
+			} else {
+				UserInfo.MdEditorWidth = mdEditorWidth;
+			}
+
 			// log(mdEditorWidth)
 			self.leftColumn.width(mdEditorWidth);
 			self.rightColumn.css("left", mdEditorWidth);
@@ -310,7 +243,7 @@ var Resize = {
 			MD.onResize();
 		}
 	}
-}
+};
 
 //--------------------------
 // 手机端访问之
@@ -337,23 +270,6 @@ Mobile = {
 	init: function() {
 		var self = this;
 		self.isMobile();
-		// $(window).on("hashchange", self.hashChange);
-		// self.hashChange();
-		/*
-		$("#noteItemList").on("tap", ".item", function(event) {
-			$(this).click();
-		});
-		$(document).on("swipeleft",function(e){
-			e.stopPropagation();
-			e.preventDefault();
-			self.toEditor();
-		});
-		$(document).on("swiperight",function(e){
-			e.stopPropagation();
-			e.preventDefault();
-			self.toNormal();
-		});
-		*/
 	},
 	isMobile: function() {
 		var u = navigator.userAgent;
@@ -409,31 +325,10 @@ Mobile = {
 		}
 		return false;
 	}
-} 
-
+};
 
 function initSlimScroll() {
-	if(Mobile.isMobile()) {
-		return;
-	}
-	$("#notebook").slimScroll({
-	    height: "100%", // $("#leftNotebook").height()+"px"
-	});
-	$("#noteItemList").slimScroll({
-	    height: "100%", // ($("#leftNotebook").height()-42)+"px"
-	});
-	/*
-	$("#wmd-input").slimScroll({
-	    height: "100%", // $("#wmd-input").height()+"px"
-	});
-	$("#wmd-input").css("width", "100%");
-	*/
-	
-	$("#wmd-panel-preview").slimScroll({
-	    height: "100%", // $("#wmd-panel-preview").height()+"px"
-	});
-	
-	$("#wmd-panel-preview").css("width", "100%");
+	return;
 }
 
 //-----------
@@ -444,7 +339,16 @@ function initEditor() {
 	var mceToobarEverHeight = 0;
 	$("#moreBtn").click(function() {
 		saveBookmark();
-		
+		var $editor = $('#editor');
+		if($editor.hasClass('all-tool')) {
+			$editor.removeClass('all-tool');
+		} else {
+			$editor.addClass('all-tool');
+		}
+
+		restoreBookmark();
+		return;
+
 		var height = $("#mceToolbar").height();
 
 		// 现在是折叠的
@@ -473,7 +377,7 @@ function initEditor() {
 				var num = e.which ? e.which : e.keyCode;
 				if(e.ctrlKey || e.metaKey) {
 				    if(num == 86) { // ctrl + v
-				    	document.execCommand('paste');
+				    	// document.execCommand('paste');
 				    }
 			    };
 			});
@@ -493,8 +397,7 @@ function initEditor() {
 		selector : "#editorContent",
 		// height: 100,//这个应该是文档的高度, 而其上层的高度是$("#content").height(),
 		// parentHeight: $("#content").height(),
-		// content_css : ["/css/bootstrap.css", "/css/editor/editor.css"].concat(em.getWritingCss()),
-		content_css : ["public/css/editor/editor.css"].concat(em.getWritingCss()),
+		content_css : ["public/css/editor/editor.css"],
 		skin : "custom",
 		language: LEA.locale, // 语言
 		plugins : [
@@ -542,6 +445,9 @@ function initEditor() {
 var random = 1;
 function scrollTo(self, tagName, text) {
 	var iframe = $("#editorContent"); // .contents();
+	if(Writting.isWriting()) { 
+		iframe = $('#editorContentWrap');
+	}
 	var target = iframe.find(tagName + ":contains(" + text + ")");
 	random++;
 	
@@ -566,22 +472,6 @@ function scrollTo(self, tagName, text) {
 		// log(top);
 		// iframe.scrollTop(top);
 		iframe.animate({scrollTop: top}, 300); // 有问题
-		
-		/*
-		var d = 200; // 时间间隔
-		for(var i = 0; i < d; i++) {
-			setTimeout(
-			(function(top) {
-				return function() {
-					iframe.scrollTop(top);
-				}
-			})(nowTop + 1.0*i*(top-nowTop)/d), i);
-		}
-		// 最后必然执行
-		setTimeout(function() {
-			iframe.scrollTop(top);
-		}, d+5);
-		*/
 		return;
 	}
 }
@@ -629,105 +519,13 @@ $(function() {
 	function openSetInfoDialog(whichTab) {
 		showDialogRemote("/user/account", {tab: whichTab});
 	}
-	// 帐号设置
-	$("#setInfo").click(function() {
-		openSetInfoDialog(0);
-	});
-	// 邮箱验证
-	$("#wrongEmail").click(function() {
-		openSetInfoDialog(1);
-	});
-	
-	$("#setAvatarMenu").click(function() {
-		showDialog2("#avatarDialog", {title: "头像设置", postShow: function() {
-		}});
-	});
-	$("#setTheme").click(function() {
-		showDialog2("#setThemeDialog", {title: "主题设置", postShow: function() {
-			if (!UserInfo.Theme) {
-				UserInfo.Theme = "default";
-			}
-			$("#themeForm input[value='" + UserInfo.Theme + "']").attr("checked", true);
-		}});
-	});
-	
-	//---------
-	// 主题
-	$("#themeForm").on("click", "input", function(e) {
-		var val = $(this).val();
-		$("#themeLink").attr("href", "/css/theme/" + val + ".css");
-		
-		ajaxPost("/user/updateTheme", {theme: val}, function(re) {
-			if(reIsOk(re)) {
-				UserInfo.Theme = val
-			}
-		});
-	});
-	
-	//-------------
-	// 邮箱验证
-	if(!UserInfo.Verified) {
-//		$("#leanoteMsg").hide();
-//		$("#verifyMsg").show();
-	}
-	
+
 	// 禁止双击选中文字
 	$("#notebook, #newMyNote, #myProfile, #topNav, #notesAndSort", "#leanoteNavTrigger").bind("selectstart", function(e) {
 		e.preventDefault();
 		return false;
 	});
 	
-	// 左侧隐藏或展示
-	function updateLeftIsMin(is) {
-		ajaxGet("/user/updateLeftIsMin", {leftIsMin: is})
-	}
-	function minLeft(save) {
-		$("#leftNotebook").width(30);
-		$("#notebook").hide();
-		// 左侧
-		$("#noteAndEditor").css("left", 30)	
-		$("#notebookSplitter").hide();
-		
-//		$("#leftSwitcher").removeClass("fa-angle-left").addClass("fa-angle-right");
-		
-		// logo
-		$("#logo").hide();
-		$("#leftSwitcher").hide();
-		$("#leftSwitcher2").show();
-		$("#leftNotebook .slimScrollDiv").hide();
-		
-		if(save) {
-			updateLeftIsMin(true);
-		}
-	}
-	
-	function maxLeft(save) {
-		$("#noteAndEditor").css("left", UserInfo.NotebookWidth);
-		$("#leftNotebook").width(UserInfo.NotebookWidth);
-		$("#notebook").show();
-		$("#notebookSplitter").show();
-		
-//		$("#leftSwitcher").removeClass("fa-angle-right").addClass("fa-angle-left");
-		
-		$("#leftSwitcher2").hide();
-		$("#logo").show();
-		$("#leftSwitcher").show();
-		$("#leftNotebook .slimScrollDiv").show();
-		
-		if(save) {
-			updateLeftIsMin(false);
-		}
-	}
-	
-	$("#leftSwitcher2").on('click', function() {
-		maxLeft(true);
-	});
-	$("#leftSwitcher").click('click', function() {
-		if(Mobile.switchPage()) {
-			minLeft(true);
-		}
-	});
-	
 	// 得到最大dropdown高度
 	// 废弃
 	function getMaxDropdownHeight(obj) {
@@ -742,26 +540,6 @@ $(function() {
 		return preHeight < maxHeight ? preHeight : maxHeight;
 	}
 	
-	// mini版
-	// 点击展开
-	$("#notebookMin div.minContainer").click(function() {
-		var target = $(this).attr("target");
-		maxLeft(true);
-		if(target == "#notebookList") {
-			if($("#myNotebooks").hasClass("closed")) {
-				$("#myNotebooks .folderHeader").trigger("click");
-			}
-		} else if(target == "#tagNav") {
-			if($("#myTag").hasClass("closed")) {
-				$("#myTag .folderHeader").trigger("click");
-			}
-		} else {
-			if($("#myShareNotebooks").hasClass("closed")) {
-				$("#myShareNotebooks .folderHeader").trigger("click");
-			}
-		}
-	});
-	
 	//------------------------
 	// 界面设置, 左侧是否是隐藏的
 	UserInfo.NotebookWidth = UserInfo.NotebookWidth || $("#notebook").width();
@@ -771,54 +549,6 @@ $(function() {
 	Resize.set3ColumnsWidth(UserInfo.NotebookWidth, UserInfo.NoteListWidth);
 	Resize.setMdColumnWidth(UserInfo.MdEditorWidth);
 	
-	if (UserInfo.LeftIsMin) {
-		minLeft(false);
-	}
-	
-	// 4/25 防止dropdown太高
-	// dropdown
-	$('.dropdown').on('shown.bs.dropdown', function () {
-		var $ul = $(this).find("ul");
-		// $ul.css("max-height", getMaxDropdownHeight(this));
-	});
-	
-	//--------
-	// 编辑器帮助
-	$("#tipsBtn").click(function() {
-		showDialog2("#tipsDialog");
-	});
-	
-	//--------
-	// 建议
-	$("#yourSuggestions").click(function() {
-		showDialog2("#suggestionsDialog");
-	});
-	$("#suggestionBtn").click(function(e) {
-		e.preventDefault();
-		var suggestion = $.trim($("#suggestionTextarea").val());
-		if(!suggestion) {
-			$("#suggestionMsg").html("请输入您的建议, 谢谢!").show().addClass("alert-warning").removeClass("alert-success");
-			$("#suggestionTextarea").focus();
-			return;
-		}
-		$("#suggestionBtn").html("正在处理...").addClass("disabled");
-		$("#suggestionMsg").html("正在处理...");
-		$.post("/suggestion", {suggestion: suggestion}, function(ret) {
-			$("#suggestionBtn").html("提交").removeClass("disabled");
-			if(ret.Ok) {
-				$("#suggestionMsg").html("谢谢反馈, 我们会第一时间处理, 祝您愉快!").addClass("alert-success").removeClass("alert-warning").show();
-			} else {
-				$("#suggestionMsg").html("出错了").show().addClass("alert-warning").removeClass("alert-success");
-			}
-		});
-	});
-	
-	// 编辑器模式
-	em.init();
-	
-	// 手机端?
-	Mobile.init();
-
 	// markdown preview下的a不能点击
 	$('#preview-contents').on('click', 'a', function(e) {
 		e.preventDefault();
@@ -1693,7 +1423,7 @@ var Pren = {
 			if(e.keyCode == 27) {
 				if(me._isPren) {
 					me.togglePren();
-				} else if(isFullscreen) {
+				} else if(me._isFullscreen) {
 					me.toggleFullscreen();
 				}
 			}
@@ -1715,6 +1445,7 @@ var Pren = {
 	}
 };
 
+
 // user
 function userMenu() {
 	//-------------------
@@ -1830,5 +1561,6 @@ function userMenu() {
 $(function() {
 	initUploadImage();
 	userMenu();
+	Writting.init();
 });
 
diff --git a/public/js/common.js b/public/js/common.js
index 2e70f77d..9236a02e 100644
--- a/public/js/common.js
+++ b/public/js/common.js
@@ -717,25 +717,10 @@ function getObjectId() {
 
 //-----------------------------------------
 function resizeEditor(second) {
-	var ifrParent = $("#editorContent_ifr").parent();
-    ifrParent.css("overflow", "auto");
-    var height = $("#editorContent").height();
-    ifrParent.height(height);
-    // log(height + '---------------------------------------')
-    $("#editorContent_ifr").height(height);
-
-    // life 12.9
-    // inline editor
-    $("#editorContent").css("top", $("#mceToolbar").height());
-    
-    /*
-    // 第一次时可能会被改变
-    if(!second) {
-		setTimeout(function() {
-			resizeEditorHeight(true);
-		}, 1000);
-    }
-    */
+	return;
+	var h = $("#mceToolbar").height()
+    $("#editorContent").css("top", h);
+    $("#editorContentWrap").css('top', h);
 }
 
 //----------
@@ -1396,6 +1381,7 @@ function commonCmd(e) {
 	    	document.execCommand('copy');
 	    } else if(num == 86) { // ctrl + v
 	    	document.execCommand('paste');
+	    	console.log("paste--------------")
 	    } else if(num == 65) { // ctrl + a
 	    	document.execCommand('selectAll');
 	    } else if(num == 88) { // ctrl + x