prevent sticky chat and chatAndUsers for mobile

src/static/css/pad.css

@@ -66,4 +66,8 @@ input {
 }
 .right {
   float: right
+}
+
+@media (max-width: 800px) {
+  .hide-for-mobile { display: none; }
 }

src/static/js/pad.js

@@ -557,6 +557,17 @@ var pad = {
       pad.changeViewOption('padFontFamily', padcookie.getPref("padFontFamily"));
       $('#viewfontmenu').val(padcookie.getPref("padFontFamily")).niceSelect('update');
 
+      // Prevent sticky chat or chat and users to be checked for mobiles
+      function checkChatAndUsersVisibility(x) {
+        if (x.matches) { // If media query matches
+          $('#options-chatandusers:checked').click();
+          $('#options-stickychat:checked').click();
+        }
+      }
+      var mobileMatch = window.matchMedia("(max-width: 800px)");
+      mobileMatch.addListener(checkChatAndUsersVisibility); // check if window resized
+      setTimeout(function() { checkChatAndUsersVisibility(mobileMatch); }, 0); // check now after load
+
       hooks.aCallAll("postAceInit", {ace: padeditor.ace, pad: pad});
     }
   },

src/templates/pad.html

@@ -121,11 +121,11 @@
           <h1 data-l10n-id="pad.settings.padSettings"></h1>
           <% e.begin_block("mySettings"); %>
           <h2 data-l10n-id="pad.settings.myView"></h2>
-          <p>
+          <p class="hide-for-mobile">
               <input type="checkbox" id="options-stickychat" onClick="chat.stickToScreen();">
               <label for="options-stickychat" data-l10n-id="pad.settings.stickychat"></label>
           </p>
-          <p>
+          <p class="hide-for-mobile">
               <input type="checkbox" id="options-chatandusers" onClick="chat.chatAndUsers();">
               <label for="options-chatandusers" data-l10n-id="pad.settings.chatandusers"></label>
           </p>