Mobile: Fade edges of fullscreen toolbar

src/css/simplemde.css

@@ -66,10 +66,11 @@
 
 .editor-toolbar.fullscreen {
 	width: 100%;
-	height: 50px;
+	height: 40px;
 	overflow-x: auto;
 	overflow-y: hidden;
 	white-space: nowrap;
+	padding-top: 10px;
 	background: #fff;
 	border: 0;
 	position: fixed;
@@ -79,6 +80,40 @@
 	z-index: 9;
 }
 
+.editor-toolbar.fullscreen::before {
+	width: 20px;
+	height: 50px;
+	background: -moz-linear-gradient(left,  rgba(255,255,255,1) 0%, rgba(125,185,232,0.01) 100%); /* FF3.6+ */
+	background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(125,185,232,0.01))); /* Chrome,Safari4+ */
+	background: -webkit-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(125,185,232,0.01) 100%); /* Chrome10+,Safari5.1+ */
+	background: -o-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(125,185,232,0.01) 100%); /* Opera 11.10+ */
+	background: -ms-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(125,185,232,0.01) 100%); /* IE10+ */
+	background: linear-gradient(to right,  rgba(255,255,255,1) 0%,rgba(125,185,232,0.01) 100%); /* W3C */
+	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#037db9e8',GradientType=1 ); /* IE6-9 */
+	position: fixed;
+	top: 0;
+	left: 0;
+	margin: 0;
+	padding: 0;
+}
+
+.editor-toolbar.fullscreen::after {
+	width: 20px;
+	height: 50px;
+	background: -moz-linear-gradient(left,  rgba(125,185,232,0.01) 0%, rgba(254,254,255,1) 99%, rgba(255,255,255,1) 100%); /* FF3.6+ */
+	background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(125,185,232,0.01)), color-stop(99%,rgba(254,254,255,1)), color-stop(100%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
+	background: -webkit-linear-gradient(left,  rgba(125,185,232,0.01) 0%,rgba(254,254,255,1) 99%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */
+	background: -o-linear-gradient(left,  rgba(125,185,232,0.01) 0%,rgba(254,254,255,1) 99%,rgba(255,255,255,1) 100%); /* Opera 11.10+ */
+	background: -ms-linear-gradient(left,  rgba(125,185,232,0.01) 0%,rgba(254,254,255,1) 99%,rgba(255,255,255,1) 100%); /* IE10+ */
+	background: linear-gradient(to right,  rgba(125,185,232,0.01) 0%,rgba(254,254,255,1) 99%,rgba(255,255,255,1) 100%); /* W3C */
+	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#037db9e8', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */
+	position: fixed;
+	top: 0;
+	right: 0;
+	margin: 0;
+	padding: 0;
+}
+
 .editor-toolbar a {
 	display: inline-block;
 	text-align: center;