Correct file size on Android

See #2

Author: rugk

make.sh

@@ -2,7 +2,7 @@
 
 EXTENSION_NAME="offline-qr-code@rugk.github.io"
 
-mkdir "build"
+mkdir -p "build"
 
 # license should be in add-on
 mv LICENSE.md src/LICENSE.md

src/options.css

@@ -4,6 +4,19 @@ body {
   color: #333;
 }
 
+/* on (small) mobile displays */
+@media (max-width: 700px) {
+  body {
+    /* smaller size -> default on Firefox for Android is 14px */
+    font-size: 14px;
+  }
+
+  /* e.g. the icon is not even displayed there :) */
+  .mobile-incompatible {
+    display: none;
+  }
+}
+
 /* https://design.firefox.com/photon/patterns/inactive.html */
 [disabled] {
   opacity: 0.4;

src/options.html

@@ -20,7 +20,7 @@
 		</div>
 		<form>
 			<ul>
-				<li>
+				<li class="mobile-incompatible">
 					<input class="setting save-on-change" type="checkbox" id="popupIconColored" name="icon-colored">
 					<label data-i18n="__MSG_optionPopupIconColored__" for="popupIconColored">Colored icon</label>
 					<span data-i18n="__MSG_optionPopupIconColoredDescr__" class="helper-text">Shows a colored icon instead of the black/white icon in the toolbar.</span>

src/popup/qrcode.css

@@ -3,6 +3,15 @@ html, body {
   width: 100%;
   min-height: 250px;
 }
+/* on (small) mobile displays */
+@media (max-width: 700px) {
+  body {
+    /* for some reason there is a margin in Firefox for Android */
+    margin: 0px;
+  }
+}
+
+
 .preventScrollbar {
   /* prevent overflow at bottom (applied to body in JS) */
   overflow: hidden;