0.0.61

components.js

@@ -1999,12 +1999,7 @@ smPopup.innerHTML = `
     padding: 1.5rem;
     overflow-y: auto;
 }
-.heading{
+
-    font-weight: 400;
-}
-.heading:first-letter{
-    text-transform: uppercase;
-}
 .hide{
     opacity: 0;
     pointer-events: none;
@@ -2043,15 +2038,6 @@ smPopup.innerHTML = `
     border-radius: 1rem;
     margin: 0.5rem 0;
 }
-.heading{
-    padding: 1rem 1.5rem
-}
-.close{
-    height: 2rem;
-    width: 2rem;
-    padding: 0.55rem;
-    margin-right: 1rem;
-}
 }
 </style>
 <div part="background" class="popup-container hide" role="dialog">

css/main.css

@@ -35,6 +35,11 @@ body[data-theme=dark] {
 body[data-theme=dark] .flo-balance-card {
   color: rgba(var(--text-color), 1);
 }
+body[data-theme=dark] #my_qr_code {
+  background: #fff;
+  border-radius: 1rem;
+  padding: 1rem;
+}
 
 a {
   font-weight: 600;
@@ -397,10 +402,6 @@ textarea {
 #prompt {
   flex-direction: column;
 }
-#confirmation p,
-#prompt p {
-  margin: 1rem;
-}
 #confirmation h4,
 #prompt h4 {
   font-weight: 500;
@@ -463,10 +464,12 @@ sm-popup h5:not(.tag) {
 #qr_code_popup::part(popup-body) {
   padding: 0;
 }
+#qr_code_popup .popup-header {
+  padding-bottom: 1.5rem;
+}
 #qr_code_popup sm-tab-header {
-  width: max-content;
+  margin: 0 auto;
-  align-self: center;
+  transform: translateX(-1rem);
-  margin-bottom: 2rem;
 }
 #qr_code_popup sm-panel {
   display: flex;
@@ -482,6 +485,11 @@ sm-popup h5:not(.tag) {
   margin-top: 1.5rem;
   opacity: 0.8;
   text-align: center;
+  max-width: 30ch;
+}
+
+sm-input[type=number] {
+  font-size: 1.2rem;
 }
 
 .popup-header {

css/main.scss

@@ -32,6 +32,11 @@ body[data-theme="dark"]{
     .flo-balance-card{
         color: rgba(var(--text-color), 1);
     }
+    #my_qr_code{
+        background: #fff;
+        border-radius: 1rem;
+        padding: 1rem;
+    }
 }
 
 a {
@@ -407,10 +412,6 @@ textarea {
 #confirmation,
 #prompt {
     flex-direction: column;
-    p {
-        margin: 1rem;
-    }
-
     h4 {
         font-weight: 500;
         margin-bottom: 1.5rem;
@@ -479,10 +480,12 @@ sm-popup{
     &::part(popup-body){
         padding: 0;
     }
+    .popup-header{
+        padding-bottom: 1.5rem;
+    }
     sm-tab-header{
-        width: max-content;
+        margin: 0 auto;
-        align-self: center;
+        transform: translateX(-1rem);   
-        margin-bottom: 2rem;
     }
     sm-panel{
         display: flex;
@@ -498,8 +501,12 @@ sm-popup{
         margin-top: 1.5rem;
         opacity: 0.8;
         text-align: center;
+        max-width: 30ch;
     }
 }
+sm-input[type="number"]{
+    font-size: 1.2rem;
+}
 
 .popup-header{
     padding: 1.5rem;

index.html

@@ -61,11 +61,11 @@
                 <line x1="64" y1="0" x2="0" y2="64" />
                 <line x1="64" y1="64" x2="0" y2="0" />
             </svg>
+            <sm-tab-header variant="tab" class="round" target="qr_selector">
+                <sm-tab>Scan</sm-tab>
+                <sm-tab>My QR Code</sm-tab>
+            </sm-tab-header>
         </header>
-        <sm-tab-header variant="tab" class="round" target="qr_selector">
-            <sm-tab>Scan</sm-tab>
-            <sm-tab>My QR Code</sm-tab>
-        </sm-tab-header>
         <sm-tab-panels id="qr_selector">
             <sm-panel>
                 <div id="reader"></div>
@@ -428,7 +428,7 @@
                 </svg>
                 <svg id="delete_person" onclick="deletePerson()" class="icon" viewBox="0 0 64 64" title="Remove">
                     <title>remove</title>
-                    <line x1="8" y1="2.5" x2="56" y2="2.5"/>
+                    <line x1="4" y1="2.5" x2="60" y2="2.5"/>
                     <line x1="33.92" y1="0.5" x2="30.08" y2="0.5"/>
                     <path d="M53.5,17.5V59.42a4.08,4.08,0,0,1-4.08,4.08H14.58a4.08,4.08,0,0,1-4.08-4.08V17.5"/>
                 </svg>
@@ -1665,6 +1665,7 @@
                 },
                 qrCodeMessage => {
                     scannedFloId = qrCodeMessage
+                    if(floCrypto.validateAddr(scannedFloId))
                     qrScannerInstance.stop().then(ignore => {
                         // QR Code scanning is stopped.
                         hidePopup()