joermd commited on
Commit
5c92939
·
verified ·
1 Parent(s): 853d214

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +6 -49
index.html CHANGED
@@ -14,36 +14,12 @@
14
  height: 100vh;
15
  background-color: #f0f0f0;
16
  }
17
- .sidebar {
18
- width: 260px;
19
- background-color: #ffffff;
20
- padding: 20px;
21
- display: flex;
22
- flex-direction: column;
23
- border-left: 1px solid #e0e0e0;
24
- overflow-y: auto;
25
- }
26
- .logo {
27
- font-size: 28px;
28
- font-weight: bold;
29
- margin-bottom: 20px;
30
- text-align: center;
31
- color: #333;
32
- }
33
- .menu-item {
34
- padding: 10px;
35
- margin-bottom: 5px;
36
- cursor: pointer;
37
- border-radius: 5px;
38
- }
39
- .menu-item:hover {
40
- background-color: #f0f0f0;
41
- }
42
  .main-content {
43
  flex-grow: 1;
44
  display: flex;
45
  flex-direction: column;
46
  padding: 20px;
 
47
  }
48
  .header {
49
  display: flex;
@@ -68,6 +44,9 @@
68
  border-radius: 15px;
69
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
70
  overflow: hidden;
 
 
 
71
  }
72
  .messages {
73
  flex: 1;
@@ -123,13 +102,14 @@
123
  display: flex;
124
  justify-content: center;
125
  margin-top: 20px;
 
 
126
  }
127
  .action-button {
128
  background-color: #f0f0f0;
129
  color: #333;
130
  border: 1px solid #e0e0e0;
131
  padding: 10px 15px;
132
- margin: 0 5px;
133
  border-radius: 5px;
134
  cursor: pointer;
135
  }
@@ -141,11 +121,6 @@
141
  margin-top: 20px;
142
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
143
  }
144
- @media (max-width: 768px) {
145
- .sidebar {
146
- display: none;
147
- }
148
- }
149
  .loading {
150
  display: none;
151
  text-align: center;
@@ -157,17 +132,6 @@
157
  </style>
158
  </head>
159
  <body>
160
- <div class="sidebar">
161
- <div class="logo">سبيدي</div>
162
- <div class="menu-item"><i class="fas fa-comment-alt"></i> سبيدي</div>
163
- <div class="menu-item"><i class="fas fa-compass"></i> استكشاف الخدمات</div>
164
- <div class="menu-item">أمس</div>
165
- <div class="menu-item">منصات ذكاء اصطناعي بديلة</div>
166
- <div class="menu-item">تقييم تلخيص النصوص</div>
167
- <div class="menu-item">الأيام السبعة الماضية</div>
168
- <div class="menu-item">إلغاء وضع السكون ويندوز</div>
169
- </div>
170
-
171
  <div class="main-content">
172
  <div class="header">
173
  <div class="header-title">سبيدي</div>
@@ -197,7 +161,6 @@
197
  </div>
198
 
199
  <script>
200
- // إضافة متغير للتحكم في حالة الإرسال
201
  let isSending = false;
202
 
203
  async function sendMessage() {
@@ -208,15 +171,12 @@
208
  if (message !== '') {
209
  isSending = true;
210
 
211
- // إظهار الرسالة في الشات
212
  appendMessage('user-message', message);
213
  input.value = '';
214
 
215
- // إظهار مؤشر التحميل
216
  document.getElementById('loading').classList.add('visible');
217
 
218
  try {
219
- // إرسال الرسالة إلى Python/Streamlit
220
  const response = await fetch('/_stcore/message', {
221
  method: 'POST',
222
  headers: {
@@ -234,7 +194,6 @@
234
  } catch (error) {
235
  appendMessage('bot-message', 'عذراً، حدث خطأ في الاتصال.');
236
  } finally {
237
- // إخفاء مؤشر التحميل وإعادة تعيين حالة الإرسال
238
  document.getElementById('loading').classList.remove('visible');
239
  isSending = false;
240
  }
@@ -261,7 +220,6 @@
261
  sendMessage();
262
  }
263
 
264
- // دالة لإضافة رسالة ترحيب عند تحميل الصفحة
265
  function initializeMessages() {
266
  var today = new Date();
267
  var hour = today.getHours();
@@ -269,7 +227,6 @@
269
  appendMessage('bot-message', `أهلاً بك، ${greeting}! كيف يمكنني مساعدتك اليوم؟`);
270
  }
271
 
272
- // استدعاء دالة التهيئة عند تحميل الصفحة
273
  window.onload = initializeMessages;
274
  </script>
275
  </body>
 
14
  height: 100vh;
15
  background-color: #f0f0f0;
16
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
17
  .main-content {
18
  flex-grow: 1;
19
  display: flex;
20
  flex-direction: column;
21
  padding: 20px;
22
+ width: 100%;
23
  }
24
  .header {
25
  display: flex;
 
44
  border-radius: 15px;
45
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
46
  overflow: hidden;
47
+ margin: 0 auto;
48
+ width: 100%;
49
+ max-width: 1200px;
50
  }
51
  .messages {
52
  flex: 1;
 
102
  display: flex;
103
  justify-content: center;
104
  margin-top: 20px;
105
+ flex-wrap: wrap;
106
+ gap: 10px;
107
  }
108
  .action-button {
109
  background-color: #f0f0f0;
110
  color: #333;
111
  border: 1px solid #e0e0e0;
112
  padding: 10px 15px;
 
113
  border-radius: 5px;
114
  cursor: pointer;
115
  }
 
121
  margin-top: 20px;
122
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
123
  }
 
 
 
 
 
124
  .loading {
125
  display: none;
126
  text-align: center;
 
132
  </style>
133
  </head>
134
  <body>
 
 
 
 
 
 
 
 
 
 
 
135
  <div class="main-content">
136
  <div class="header">
137
  <div class="header-title">سبيدي</div>
 
161
  </div>
162
 
163
  <script>
 
164
  let isSending = false;
165
 
166
  async function sendMessage() {
 
171
  if (message !== '') {
172
  isSending = true;
173
 
 
174
  appendMessage('user-message', message);
175
  input.value = '';
176
 
 
177
  document.getElementById('loading').classList.add('visible');
178
 
179
  try {
 
180
  const response = await fetch('/_stcore/message', {
181
  method: 'POST',
182
  headers: {
 
194
  } catch (error) {
195
  appendMessage('bot-message', 'عذراً، حدث خطأ في الاتصال.');
196
  } finally {
 
197
  document.getElementById('loading').classList.remove('visible');
198
  isSending = false;
199
  }
 
220
  sendMessage();
221
  }
222
 
 
223
  function initializeMessages() {
224
  var today = new Date();
225
  var hour = today.getHours();
 
227
  appendMessage('bot-message', `أهلاً بك، ${greeting}! كيف يمكنني مساعدتك اليوم؟`);
228
  }
229
 
 
230
  window.onload = initializeMessages;
231
  </script>
232
  </body>