html editor optimizations

rainloop/v/0.0.0/static/css/app.css

@@ -637,7 +637,7 @@
 	border-radius: 8px;
 }
 
-
+
 /*! normalize.css 2012-03-11T12:53 UTC - http://github.com/necolas/normalize.css */
 
 /* =============================================================================
@@ -1142,7 +1142,7 @@ table {
     border-collapse: collapse;
     border-spacing: 0;
 }
-
+
 @charset "UTF-8";
 
 @font-face {
@@ -1474,7 +1474,7 @@ table {
 .icon-mail:before {
   content: "\e062";
 }
-
+
 /** initial setup **/
 .nano {
 /*
@@ -1591,7 +1591,7 @@ table {
 .nano > .pane2:hover > .slider2, .nano > .pane2.active > .slider2 {
 	background-color: rgba(0, 0, 0, 0.4);
 }
-
+
 /* Magnific Popup CSS */
 .mfp-bg {
   top: 0;
@@ -1956,7 +1956,7 @@ img.mfp-img {
   right: 0;
   padding-top: 0; }
 
-
+
 
 /* overlay at start */
 .mfp-fade.mfp-bg {
@@ -2002,7 +2002,7 @@ img.mfp-img {
   -moz-transform: translateX(50px);
   transform: translateX(50px);
 }
-
+
 .simple-pace {
 	-webkit-pointer-events: none;
 	pointer-events: none;
@@ -2073,7 +2073,7 @@ img.mfp-img {
 @keyframes simple-pace-stripe-animation {
 	0% { transform: none; transform: none; }
 	100% { transform: translate(-32px, 0); transform: translate(-32px, 0); }
-}
+}
 .inputosaurus-container {
 	background-color:#fff;
 	border:1px solid #bcbec0;
@@ -2141,7 +2141,7 @@ img.mfp-img {
 	box-shadow:none;
 }
 .inputosaurus-input-hidden { display:none; }
-
+
 .flag-wrapper {
 	width: 24px;
 	height: 16px;
@@ -2183,7 +2183,7 @@ img.mfp-img {
 .flag.flag-pt-br {background-position: -192px -11px}
 
 .flag.flag-cn, .flag.flag-zh-tw, .flag.flag-zh-cn, .flag.flag-zh-hk {background-position: -208px -22px}
-
+
 /* RainLoop Webmail (c) RainLoop Team | Licensed under CC BY-NC-SA 3.0 */
 .clearfix {
   *zoom: 1;
@@ -8628,7 +8628,9 @@ html.html-editor-wrapper-fullscreen .html-editor-wrapper-plain.styled {
   border-radius: 0;
 }
 .html-editor-wrapper-html.styled:focus,
-.html-editor-wrapper-plain.styled:focus {
+.html-editor-wrapper-plain.styled:focus,
+.html-editor-wrapper-html.styled.focused,
+.html-editor-wrapper-plain.styled.focused {
   border: 1px solid #999999;
   -webkit-box-shadow: none;
   -moz-box-shadow: none;
@@ -8655,13 +8657,17 @@ html.html-editor-wrapper-fullscreen .html-editor-wrapper-plain.styled {
 .html-editor-wrapper-mode-button,
 .html-editor-wrapper-fullscreen-button {
   position: absolute;
-  top: 5px;
+  bottom: 5px;
   right: 25px;
   z-index: 100;
   color: #555;
   text-decoration: underline;
   font-family: Arial, Helvetica, Tahoma, Verdana, Sans-Serif;
   font-size: 12px;
+  background-color: #fff;
+  /*background-color: rgba(255, 255, 255, 0.8);*/
+
+  padding: 1px 3px;
 }
 .html-editor-wrapper-mode-button:hover,
 .html-editor-wrapper-fullscreen-button:hover {