Fix problematic merge of PR

In 313a5f6 the PR #86 was not really merged in a good way.
rugk · Jun 2, 2018 · a4694bc · a4694bc
1 parent c245eec
commit a4694bc
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 6 deletions.
diff --git a/src/_locales/de/messages.json b/src/_locales/de/messages.json
@@ -83,7 +83,7 @@
     "desription": "The message shown when the contrast ratio is too low"
   },
   "lowContrastRatioWarning": {
-    "message": "Das Kontrastverhältnis zwischen der Farbe des QR-Codes und dem Hintergrund ist wahrscheinlich zu niedrig um von den meisten QR-Code-Scannern erkannt zu werden",
+    "message": "Der Kontrast zwischen der Farbe des QR-Codes und dessen Hintergrund ist zu niedrig um von den meisten QR-Code-Scannern erkannt zu werden",
     "desription": "The warning shown when the contrast ratio is too low"
   },
   "lowContrastRatioError": {

diff --git a/src/common/common.css b/src/common/common.css
@@ -54,7 +54,7 @@ a:active {
 
 /* buttons https://design.firefox.com/photon/components/buttons.html */
 .micro-button {
-  height: 24px;
+  min-height: 24px;
   height: auto;
   border-radius: 2px;
 
@@ -66,6 +66,20 @@ a:active {
   padding-bottom: 2px;
 
   box-sizing: content-box;
+
+  /* do not break over multiple lines */
+  /* white-space: nowrap; */
+  height: auto; /* currently, we rather prefer breaking until https://github.com/rugk/offline-qr-code/issues/12 is done */
+}
+
+/* use light color for dark backgrounds */
+.micro-button:hover.success,
+.micro-button:active.success,
+.micro-button:hover.warning,
+.micro-button:active.warning,
+.micro-button:hover.error,
+.micro-button:active.error {
+  color: var(--white-100);
 }
 
 .micro-button.info {

diff --git a/src/options.js b/src/options.js
@@ -222,7 +222,7 @@ const OptionHandler = (function () {
                     browser.storage.sync.set({
                         "qrBackgroundColor": invertedColor
                     }).catch((error) => {
-                        Logger.logError("could not save option", option, ": ", error);
+                        Logger.logError("could not save option", option, ":", error);
                         MessageHandler.showError("couldNotSaveOption", true);
                     }).finally(() => {
                         applyOptionLive();
@@ -232,11 +232,20 @@ const OptionHandler = (function () {
             };
 
             // breakpoints: https://github.com/rugk/offline-qr-code/pull/86#issuecomment-390426286
-            if (colorContrast <= 2) {
+            if (colorContrast <= Colors.CONTRAST_RATIO.WAY_TOO_LOW) {
+                // show an error when nearly no QR code scanner can read it
+                MessageHandler.hideInfo();
+                MessageHandler.hideWarning();
                 MessageHandler.showError("lowContrastRatioError", false, actionButton);
-            } else if (colorContrast <= 3) {
+            } else if (colorContrast <= Colors.CONTRAST_RATIO.LARGE_AA) {
+                // show a warning when approx. 50% of the QR code scanners can read it
+                MessageHandler.hideInfo();
+                MessageHandler.hideError();
                 MessageHandler.showWarning("lowContrastRatioWarning", false, actionButton);
-            } else if (colorContrast <= 4.5) {
+            } else if (colorContrast <= Colors.CONTRAST_RATIO.LARGE_AAA) {
+                // show only an info when the contrast is low but most of the scanners can still read it
+                MessageHandler.hideWarning();
+                MessageHandler.hideError();
                 MessageHandler.showInfo("lowContrastRatioInfo", false, actionButton);
             } else {
                 MessageHandler.hideInfo();