Hugging Face's logo

Spaces:
triton7777
/
futureconnectv0
Running

App Files Community
triton7777 commited on
Commit
9463ec1
·
verified ·
1 Parent(s): 3c55d75

Okay, now modify the site to look a lot more different towards modern UI, currently it focuses on things, which are not useful, gaming (why games are part of , okay), but the framework should involve much other aspects that does not conform to what has and is existing, hte UIUX, the style, the theme, we dont want another facebook, a failed social media, we want present reality, to live in the moment, to do meaning ful things, and bring the world out of the gutter that there is, and streamline sort thoughts and ideas for better existence - Follow Up Deployment

Browse files
Files changed (1) hide show
  1. index.html +29 -19
index.html CHANGED
@@ -3,7 +3,7 @@
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>FutureConnect | The Social Network 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>
@@ -21,12 +21,22 @@
21
  }
22
 
23
  .gradient-text {
24
- background: linear-gradient(90deg, #00f7ff, #0084ff);
25
  -webkit-background-clip: text;
26
  background-clip: text;
27
  color: transparent;
28
  }
29
 
 
 
 
 
 
 
 
 
 
 
30
  .pulse-animation {
31
  animation: pulse 2s infinite;
32
  }
@@ -49,20 +59,20 @@
49
  <!-- Navigation Bar -->
50
  <nav class="bg-gray-800 h-16 flex items-center justify-between px-6 fixed w-full z-50">
51
  <div class="flex items-center space-x-2">
52
- <i class="fas fa-robot text-2xl gradient-text"></i>
53
- <span class="text-xl font-bold gradient-text">FutureConnect</span>
54
  </div>
55
 
56
  <div class="hidden md:flex items-center space-x-6">
57
- <a href="#" class="hover:text-blue-400 transition"><i class="fas fa-home"></i> Home</a>
58
- <a href="#" class="hover:text-blue-400 transition"><i class="fas fa-network-wired"></i> Network</a>
59
- <a href="#" class="hover:text-blue-400 transition"><i class="fas fa-vr-cardboard"></i> Metaverse</a>
60
- <a href="#" class="hover:text-blue-400 transition"><i class="fas fa-brain"></i> AI Hub</a>
61
  </div>
62
 
63
  <div class="flex items-center space-x-4">
64
  <div class="relative">
65
- <input type="text" placeholder="Search FutureConnect..." class="bg-gray-700 rounded-full py-1 px-4 pr-10 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 w-40 md:w-64">
66
  <i class="fas fa-search absolute right-3 top-2 text-gray-400"></i>
67
  </div>
68
  <div class="flex items-center space-x-2">
@@ -88,24 +98,24 @@
88
 
89
  <div class="space-y-2">
90
  <a href="#" class="flex items-center space-x-3 p-2 rounded hover:bg-gray-700 transition">
91
- <i class="fas fa-user-friends w-5 text-center"></i>
92
- <span>Friends</span>
93
  </a>
94
  <a href="#" class="flex items-center space-x-3 p-2 rounded hover:bg-gray-700 transition">
95
- <i class="fas fa-users w-5 text-center"></i>
96
- <span>Communities</span>
97
  </a>
98
  <a href="#" class="flex items-center space-x-3 p-2 rounded hover:bg-gray-700 transition">
99
- <i class="fas fa-store w-5 text-center"></i>
100
- <span>Marketplace</span>
101
  </a>
102
  <a href="#" class="flex items-center space-x-3 p-2 rounded hover:bg-gray-700 transition">
103
- <i class="fas fa-gamepad w-5 text-center"></i>
104
- <span>Gaming</span>
105
  </a>
106
  <a href="#" class="flex items-center space-x-3 p-2 rounded hover:bg-gray-700 transition">
107
- <i class="fas fa-chart-line w-5 text-center"></i>
108
- <span>Analytics</span>
109
  </a>
110
  </div>
111
 
 
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Now | Presence-Focused Connection</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>
 
21
  }
22
 
23
  .gradient-text {
24
+ background: linear-gradient(90deg, #f59e0b, #f97316);
25
  -webkit-background-clip: text;
26
  background-clip: text;
27
  color: transparent;
28
  }
29
 
30
+ .mindful-card {
31
+ background: rgba(245, 158, 11, 0.05);
32
+ border-left: 4px solid #f59e0b;
33
+ transition: all 0.3s ease;
34
+ }
35
+
36
+ .mindful-card:hover {
37
+ background: rgba(245, 158, 11, 0.1);
38
+ }
39
+
40
  .pulse-animation {
41
  animation: pulse 2s infinite;
42
  }
 
59
  <!-- Navigation Bar -->
60
  <nav class="bg-gray-800 h-16 flex items-center justify-between px-6 fixed w-full z-50">
61
  <div class="flex items-center space-x-2">
62
+ <i class="fas fa-hourglass-half text-2xl text-amber-400"></i>
63
+ <span class="text-xl font-bold text-amber-400">Now</span>
64
  </div>
65
 
66
  <div class="hidden md:flex items-center space-x-6">
67
+ <a href="#" class="hover:text-amber-400 transition"><i class="fas fa-mind"></i> Presence</a>
68
+ <a href="#" class="hover:text-amber-400 transition"><i class="fas fa-hands-helping"></i> Collaborate</a>
69
+ <a href="#" class="hover:text-amber-400 transition"><i class="fas fa-lightbulb"></i> Ideas</a>
70
+ <a href="#" class="hover:text-amber-400 transition"><i class="fas fa-heartbeat"></i> Wellbeing</a>
71
  </div>
72
 
73
  <div class="flex items-center space-x-4">
74
  <div class="relative">
75
+ <input type="text" placeholder="Find meaningful connections..." class="bg-gray-700 rounded-full py-1 px-4 pr-10 text-sm focus:outline-none focus:ring-2 focus:ring-amber-500 w-40 md:w-64">
76
  <i class="fas fa-search absolute right-3 top-2 text-gray-400"></i>
77
  </div>
78
  <div class="flex items-center space-x-2">
 
98
 
99
  <div class="space-y-2">
100
  <a href="#" class="flex items-center space-x-3 p-2 rounded hover:bg-gray-700 transition">
101
+ <i class="fas fa-eye w-5 text-center text text-amber-400"></i>
102
+ <span>Awareness</span>
103
  </a>
104
  <a href="#" class="flex items-center space-x-3 p-2 rounded hover:bg-gray-700 transition">
105
+ <i class="fas fa-seedling w-5 text-center text-emerald-400"></i>
106
+ <span>Growth</span>
107
  </a>
108
  <a href="#" class="flex items-center space-x-3 p-2 rounded hover:bg-gray-700 transition">
109
+ <i class="fas fa-hands w-5 text-center text-blue-400"></i>
110
+ <span>Service</span>
111
  </a>
112
  <a href="#" class="flex items-center space-x-3 p-2 rounded hover:bg-gray-700 transition">
113
+ <i class="fas fa-book w-5 text-center text-violet-400"></i>
114
+ <span>Wisdom</span>
115
  </a>
116
  <a href="#" class="flex items-center space-x-3 p-2 rounded hover:bg-gray-700 transition">
117
+ <i class="fas fa-tree w-5 text-center text-green-400"></i>
118
+ <span>Nature</span>
119
  </a>
120
  </div>
121