Spaces:
Running
Running
well you didn't adapt any ui ux, current one is too naive native simple - Follow Up Deployment
Browse files- index.html +35 -13
index.html
CHANGED
@@ -9,11 +9,11 @@
|
|
9 |
<style>
|
10 |
/* Custom CSS for futuristic elements */
|
11 |
.holographic-card {
|
12 |
-
background: rgba(
|
13 |
-
backdrop-filter: blur(
|
14 |
-
-webkit-backdrop-filter: blur(
|
15 |
-
border: 1px solid rgba(255, 255, 255, 0.
|
16 |
-
box-shadow: 0 8px 32px 0 rgba(
|
17 |
}
|
18 |
|
19 |
.neon-text {
|
@@ -57,17 +57,39 @@
|
|
57 |
</head>
|
58 |
<body class="bg-gray-900 text-white min-h-screen">
|
59 |
<!-- Navigation Bar -->
|
60 |
-
<nav class="bg-
|
61 |
-
<div class="flex items-center space-x-
|
62 |
-
<
|
63 |
-
|
|
|
|
|
64 |
</div>
|
65 |
|
66 |
<div class="hidden md:flex items-center space-x-6">
|
67 |
-
<a href="#" class="hover:text-amber-400 transition
|
68 |
-
|
69 |
-
|
70 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
71 |
</div>
|
72 |
|
73 |
<div class="flex items-center space-x-4">
|
|
|
9 |
<style>
|
10 |
/* Custom CSS for futuristic elements */
|
11 |
.holographic-card {
|
12 |
+
background: rgba(30, 41, 59, 0.5);
|
13 |
+
backdrop-filter: blur(16px);
|
14 |
+
-webkit-backdrop-filter: blur(16px);
|
15 |
+
border: 1px solid rgba(255, 255, 255, 0.08);
|
16 |
+
box-shadow: 0 8px 32px 0 rgba(15, 23, 42, 0.5);
|
17 |
}
|
18 |
|
19 |
.neon-text {
|
|
|
57 |
</head>
|
58 |
<body class="bg-gray-900 text-white min-h-screen">
|
59 |
<!-- Navigation Bar -->
|
60 |
+
<nav class="bg-[#111827] h-20 border-b border-gray-700/50 flex items-center justify-between px-6 fixed w-full z-50 backdrop-blur-md">
|
61 |
+
<div class="flex items-center space-x-3">
|
62 |
+
<div class="w-10 h-10 rounded-xl bg-gradient-to-br from-amber-500 to-amber-600 flex items-center justify-center">
|
63 |
+
<i class="fas fa-hourglass-half text-xl text-white"></i>
|
64 |
+
</div>
|
65 |
+
<span class="text-2xl font-bold bg-clip-text text-transparent bg-gradient-to-r from-amber-400 to-amber-600">Now</span>
|
66 |
</div>
|
67 |
|
68 |
<div class="hidden md:flex items-center space-x-6">
|
69 |
+
<a href="#" class="flex flex-col items-center hover:text-amber-400 transition group">
|
70 |
+
<div class="w-10 h-10 rounded-xl bg-gray-700/50 flex items-center justify-center group-hover:bg-amber-900/30 group-hover:border group-hover:border-amber-400/20 transition">
|
71 |
+
<i class="fas fa-brain text-lg gradient-text"></i>
|
72 |
+
</div>
|
73 |
+
<span class="text-xs mt-1 tracking-wide">Presence</span>
|
74 |
+
</a>
|
75 |
+
<a href="#" class="flex flex-col items-center hover:text-amber-400 transition group">
|
76 |
+
<div class="w-10 h-10 rounded-xl bg-gray-700/50 flex items-center justify-center group-hover:bg-amber-900/30 group-hover:border group-hover:border-amber-400/20 transition">
|
77 |
+
<i class="fas fa-hands-helping text-lg gradient-text"></i>
|
78 |
+
</div>
|
79 |
+
<span class="text-xs mt-1 tracking-wide">Connect</span>
|
80 |
+
</a>
|
81 |
+
<a href="#" class="flex flex-col items-center hover:text-amber-400 transition group">
|
82 |
+
<div class="w-10 h-10 rounded-xl bg-gray-700/50 flex items-center justify-center group-hover:bg-amber-900/30 group-hover:border group-hover:border-amber-400/20 transition">
|
83 |
+
<i class="fas fa-seedling text-lg gradient-text"></i>
|
84 |
+
</div>
|
85 |
+
<span class="text-xs mt-1 tracking-wide">Grow</span>
|
86 |
+
</a>
|
87 |
+
<a href="#" class="flex flex-col items-center hover:text-amber-400 transition group">
|
88 |
+
<div class="w-10 h-10 rounded-xl bg-gray-700/50 flex items-center justify-center group-hover:bg-amber-900/30 group-hover:border group-hover:border-amber-400/20 transition">
|
89 |
+
<i class="fas fa-heart-pulse text-lg gradient-text"></i>
|
90 |
+
</div>
|
91 |
+
<span class="text-xs mt-1 tracking-wide">Wellbeing</span>
|
92 |
+
</a>
|
93 |
</div>
|
94 |
|
95 |
<div class="flex items-center space-x-4">
|