Merge pull request #1633 from ether/mobile-msg-css

better mobile support for gritter messages, before it was awful

src/static/css/pad.css

@@ -828,7 +828,44 @@ input[type=checkbox] {
       padding: 4px 1px
     }
 }
-@media screen and (max-width: 400px){
+@media all and (max-width: 400px){
+  #gritter-notice-wrapper{
+    max-height:172px;
+    overflow:hidden;
+    width:100% !important;
+    background-color: #ccc;
+    bottom:20px;
+    left:0px;
+    right:0px;
+    color:#000;
+  } 
+  .gritter-close {
+    display:block !important;
+    left: auto !important;
+    right:5px;
+  }
+  #gritter-notice-wrapper.bottom-right{
+    left:0px !important;
+    bottom:30px !important;
+    right:0px !important;
+  }
+  .gritter-item p{
+    color:black;
+    font-size:16px;
+  }
+  .gritter-title{
+    text-shadow: none !important;
+    color:black;
+  }
+  .gritter-item{
+    padding:2px 11px 8px 4px;
+  }
+  .gritter-item-wrapper{
+    margin:0;
+  }
+  .gritter-item-wrapper > div{
+    background: none;
+  }
   #editorcontainer { 
     top: 68px;
   }

src/static/js/gritter.js

@@ -21,8 +21,6 @@
 	$.gritter.options = {
 		position: '',
 		class_name: '', // could be set to 'gritter-light' to use white notifications
-		fade_in_speed: 'medium', // how fast notifications fade in
-		fade_out_speed: 1000, // how fast the notices fade out
 		time: 6000 // hang on the screen for...
 	}
 	

src/static/js/pad.js

@@ -365,8 +365,7 @@ function handshake()
 
 $.extend($.gritter.options, { 
   position: 'bottom-right', // defaults to 'top-right' but can be 'bottom-left', 'bottom-right', 'top-left', 'top-right' (added in 1.7.1)
-  fade_in_speed: 'medium', // how fast notifications fade in (string or int)
-  fade_out_speed: 2000, // how fast the notices fade out
+  fade: false, // dont fade, too jerky on mobile
   time: 6000 // hang on the screen for...
 });