akhaliq HF Staff commited on
Commit
225fbb1
·
verified ·
1 Parent(s): 7746ef1

the video should take up the entire website background just use a empty mp4 made up file Ill replace it later with a real file - Initial Deployment

Browse files
Files changed (2) hide show
  1. README.md +7 -5
  2. index.html +84 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Nexusrobotics
3
- emoji: 🔥
4
- colorFrom: indigo
5
- colorTo: red
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: nexusrobotics
3
+ emoji: 🐳
4
+ colorFrom: blue
5
+ colorTo: blue
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,84 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Nexus Robotics - Humanoid Robots of Tomorrow</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <style>
10
+ .video-container {
11
+ position: relative;
12
+ padding-bottom: 56.25%; /* 16:9 aspect ratio */
13
+ height: 0;
14
+ overflow: hidden;
15
+ }
16
+ .video-container iframe {
17
+ position: absolute;
18
+ top: 0;
19
+ left: 0;
20
+ width: 100%;
21
+ height: 100%;
22
+ }
23
+ .gradient-text {
24
+ background: linear-gradient(90deg, #3b82f6, #10b981);
25
+ -webkit-background-clip: text;
26
+ background-clip: text;
27
+ color: transparent;
28
+ text-shadow: 0 0 8px rgba(255,255,255,0.3);
29
+ }
30
+ .join-btn {
31
+ transition: all 0.3s ease;
32
+ box-shadow: 0 4px 6px rgba(5, 150, 105, 0.3);
33
+ }
34
+ .join-btn:hover {
35
+ transform: translateY(-2px);
36
+ box-shadow: 0 6px 8px rgba(5, 150, 105, 0.4);
37
+ }
38
+ </style>
39
+ </head>
40
+ <body class="bg-gray-50 min-h-screen flex flex-col">
41
+ <!-- Navigation -->
42
+ <nav class="fixed w-full z-10 py-4">
43
+ <div class="container mx-auto px-4 flex justify-between items-center">
44
+ <div class="flex items-center">
45
+ <i class="fas fa-robot text-2xl mr-2 text-white"></i>
46
+ <span class="text-xl font-bold text-white">NEXUS<span class="gradient-text">ROBOTICS</span></span>
47
+ </div>
48
+ </div>
49
+ </nav>
50
+
51
+ <!-- Video Background -->
52
+ <div class="fixed inset-0 -z-10 overflow-hidden">
53
+ <video autoplay muted loop class="w-full h-full object-cover">
54
+ <source src="background.mp4" type="video/mp4">
55
+ </video>
56
+ <div class="absolute inset-0 bg-black/30"></div>
57
+ </div>
58
+
59
+ <!-- Main Content -->
60
+ <main class="flex-grow flex flex-col items-center justify-center min-h-screen text-center px-4">
61
+ <div class="relative z-10">
62
+ <h1 class="text-5xl md:text-7xl font-bold text-white mb-8">
63
+ NEXUS<span class="gradient-text">ROBOTICS</span>
64
+ </h1>
65
+ <button class="join-btn bg-gradient-to-r from-blue-500 to-emerald-500 text-white px-8 py-4 rounded-full font-medium text-xl">
66
+ <i class="fas fa-user-plus mr-2"></i> Join Us
67
+ </button>
68
+ </div>
69
+ </main>
70
+
71
+
72
+ <script>
73
+ // Simple animation for the join button
74
+ document.querySelectorAll('.join-btn').forEach(button => {
75
+ button.addEventListener('mouseenter', () => {
76
+ button.classList.add('shadow-lg');
77
+ });
78
+ button.addEventListener('mouseleave', () => {
79
+ button.classList.remove('shadow-lg');
80
+ });
81
+ });
82
+ </script>
83
+ <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=akhaliq/nexusrobotics" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
84
+ </html>