fix conflict

css/main.css

@@ -909,6 +909,10 @@ button, .button, p {
   margin-left: 0;
 }
 
+.pointer {
+  cursor: pointer;
+}
+
 .video-box {
   width: 70px;
   text-align: center;
@@ -1013,7 +1017,7 @@ a.text-white:hover {color: #ccc;}
 
 .box-setup .panel {
   background-color: #2C3E50;
-  padding: 0.5rem;
+  padding: 1rem;
   border: 0;
 }
 
@@ -1046,4 +1050,27 @@ a.text-white:hover {color: #ccc;}
   color: #8597A7;
 }
 
+.panel qrcode {
+  float: left;
+  width: 160px;
+  height: 160px;
+  padding: 5px 0 0 5px;
+  background-color: white;
+}
+
+.panel qrcode canvas {
+  width: 150px;
+  height: 150px;
+}
+
+.panel .secret {
+  line-height: 1.3rem;
+  padding-top: 4rem;
+  float: left;
+  margin-left: 2rem;
+  overflow-wrap: break-word;
+  width: 55%;
+  text-align: left;
+}
+
 /*-----------------------------------------------------------------*/

css/mobile.css

@@ -102,5 +102,18 @@
     border-right: 1px solid #425568;
   }
 
+  .panel .secret {
+    padding-top: 0.5rem;
+    display: block;
+    width: 100%;
+    margin-left: 0;
+    text-align: center;
+  }
+
+  .panel qrcode {
+    display: block;
+    float: none;
+    margin: 0 auto;
+  }
 }