Hugging Face's logo

Spaces:
Alexo19
/
forexmind
Running

App Files Community
Alexo19 commited on
Commit
70f0a20
·
verified ·
1 Parent(s): f531164

fully finish

Browse files
Files changed (2) hide show
  1. index.html +5 -4
  2. market-data.html +619 -0
index.html CHANGED
@@ -49,8 +49,8 @@
49
  <a href="#" class="bg-slate-900 text-white px-3 py-2 rounded-md text-sm font-medium">Dashboard</a>
50
  <a href="#" class="text-slate-300 hover:bg-slate-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium">Analysis</a>
51
  <a href="#" class="text-slate-300 hover:bg-slate-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium">Education</a>
52
- <a href="#" class="text-slate-300 hover:bg-slate-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium">Market Data</a>
53
- </div>
54
  </div>
55
  </div>
56
  <div class="hidden md:block">
@@ -350,12 +350,13 @@
350
  <div>
351
  <h3 class="text-lg font-semibold mb-4">Platform</h3>
352
  <ul class="space-y-2">
353
- <li><a href="#" class="text-slate-400 hover:text-white">Dashboard</a></li>
354
  <li><a href="#" class="text-slate-400 hover:text-white">Market Analysis</a></li>
355
  <li><a href="#" class="text-slate-400 hover:text-white">Educational Resources</a></li>
 
356
  <li><a href="#" class="text-slate-400 hover:text-white">Trading Simulator</a></li>
357
  <li><a href="#" class="text-slate-400 hover:text-white">Market News</a></li>
358
- </ul>
359
  </div>
360
  <div>
361
  <h3 class="text-lg font-semibold mb-4">Resources</h3>
 
49
  <a href="#" class="bg-slate-900 text-white px-3 py-2 rounded-md text-sm font-medium">Dashboard</a>
50
  <a href="#" class="text-slate-300 hover:bg-slate-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium">Analysis</a>
51
  <a href="#" class="text-slate-300 hover:bg-slate-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium">Education</a>
52
+ <a href="market-data.html" class="text-slate-300 hover:bg-slate-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium">Market Data</a>
53
+ </div>
54
  </div>
55
  </div>
56
  <div class="hidden md:block">
 
350
  <div>
351
  <h3 class="text-lg font-semibold mb-4">Platform</h3>
352
  <ul class="space-y-2">
353
+ <li><a href="index.html" class="text-slate-400 hover:text-white">Dashboard</a></li>
354
  <li><a href="#" class="text-slate-400 hover:text-white">Market Analysis</a></li>
355
  <li><a href="#" class="text-slate-400 hover:text-white">Educational Resources</a></li>
356
+ <li><a href="market-data.html" class="text-slate-400 hover:text-white">Market Data</a></li>
357
  <li><a href="#" class="text-slate-400 hover:text-white">Trading Simulator</a></li>
358
  <li><a href="#" class="text-slate-400 hover:text-white">Market News</a></li>
359
+ </ul>
360
  </div>
361
  <div>
362
  <h3 class="text-lg font-semibold mb-4">Resources</h3>
market-data.html ADDED
@@ -0,0 +1,619 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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>Market Data - ForexMind</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/chart.js"></script>
11
+ <style>
12
+ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
13
+ body {
14
+ font-family: 'Inter', sans-serif;
15
+ background-color: #0f172a;
16
+ }
17
+ .card-gradient {
18
+ background: linear-gradient(145deg, #1e293b, #0f172a);
19
+ box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.25);
20
+ }
21
+ .market-up {
22
+ color: #10b981;
23
+ }
24
+ .market-down {
25
+ color: #ef4444;
26
+ }
27
+ .table-row:hover {
28
+ background-color: #1e293b;
29
+ }
30
+ </style>
31
+ </head>
32
+ <body class="bg-slate-900 text-slate-100">
33
+ <!-- Navigation -->
34
+ <nav class="bg-slate-800 border-b border-slate-700">
35
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
36
+ <div class="flex items-center justify-between h-16">
37
+ <div class="flex items-center">
38
+ <div class="flex-shrink-0 flex items-center">
39
+ <i data-feather="trending-up" class="text-emerald-500 mr-2"></i>
40
+ <span class="font-bold text-xl">ForexMind</span>
41
+ </div>
42
+ <div class="hidden md:block">
43
+ <div class="ml-10 flex items-baseline space-x-4">
44
+ <a href="index.html" class="text-slate-300 hover:bg-slate-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium">Dashboard</a>
45
+ <a href="#" class="text-slate-300 hover:bg-slate-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium">Analysis</a>
46
+ <a href="#" class="text-slate-300 hover:bg-slate-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium">Education</a>
47
+ <a href="market-data.html" class="bg-slate-900 text-white px-3 py-2 rounded-md text-sm font-medium">Market Data</a>
48
+ </div>
49
+ </div>
50
+ </div>
51
+ <div class="hidden md:block">
52
+ <div class="ml-4 flex items-center md:ml-6">
53
+ <button class="bg-slate-800 p-1 rounded-full text-slate-400 hover:text-white focus:outline-none">
54
+ <i data-feather="bell"></i>
55
+ </button>
56
+ <div class="ml-3 relative">
57
+ <div class="flex items-center">
58
+ <button class="flex text-sm rounded-full focus:outline-none">
59
+ <img class="h-8 w-8 rounded-full" src="http://static.photos/people/200x200/1" alt="User">
60
+ </button>
61
+ </div>
62
+ </div>
63
+ </div>
64
+ </div>
65
+ <div class="-mr-2 flex md:hidden">
66
+ <button class="bg-slate-800 inline-flex items-center justify-center p-2 rounded-md text-slate-400 hover:text-white hover:bg-slate-700 focus:outline-none">
67
+ <i data-feather="menu"></i>
68
+ </button>
69
+ </div>
70
+ </div>
71
+ </div>
72
+ </nav>
73
+
74
+ <!-- Main Content -->
75
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
76
+ <div class="mb-8">
77
+ <h1 class="text-3xl font-bold mb-2">Market Data</h1>
78
+ <p class="text-slate-400">Real-time currency pair information and market statistics</p>
79
+ </div>
80
+
81
+ <!-- Filters -->
82
+ <div class="card-gradient rounded-xl p-6 mb-8">
83
+ <div class="flex flex-col md:flex-row md:items-center md:justify-between gap-4">
84
+ <div class="flex flex-wrap gap-2">
85
+ <button class="bg-emerald-600 text-white px-4 py-2 rounded-lg text-sm">All Pairs</button>
86
+ <button class="bg-slate-800 hover:bg-slate-700 text-slate-300 px-4 py-2 rounded-lg text-sm">Majors</button>
87
+ <button class="bg-slate-800 hover:bg-slate-700 text-slate-300 px-4 py-2 rounded-lg text-sm">Minors</button>
88
+ <button class="bg-slate-800 hover:bg-slate-700 text-slate-300 px-4 py-2 rounded-lg text-sm">Exotics</button>
89
+ <button class="bg-slate-800 hover:bg-slate-700 text-slate-300 px-4 py-2 rounded-lg text-sm">Commodities</button>
90
+ </div>
91
+ <div class="relative">
92
+ <input type="text" placeholder="Search pairs..." class="bg-slate-800 text-slate-200 rounded-lg py-2 px-4 pl-10 w-full md:w-64 focus:outline-none focus:ring-2 focus:ring-emerald-500">
93
+ <i data-feather="search" class="absolute left-3 top-2.5 text-slate-500 w-4 h-4"></i>
94
+ </div>
95
+ </div>
96
+ </div>
97
+
98
+ <!-- Market Data Table -->
99
+ <div class="card-gradient rounded-xl overflow-hidden">
100
+ <div class="overflow-x-auto">
101
+ <table class="min-w-full divide-y divide-slate-700">
102
+ <thead class="bg-slate-800">
103
+ <tr>
104
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-slate-400 uppercase tracking-wider">Pair</th>
105
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-slate-400 uppercase tracking-wider">Price</th>
106
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-slate-400 uppercase tracking-wider">24h Change</th>
107
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-slate-400 uppercase tracking-wider">24h High</th>
108
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-slate-400 uppercase tracking-wider">24h Low</th>
109
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-slate-400 uppercase tracking-wider">Volume</th>
110
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-slate-400 uppercase tracking-wider">Chart</th>
111
+ </tr>
112
+ </thead>
113
+ <tbody class="divide-y divide-slate-800">
114
+ <!-- EUR/USD -->
115
+ <tr class="table-row">
116
+ <td class="px-6 py-4 whitespace-nowrap">
117
+ <div class="flex items-center">
118
+ <div class="bg-slate-800 rounded-lg w-8 h-8 flex items-center justify-center mr-3">
119
+ <span class="text-xs font-bold">EU</span>
120
+ </div>
121
+ <div>
122
+ <div class="font-medium">EUR/USD</div>
123
+ <div class="text-slate-500 text-sm">Euro / US Dollar</div>
124
+ </div>
125
+ </div>
126
+ </td>
127
+ <td class="px-6 py-4 whitespace-nowrap font-medium">1.0842</td>
128
+ <td class="px-6 py-4 whitespace-nowrap">
129
+ <span class="market-up font-medium">+0.24%</span>
130
+ </td>
131
+ <td class="px-6 py-4 whitespace-nowrap">1.0855</td>
132
+ <td class="px-6 py-4 whitespace-nowrap">1.0812</td>
133
+ <td class="px-6 py-4 whitespace-nowrap">2.45B</td>
134
+ <td class="px-6 py-4 whitespace-nowrap">
135
+ <div class="h-10 w-24">
136
+ <canvas id="eurusd-mini-chart"></canvas>
137
+ </div>
138
+ </td>
139
+ </tr>
140
+
141
+ <!-- GBP/USD -->
142
+ <tr class="table-row">
143
+ <td class="px-6 py-4 whitespace-nowrap">
144
+ <div class="flex items-center">
145
+ <div class="bg-slate-800 rounded-lg w-8 h-8 flex items-center justify-center mr-3">
146
+ <span class="text-xs font-bold">GU</span>
147
+ </div>
148
+ <div>
149
+ <div class="font-medium">GBP/USD</div>
150
+ <div class="text-slate-500 text-sm">British Pound / US Dollar</div>
151
+ </div>
152
+ </div>
153
+ </td>
154
+ <td class="px-6 py-4 whitespace-nowrap font-medium">1.2728</td>
155
+ <td class="px-6 py-4 whitespace-nowrap">
156
+ <span class="market-down font-medium">-0.12%</span>
157
+ </td>
158
+ <td class="px-6 py-4 whitespace-nowrap">1.2750</td>
159
+ <td class="px-6 py-4 whitespace-nowrap">1.2710</td>
160
+ <td class="px-6 py-4 whitespace-nowrap">1.87B</td>
161
+ <td class="px-6 py-4 whitespace-nowrap">
162
+ <div class="h-10 w-24">
163
+ <canvas id="gbpusd-mini-chart"></canvas>
164
+ </div>
165
+ </td>
166
+ </tr>
167
+
168
+ <!-- USD/JPY -->
169
+ <tr class="table-row">
170
+ <td class="px-6 py-4 whitespace-nowrap">
171
+ <div class="flex items-center">
172
+ <div class="bg-slate-800 rounded-lg w-8 h-8 flex items-center justify-center mr-3">
173
+ <span class="text-xs font-bold">UJ</span>
174
+ </div>
175
+ <div>
176
+ <div class="font-medium">USD/JPY</div>
177
+ <div class="text-slate-500 text-sm">US Dollar / Japanese Yen</div>
178
+ </div>
179
+ </div>
180
+ </td>
181
+ <td class="px-6 py-4 whitespace-nowrap font-medium">151.85</td>
182
+ <td class="px-6 py-4 whitespace-nowrap">
183
+ <span class="market-up font-medium">+0.38%</span>
184
+ </td>
185
+ <td class="px-6 py-4 whitespace-nowrap">152.10</td>
186
+ <td class="px-6 py-4 whitespace-nowrap">151.20</td>
187
+ <td class="px-6 py-4 whitespace-nowrap">3.21B</td>
188
+ <td class="px-6 py-4 whitespace-nowrap">
189
+ <div class="h-10 w-24">
190
+ <canvas id="usdjpy-mini-chart"></canvas>
191
+ </div>
192
+ </td>
193
+ </tr>
194
+
195
+ <!-- USD/CHF -->
196
+ <tr class="table-row">
197
+ <td class="px-6 py-4 whitespace-nowrap">
198
+ <div class="flex items-center">
199
+ <div class="bg-slate-800 rounded-lg w-8 h-8 flex items-center justify-center mr-3">
200
+ <span class="text-xs font-bold">UC</span>
201
+ </div>
202
+ <div>
203
+ <div class="font-medium">USD/CHF</div>
204
+ <div class="text-slate-500 text-sm">US Dollar / Swiss Franc</div>
205
+ </div>
206
+ </div>
207
+ </td>
208
+ <td class="px-6 py-4 whitespace-nowrap font-medium">0.9124</td>
209
+ <td class="px-6 py-4 whitespace-nowrap">
210
+ <span class="market-down font-medium">-0.08%</span>
211
+ </td>
212
+ <td class="px-6 py-4 whitespace-nowrap">0.9135</td>
213
+ <td class="px-6 py-4 whitespace-nowrap">0.9110</td>
214
+ <td class="px-6 py-4 whitespace-nowrap">1.98B</td>
215
+ <td class="px-6 py-4 whitespace-nowrap">
216
+ <div class="h-10 w-24">
217
+ <canvas id="usdchf-mini-chart"></canvas>
218
+ </div>
219
+ </td>
220
+ </tr>
221
+
222
+ <!-- AUD/USD -->
223
+ <tr class="table-row">
224
+ <td class="px-6 py-4 whitespace-nowrap">
225
+ <div class="flex items-center">
226
+ <div class="bg-slate-800 rounded-lg w-8 h-8 flex items-center justify-center mr-3">
227
+ <span class="text-xs font-bold">AU</span>
228
+ </div>
229
+ <div>
230
+ <div class="font-medium">AUD/USD</div>
231
+ <div class="text-slate-500 text-sm">Australian Dollar / US Dollar</div>
232
+ </div>
233
+ </div>
234
+ </td>
235
+ <td class="px-6 py-4 whitespace-nowrap font-medium">0.6528</td>
236
+ <td class="px-6 py-4 whitespace-nowrap">
237
+ <span class="market-up font-medium">+0.15%</span>
238
+ </td>
239
+ <td class="px-6 py-4 whitespace-nowrap">0.6540</td>
240
+ <td class="px-6 py-4 whitespace-nowrap">0.6505</td>
241
+ <td class="px-6 py-4 whitespace-nowrap">1.32B</td>
242
+ <td class="px-6 py-4 whitespace-nowrap">
243
+ <div class="h-10 w-24">
244
+ <canvas id="audusd-mini-chart"></canvas>
245
+ </div>
246
+ </td>
247
+ </tr>
248
+
249
+ <!-- USD/CAD -->
250
+ <tr class="table-row">
251
+ <td class="px-6 py-4 whitespace-nowrap">
252
+ <div class="flex items-center">
253
+ <div class="bg-slate-800 rounded-lg w-8 h-8 flex items-center justify-center mr-3">
254
+ <span class="text-xs font-bold">UC</span>
255
+ </div>
256
+ <div>
257
+ <div class="font-medium">USD/CAD</div>
258
+ <div class="text-slate-500 text-sm">US Dollar / Canadian Dollar</div>
259
+ </div>
260
+ </div>
261
+ </td>
262
+ <td class="px-6 py-4 whitespace-nowrap font-medium">1.3452</td>
263
+ <td class="px-6 py-4 whitespace-nowrap">
264
+ <span class="market-down font-medium">-0.22%</span>
265
+ </td>
266
+ <td class="px-6 py-4 whitespace-nowrap">1.3480</td>
267
+ <td class="px-6 py-4 whitespace-nowrap">1.3425</td>
268
+ <td class="px-6 py-4 whitespace-nowrap">1.76B</td>
269
+ <td class="px-6 py-4 whitespace-nowrap">
270
+ <div class="h-10 w-24">
271
+ <canvas id="usdcad-mini-chart"></canvas>
272
+ </div>
273
+ </td>
274
+ </tr>
275
+ </tbody>
276
+ </table>
277
+ </div>
278
+ </div>
279
+
280
+ <!-- Economic Calendar -->
281
+ <div class="mt-12">
282
+ <h2 class="text-2xl font-bold mb-6">Economic Calendar</h2>
283
+ <div class="card-gradient rounded-xl p-6">
284
+ <div class="overflow-x-auto">
285
+ <table class="min-w-full divide-y divide-slate-700">
286
+ <thead class="bg-slate-800">
287
+ <tr>
288
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-slate-400 uppercase tracking-wider">Time</th>
289
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-slate-400 uppercase tracking-wider">Currency</th>
290
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-slate-400 uppercase tracking-wider">Event</th>
291
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-slate-400 uppercase tracking-wider">Actual</th>
292
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-slate-400 uppercase tracking-wider">Forecast</th>
293
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-slate-400 uppercase tracking-wider">Previous</th>
294
+ </tr>
295
+ </thead>
296
+ <tbody class="divide-y divide-slate-800">
297
+ <tr class="table-row">
298
+ <td class="px-6 py-4 whitespace-nowrap">08:30 AM</td>
299
+ <td class="px-6 py-4 whitespace-nowrap">
300
+ <div class="flex items-center">
301
+ <div class="bg-slate-800 rounded w-6 h-6 flex items-center justify-center mr-2">
302
+ <span class="text-xs">USD</span>
303
+ </div>
304
+ USD
305
+ </div>
306
+ </td>
307
+ <td class="px-6 py-4">Non-Farm Payrolls</td>
308
+ <td class="px-6 py-4 font-medium">250K</td>
309
+ <td class="px-6 py-4">200K</td>
310
+ <td class="px-6 py-4">190K</td>
311
+ </tr>
312
+ <tr class="table-row">
313
+ <td class="px-6 py-4 whitespace-nowrap">10:00 AM</td>
314
+ <td class="px-6 py-4 whitespace-nowrap">
315
+ <div class="flex items-center">
316
+ <div class="bg-slate-800 rounded w-6 h-6 flex items-center justify-center mr-2">
317
+ <span class="text-xs">EUR</span>
318
+ </div>
319
+ EUR
320
+ </div>
321
+ </td>
322
+ <td class="px-6 py-4">ECB Interest Rate Decision</td>
323
+ <td class="px-6 py-4 font-medium">3.50%</td>
324
+ <td class="px-6 py-4">3.50%</td>
325
+ <td class="px-6 py-4">3.50%</td>
326
+ </tr>
327
+ <tr class="table-row">
328
+ <td class="px-6 py-4 whitespace-nowrap">02:00 PM</td>
329
+ <td class="px-6 py-4 whitespace-nowrap">
330
+ <div class="flex items-center">
331
+ <div class="bg-slate-800 rounded w-6 h-6 flex items-center justify-center mr-2">
332
+ <span class="text-xs">USD</span>
333
+ </div>
334
+ USD
335
+ </div>
336
+ </td>
337
+ <td class="px-6 py-4">ISM Manufacturing PMI</td>
338
+ <td class="px-6 py-4 font-medium">52.6</td>
339
+ <td class="px-6 py-4">51.8</td>
340
+ <td class="px-6 py-4">51.5</td>
341
+ </tr>
342
+ </tbody>
343
+ </table>
344
+ </div>
345
+ </div>
346
+ </div>
347
+ </div>
348
+
349
+ <!-- Footer -->
350
+ <footer class="bg-slate-800 border-t border-slate-700 mt-12">
351
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
352
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
353
+ <div>
354
+ <div class="flex items-center mb-4">
355
+ <i data-feather="trending-up" class="text-emerald-500 mr-2"></i>
356
+ <span class="font-bold text-xl">ForexMind</span>
357
+ </div>
358
+ <p class="text-slate-400 mb-4">Advanced forex analysis and educational platform for traders of all levels.</p>
359
+ <div class="flex space-x-4">
360
+ <a href="#" class="text-slate-400 hover:text-white">
361
+ <i data-feather="twitter"></i>
362
+ </a>
363
+ <a href="#" class="text-slate-400 hover:text-white">
364
+ <i data-feather="facebook"></i>
365
+ </a>
366
+ <a href="#" class="text-slate-400 hover:text-white">
367
+ <i data-feather="linkedin"></i>
368
+ </a>
369
+ </div>
370
+ </div>
371
+ <div>
372
+ <h3 class="text-lg font-semibold mb-4">Platform</h3>
373
+ <ul class="space-y-2">
374
+ <li><a href="index.html" class="text-slate-400 hover:text-white">Dashboard</a></li>
375
+ <li><a href="#" class="text-slate-400 hover:text-white">Market Analysis</a></li>
376
+ <li><a href="#" class="text-slate-400 hover:text-white">Educational Resources</a></li>
377
+ <li><a href="market-data.html" class="text-slate-400 hover:text-white">Market Data</a></li>
378
+ <li><a href="#" class="text-slate-400 hover:text-white">Trading Simulator</a></li>
379
+ </ul>
380
+ </div>
381
+ <div>
382
+ <h3 class="text-lg font-semibold mb-4">Resources</h3>
383
+ <ul class="space-y-2">
384
+ <li><a href="#" class="text-slate-400 hover:text-white">Trading Courses</a></li>
385
+ <li><a href="#" class="text-slate-400 hover:text-white">Glossary</a></li>
386
+ <li><a href="#" class="text-slate-400 hover:text-white">Webinars</a></li>
387
+ <li><a href="#" class="text-slate-400 hover:text-white">Blog</a></li>
388
+ <li><a href="#" class="text-slate-400 hover:text-white">Support</a></li>
389
+ </ul>
390
+ </div>
391
+ <div>
392
+ <h3 class="text-lg font-semibold mb-4">Legal</h3>
393
+ <ul class="space-y-2">
394
+ <li><a href="#" class="text-slate-400 hover:text-white">Privacy Policy</a></li>
395
+ <li><a href="#" class="text-slate-400 hover:text-white">Terms of Service</a></li>
396
+ <li><a href="#" class="text-slate-400 hover:text-white">Risk Disclosure</a></li>
397
+ <li><a href="#" class="text-slate-400 hover:text-white">Disclaimer</a></li>
398
+ </ul>
399
+ </div>
400
+ </div>
401
+ <div class="border-t border-slate-700 mt-8 pt-8 text-center text-slate-500">
402
+ <p>© 2023 ForexMind. All rights reserved. Trading involves substantial risk of loss.</p>
403
+ </div>
404
+ </div>
405
+ </footer>
406
+
407
+ <script>
408
+ // Initialize Feather Icons
409
+ feather.replace();
410
+
411
+ // Initialize mini charts
412
+ document.addEventListener('DOMContentLoaded', function() {
413
+ // EUR/USD mini chart
414
+ const ctx1 = document.getElementById('eurusd-mini-chart').getContext('2d');
415
+ new Chart(ctx1, {
416
+ type: 'line',
417
+ data: {
418
+ labels: ['9:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00'],
419
+ datasets: [{
420
+ data: [1.0812, 1.0825, 1.0830, 1.0838, 1.0840, 1.0845, 1.0842],
421
+ borderColor: '#10b981',
422
+ borderWidth: 2,
423
+ pointRadius: 0,
424
+ fill: false,
425
+ tension: 0.4
426
+ }]
427
+ },
428
+ options: {
429
+ responsive: true,
430
+ maintainAspectRatio: false,
431
+ plugins: {
432
+ legend: {
433
+ display: false
434
+ }
435
+ },
436
+ scales: {
437
+ x: {
438
+ display: false
439
+ },
440
+ y: {
441
+ display: false
442
+ }
443
+ }
444
+ }
445
+ });
446
+
447
+ // GBP/USD mini chart
448
+ const ctx2 = document.getElementById('gbpusd-mini-chart').getContext('2d');
449
+ new Chart(ctx2, {
450
+ type: 'line',
451
+ data: {
452
+ labels: ['9:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00'],
453
+ datasets: [{
454
+ data: [1.2750, 1.2742, 1.2738, 1.2735, 1.2730, 1.2725, 1.2728],
455
+ borderColor: '#ef4444',
456
+ borderWidth: 2,
457
+ pointRadius: 0,
458
+ fill: false,
459
+ tension: 0.4
460
+ }]
461
+ },
462
+ options: {
463
+ responsive: true,
464
+ maintainAspectRatio: false,
465
+ plugins: {
466
+ legend: {
467
+ display: false
468
+ }
469
+ },
470
+ scales: {
471
+ x: {
472
+ display: false
473
+ },
474
+ y: {
475
+ display: false
476
+ }
477
+ }
478
+ }
479
+ });
480
+
481
+ // USD/JPY mini chart
482
+ const ctx3 = document.getElementById('usdjpy-mini-chart').getContext('2d');
483
+ new Chart(ctx3, {
484
+ type: 'line',
485
+ data: {
486
+ labels: ['9:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00'],
487
+ datasets: [{
488
+ data: [151.20, 151.35, 151.50, 151.65, 151.72, 151.80, 151.85],
489
+ borderColor: '#10b981',
490
+ borderWidth: 2,
491
+ pointRadius: 0,
492
+ fill: false,
493
+ tension: 0.4
494
+ }]
495
+ },
496
+ options: {
497
+ responsive: true,
498
+ maintainAspectRatio: false,
499
+ plugins: {
500
+ legend: {
501
+ display: false
502
+ }
503
+ },
504
+ scales: {
505
+ x: {
506
+ display: false
507
+ },
508
+ y: {
509
+ display: false
510
+ }
511
+ }
512
+ }
513
+ });
514
+
515
+ // USD/CHF mini chart
516
+ const ctx4 = document.getElementById('usdchf-mini-chart').getContext('2d');
517
+ new Chart(ctx4, {
518
+ type: 'line',
519
+ data: {
520
+ labels: ['9:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00'],
521
+ datasets: [{
522
+ data: [0.9130, 0.9128, 0.9126, 0.9125, 0.9124, 0.9123, 0.9124],
523
+ borderColor: '#ef4444',
524
+ borderWidth: 2,
525
+ pointRadius: 0,
526
+ fill: false,
527
+ tension: 0.4
528
+ }]
529
+ },
530
+ options: {
531
+ responsive: true,
532
+ maintainAspectRatio: false,
533
+ plugins: {
534
+ legend: {
535
+ display: false
536
+ }
537
+ },
538
+ scales: {
539
+ x: {
540
+ display: false
541
+ },
542
+ y: {
543
+ display: false
544
+ }
545
+ }
546
+ }
547
+ });
548
+
549
+ // AUD/USD mini chart
550
+ const ctx5 = document.getElementById('audusd-mini-chart').getContext('2d');
551
+ new Chart(ctx5, {
552
+ type: 'line',
553
+ data: {
554
+ labels: ['9:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00'],
555
+ datasets: [{
556
+ data: [0.6505, 0.6512, 0.6518, 0.6522, 0.6525, 0.6527, 0.6528],
557
+ borderColor: '#10b981',
558
+ borderWidth: 2,
559
+ pointRadius: 0,
560
+ fill: false,
561
+ tension: 0.4
562
+ }]
563
+ },
564
+ options: {
565
+ responsive: true,
566
+ maintainAspectRatio: false,
567
+ plugins: {
568
+ legend: {
569
+ display: false
570
+ }
571
+ },
572
+ scales: {
573
+ x: {
574
+ display: false
575
+ },
576
+ y: {
577
+ display: false
578
+ }
579
+ }
580
+ }
581
+ });
582
+
583
+ // USD/CAD mini chart
584
+ const ctx6 = document.getElementById('usdcad-mini-chart').getContext('2d');
585
+ new Chart(ctx6, {
586
+ type: 'line',
587
+ data: {
588
+ labels: ['9:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00'],
589
+ datasets: [{
590
+ data: [1.3480, 1.3472, 1.3465, 1.3458, 1.3455, 1.3453, 1.3452],
591
+ borderColor: '#ef4444',
592
+ borderWidth: 2,
593
+ pointRadius: 0,
594
+ fill: false,
595
+ tension: 0.4
596
+ }]
597
+ },
598
+ options: {
599
+ responsive: true,
600
+ maintainAspectRatio: false,
601
+ plugins: {
602
+ legend: {
603
+ display: false
604
+ }
605
+ },
606
+ scales: {
607
+ x: {
608
+ display: false
609
+ },
610
+ y: {
611
+ display: false
612
+ }
613
+ }
614
+ }
615
+ });
616
+ });
617
+ </script>
618
+ </body>
619
+ </html>