Merge pull request #732 from musdom/fix/qr-invert

fix(qrcode): re-invert QR colors and 2 px border for maximum compatibility

app/components/Activity/InvoiceModal.js

@@ -43,8 +43,8 @@ const InvoiceModal = ({
             value={invoice.payment_request}
             renderAs="svg"
             size={150}
-            bgColor="transparent"
+            bgColor="white"
-            fgColor="white"
+            fgColor="#252832"
             level="L"
             className={styles.qrcode}
           />

app/components/Activity/InvoiceModal.scss

@@ -16,13 +16,16 @@
   .left {
     width: 25%;
     padding: 0 60px;
+    text-align: center;
 
     h2 {
-      text-align: center;
       margin-bottom: 20px;
     }
 
     .qrcode {
+      border-style: solid;
+      border-color: white;
+      border-width: 2px;
       margin-bottom: 20px;
     }
   }

app/components/Onboarding/Syncing.js

@@ -108,8 +108,8 @@ class Syncing extends Component {
                       value={address}
                       renderAs="svg"
                       size={100}
-                      bgColor="transparent"
+                      bgColor="white"
-                      fgColor="white"
+                      fgColor="#252832"
                       level="L"
                       className={styles.qrcode}
                     />

app/components/Onboarding/Syncing.scss

@@ -70,6 +70,12 @@
       }
     }
   }
+
+  .qrcode {
+    border-style: solid;
+    border-color: white;
+    border-width: 2px;
+  }
 }
 
 .progressContainer {

app/components/Wallet/ReceiveModal.js

@@ -76,9 +76,10 @@ class ReceiveModal extends React.Component {
                 value={qrCodeType === 1 ? pubkey : address}
                 renderAs="svg"
                 size={150}
-                bgColor="transparent"
+                bgColor="white"
-                fgColor="white"
+                fgColor="#252832"
                 level="L"
+                className={styles.qrcode}
               />
             </div>
           </section>

app/components/Wallet/ReceiveModal.scss

@@ -69,6 +69,12 @@
     .qrCodeContainer {
       text-align: center;
     }
+
+    .qrcode {
+      border-style: solid;
+      border-color: white;
+      border-width: 2px;
+    }
   }
 
   .right {