update

index.html

@@ -18,11 +18,11 @@
 		</header>
 
 		<section class="description">
-			<h2>About the Project</h2>
-			<p>This demo showcases the V-JEPA 2 model's capabilities in real-time video classification. V-JEPA 2 is a
-				state-of-the-art video understanding model that can extract video features,
-				making it ideal for applications requiring immediate video content analysis.</p>
-			<p>The model is pretrained on Something-Something-V2 dataset and can classify 174 actions.</p>
+			<h2>🎥 Video Classification</h2>
+			<p>This demo showcases a specialized version of V-JEPA 2, fine-tuned for real-time video action recognition!
+				Model optimized specifically for classifying 174 different actions from the Something-Something-V2 dataset. 
+				Watch as it instantly understands what's happening in the video! ⚡
+			</p>
 		</section>
 
 		<section class="demo">
@@ -53,6 +53,17 @@ cd vjepa2-streaming-video-classification</code></pre>
 		<footer>
 			<p>Built with ❤️ using <a href="https://huggingface.co/transformers" target="_blank">Hugging Face
 					Transformers</a></p>
+			<div class="footer-links">
+				<h4>Learn More About V-JEPA 2</h4>
+				<ul>
+					<li><a href="https://ai.meta.com/vjepa/" target="_blank">🌐 Official Meta AI Page</a></li>
+					<li><a href="https://github.com/facebookresearch/vjepa2" target="_blank">📚 GitHub Repository</a>
+					</li>
+					<li><a href="https://huggingface.co/papers/2506.09985" target="_blank">📄 Research Paper</a></li>
+					<li><a href="https://huggingface.co/spaces/qubvel-hf/vjepa2-streaming-video-classification"
+							target="_blank">🔗 Original Demo Space</a></li>
+				</ul>
+			</div>
 		</footer>
 	</div>
 </body>

style.css

@@ -129,6 +129,45 @@ a:hover {
 	color: #2B6CB0;
 }
 
+.footer-links {
+	margin-top: 2rem;
+	padding-top: 1rem;
+	border-top: 1px solid #E2E8F0;
+}
+
+.footer-links h4 {
+	color: var(--primary-color);
+	margin-bottom: 1rem;
+	font-size: 1.1rem;
+}
+
+.footer-links ul {
+	list-style: none;
+	margin: 0;
+	padding: 0;
+	display: flex;
+	flex-wrap: wrap;
+	gap: 1.5rem;
+	justify-content: center;
+}
+
+.footer-links li {
+	margin: 0;
+}
+
+.footer-links a {
+	color: var(--secondary-color);
+	text-decoration: none;
+	transition: color 0.2s ease;
+	display: inline-flex;
+	align-items: center;
+	gap: 0.5rem;
+}
+
+.footer-links a:hover {
+	color: var(--accent-color);
+}
+
 @media (max-width: 768px) {
 	.container {
 		padding: 1rem;
@@ -145,4 +184,10 @@ a:hover {
 	pre {
 		padding: 0.75rem;
 	}
+
+	.footer-links ul {
+		flex-direction: column;
+		align-items: center;
+		gap: 1rem;
+	}
 }