Update templates/index.html

templates/index.html

@@ -93,6 +93,28 @@
                 transform: rotate(360deg);
             }
         }
+
+        /* Tabs styles */
+        .tab {
+            position: absolute;
+            top: 10px;
+            left: 10px;
+        }
+
+        .tab button {
+            background-color: #ee4410;
+            border: none;
+            padding: 10px;
+            margin: 0 5px;
+            color: #f5f5f7;
+            cursor: pointer;
+            border-radius: 5px;
+            transition: background-color 0.3s ease;
+        }
+
+        .tab button:hover {
+            background-color: #444;
+        }
     </style>
 </head>
 
@@ -100,11 +122,13 @@
     <div class="container">
         <h1>Visiting Card Data Extractor</h1>
 
-        <div class="file-upload-section">
-
+        <div class="tab">
+            <button class="tablinks" onclick="openLink('https://webashalarforml-imagedataextractor2.hf.space/')">Image Extractor</button>
+            <button class="tablinks" onclick="openLink('https://webashalarforml-ResumeExtractor2.hf.space/')">Resume Parser Extractor</button>
+        </div>
 
+        <div class="file-upload-section">
             <form id="fileUploadForm" action="{{ url_for('upload_file') }}" method="POST" enctype="multipart/form-data">
-                <!-- <input type="file" name="file" class="form-control" required /> -->
                 <input type="file" name="files" multiple class="form-control" required />
                 <input type="submit" value="Upload your Images" class="btn btn-outline-primary" />
             </form>
@@ -150,7 +174,12 @@
                 setTimeout(() => flashMessage.remove(), 1000);
             }
         }, 3000);
+
+        // Function to open links
+        function openLink(url) {
+            window.open(url, '_blank'); // Opens the link in a new tab
+        }
     </script>
 </body>
 
-</html>
+</html>