Hugging Face's logo

Spaces:
ashercn97
/
steeldatametrics-forge
Running

App Files Community
ashercn97 commited on
Commit
3c376b7
·
verified ·
1 Parent(s): 740c2b9

more modern. not literally steel.

Browse files
Files changed (1) hide show
  1. index.html +37 -37
index.html CHANGED
@@ -3,19 +3,19 @@
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>SteelDataMetrics Forge - Industrial Data Solutions</title>
7
- <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
8
  <script src="https://cdn.tailwindcss.com"></script>
9
  <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
10
  <script src="https://cdn.jsdelivr.net/npm/animejs/lib/anime.min.js"></script>
11
  <script src="https://unpkg.com/feather-icons"></script>
12
  <style>
13
  .hero-gradient {
14
- background: linear-gradient(135deg, #1a202c 0%, #2d3748 50%, #4a5568 100%);
15
  }
16
- .steel-texture {
17
- background-image: url("http://static.photos/industry/1200x630/42");
18
- background-size: cover;
19
  background-position: center;
20
  }
21
  .glow-border {
@@ -30,9 +30,9 @@
30
  <div class="flex justify-between h-16">
31
  <div class="flex items-center">
32
  <div class="flex-shrink-0 flex items-center">
33
- <i data-feather="database" class="h-8 w-8 text-blue-400"></i>
34
- <span class="ml-2 text-xl font-bold text-white">SteelDataMetrics</span>
35
- </div>
36
  </div>
37
  <div class="flex items-center space-x-8">
38
  <a href="#" class="text-gray-300 hover:text-white px-3 py-2">Services</a>
@@ -45,21 +45,21 @@
45
  </nav>
46
 
47
  <!-- Hero Section -->
48
- <section class="steel-texture hero-gradient min-h-screen flex items-center">
49
- <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-20">
50
  <div class="text-center">
51
- <h1 class="text-5xl md:text-7xl font-bold mb-6 text-white">
52
- FORGING DATA<br>INTO STEEL
53
- </h1>
54
- <p class="text-xl md:text-2xl text-gray-300 mb-8 max-w-3xl mx-auto">
55
- Industrial-strength data analytics and machine learning solutions built for the toughest business environments
56
- </p>
57
  <div class="flex justify-center space-x-6">
58
- <button class="bg-blue-600 hover:bg-blue-700 text-white px-8 py-4 rounded-md text-lg font-semibold glow-border">
59
- Get Started
60
  </button>
61
- <button class="border border-gray-400 hover:border-white text-white px-8 py-4 rounded-md text-lg font-semibold">
62
- View Demo
63
  </button>
64
  </div>
65
  </div>
@@ -71,8 +71,8 @@
71
  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
72
  <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center">
73
  <div class="p-6">
74
- <div class="text-3xl font-bold text-blue-400 mb-2">98.7%</div>
75
- <div class="text-gray-400">Uptime Guarantee</div>
76
  </div>
77
  <div class="p-6">
78
  <div class="text-3xl font-bold text-blue-400 mb-2">500+</div>
@@ -96,18 +96,18 @@
96
  <h2 class="text-3xl md:text-4xl font-bold text-center mb-16 text-white">INDUSTRIAL DATA SOLUTIONS</h2>
97
  <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
98
  <div class="bg-gray-800 p-8 rounded-lg glow-border">
99
- <i data-feather="bar-chart-2" class="h-12 w-12 text-blue-400 mb-4"></i>
100
- <h3 class="text-xl font-semibold mb-4">Real-time Analytics</h3>
101
  <p class="text-gray-400">Monitor and analyze data streams with millisecond precision for immediate insights.</p>
102
  </div>
103
  <div class="bg-gray-800 p-8 rounded-lg glow-border">
104
- <i data-feather="cpu" class="h-12 w-12 text-blue-400 mb-4"></i>
105
- <h3 class="text-xl font-semibold mb-4">Machine Learning</h3>
106
  <p class="text-gray-400">Predictive models built to withstand the most demanding industrial applications.</p>
107
  </div>
108
  <div class="bg-gray-800 p-8 rounded-lg glow-border">
109
- <i data-feather="shield" class="h-12 w-12 text-blue-400 mb-4"></i>
110
- <h3 class="text-xl font-semibold mb-4">Security First</h3>
111
  <p class="text-gray-400">Military-grade encryption and compliance frameworks for sensitive industrial data.</p>
112
  </div>
113
  </div>
@@ -115,8 +115,8 @@
115
  </section>
116
 
117
  <!-- CTA Section -->
118
- <section class="bg-blue-600 py-20">
119
- <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
120
  <h2 class="text-3xl md:text-4xl font-bold mb-6 text-white">READY TO FORGE YOUR DATA?</h2>
121
  <p class="text-xl text-blue-100 mb-8 max-w-2xl mx-auto">
122
  Join industry leaders who trust SteelDataMetrics for their mission-critical data operations
@@ -133,11 +133,11 @@
133
  <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
134
  <div>
135
  <div class="flex items-center mb-4">
136
- <i data-feather="database" class="h-6 w-6 text-blue-400"></i>
137
- <span class="ml-2 text-lg font-bold text-white">SteelDataMetrics</span>
138
  </div>
139
- <p class="text-gray-400">Forging data into actionable insights since 2018</p>
140
- </div>
141
  <div>
142
  <h4 class="text-white font-semibold mb-4">Solutions</h4>
143
  <a href="#" class="block text-gray-400 hover:text-white mb-2">Real-time Analytics</a>
@@ -160,8 +160,8 @@
160
  </div>
161
  </div>
162
  <div class="border-t border-gray-700 mt-8 pt-8 text-center text-gray-400">
163
- <p>&copy; 2024 SteelDataMetrics Forge. All rights reserved.</p>
164
- </div>
165
  </div>
166
  </footer>
167
 
 
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>NexusData - AI-Powered Data Insights</title>
7
+ <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
8
  <script src="https://cdn.tailwindcss.com"></script>
9
  <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
10
  <script src="https://cdn.jsdelivr.net/npm/animejs/lib/anime.min.js"></script>
11
  <script src="https://unpkg.com/feather-icons"></script>
12
  <style>
13
  .hero-gradient {
14
+ background: linear-gradient(135deg, #0f172a 0%, #1e293b 50%, #334155 100%);
15
  }
16
+ .modern-texture {
17
+ background-image: url("http://static.photos/technology/1200x630/7");
18
+ background-size: cover;
19
  background-position: center;
20
  }
21
  .glow-border {
 
30
  <div class="flex justify-between h-16">
31
  <div class="flex items-center">
32
  <div class="flex-shrink-0 flex items-center">
33
+ <i data-feather="activity" class="h-8 w-8 text-indigo-400"></i>
34
+ <span class="ml-2 text-xl font-bold text-white">NexusData</span>
35
+ </div>
36
  </div>
37
  <div class="flex items-center space-x-8">
38
  <a href="#" class="text-gray-300 hover:text-white px-3 py-2">Services</a>
 
45
  </nav>
46
 
47
  <!-- Hero Section -->
48
+ <section class="modern-texture hero-gradient min-h-screen flex items-center">
49
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-20">
50
  <div class="text-center">
51
+ <h1 class="text-5xl md:text-7xl font-bold mb-6 text-white">
52
+ Transforming Data<br>Into Intelligence
53
+ </h1>
54
+ <p class="text-xl md:text-2xl text-gray-300 mb-8 max-w-3xl mx-auto">
55
+ AI-powered analytics and machine learning solutions designed for the modern enterprise
56
+ </p>
57
  <div class="flex justify-center space-x-6">
58
+ <button class="bg-indigo-600 hover:bg-indigo-700 text-white px-8 py-4 rounded-lg text-lg font-semibold glow-border transition-all duration-300 hover:scale-105">
59
+ Get Started
60
  </button>
61
+ <button class="border border-gray-400 hover:border-white text-white px-8 py-4 rounded-lg text-lg font-semibold transition-all duration-300 hover:scale-105">
62
+ View Demo
63
  </button>
64
  </div>
65
  </div>
 
71
  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
72
  <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center">
73
  <div class="p-6">
74
+ <div class="text-3xl font-bold text-indigo-400 mb-2">99.9%</div>
75
+ <div class="text-gray-400">Uptime Guarantee</div>
76
  </div>
77
  <div class="p-6">
78
  <div class="text-3xl font-bold text-blue-400 mb-2">500+</div>
 
96
  <h2 class="text-3xl md:text-4xl font-bold text-center mb-16 text-white">INDUSTRIAL DATA SOLUTIONS</h2>
97
  <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
98
  <div class="bg-gray-800 p-8 rounded-lg glow-border">
99
+ <i data-feather="bar-chart-2" class="h-12 w-12 text-white mb-4"></i>
100
+ <h3 class="text-xl font-semibold mb-4">Real-time Analytics</h3>
101
  <p class="text-gray-400">Monitor and analyze data streams with millisecond precision for immediate insights.</p>
102
  </div>
103
  <div class="bg-gray-800 p-8 rounded-lg glow-border">
104
+ <i data-feather="cpu" class="h-12 w-12 text-white mb-4"></i>
105
+ <h3 class="text-xl font-semibold mb-4">Machine Learning</h3>
106
  <p class="text-gray-400">Predictive models built to withstand the most demanding industrial applications.</p>
107
  </div>
108
  <div class="bg-gray-800 p-8 rounded-lg glow-border">
109
+ <i data-feather="shield" class="h-12 w-12 text-white mb-4"></i>
110
+ <h3 class="text-xl font-semibold mb-4">Security First</h3>
111
  <p class="text-gray-400">Military-grade encryption and compliance frameworks for sensitive industrial data.</p>
112
  </div>
113
  </div>
 
115
  </section>
116
 
117
  <!-- CTA Section -->
118
+ <section class="bg-indigo-600 py-20">
119
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
120
  <h2 class="text-3xl md:text-4xl font-bold mb-6 text-white">READY TO FORGE YOUR DATA?</h2>
121
  <p class="text-xl text-blue-100 mb-8 max-w-2xl mx-auto">
122
  Join industry leaders who trust SteelDataMetrics for their mission-critical data operations
 
133
  <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
134
  <div>
135
  <div class="flex items-center mb-4">
136
+ <i data-feather="activity" class="h-6 w-6 text-indigo-400"></i>
137
+ <span class="ml-2 text-lg font-bold text-white">NexusData</span>
138
  </div>
139
+ <p class="text-gray-400">Transforming data into intelligence since 2020</p>
140
+ </div>
141
  <div>
142
  <h4 class="text-white font-semibold mb-4">Solutions</h4>
143
  <a href="#" class="block text-gray-400 hover:text-white mb-2">Real-time Analytics</a>
 
160
  </div>
161
  </div>
162
  <div class="border-t border-gray-700 mt-8 pt-8 text-center text-gray-400">
163
+ <p>&copy; 2024 NexusData. All rights reserved.</p>
164
+ </div>
165
  </div>
166
  </footer>
167