Spaces:

Rehyor
/

nexus-vision-pilot-dashboard

Running

App Files Files Community

Rehyor commited on Oct 6

Commit

3579673

verified ·

1 Parent(s): 6b208c5

is it possible to extract index.html, script.js, and style.css - so we have a clean structure from the beginning?

Browse files

Files changed (3) hide show

index.html +4 -46
script.js +60 -0
style.css +21 -20

index.html CHANGED Viewed

@@ -5,51 +5,10 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Nexus Vision | Data Ingestion Dashboard</title>
     <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
     <script src="https://cdn.tailwindcss.com"></script>
     <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
-    <script>
-        tailwind.config = {
-            theme: {
-                extend: {
-                    colors: {
-                        primary: {
-                            500: '#6366f1',
-                            600: '#4f46e5',
-                        },
-                        secondary: {
-                            500: '#ec4899',
-                            600: '#db2777',
-                        }
-                    }
-                }
-            }
-        }
-    </script>
-    <style>
-        @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
-        body {
-            font-family: 'Inter', sans-serif;
-        }
-        .vanta-bg {
-            position: absolute;
-            top: 0;
-            left: 0;
-            width: 100%;
-            height: 350px;
-            z-index: 0;
-        }
-        .dashboard-grid {
-            display: grid;
-            grid-template-columns: 240px 1fr;
-            grid-template-rows: 60px 1fr;
-            min-height: 100vh;
-        }
-        @media (max-width: 768px) {
-            .dashboard-grid {
-                grid-template-columns: 1fr;
-            }
-        }
-    </style>
 </head>
 <body class="h-full">
     <!-- Vanta.js background -->
@@ -173,7 +132,7 @@
                 <div class="bg-white rounded-xl shadow-sm p-6 border border-gray-100">
                     <div class="flex items-center justify-between mb-6">
                         <h2 class="text-lg font-semibold text-gray-800">CSV Data Ingestion</h2>
-                        <button class="px-4 py-2 bg-primary-600 text-white rounded-lg hover:bg-primary-700 flex items-center space-x-2">
                             <i data-feather="upload" class="w-4 h-4"></i>
                             <span>Upload CSV</span>
                         </button>
@@ -252,6 +211,5 @@
     <!-- Scripts -->
     <script src="https://cdn.jsdelivr.net/npm/vanta@latest/dist/vanta.globe.min.js"></script>
-    <script src="/static/js/main.js"></script>
 </body>
-</html>

     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Nexus Vision | Data Ingestion Dashboard</title>
     <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
+    <link rel="stylesheet" href="/static/css/style.css">
     <script src="https://cdn.tailwindcss.com"></script>
     <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
+    <script src="/static/js/script.js" defer></script>
 </head>
 <body class="h-full">
     <!-- Vanta.js background -->
                 <div class="bg-white rounded-xl shadow-sm p-6 border border-gray-100">
                     <div class="flex items-center justify-between mb-6">
                         <h2 class="text-lg font-semibold text-gray-800">CSV Data Ingestion</h2>
+                        <button id="upload-csv-btn" class="px-4 py-2 bg-primary-600 text-white rounded-lg hover:bg-primary-700 flex items-center space-x-2">
                             <i data-feather="upload" class="w-4 h-4"></i>
                             <span>Upload CSV</span>
                         </button>
     <!-- Scripts -->
     <script src="https://cdn.jsdelivr.net/npm/vanta@latest/dist/vanta.globe.min.js"></script>
 </body>
+</html>

script.js ADDED Viewed

	@@ -0,0 +1,60 @@

+```javascript
+document.addEventListener('DOMContentLoaded', function() {
+    // Initialize feather icons
+    feather.replace();
+    // Initialize Vanta.js background
+    if (window.VANTA) {
+        VANTA.GLOBE({
+            el: "#vanta-bg",
+            mouseControls: true,
+            touchControls: true,
+            gyroControls: false,
+            minHeight: 200.00,
+            minWidth: 200.00,
+            scale: 1.00,
+            scaleMobile: 1.00,
+            color: 0x6366f1,
+            backgroundColor: 0xf8fafc,
+            size: 0.80
+        });
+    }
+    // Tailwind config
+    tailwind.config = {
+        theme: {
+            extend: {
+                colors: {
+                    primary: {
+                        500: '#6366f1',
+                        600: '#4f46e5',
+                    },
+                    secondary: {
+                        500: '#ec4899',
+                        600: '#db2777',
+                    }
+                }
+            }
+        }
+    }
+    // File upload functionality
+    const fileUpload = document.getElementById('file-upload');
+    const uploadBtn = document.getElementById('upload-csv-btn');
+    if (fileUpload && uploadBtn) {
+        uploadBtn.addEventListener('click', () => {
+            fileUpload.click();
+        });
+        fileUpload.addEventListener('change', (e) => {
+            const file = e.target.files[0];
+            if (file) {
+                // Handle file upload logic here
+                console.log('File selected:', file.name);
+                // You would typically upload to server here
+            }
+        });
+    }
+});
+```

style.css CHANGED Viewed

@@ -1,28 +1,29 @@
-body {
-	padding: 2rem;
-	font-family: -apple-system, BlinkMacSystemFont, "Arial", sans-serif;
-}
-h1 {
-	font-size: 16px;
-	margin-top: 0;
 }
-p {
-	color: rgb(107, 114, 128);
-	font-size: 15px;
-	margin-bottom: 10px;
-	margin-top: 5px;
 }
-.card {
-	max-width: 620px;
-	margin: 0 auto;
-	padding: 16px;
-	border: 1px solid lightgray;
-	border-radius: 16px;
 }
-.card p:last-child {
-	margin-bottom: 0;
 }

+```css
+@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
+body {
+    font-family: 'Inter', sans-serif;
 }
+.vanta-bg {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 350px;
+    z-index: 0;
 }
+.dashboard-grid {
+    display: grid;
+    grid-template-columns: 240px 1fr;
+    grid-template-rows: 60px 1fr;
+    min-height: 100vh;
 }
+@media (max-width: 768px) {
+    .dashboard-grid {
+        grid-template-columns: 1fr;
+    }
 }
+```