Spaces:

gaur3009
/

newgbd

Running

App Files Files Community

gaur3009 commited on May 16

Commit

dd98209

verified ·

1 Parent(s): 603ec3a

Add 3 files

Browse files

Files changed (3) hide show

README.md +7 -5
index.html +817 -19
prompts.txt +1 -0

README.md CHANGED Viewed

@@ -1,10 +1,12 @@
 ---
-title: Newgbd
-emoji: 🌍
-colorFrom: indigo
-colorTo: red
 sdk: static
 pinned: false
 ---
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

 ---
+title: newgbd
+emoji: 🐳
+colorFrom: blue
+colorTo: yellow
 sdk: static
 pinned: false
+tags:
+  - deepsite
 ---
+Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

index.html CHANGED Viewed

@@ -1,19 +1,817 @@
-<!doctype html>
-<html>
-	<head>
-		<meta charset="utf-8" />
-		<meta name="viewport" content="width=device-width" />
-		<title>My static Space</title>
-		<link rel="stylesheet" href="style.css" />
-	</head>
-	<body>
-		<div class="card">
-			<h1>Welcome to your static Space!</h1>
-			<p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
-			<p>
-				Also don't forget to check the
-				<a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
-			</p>
-		</div>
-	</body>
-</html>

+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Polyglot NLP | Transfer Learning for Low-Resource Languages</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+    <style>
+        .gradient-bg {
+            background: linear-gradient(135deg, #6B73FF 0%, #000DFF 50%, #00D4FF 100%);
+        }
+        .language-card:hover {
+            transform: translateY(-5px);
+            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
+        }
+        .model-visualization {
+            background: linear-gradient(45deg, #f3f4f6 0%, #e5e7eb 100%);
+        }
+        .typing-demo {
+            width: 22ch;
+            animation: typing 2s steps(22), blink .5s step-end infinite alternate;
+            white-space: nowrap;
+            overflow: hidden;
+            border-right: 3px solid;
+            font-family: monospace;
+        }
+        @keyframes typing {
+            from { width: 0 }
+        }
+        @keyframes blink {
+            50% { border-color: transparent }
+        }
+    </style>
+</head>
+<body class="font-sans antialiased text-gray-800">
+    <!-- Navigation -->
+    <nav class="bg-white shadow-lg sticky top-0 z-50">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="flex justify-between h-16">
+                <div class="flex items-center">
+                    <div class="flex-shrink-0 flex items-center">
+                        <i class="fas fa-language text-3xl text-blue-600 mr-2"></i>
+                        <span class="text-xl font-bold text-gray-900">PolyglotNLP</span>
+                    </div>
+                </div>
+                <div class="hidden md:ml-6 md:flex md:items-center md:space-x-8">
+                    <a href="#home" class="text-gray-900 hover:text-blue-600 px-3 py-2 text-sm font-medium">Home</a>
+                    <a href="#features" class="text-gray-900 hover:text-blue-600 px-3 py-2 text-sm font-medium">Features</a>
+                    <a href="#demo" class="text-gray-900 hover:text-blue-600 px-3 py-2 text-sm font-medium">Demo</a>
+                    <a href="#about" class="text-gray-900 hover:text-blue-600 px-3 py-2 text-sm font-medium">About</a>
+                    <a href="#contact" class="bg-blue-600 text-white px-4 py-2 rounded-md text-sm font-medium hover:bg-blue-700 transition">Get Started</a>
+                </div>
+                <div class="-mr-2 flex items-center md:hidden">
+                    <button type="button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none" aria-controls="mobile-menu" aria-expanded="false" id="mobile-menu-button">
+                        <span class="sr-only">Open main menu</span>
+                        <i class="fas fa-bars"></i>
+                    </button>
+                </div>
+            </div>
+        </div>
+        <!-- Mobile menu -->
+        <div class="hidden md:hidden" id="mobile-menu">
+            <div class="pt-2 pb-3 space-y-1">
+                <a href="#home" class="bg-blue-50 border-blue-500 text-blue-600 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">Home</a>
+                <a href="#features" class="border-transparent text-gray-600 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-800 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">Features</a>
+                <a href="#demo" class="border-transparent text-gray-600 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-800 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">Demo</a>
+                <a href="#about" class="border-transparent text-gray-600 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-800 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">About</a>
+                <a href="#contact" class="block w-full px-4 py-2 text-center text-white bg-blue-600 rounded-md hover:bg-blue-700 transition">Get Started</a>
+            </div>
+        </div>
+    </nav>
+    <!-- Hero Section -->
+    <section id="home" class="gradient-bg text-white py-20">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="lg:grid lg:grid-cols-2 lg:gap-8 items-center">
+                <div class="mb-12 lg:mb-0">
+                    <h1 class="text-4xl md:text-5xl font-bold mb-6 leading-tight">
+                        Breaking Language Barriers with <span class="typing-demo">Transfer Learning</span>
+                    </h1>
+                    <p class="text-xl mb-8 text-blue-100">
+                        Empowering low-resource languages through advanced NLP techniques. Our transfer learning models bring high-quality language processing to underserved communities.
+                    </p>
+                    <div class="flex flex-col sm:flex-row space-y-4 sm:space-y-0 sm:space-x-4">
+                        <a href="#demo" class="bg-white text-blue-600 hover:bg-gray-100 px-6 py-3 rounded-lg text-lg font-semibold text-center transition duration-300">
+                            Try Our Demo
+                        </a>
+                        <a href="#about" class="border-2 border-white text-white hover:bg-white hover:text-blue-600 px-6 py-3 rounded-lg text-lg font-semibold text-center transition duration-300">
+                            Learn More
+                        </a>
+                    </div>
+                </div>
+                <div class="relative">
+                    <div class="bg-white/10 backdrop-blur-md rounded-2xl p-6 border border-white/20">
+                        <div class="flex items-center mb-4">
+                            <div class="w-3 h-3 rounded-full bg-red-500 mr-2"></div>
+                            <div class="w-3 h-3 rounded-full bg-yellow-500 mr-2"></div>
+                            <div class="w-3 h-3 rounded-full bg-green-500"></div>
+                        </div>
+                        <div class="bg-black/30 rounded-lg p-4 font-mono text-sm overflow-auto h-64">
+                            <p class="text-green-400"># Initialize base model (mBERT)</p>
+                            <p class="text-green-400">base_model = AutoModel.from_pretrained('bert-base-multilingual-cased')</p>
+                            <br>
+                            <p class="text-green-400"># Add task-specific layers</p>
+                            <p class="text-green-400">class PolyglotModel(nn.Module):</p>
+                            <p class="text-green-400 ml-4">def __init__(self, base_model, num_languages):</p>
+                            <p class="text-green-400 ml-8">super().__init__()</p>
+                            <p class="text-green-400 ml-8">self.base = base_model</p>
+                            <p class="text-green-400 ml-8">self.classifier = nn.Linear(768, num_languages)</p>
+                            <br>
+                            <p class="text-green-400 ml-4">def forward(self, input_ids, attention_mask):</p>
+                            <p class="text-green-400 ml-8">outputs = self.base(input_ids, attention_mask)</p>
+                            <p class="text-green-400 ml-8">pooled = outputs.last_hidden_state[:, 0, :]</p>
+                            <p class="text-green-400 ml-8">return self.classifier(pooled)</p>
+                            <br>
+                            <p class="text-green-400"># Train with low-resource data</p>
+                            <p class="text-green-400">train_model(low_resource_data, epochs=5, lr=2e-5)</p>
+                        </div>
+                    </div>
+                    <div class="absolute -bottom-6 -right-6 bg-yellow-400 text-gray-900 px-4 py-2 rounded-lg shadow-lg font-bold">
+                        Transfer Learning in Action
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+    <!-- Supported Languages -->
+    <section class="py-16 bg-gray-50">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="text-center mb-12">
+                <h2 class="text-3xl font-bold text-gray-900 mb-4">Supported Low-Resource Languages</h2>
+                <p class="text-xl text-gray-600 max-w-3xl mx-auto">
+                    We currently support these languages with limited digital resources, helping bridge the digital divide.
+                </p>
+            </div>
+            <div class="grid grid-cols-2 md:grid-cols-4 lg:grid-cols-6 gap-6">
+                <!-- Language Cards -->
+                <div class="language-card bg-white p-6 rounded-xl shadow-md transition duration-300 flex flex-col items-center">
+                    <div class="w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mb-4">
+                        <span class="text-2xl">🇮🇳</span>
+                    </div>
+                    <h3 class="font-bold text-lg mb-1">Nepali</h3>
+                    <p class="text-gray-600 text-sm text-center">~30M speakers</p>
+                    <div class="mt-3 w-full bg-gray-200 rounded-full h-2">
+                        <div class="bg-blue-600 h-2 rounded-full" style="width: 45%"></div>
+                    </div>
+                    <span class="text-xs mt-1 text-gray-500">45% coverage</span>
+                </div>
+                <div class="language-card bg-white p-6 rounded-xl shadow-md transition duration-300 flex flex-col items-center">
+                    <div class="w-16 h-16 bg-green-100 rounded-full flex items-center justify-center mb-4">
+                        <span class="text-2xl">🇪🇹</span>
+                    </div>
+                    <h3 class="font-bold text-lg mb-1">Amharic</h3>
+                    <p class="text-gray-600 text-sm text-center">~25M speakers</p>
+                    <div class="mt-3 w-full bg-gray-200 rounded-full h-2">
+                        <div class="bg-green-600 h-2 rounded-full" style="width: 38%"></div>
+                    </div>
+                    <span class="text-xs mt-1 text-gray-500">38% coverage</span>
+                </div>
+                <div class="language-card bg-white p-6 rounded-xl shadow-md transition duration-300 flex flex-col items-center">
+                    <div class="w-16 h-16 bg-purple-100 rounded-full flex items-center justify-center mb-4">
+                        <span class="text-2xl">🇰🇪</span>
+                    </div>
+                    <h3 class="font-bold text-lg mb-1">Swahili</h3>
+                    <p class="text-gray-600 text-sm text-center">~16M speakers</p>
+                    <div class="mt-3 w-full bg-gray-200 rounded-full h-2">
+                        <div class="bg-purple-600 h-2 rounded-full" style="width: 65%"></div>
+                    </div>
+                    <span class="text-xs mt-1 text-gray-500">65% coverage</span>
+                </div>
+                <div class="language-card bg-white p-6 rounded-xl shadow-md transition duration-300 flex flex-col items-center">
+                    <div class="w-16 h-16 bg-yellow-100 rounded-full flex items-center justify-center mb-4">
+                        <span class="text-2xl">🇲🇲</span>
+                    </div>
+                    <h3 class="font-bold text-lg mb-1">Burmese</h3>
+                    <p class="text-gray-600 text-sm text-center">~33M speakers</p>
+                    <div class="mt-3 w-full bg-gray-200 rounded-full h-2">
+                        <div class="bg-yellow-600 h-2 rounded-full" style="width: 28%"></div>
+                    </div>
+                    <span class="text-xs mt-1 text-gray-500">28% coverage</span>
+                </div>
+                <div class="language-card bg-white p-6 rounded-xl shadow-md transition duration-300 flex flex-col items-center">
+                    <div class="w-16 h-16 bg-red-100 rounded-full flex items-center justify-center mb-4">
+                        <span class="text-2xl">🇮🇳</span>
+                    </div>
+                    <h3 class="font-bold text-lg mb-1">Odia</h3>
+                    <p class="text-gray-600 text-sm text-center">~35M speakers</p>
+                    <div class="mt-3 w-full bg-gray-200 rounded-full h-2">
+                        <div class="bg-red-600 h-2 rounded-full" style="width: 22%"></div>
+                    </div>
+                    <span class="text-xs mt-1 text-gray-500">22% coverage</span>
+                </div>
+                <div class="language-card bg-white p-6 rounded-xl shadow-md transition duration-300 flex flex-col items-center">
+                    <div class="w-16 h-16 bg-indigo-100 rounded-full flex items-center justify-center mb-4">
+                        <span class="text-2xl">🇵🇰</span>
+                    </div>
+                    <h3 class="font-bold text-lg mb-1">Sindhi</h3>
+                    <p class="text-gray-600 text-sm text-center">~30M speakers</p>
+                    <div class="mt-3 w-full bg-gray-200 rounded-full h-2">
+                        <div class="bg-indigo-600 h-2 rounded-full" style="width: 18%"></div>
+                    </div>
+                    <span class="text-xs mt-1 text-gray-500">18% coverage</span>
+                </div>
+            </div>
+            <div class="mt-12 text-center">
+                <a href="#" class="inline-flex items-center text-blue-600 hover:text-blue-800 font-medium">
+                    Request a language <i class="fas fa-arrow-right ml-2"></i>
+                </a>
+            </div>
+        </div>
+    </section>
+    <!-- Features Section -->
+    <section id="features" class="py-16 bg-white">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="text-center mb-16">
+                <h2 class="text-3xl font-bold text-gray-900 mb-4">Our Transfer Learning Approach</h2>
+                <p class="text-xl text-gray-600 max-w-3xl mx-auto">
+                    Leveraging state-of-the-art techniques to bring NLP to languages with limited digital resources.
+                </p>
+            </div>
+            <div class="grid md:grid-cols-3 gap-8">
+                <!-- Feature 1 -->
+                <div class="bg-gray-50 p-8 rounded-xl">
+                    <div class="w-14 h-14 bg-blue-100 rounded-lg flex items-center justify-center mb-6">
+                        <i class="fas fa-project-diagram text-blue-600 text-2xl"></i>
+                    </div>
+                    <h3 class="text-xl font-bold mb-3">Multilingual Base Models</h3>
+                    <p class="text-gray-600 mb-4">
+                        We use pretrained multilingual models like mBERT and XLM-R as our foundation, then fine-tune them for specific low-resource languages.
+                    </p>
+                    <ul class="space-y-2">
+                        <li class="flex items-start">
+                            <i class="fas fa-check text-green-500 mt-1 mr-2"></i>
+                            <span>Leverages cross-lingual transfer</span>
+                        </li>
+                        <li class="flex items-start">
+                            <i class="fas fa-check text-green-500 mt-1 mr-2"></i>
+                            <span>Requires minimal target language data</span>
+                        </li>
+                    </ul>
+                </div>
+                <!-- Feature 2 -->
+                <div class="bg-gray-50 p-8 rounded-xl">
+                    <div class="w-14 h-14 bg-purple-100 rounded-lg flex items-center justify-center mb-6">
+                        <i class="fas fa-layer-group text-purple-600 text-2xl"></i>
+                    </div>
+                    <h3 class="text-xl font-bold mb-3">Adaptive Fine-Tuning</h3>
+                    <p class="text-gray-600 mb-4">
+                        Our progressive unfreezing technique carefully adapts the model layers to preserve valuable multilingual knowledge while specializing for target languages.
+                    </p>
+                    <ul class="space-y-2">
+                        <li class="flex items-start">
+                            <i class="fas fa-check text-green-500 mt-1 mr-2"></i>
+                            <span>Preserves multilingual capabilities</span>
+                        </li>
+                        <li class="flex items-start">
+                            <i class="fas fa-check text-green-500 mt-1 mr-2"></i>
+                            <span>Optimizes for low-resource scenarios</span>
+                        </li>
+                    </ul>
+                </div>
+                <!-- Feature 3 -->
+                <div class="bg-gray-50 p-8 rounded-xl">
+                    <div class="w-14 h-14 bg-green-100 rounded-lg flex items-center justify-center mb-6">
+                        <i class="fas fa-robot text-green-600 text-2xl"></i>
+                    </div>
+                    <h3 class="text-xl font-bold mb-3">Task-Specific Heads</h3>
+                    <p class="text-gray-600 mb-4">
+                        We add lightweight task-specific layers on top of the multilingual base, enabling efficient adaptation for various NLP tasks with minimal data.
+                    </p>
+                    <ul class="space-y-2">
+                        <li class="flex items-start">
+                            <i class="fas fa-check text-green-500 mt-1 mr-2"></i>
+                            <span>Supports multiple NLP tasks</span>
+                        </li>
+                        <li class="flex items-start">
+                            <i class="fas fa-check text-green-500 mt-1 mr-2"></i>
+                            <span>Reduces catastrophic forgetting</span>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+            <!-- Model Visualization -->
+            <div class="mt-16 model-visualization rounded-2xl p-8">
+                <h3 class="text-2xl font-bold mb-6 text-center">Our Transfer Learning Architecture</h3>
+                <div class="flex flex-col items-center">
+                    <div class="w-full max-w-4xl">
+                        <!-- Model layers visualization -->
+                        <div class="flex flex-col items-center space-y-4">
+                            <!-- Input -->
+                            <div class="w-full bg-gray-200 py-4 px-6 rounded-lg text-center font-mono">
+                                Input Text (Low-Resource Language)
+                            </div>
+                            <!-- Tokenizer -->
+                            <div class="w-3/4 bg-blue-100 py-3 px-6 rounded-lg text-center relative">
+                                <span class="font-mono">Multilingual Tokenizer</span>
+                                <div class="absolute -bottom-4 left-1/2 transform -translate-x-1/2 text-xs bg-blue-500 text-white px-2 py-1 rounded">
+                                    Shared Vocabulary
+                                </div>
+                            </div>
+                            <!-- Base Model -->
+                            <div class="w-full">
+                                <div class="text-center mb-2 text-sm font-medium">Multilingual Base Model (Frozen Initial Layers)</div>
+                                <div class="grid grid-cols-12 gap-1">
+                                    <div class="col-span-12 bg-blue-500 h-2 rounded-full"></div>
+                                    <div class="col-span-12 bg-blue-400 h-2 rounded-full"></div>
+                                    <div class="col-span-12 bg-blue-300 h-2 rounded-full"></div>
+                                    <div class="col-span-12 bg-blue-200 h-2 rounded-full"></div>
+                                </div>
+                            </div>
+                            <!-- Fine-tuned layers -->
+                            <div class="w-full">
+                                <div class="text-center mb-2 text-sm font-medium">Adaptive Fine-Tuned Layers</div>
+                                <div class="grid grid-cols-12 gap-1">
+                                    <div class="col-span-12 bg-purple-300 h-2 rounded-full"></div>
+                                    <div class="col-span-12 bg-purple-400 h-2 rounded-full"></div>
+                                </div>
+                            </div>
+                            <!-- Task head -->
+                            <div class="w-2/3 bg-green-200 py-3 px-6 rounded-lg text-center relative">
+                                <span class="font-mono">Language-Specific Task Head</span>
+                                <div class="absolute -bottom-4 left-1/2 transform -translate-x-1/2 text-xs bg-green-500 text-white px-2 py-1 rounded">
+                                    Trained on Target Data
+                                </div>
+                            </div>
+                            <!-- Output -->
+                            <div class="w-full bg-gray-800 text-white py-4 px-6 rounded-lg text-center font-mono">
+                                Task Output (e.g., Translation, Sentiment, etc.)
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+    <!-- Demo Section -->
+    <section id="demo" class="py-16 bg-gray-50">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="text-center mb-12">
+                <h2 class="text-3xl font-bold text-gray-900 mb-4">Try Our Polyglot NLP Demo</h2>
+                <p class="text-xl text-gray-600 max-w-3xl mx-auto">
+                    Experience how transfer learning enables NLP for low-resource languages.
+                </p>
+            </div>
+            <div class="bg-white rounded-xl shadow-lg overflow-hidden">
+                <div class="md:flex">
+                    <!-- Input Section -->
+                    <div class="md:w-1/2 p-8 border-b md:border-b-0 md:border-r border-gray-200">
+                        <h3 class="text-xl font-bold mb-6">Input Text</h3>
+                        <div class="mb-6">
+                            <label class="block text-sm font-medium text-gray-700 mb-2">Select Language</label>
+                            <select id="language-select" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-blue-500 focus:border-blue-500">
+                                <option value="nepali">Nepali (नेपाली)</option>
+                                <option value="amharic">Amharic (አማርኛ)</option>
+                                <option value="swahili">Swahili (Kiswahili)</option>
+                                <option value="burmese">Burmese (မြန်မာဘာသာ)</option>
+                            </select>
+                        </div>
+                        <div class="mb-6">
+                            <label class="block text-sm font-medium text-gray-700 mb-2">Select Task</label>
+                            <select id="task-select" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-blue-500 focus:border-blue-500">
+                                <option value="sentiment">Sentiment Analysis</option>
+                                <option value="translation">Translation to English</option>
+                                <option value="ner">Named Entity Recognition</option>
+                            </select>
+                        </div>
+                        <div>
+                            <label class="block text-sm font-medium text-gray-700 mb-2">Enter Text</label>
+                            <textarea id="input-text" class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-blue-500 focus:border-blue-500 h-32" placeholder="Type or paste text here..."></textarea>
+                        </div>
+                        <button id="process-btn" class="w-full mt-6 bg-blue-600 hover:bg-blue-700 text-white font-medium py-3 px-4 rounded-lg transition duration-300 flex items-center justify-center">
+                            <i class="fas fa-cogs mr-2"></i> Process Text
+                        </button>
+                    </div>
+                    <!-- Output Section -->
+                    <div class="md:w-1/2 p-8">
+                        <h3 class="text-xl font-bold mb-6">Results</h3>
+                        <div id="loading" class="hidden text-center py-12">
+                            <div class="inline-block animate-spin rounded-full h-12 w-12 border-t-2 border-b-2 border-blue-500 mb-4"></div>
+                            <p class="text-gray-600">Processing your text with our transfer learning model...</p>
+                        </div>
+                        <div id="results" class="hidden">
+                            <div class="mb-6">
+                                <h4 class="font-medium text-gray-700 mb-2">Input Language</h4>
+                                <div id="input-lang" class="px-4 py-2 bg-gray-100 rounded-lg"></div>
+                            </div>
+                            <div class="mb-6">
+                                <h4 class="font-medium text-gray-700 mb-2">Task Performed</h4>
+                                <div id="task-performed" class="px-4 py-2 bg-gray-100 rounded-lg"></div>
+                            </div>
+                            <div>
+                                <h4 class="font-medium text-gray-700 mb-2">Results</h4>
+                                <div id="result-output" class="px-4 py-3 bg-gray-100 rounded-lg min-h-32"></div>
+                            </div>
+                            <div id="confidence" class="mt-4 hidden">
+                                <h4 class="font-medium text-gray-700 mb-2">Model Confidence</h4>
+                                <div class="w-full bg-gray-200 rounded-full h-2.5">
+                                    <div id="confidence-bar" class="bg-blue-600 h-2.5 rounded-full" style="width: 0%"></div>
+                                </div>
+                                <p id="confidence-value" class="text-sm text-gray-600 mt-1"></p>
+                            </div>
+                        </div>
+                        <div id="demo-placeholder" class="text-center py-12">
+                            <i class="fas fa-language text-4xl text-gray-300 mb-4"></i>
+                            <h4 class="font-medium text-gray-500 mb-2">No results yet</h4>
+                            <p class="text-gray-400">Enter some text and click "Process Text" to see our transfer learning model in action.</p>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="mt-8 bg-blue-50 border border-blue-200 rounded-lg p-6">
+                <div class="flex">
+                    <div class="flex-shrink-0">
+                        <i class="fas fa-info-circle text-blue-500 text-2xl"></i>
+                    </div>
+                    <div class="ml-3">
+                        <h3 class="text-lg font-medium text-blue-800">About This Demo</h3>
+                        <p class="mt-2 text-blue-700">
+                            This demo simulates how our transfer learning approach works with low-resource languages. While we can't run actual models in the browser, this shows the interface and expected behavior of our system.
+                        </p>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+    <!-- About Section -->
+    <section id="about" class="py-16 bg-white">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="lg:grid lg:grid-cols-2 lg:gap-12 items-center">
+                <div class="mb-12 lg:mb-0">
+                    <h2 class="text-3xl font-bold text-gray-900 mb-6">Our Mission: Inclusive NLP</h2>
+                    <p class="text-lg text-gray-600 mb-6">
+                        Over 3,000 languages are spoken worldwide, yet most NLP research focuses on just a handful of high-resource languages. We're changing that by making NLP accessible to all languages, regardless of available digital resources.
+                    </p>
+                    <p class="text-lg text-gray-600 mb-8">
+                        Our transfer learning techniques allow us to achieve state-of-the-art results with as little as 1% of the data typically required for training NLP models from scratch.
+                    </p>
+                    <div class="space-y-6">
+                        <div class="flex">
+                            <div class="flex-shrink-0">
+                                <div class="flex items-center justify-center h-12 w-12 rounded-md bg-blue-500 text-white">
+                                    <i class="fas fa-database"></i>
+                                </div>
+                            </div>
+                            <div class="ml-4">
+                                <h3 class="text-lg font-medium text-gray-900">Data Efficiency</h3>
+                                <p class="mt-2 text-gray-600">
+                                    Achieve 90% of high-resource language performance with just thousands (not millions) of training examples.
+                                </p>
+                            </div>
+                        </div>
+                        <div class="flex">
+                            <div class="flex-shrink-0">
+                                <div class="flex items-center justify-center h-12 w-12 rounded-md bg-purple-500 text-white">
+                                    <i class="fas fa-globe"></i>
+                                </div>
+                            </div>
+                            <div class="ml-4">
+                                <h3 class="text-lg font-medium text-gray-900">Cross-Lingual Transfer</h3>
+                                <p class="mt-2 text-gray-600">
+                                    Knowledge from related languages boosts performance on truly low-resource languages.
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <div class="relative">
+                    <div class="bg-gray-50 p-8 rounded-xl border border-gray-200">
+                        <h3 class="text-xl font-bold mb-6">Performance Comparison</h3>
+                        <p class="text-gray-600 mb-6">
+                            Our transfer learning approach outperforms traditional methods for low-resource languages:
+                        </p>
+                        <div class="space-y-6">
+                            <!-- Chart -->
+                            <div class="bg-white p-4 rounded-lg border border-gray-200">
+                                <div class="flex justify-between mb-2">
+                                    <span class="text-sm font-medium text-gray-500">Model</span>
+                                    <span class="text-sm font-medium text-gray-500">F1 Score</span>
+                                </div>
+                                <div class="space-y-4">
+                                    <!-- From Scratch -->
+                                    <div>
+                                        <div class="flex justify-between mb-1">
+                                            <span class="text-sm font-medium text-gray-700">From Scratch</span>
+                                            <span class="text-sm font-medium text-gray-700">42%</span>
+                                        </div>
+                                        <div class="w-full bg-gray-200 rounded-full h-2.5">
+                                            <div class="bg-red-500 h-2.5 rounded-full" style="width: 42%"></div>
+                                        </div>
+                                    </div>
+                                    <!-- Standard Fine-Tuning -->
+                                    <div>
+                                        <div class="flex justify-between mb-1">
+                                            <span class="text-sm font-medium text-gray-700">Standard Fine-Tuning</span>
+                                            <span class="text-sm font-medium text-gray-700">67%</span>
+                                        </div>
+                                        <div class="w-full bg-gray-200 rounded-full h-2.5">
+                                            <div class="bg-yellow-500 h-2.5 rounded-full" style="width: 67%"></div>
+                                        </div>
+                                    </div>
+                                    <!-- Our Approach -->
+                                    <div>
+                                        <div class="flex justify-between mb-1">
+                                            <span class="text-sm font-medium text-gray-700">Our Transfer Learning</span>
+                                            <span class="text-sm font-medium text-gray-700">83%</span>
+                                        </div>
+                                        <div class="w-full bg-gray-200 rounded-full h-2.5">
+                                            <div class="bg-green-500 h-2.5 rounded-full" style="width: 83%"></div>
+                                        </div>
+                                    </div>
+                                </div>
+                                <p class="text-xs text-gray-500 mt-4 italic">Average performance across 5 low-resource languages on NER task</p>
+                            </div>
+                            <!-- Data Requirements -->
+                            <div class="bg-white p-4 rounded-lg border border-gray-200">
+                                <h4 class="font-medium mb-3">Data Requirements Comparison</h4>
+                                <div class="grid grid-cols-3 gap-4 text-center">
+                                    <div>
+                                        <div class="text-2xl font-bold text-red-500">1M+</div>
+                                        <div class="text-xs text-gray-500">From Scratch</div>
+                                    </div>
+                                    <div>
+                                        <div class="text-2xl font-bold text-yellow-500">100K</div>
+                                        <div class="text-xs text-gray-500">Standard FT</div>
+                                    </div>
+                                    <div>
+                                        <div class="text-2xl font-bold text-green-500">10K</div>
+                                        <div class="text-xs text-gray-500">Our Approach</div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="absolute -bottom-6 -left-6 bg-white shadow-lg rounded-lg px-4 py-2 border border-gray-200">
+                        <div class="flex items-center">
+                            <div class="w-3 h-3 rounded-full bg-green-500 mr-2"></div>
+                            <span class="font-medium">83% average performance</span>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+    <!-- Contact Section -->
+    <section id="contact" class="py-16 gradient-bg text-white">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="lg:grid lg:grid-cols-2 lg:gap-12 items-center">
+                <div class="mb-12 lg:mb-0">
+                    <h2 class="text-3xl font-bold mb-6">Get Started With Polyglot NLP</h2>
+                    <p class="text-xl mb-8 text-blue-100">
+                        Whether you're a researcher, developer, or language community representative, we'd love to hear from you.
+                    </p>
+                    <div class="space-y-6">
+                        <div class="flex">
+                            <div class="flex-shrink-0">
+                                <i class="fas fa-envelope text-2xl text-blue-300"></i>
+                            </div>
+                            <div class="ml-4">
+                                <h3 class="text-lg font-medium">Email Us</h3>
+                                <p class="mt-1 text-blue-100">[email protected]</p>
+                            </div>
+                        </div>
+                        <div class="flex">
+                            <div class="flex-shrink-0">
+                                <i class="fas fa-code-branch text-2xl text-blue-300"></i>
+                            </div>
+                            <div class="ml-4">
+                                <h3 class="text-lg font-medium">GitHub</h3>
+                                <p class="mt-1 text-blue-100">github.com/polyglot-nlp</p>
+                            </div>
+                        </div>
+                        <div class="flex">
+                            <div class="flex-shrink-0">
+                                <i class="fas fa-file-alt text-2xl text-blue-300"></i>
+                            </div>
+                            <div class="ml-4">
+                                <h3 class="text-lg font-medium">Research Paper</h3>
+                                <p class="mt-1 text-blue-100">Read our latest findings</p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <div>
+                    <div class="bg-white/10 backdrop-blur-md rounded-xl p-8 border border-white/20">
+                        <h3 class="text-xl font-bold mb-6">Contact Form</h3>
+                        <form>
+                            <div class="mb-6">
+                                <label for="name" class="block text-sm font-medium mb-2">Your Name</label>
+                                <input type="text" id="name" class="w-full px-4 py-2 bg-white/20 border border-white/30 rounded-lg focus:ring-2 focus:ring-blue-300 focus:border-blue-300 text-white placeholder-blue-200" placeholder="John Doe">
+                            </div>
+                            <div class="mb-6">
+                                <label for="email" class="block text-sm font-medium mb-2">Email Address</label>
+                                <input type="email" id="email" class="w-full px-4 py-2 bg-white/20 border border-white/30 rounded-lg focus:ring-2 focus:ring-blue-300 focus:border-blue-300 text-white placeholder-blue-200" placeholder="[email protected]">
+                            </div>
+                            <div class="mb-6">
+                                <label for="interest" class="block text-sm font-medium mb-2">I'm interested in</label>
+                                <select id="interest" class="w-full px-4 py-2 bg-white/20 border border-white/30 rounded-lg focus:ring-2 focus:ring-blue-300 focus:border-blue-300 text-white">
+                                    <option value="research">Research Collaboration</option>
+                                    <option value="integration">API Integration</option>
+                                    <option value="language">Adding a New Language</option>
+                                    <option value="other">Other</option>
+                                </select>
+                            </div>
+                            <div class="mb-6">
+                                <label for="message" class="block text-sm font-medium mb-2">Message</label>
+                                <textarea id="message" rows="4" class="w-full px-4 py-2 bg-white/20 border border-white/30 rounded-lg focus:ring-2 focus:ring-blue-300 focus:border-blue-300 text-white placeholder-blue-200" placeholder="Your message..."></textarea>
+                            </div>
+                            <button type="submit" class="w-full bg-white text-blue-600 hover:bg-gray-100 px-6 py-3 rounded-lg text-lg font-semibold transition duration-300">
+                                Send Message
+                            </button>
+                        </form>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+    <!-- Footer -->
+    <footer class="bg-gray-900 text-white py-12">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="grid grid-cols-2 md:grid-cols-4 gap-8">
+                <div>
+                    <h3 class="text-lg font-semibold mb-4">PolyglotNLP</h3>
+                    <p class="text-gray-400">
+                        Making NLP accessible for all languages through innovative transfer learning techniques.
+                    </p>
+                </div>
+                <div>
+                    <h3 class="text-lg font-semibold mb-4">Resources</h3>
+                    <ul class="space-y-2">
+                        <li><a href="#" class="text-gray-400 hover:text-white transition">Documentation</a></li>
+                        <li><a href="#" class="text-gray-400 hover:text-white transition">API Reference</a></li>
+                        <li><a href="#" class="text-gray-400 hover:text-white transition">Research Papers</a></li>
+                        <li><a href="#" class="text-gray-400 hover:text-white transition">Blog</a></li>
+                    </ul>
+                </div>
+                <div>
+                    <h3 class="text-lg font-semibold mb-4">Community</h3>
+                    <ul class="space-y-2">
+                        <li><a href="#" class="text-gray-400 hover:text-white transition">GitHub</a></li>
+                        <li><a href="#" class="text-gray-400 hover:text-white transition">Discord</a></li>
+                        <li><a href="#" class="text-gray-400 hover:text-white transition">Twitter</a></li>
+                        <li><a href="#" class="text-gray-400 hover:text-white transition">Contributing</a></li>
+                    </ul>
+                </div>
+                <div>
+                    <h3 class="text-lg font-semibold mb-4">Legal</h3>
+                    <ul class="space-y-2">
+                        <li><a href="#" class="text-gray-400 hover:text-white transition">Privacy Policy</a></li>
+                        <li><a href="#" class="text-gray-400 hover:text-white transition">Terms of Service</a></li>
+                        <li><a href="#" class="text-gray-400 hover:text-white transition">License</a></li>
+                    </ul>
+                </div>
+            </div>
+            <div class="border-t border-gray-800 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center">
+                <p class="text-gray-400 mb-4 md:mb-0">
+                    &copy; 2023 PolyglotNLP. All rights reserved.
+                </p>
+                <div class="flex space-x-6">
+                    <a href="#" class="text-gray-400 hover:text-white transition">
+                        <i class="fab fa-twitter text-xl"></i>
+                    </a>
+                    <a href="#" class="text-gray-400 hover:text-white transition">
+                        <i class="fab fa-github text-xl"></i>
+                    </a>
+                    <a href="#" class="text-gray-400 hover:text-white transition">
+                        <i class="fab fa-linkedin text-xl"></i>
+                    </a>
+                    <a href="#" class="text-gray-400 hover:text-white transition">
+                        <i class="fab fa-youtube text-xl"></i>
+                    </a>
+                </div>
+            </div>
+        </div>
+    </footer>
+    <script>
+        // Mobile menu toggle
+        document.getElementById('mobile-menu-button').addEventListener('click', function() {
+            const menu = document.getElementById('mobile-menu');
+            menu.classList.toggle('hidden');
+        });
+        // Demo functionality
+        document.getElementById('process-btn').addEventListener('click', function() {
+            const inputText = document.getElementById('input-text').value.trim();
+            const language = document.getElementById('language-select').value;
+            const task = document.getElementById('task-select').value;
+            if (!inputText) {
+                alert('Please enter some text to process');
+                return;
+            }
+            // Show loading state
+            document.getElementById('loading').classList.remove('hidden');
+            document.getElementById('results').classList.add('hidden');
+            document.getElementById('demo-placeholder').classList.add('hidden');
+            // Simulate API call with timeout
+            setTimeout(function() {
+                // Hide loading
+                document.getElementById('loading').classList.add('hidden');
+                // Show results
+                document.getElementById('input-lang').textContent = document.getElementById('language-select').options[document.getElementById('language-select').selectedIndex].text;
+                document.getElementById('task-performed').textContent = document.getElementById('task-select').options[document.getElementById('task-select').selectedIndex].text;
+                // Generate demo results based on task
+                let resultOutput = '';
+                let confidence = Math.random() * 30 + 70; // Random confidence between 70-100%
+                if (task === 'sentiment') {
+                    const sentiments = ['Positive', 'Negative', 'Neutral'];
+                    const randomSentiment = sentiments[Math.floor(Math.random() * sentiments.length)];
+                    resultOutput = `Sentiment: <span class="font-bold ${randomSentiment === 'Positive' ? 'text-green-600' : randomSentiment === 'Negative' ? 'text-red-600' : 'text-yellow-600'}">${randomSentiment}</span>`;
+                    document.getElementById('confidence').classList.remove('hidden');
+                    document.getElementById('confidence-bar').style.width = `${confidence}%`;
+                    document.getElementById('confidence-value').textContent = `Model is ${confidence.toFixed(1)}% confident in this prediction`;
+                }
+                else if (task === 'translation') {
+                    resultOutput = `This is a simulated translation from ${language} to English. In a real implementation, this would show the actual translation output from our transfer learning model.`;
+                }
+                else if (task === 'ner') {
+                    resultOutput = `[PERSON] John Doe [/PERSON] from [LOCATION] Kathmandu [/LOCATION] works at [ORGANIZATION] PolyglotNLP [/ORGANIZATION].`;
+                }
+                document.getElementById('result-output').innerHTML = resultOutput;
+                document.getElementById('results').classList.remove('hidden');
+            }, 1500);
+        });
+        // Smooth scrolling for anchor links
+        document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+            anchor.addEventListener('click', function (e) {
+                e.preventDefault();
+                const targetId = this.getAttribute('href');
+                if (targetId === '#') return;
+                const targetElement = document.querySelector(targetId);
+                if (targetElement) {
+                    window.scrollTo({
+                        top: targetElement.offsetTop - 80,
+                        behavior: 'smooth'
+                    });
+                    // Close mobile menu if open
+                    const mobileMenu = document.getElementById('mobile-menu');
+                    if (!mobileMenu.classList.contains('hidden')) {
+                        mobileMenu.classList.add('hidden');
+                    }
+                }
+            });
+        });
+    </script>
+<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=gaur3009/newgbd" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
+</html>

prompts.txt ADDED Viewed

	@@ -0,0 +1 @@


1	+ Make a polyglot NLP where low source languages using transfer leraning technique pick any model and use it to make a full fledged website and make sure don't have any error