wiz

static/css/connect.css

@@ -13,9 +13,8 @@
     display: block;
     position: relative;
     width: 253px;
-    height: 241px;
-    -webkit-backdrop-filter: blur(10px);
-    backdrop-filter: blur(10px);
+    min-height: 241px;
+    height: auto;
     margin-top: 10px;
     padding: 10px;
     transition: background-color 0.5s;
@@ -27,7 +26,7 @@
 }
 
 /* prevent overlap: hide connect string until revealed; click surface on box */
-.qrcode-box #connectString { display: none; }
+.qrcode-box #connectString { display: none; margin-top: 6px; }
 .qrcode-box.revealed #connectString { display: block; }
 .qrcode-box { cursor: pointer; }
 
@@ -40,6 +39,7 @@
     align-items: center;
     justify-content: center;
     overflow: hidden;
+    margin-top: 6px;
 }
 .qrcode-viewport #qrcode {
     position: absolute;
@@ -60,6 +60,9 @@
 }
 .qrcode-box.revealed .qr-veil { display: none; }
 
+/* hide helper text when revealed to avoid overlap */
+.qrcode-box.revealed #click-text { display: none; }
+
 .qrcode-box-clicked::before {
     content: "";
     position: absolute;