Hugging Face's logo

Spaces:
halil339
/
redefined-trading
Running

App Files Community
halil339 commited on
Commit
fe2841d
·
verified ·
1 Parent(s): feedf06

اضهر الرسم البياني

Browse files
Files changed (3) hide show
  1. index.html +11 -40
  2. markets.html +94 -0
  3. trading.html +3 -4
index.html CHANGED
@@ -49,9 +49,10 @@
49
  }
50
  }
51
  </style>
 
52
  </head>
53
  <body class="bg-gray-50 text-gray-900">
54
- <!-- Header -->
55
  <header class="bg-white shadow-sm sticky top-0 z-50">
56
  <div class="container mx-auto px-4">
57
  <div class="flex justify-between items-center py-4">
@@ -102,44 +103,15 @@
102
  </button>
103
  </div>
104
  </div>
105
- <div class="md:w-1/2 flex justify-center">
106
- <div class="relative">
107
- <div class="w-80 h-80 bg-red-500 rounded-full opacity-20 absolute -top-10 -right-10"></div>
108
- <div class="relative bg-gray-800 rounded-2xl shadow-2xl p-6 w-full max-w-md">
109
- <div class="flex justify-between items-center mb-6">
110
- <h3 class="text-xl font-bold">الأسواق الحالية</h3>
111
- <span class="text-green-500 font-bold">مباشر</span>
112
- </div>
113
- <div class="space-y-4">
114
- <div class="flex justify-between items-center pb-4 border-b border-gray-700">
115
- <div>
116
- <h4 class="font-bold">EUR/USD</h4>
117
- <p class="text-gray-400 text-sm">اليورو مقابل الدولار</p>
118
- </div>
119
- <div class="text-right">
120
- <p class="font-bold">1.1234</p>
121
- <p class="text-green-500">+0.25%</p>
122
- </div>
123
- </div>
124
- <div class="flex justify-between items-center pb-4 border-b border-gray-700">
125
- <div>
126
- <h4 class="font-bold">BTC/USD</h4>
127
- <p class="text-gray-400 text-sm">البيتكوين</p>
128
- </div>
129
- <div class="text-right">
130
- <p class="font-bold">42,350</p>
131
- <p class="text-red-500">-1.2%</p>
132
- </div>
133
  </div>
134
- <div class="flex justify-between items-center">
135
- <div>
136
- <h4 class="font-bold">GOLD</h4>
137
- <p class="text-gray-400 text-sm">الذهب</p>
138
- </div>
139
- <div class="text-right">
140
- <p class="font-bold">1,856.20</p>
141
- <p class="text-green-500">+0.8%</p>
142
- </div>
143
  </div>
144
  </div>
145
  </div>
@@ -148,8 +120,7 @@
148
  </div>
149
  </div>
150
  </section>
151
-
152
- <!-- Features Section -->
153
  <section class="py-20 bg-white">
154
  <div class="container mx-auto px-4">
155
  <div class="text-center mb-16">
 
49
  }
50
  }
51
  </style>
52
+ <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
53
  </head>
54
  <body class="bg-gray-50 text-gray-900">
55
+ <!-- Header -->
56
  <header class="bg-white shadow-sm sticky top-0 z-50">
57
  <div class="container mx-auto px-4">
58
  <div class="flex justify-between items-center py-4">
 
103
  </button>
104
  </div>
105
  </div>
106
+ <div class="md:w-1/2 flex justify-center">
107
+ <div class="relative w-full max-w-2xl">
108
+ <div class="bg-gray-800 rounded-2xl shadow-2xl p-6">
109
+ <div class="flex justify-between items-center mb-6">
110
+ <h3 class="text-xl font-bold">الرسم البياني المباشر</h3>
111
+ <span class="text-green-500 font-bold">مباشر</span>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
112
  </div>
113
+ <div class="chart-container">
114
+ <canvas id="priceChart"></canvas>
 
 
 
 
 
 
 
115
  </div>
116
  </div>
117
  </div>
 
120
  </div>
121
  </div>
122
  </section>
123
+ <!-- Features Section -->
 
124
  <section class="py-20 bg-white">
125
  <div class="container mx-auto px-4">
126
  <div class="text-center mb-16">
markets.html ADDED
@@ -0,0 +1,94 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ ```html
2
+ <!DOCTYPE html>
3
+ <html lang="ar" dir="rtl">
4
+ <head>
5
+ <meta charset="UTF-8">
6
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
+ <title>الأسواق - Redefined Trading</title>
8
+ <script src="https://cdn.tailwindcss.com"></script>
9
+ <link href="https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700&display=swap" rel="stylesheet">
10
+ <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
11
+ <script>
12
+ tailwind.config = {
13
+ theme: {
14
+ extend: {
15
+ colors: {
16
+ primary: '#EF4444', // red-500
17
+ },
18
+ fontFamily: {
19
+ 'tajawal': ['Tajawal', 'sans-serif']
20
+ }
21
+ }
22
+ }
23
+ }
24
+ </script>
25
+ <style>
26
+ body {
27
+ font-family: 'Tajawal', sans-serif;
28
+ }
29
+ .market-card:hover {
30
+ transform: translateY(-5px);
31
+ box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
32
+ }
33
+ .chart-container {
34
+ height: 400px;
35
+ }
36
+ </style>
37
+ </head>
38
+ <body class="bg-gray-50 text-gray-900">
39
+ <!-- Header -->
40
+ <header class="bg-white shadow-sm sticky top-0 z-50">
41
+ <div class="container mx-auto px-4">
42
+ <div class="flex justify-between items-center py-4">
43
+ <div class="flex items-center space-x-2">
44
+ <div class="w-10 h-10 rounded-full bg-red-500 flex items-center justify-center">
45
+ <span class="text-white font-bold">RT</span>
46
+ </div>
47
+ <span class="text-xl font-bold text-gray-900">Redefined Trading</span>
48
+ </div>
49
+
50
+ <nav class="hidden md:flex space-x-8">
51
+ <a href="index.html" class="text-gray-700 hover:text-red-500 font-medium">الرئيسية</a>
52
+ <a href="trading.html" class="text-gray-700 hover:text-red-500 font-medium">منصة التداول</a>
53
+ <a href="#" class="text-red-500 font-medium">الأسواق</a>
54
+ <a href="#" class="text-gray-700 hover:text-red-500 font-medium">المنتجات</a>
55
+ <a href="#" class="text-gray-700 hover:text-red-500 font-medium">التحليلات</a>
56
+ <a href="#" class="text-gray-700 hover:text-red-500 font-medium">الدعم</a>
57
+ </nav>
58
+
59
+ <div class="flex items-center space-x-4">
60
+ <button class="hidden md:block text-gray-700 hover:text-red-500 font-medium">تسجيل الدخول</button>
61
+ <button class="bg-red-500 hover:bg-red-600 text-white px-6 py-2 rounded-lg font-medium transition duration-300">ابدأ التداول</button>
62
+ <button class="md:hidden text-gray-700">
63
+ <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
64
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
65
+ </svg>
66
+ </button>
67
+ </div>
68
+ </div>
69
+ </div>
70
+ </header>
71
+
72
+ <!-- Markets Section -->
73
+ <section class="py-20">
74
+ <div class="container mx-auto px-4">
75
+ <div class="text-center mb-16">
76
+ <h1 class="text-3xl md:text-4xl font-bold mb-4">الأسواق المتاحة</h1>
77
+ <p class="text-gray-600 max-w-2xl mx-auto">تداول في أكثر من 300 أداة مالية مختلفة</p>
78
+ </div>
79
+
80
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8 mb-16">
81
+ <div class="market-card bg-white p-8 rounded-xl shadow-md transition duration-300">
82
+ <div class="flex items-center mb-4">
83
+ <div class="w-12 h-12 rounded-full bg-blue-100 flex items-center justify-center mr-4">
84
+ <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 text-blue-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
85
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
86
+ </svg>
87
+ </div>
88
+ <h3 class="text-xl font-bold">العملات الأجنبية</h3>
89
+ </div>
90
+ <p class="text-gray-600 mb-4">تداول في أكثر من 70 زوج عملة مع فروقات أسعار تنافسية</p>
91
+ <ul class="text-gray-700 space-y-2">
92
+ <li class="flex items-center">
93
+ <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-green-500 mr-2" viewBox="0 0 20 20" fill="currentColor">
94
+ <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm
trading.html CHANGED
@@ -47,7 +47,7 @@
47
  </style>
48
  </head>
49
  <body class="bg-gray-50 text-gray-900">
50
- <!-- Header -->
51
  <header class="bg-white shadow-sm sticky top-0 z-50">
52
  <div class="container mx-auto px-4">
53
  <div class="flex justify-between items-center py-4">
@@ -61,7 +61,7 @@
61
  <nav class="hidden md:flex space-x-8">
62
  <a href="index.html" class="text-gray-700 hover:text-red-500 font-medium">الرئيسية</a>
63
  <a href="#" class="text-red-500 font-medium">منصة التداول</a>
64
- <a href="markets.html" class="text-gray-700 hover:text-red-500 font-medium">الأسواق</a>
65
  <a href="#" class="text-gray-700 hover:text-red-500 font-medium">المنتجات</a>
66
  <a href="#" class="text-gray-700 hover:text-red-500 font-medium">التحليلات</a>
67
  <a href="#" class="text-gray-700 hover:text-red-500 font-medium">الدعم</a>
@@ -79,8 +79,7 @@
79
  </div>
80
  </div>
81
  </header>
82
-
83
- <!-- Trading Interface -->
84
  <div class="trading-interface container mx-auto px-4 py-6">
85
  <div class="flex flex-col lg:flex-row gap-6 h-full">
86
  <!-- Market List Sidebar -->
 
47
  </style>
48
  </head>
49
  <body class="bg-gray-50 text-gray-900">
50
+ <!-- Header -->
51
  <header class="bg-white shadow-sm sticky top-0 z-50">
52
  <div class="container mx-auto px-4">
53
  <div class="flex justify-between items-center py-4">
 
61
  <nav class="hidden md:flex space-x-8">
62
  <a href="index.html" class="text-gray-700 hover:text-red-500 font-medium">الرئيسية</a>
63
  <a href="#" class="text-red-500 font-medium">منصة التداول</a>
64
+ <a href="#" class="text-gray-700 hover:text-red-500 font-medium">الأسواق</a>
65
  <a href="#" class="text-gray-700 hover:text-red-500 font-medium">المنتجات</a>
66
  <a href="#" class="text-gray-700 hover:text-red-500 font-medium">التحليلات</a>
67
  <a href="#" class="text-gray-700 hover:text-red-500 font-medium">الدعم</a>
 
79
  </div>
80
  </div>
81
  </header>
82
+ <!-- Trading Interface -->
 
83
  <div class="trading-interface container mx-auto px-4 py-6">
84
  <div class="flex flex-col lg:flex-row gap-6 h-full">
85
  <!-- Market List Sidebar -->