fix: update horizontal mobile layout on result

Dynamsoft · Dec 12, 2024 · 06bd13f · 06bd13f
1 parent 280c260
commit 06bd13f
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 2 deletions.
diff --git a/css/index.css b/css/index.css
@@ -283,6 +283,13 @@ img {
   color: #aaaaaa;
 }
 
+.result-container .result-area {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+
 .result-container .scanned-image {
   max-height: 200px;
 }
@@ -558,4 +565,9 @@ img {
   .result-container .parsed-result-area .parsed-filed {
     font-size: 14px;
   }
+
+  .result-container .result-area {
+    height: 70%;
+    flex-direction: row;
+  }
 }
diff --git a/index.html b/index.html
@@ -314,8 +314,10 @@ <h3 style="font-weight: normal">Quick Start Options</h3>
           </svg>
         </div>
       </div>
-      <div class="scanned-image"></div>
-      <div class="parsed-result-area"></div>
+      <div class="result-area">
+        <div class="scanned-image"></div>
+        <div class="parsed-result-area"></div>
+      </div>
       <div class="scan-again">
         <button class="btn-scan-again">Scan Again</button>
       </div>