compatible for iPhone/ipad; writing mode for ipad/iphone

app/views/note/note-dev.html

@@ -160,12 +160,18 @@ function log(o) {
 								{{msg . "myBlog"}}</a>
 							</li>
 							
+							<li role="presentation" class="divider my-link writing-mobile-hide"></li>
+							<li role="presentation" class="my-link toggle-editor-mode" >
+								<a href="#writing"><i class="fa fa-rocket"></i>
+								{{msg . "writingMode"}}</a>
+							</li>
+							
 							{{if .isAdmin}}
 							<li role="presentation" class="divider"></li>
 							<li role="presentation">
 								<a target="_blank" title="{{msg . "amdin"}}" href="/admin/index">
 									<i class="fa fa-dashboard"></i> 
-									{{msg . "admin"}}
+									<span>{{msg . "admin"}}</span>
 								</a>
 							</li>
 							{{end}}
@@ -178,14 +184,14 @@ function log(o) {
 					</div>
 				</div>
 
-				<div class="pull-right top-nav" id="myBlog">
+				<div class="pull-right top-nav writting-hide" id="myBlog">
 					<a target="_blank" href="{{$.blogUrl}}/{{.userInfo.Username}}"> 
 						{{msg . "myBlog"}}
 					</a>
 				</div>
 
-				<div class="pull-right" style="line-height: 60px; margin-right:10px" id="toggleEditorMode">
+				<div class="pull-right toggle-editor-mode" style="line-height: 60px; margin-right:10px" id="toggleEditorMode">
-					<a href="#writing">{{msg . "writingMode"}}</a>
+					<a href="#writing"><span>{{msg . "writingMode"}}</span></a>
 				</div>
 				
 				{{if eq .userInfo.Email "demo@leanote.com"}}

app/views/note/note.html

@@ -160,12 +160,20 @@ function log(o) {
 								{{msg . "myBlog"}}</a>
 							</li>
 							
+							<!--
+							<li role="presentation" class="divider my-link"></li>
+							<li role="presentation" class="my-link toggle-editor-mode" >
+								<a href="#writing"><i class="fa fa-rocket"></i>
+								{{msg . "writingMode"}}</a>
+							</li>
+							-->
+							
 							{{if .isAdmin}}
 							<li role="presentation" class="divider"></li>
 							<li role="presentation">
 								<a target="_blank" title="{{msg . "amdin"}}" href="/admin/index">
 									<i class="fa fa-dashboard"></i> 
-									{{msg . "admin"}}
+									<span>{{msg . "admin"}}</span>
 								</a>
 							</li>
 							{{end}}
@@ -178,14 +186,20 @@ function log(o) {
 					</div>
 				</div>
 
-				<div class="pull-right top-nav" id="myBlog">
+				<div class="pull-right top-nav writting-hide lea-blog">
+					<a target="_blank" href="http://lea.leanote.com"> 
+						lea++
+					</a>
+				</div>
+				
+				<div class="pull-right top-nav writting-hide" id="myBlog">
 					<a target="_blank" href="{{$.blogUrl}}/{{.userInfo.Username}}"> 
 						{{msg . "myBlog"}}
 					</a>
 				</div>
 
-				<div class="pull-right" style="line-height: 60px; margin-right:10px" id="toggleEditorMode">
+				<div class="pull-right toggle-editor-mode" style="line-height: 60px; margin-right:10px" id="toggleEditorMode">
-					<a href="#writing">{{msg . "writingMode"}}</a>
+					<a href="#writing"><span>{{msg . "writingMode"}}</span></a>
 				</div>
 				
 				{{if eq .userInfo.Email "demo@leanote.com"}}

public/css/theme/basic.less

@@ -38,6 +38,20 @@
 
 /*"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_ifr,
+.mce-edit-area,.mce-container-body,.mce-tinymce,
+#editor .mce-ifr,
+.wmd-input,
+#noteReadContent,
+#attachList,
+#tags
+{
+	-webkit-overflow-scrolling: touch !important; // for iphone
+}
+
+
 .btn {
 	border-radius: 2px;
 }
@@ -618,7 +632,7 @@
 }
 #tag {
 	position: absolute;
-	right: 270px;
+	right: 300px;
 	left: 0;
 	top: 0;
 	bottom: 0;

public/css/theme/default.css

@@ -31,6 +31,21 @@
   font-style: normal;
 }
 /*"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_ifr,
+.mce-edit-area,
+.mce-container-body,
+.mce-tinymce,
+#editor .mce-ifr,
+.wmd-input,
+#noteReadContent,
+#attachList,
+#tags {
+  -webkit-overflow-scrolling: touch !important;
+}
 .btn {
   border-radius: 2px;
 }
@@ -561,7 +576,7 @@
 }
 #tag {
   position: absolute;
-  right: 270px;
+  right: 300px;
   left: 0;
   top: 0;
   bottom: 0;
@@ -1807,7 +1822,10 @@ background-position:-1px -670px
   .new-note-text,
   .username,
   #notebookMin,
-  .ui-loader {
+  .ui-loader,
+  #md-section-helper,
+  #right-column,
+  .writing-mobile-hide {
     display: none !important;
   }
   *,
@@ -1940,7 +1958,6 @@ background-position:-1px -670px
     bottom: 0;
     overflow-y: hidden;
     overflow-x: scroll;
-    -webkit-overflow-scrolling: touch !important;
     position: absolute;
     line-height: 40px;
     line-height: inherit !important;
@@ -1968,12 +1985,6 @@ background-position:-1px -670px
   #mdEditor #wmd-input {
     font-size: 16px;
   }
-  #md-section-helper {
-    display: none;
-  }
-  #right-column {
-    display: none !important;
-  }
   .new-markdown-text-abbr,
   .new-note-text-abbr {
     display: inline;
@@ -1997,19 +2008,18 @@ background-position:-1px -670px
   .mce-container-body,
   .mce-tinymce,
   #editor .mce-ifr,
-  .wmd-input {
+  .wmd-input,
+  #noteReadContent,
+  #attachList,
+  #tags {
     overflow: scroll !important;
     -webkit-overflow-scrolling: touch !important;
   }
-  #noteReadContent {
-    -webkit-overflow-scrolling: touch !important;
-  }
   #attachMenu {
     width: 320px;
   }
   #attachList {
     max-height: 200px;
-    -webkit-overflow-scrolling: touch !important;
   }
   #attachList li .attach-title {
     width: 170px;
@@ -2043,3 +2053,164 @@ background-position:-1px -670px
     opacity: 0.8;
   }
 }
+@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;
+  }
+  #tag {
+    position: absolute;
+    right: 140px;
+    left: 0;
+    top: 0;
+    bottom: 0;
+    overflow: hidden;
+  }
+  #tag #tags {
+    left: 50px;
+    right: 0;
+    top: 0;
+    bottom: 0;
+    overflow-y: hidden;
+    overflow-x: scroll;
+    position: absolute;
+    line-height: 40px;
+    line-height: inherit !important;
+  }
+  #tag #tagDropdown {
+    float: left;
+    width: 50px;
+    line-height: 40px;
+    overflow: hidden;
+    padding-left: 3px;
+  }
+  #tag .add-tag-text {
+    display: none;
+  }
+  #tag #addTagInput {
+    width: 30px;
+    display: inline-block;
+  }
+  #tag #tagColor {
+    display: none !important;
+  }
+}
+@media screen and (max-width: 800px) {
+  #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;
+  }
+  #lea,
+  .lea-blog,
+  #myBlog,
+  #demoRegister,
+  .noteSplit,
+  #tipsBtn,
+  #contentHistory,
+  #curNotebookForNewNote,
+  #curNotebookForNewSharedNote,
+  .for-split,
+  #listNotebookDropdownMenu,
+  #listShareNotebookDropdownMenu,
+  .username,
+  .ui-loader,
+  #md-section-helper,
+  #right-column {
+    display: none !important;
+  }
+  #tag {
+    position: absolute;
+    right: 160px;
+    left: 0;
+    top: 0;
+    bottom: 0;
+    overflow: hidden;
+  }
+  #tag #tags {
+    left: 50px;
+    right: 0;
+    top: 0;
+    bottom: 0;
+    overflow-y: hidden;
+    overflow-x: scroll;
+    position: absolute;
+    line-height: 40px;
+    line-height: inherit !important;
+  }
+  #tag #tagDropdown {
+    float: left;
+    width: 50px;
+    line-height: 40px;
+    overflow: hidden;
+    padding-left: 3px;
+  }
+  #tag .add-tag-text {
+    display: none;
+  }
+  #tag #addTagInput {
+    width: 30px;
+    display: inline-block;
+  }
+  #tag #tagColor {
+    display: none !important;
+  }
+  .my-link {
+    display: block;
+  }
+  #attachMenu {
+    width: 320px;
+  }
+  #attachList {
+    max-height: 200px;
+  }
+  #attachList li .attach-title {
+    width: 170px;
+  }
+  #dropAttach .btn {
+    padding: 5px 3px;
+    margin-top: 3px;
+    display: block;
+  }
+  #myTag .folderBody li {
+    margin: 5px;
+  }
+  #myTag .folderBody li a:hover span {
+    color: #65bd77;
+  }
+  #left-column {
+    width: 100% !important;
+  }
+  #mdEditor #wmd-input {
+    font-size: 16px;
+  }
+  .my-link {
+    display: block;
+  }
+  #themeForm img {
+    height: 70px !important;
+  }
+}

public/css/theme/mobile.less

@@ -1,6 +1,6 @@
-@media screen and (max-width:700px) {
 @green: #65bd77;
 
+@media screen and (max-width:700px) {
 #toggleEditorMode,
 #lea,
 #myBlog,
@@ -18,7 +18,10 @@
 .new-note-text,
 .username,
 #notebookMin,
-.ui-loader 
+.ui-loader,
+#md-section-helper,
+#right-column,
+.writing-mobile-hide
 {
 	display: none !important;
 }
@@ -159,7 +162,6 @@ a:focus, a:hover, a:active {
 		bottom: 0;
 		overflow-y: hidden;
 		overflow-x: scroll;
-		-webkit-overflow-scrolling: touch !important; // for iphone
 		position: absolute;
 		line-height: 40px;
 		line-height: inherit !important;
@@ -188,12 +190,7 @@ a:focus, a:hover, a:active {
 #mdEditor #wmd-input {
 	font-size: 16px;
 }
-#md-section-helper {
+
-	display: none;
-}
-#right-column {
-	display: none !important;
-}
 .new-markdown-text-abbr, .new-note-text-abbr {
 	display: inline;
 }
@@ -214,21 +211,20 @@ a:focus, a:hover, a:active {
 #editorContent_ifr,
 .mce-edit-area,.mce-container-body,.mce-tinymce,
 #editor .mce-ifr,
-.wmd-input{
+.wmd-input,
+#noteReadContent,
+#attachList,
+#tags
+{
 	overflow: scroll !important;
 	-webkit-overflow-scrolling: touch !important; // for iphone
 }
 
-#noteReadContent {
-	-webkit-overflow-scrolling: touch !important; // for iphone
-}
-
 #attachMenu {
 	width: 320px;
 }
 #attachList {
 	max-height: 200px;
-	-webkit-overflow-scrolling: touch !important; // for iphone
 }
 #attachList li .attach-title {
 	width: 170px;
@@ -266,4 +262,179 @@ a:focus, a:hover, a:active {
 	opacity: .8
 }
 
+}
+
+// ipad 
+@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
+}
+
+#tag {
+	position: absolute;
+	right: 140px;
+	left:0;
+	top:0;
+	bottom:0;
+	overflow: hidden;
+
+	#tags {
+		position: absolute;
+		left: 50px;
+		right: 0;
+		top: 0;
+		bottom: 0;
+		overflow-y: hidden;
+		overflow-x: scroll;
+		position: absolute;
+		line-height: 40px;
+		line-height: inherit !important;
+	}
+	#tagDropdown {
+		float: left;
+		width: 50px;
+		line-height: 40px;
+		overflow: hidden;
+		padding-left: 3px;
+	}
+	.add-tag-text {
+		display: none;
+	}
+	#addTagInput {
+		width: 30px;
+		display: inline-block;
+	}
+	#tagColor {
+		display: none !important;
+	}
+}
+
+}
+
+@media screen and (max-width: 800px) {
+#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
+}
+
+#lea,
+.lea-blog,
+#myBlog,
+#demoRegister,
+.noteSplit,
+#tipsBtn,
+#contentHistory,
+#curNotebookForNewNote,
+#curNotebookForNewSharedNote,
+.for-split,
+#listNotebookDropdownMenu,
+#listShareNotebookDropdownMenu,
+.username,
+.ui-loader,
+#md-section-helper,
+#right-column
+{
+	display: none !important;
+}
+
+#tag {
+	position: absolute;
+	right: 160px;
+	left:0;
+	top:0;
+	bottom:0;
+	overflow: hidden;
+
+	#tags {
+		position: absolute;
+		left: 50px;
+		right: 0;
+		top: 0;
+		bottom: 0;
+		overflow-y: hidden;
+		overflow-x: scroll;
+		position: absolute;
+		line-height: 40px;
+		line-height: inherit !important;
+	}
+	#tagDropdown {
+		float: left;
+		width: 50px;
+		line-height: 40px;
+		overflow: hidden;
+		padding-left: 3px;
+	}
+	.add-tag-text {
+		display: none;
+	}
+	#addTagInput {
+		width: 30px;
+		display: inline-block;
+	}
+	#tagColor {
+		display: none !important;
+	}
+}
+
+.my-link {
+	display: block;
+}
+
+#attachMenu {
+	width: 320px;
+}
+#attachList {
+	max-height: 200px;
+}
+#attachList li .attach-title {
+	width: 170px;
+}
+#dropAttach .btn {
+	padding: 5px 3px;
+	margin-top: 3px;
+	display: block;
+}
+#myTag .folderBody li {
+	margin: 5px;
+	a:hover {
+		span {
+			color: @green;
+		}
+	}
+}
+
+#left-column {
+	width: 100% !important;
+}
+#mdEditor #wmd-input {
+	font-size: 16px;
+}
+
+.my-link {
+	display: block;
+}
+
+#themeForm img {
+	height: 70px !important;
+}
+
 }

public/css/theme/simple.css

@@ -31,6 +31,21 @@
   font-style: normal;
 }
 /*"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_ifr,
+.mce-edit-area,
+.mce-container-body,
+.mce-tinymce,
+#editor .mce-ifr,
+.wmd-input,
+#noteReadContent,
+#attachList,
+#tags {
+  -webkit-overflow-scrolling: touch !important;
+}
 .btn {
   border-radius: 2px;
 }
@@ -561,7 +576,7 @@
 }
 #tag {
   position: absolute;
-  right: 270px;
+  right: 300px;
   left: 0;
   top: 0;
   bottom: 0;
@@ -1742,7 +1757,10 @@ background-position:-1px -670px
   .new-note-text,
   .username,
   #notebookMin,
-  .ui-loader {
+  .ui-loader,
+  #md-section-helper,
+  #right-column,
+  .writing-mobile-hide {
     display: none !important;
   }
   *,
@@ -1875,7 +1893,6 @@ background-position:-1px -670px
     bottom: 0;
     overflow-y: hidden;
     overflow-x: scroll;
-    -webkit-overflow-scrolling: touch !important;
     position: absolute;
     line-height: 40px;
     line-height: inherit !important;
@@ -1903,12 +1920,6 @@ background-position:-1px -670px
   #mdEditor #wmd-input {
     font-size: 16px;
   }
-  #md-section-helper {
-    display: none;
-  }
-  #right-column {
-    display: none !important;
-  }
   .new-markdown-text-abbr,
   .new-note-text-abbr {
     display: inline;
@@ -1932,19 +1943,18 @@ background-position:-1px -670px
   .mce-container-body,
   .mce-tinymce,
   #editor .mce-ifr,
-  .wmd-input {
+  .wmd-input,
+  #noteReadContent,
+  #attachList,
+  #tags {
     overflow: scroll !important;
     -webkit-overflow-scrolling: touch !important;
   }
-  #noteReadContent {
-    -webkit-overflow-scrolling: touch !important;
-  }
   #attachMenu {
     width: 320px;
   }
   #attachList {
     max-height: 200px;
-    -webkit-overflow-scrolling: touch !important;
   }
   #attachList li .attach-title {
     width: 170px;
@@ -1978,3 +1988,164 @@ background-position:-1px -670px
     opacity: 0.8;
   }
 }
+@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;
+  }
+  #tag {
+    position: absolute;
+    right: 140px;
+    left: 0;
+    top: 0;
+    bottom: 0;
+    overflow: hidden;
+  }
+  #tag #tags {
+    left: 50px;
+    right: 0;
+    top: 0;
+    bottom: 0;
+    overflow-y: hidden;
+    overflow-x: scroll;
+    position: absolute;
+    line-height: 40px;
+    line-height: inherit !important;
+  }
+  #tag #tagDropdown {
+    float: left;
+    width: 50px;
+    line-height: 40px;
+    overflow: hidden;
+    padding-left: 3px;
+  }
+  #tag .add-tag-text {
+    display: none;
+  }
+  #tag #addTagInput {
+    width: 30px;
+    display: inline-block;
+  }
+  #tag #tagColor {
+    display: none !important;
+  }
+}
+@media screen and (max-width: 800px) {
+  #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;
+  }
+  #lea,
+  .lea-blog,
+  #myBlog,
+  #demoRegister,
+  .noteSplit,
+  #tipsBtn,
+  #contentHistory,
+  #curNotebookForNewNote,
+  #curNotebookForNewSharedNote,
+  .for-split,
+  #listNotebookDropdownMenu,
+  #listShareNotebookDropdownMenu,
+  .username,
+  .ui-loader,
+  #md-section-helper,
+  #right-column {
+    display: none !important;
+  }
+  #tag {
+    position: absolute;
+    right: 160px;
+    left: 0;
+    top: 0;
+    bottom: 0;
+    overflow: hidden;
+  }
+  #tag #tags {
+    left: 50px;
+    right: 0;
+    top: 0;
+    bottom: 0;
+    overflow-y: hidden;
+    overflow-x: scroll;
+    position: absolute;
+    line-height: 40px;
+    line-height: inherit !important;
+  }
+  #tag #tagDropdown {
+    float: left;
+    width: 50px;
+    line-height: 40px;
+    overflow: hidden;
+    padding-left: 3px;
+  }
+  #tag .add-tag-text {
+    display: none;
+  }
+  #tag #addTagInput {
+    width: 30px;
+    display: inline-block;
+  }
+  #tag #tagColor {
+    display: none !important;
+  }
+  .my-link {
+    display: block;
+  }
+  #attachMenu {
+    width: 320px;
+  }
+  #attachList {
+    max-height: 200px;
+  }
+  #attachList li .attach-title {
+    width: 170px;
+  }
+  #dropAttach .btn {
+    padding: 5px 3px;
+    margin-top: 3px;
+    display: block;
+  }
+  #myTag .folderBody li {
+    margin: 5px;
+  }
+  #myTag .folderBody li a:hover span {
+    color: #65bd77;
+  }
+  #left-column {
+    width: 100% !important;
+  }
+  #mdEditor #wmd-input {
+    font-size: 16px;
+  }
+  .my-link {
+    display: block;
+  }
+  #themeForm img {
+    height: 70px !important;
+  }
+}

public/css/theme/writting-overwrite.css

@@ -31,6 +31,21 @@
   font-style: normal;
 }
 /*"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_ifr,
+.mce-edit-area,
+.mce-container-body,
+.mce-tinymce,
+#editor .mce-ifr,
+.wmd-input,
+#noteReadContent,
+#attachList,
+#tags {
+  -webkit-overflow-scrolling: touch !important;
+}
 .btn {
   border-radius: 2px;
 }
@@ -561,7 +576,7 @@
 }
 #tag {
   position: absolute;
-  right: 270px;
+  right: 300px;
   left: 0;
   top: 0;
   bottom: 0;
@@ -1638,14 +1653,12 @@ body {
 }
 #newNoteWrap,
 #topNav,
-#lea,
+#lea {
-#myBlog {
   opacity: 0;
 }
 #newNoteWrap:hover,
 #topNav:hover,
-#lea:hover,
+#lea:hover {
-#myBlog:hover {
   opacity: 1;
 }
 #mainContainer {
@@ -1846,3 +1859,45 @@ body {
 #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;
+  }
+}

public/css/theme/writting-overwrite.less

@@ -869,7 +869,7 @@ html,body {
 	z-index:333;
 	#leanoteMsg {
 		position: absolute;
-		width: @editorWidth;
+		width: 700px;
 		left:0;
 		right:0;
 		text-align: right;
@@ -884,7 +884,7 @@ html,body {
 	margin-left: 10px;
 }
 
-#newNoteWrap, #topNav, #lea, #myBlog {
+#newNoteWrap, #topNav, #lea {
 	opacity: 0;
 	&:hover {
 		opacity: 1;
@@ -1096,4 +1096,42 @@ body {
 }
 #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
+}
+}

public/css/theme/writting.css

@@ -31,6 +31,21 @@
   font-style: normal;
 }
 /*"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_ifr,
+.mce-edit-area,
+.mce-container-body,
+.mce-tinymce,
+#editor .mce-ifr,
+.wmd-input,
+#noteReadContent,
+#attachList,
+#tags {
+  -webkit-overflow-scrolling: touch !important;
+}
 .btn {
   border-radius: 2px;
 }
@@ -561,7 +576,7 @@
 }
 #tag {
   position: absolute;
-  right: 270px;
+  right: 300px;
   left: 0;
   top: 0;
   bottom: 0;

public/js/app/page.js

@@ -14,11 +14,14 @@ function editorMode() {
 editorMode.prototype.toggleAText = function(isWriting) {
 	var self = this;
 	setTimeout(function() {
-		toggleA = $("#toggleEditorMode a");
+		var toggleA = $(".toggle-editor-mode a");
+		var toggleSpan = $(".toggle-editor-mode span");
 		if(isWriting) {
-			toggleA.attr("href", self.normalHash).text(getMsg("normalMode"));
+			toggleA.attr("href", self.normalHash);
+			toggleSpan.text(getMsg("normalMode"));
 		} else {
-			toggleA.attr("href", self.writingHash).text(getMsg("writingMode"));
+			toggleA.attr("href", self.writingHash);
+			toggleSpan.text(getMsg("writingMode"));
 		}	
 	}, 0);
 }
@@ -28,7 +31,7 @@ editorMode.prototype.isWriting = function(hash) {
 editorMode.prototype.init = function() {
 	this.changeMode(this.isWritingMode);
 	var self = this;
-	$("#toggleEditorMode").click(function() {
+	$(".toggle-editor-mode").click(function() {
 		// 
 		saveBookmark();
 		var $a = $(this).find("a");
@@ -310,7 +313,8 @@ Mobile = {
 	isMobile: function() {
 		var u = navigator.userAgent;
 		LEA.isMobile = false;
-		LEA.isMobile = /Mobile|Android|iPhone/i.test(u);
+		LEA.isMobile = /Mobile|Android|iPhone|iPad/i.test(u);
+		LEA.isIpad =  /iPhone|iPad/i.test(u);
 		if(!LEA.isMobile && $(document).width() <= 700){ 
 			LEA.isMobile = true
 		}
@@ -345,7 +349,7 @@ Mobile = {
 	},
 	switchPage: function() {
 		var self = this;
-		if(!LEA.isMobile) {return true;}
+		if(!LEA.isMobile || LEA.isIpad) {return true;}
 		if(self.bodyO.hasClass("full-editor")) {
 			self.toNormal(true);
 		} else {