Hugging Face's logo

Spaces:
luigi12345
/
Hospital_AI_Proposal
Running

App Files Community
Sami commited on
Commit
2a4bceb
·
1 Parent(s): fff3ce7

Update main structure and styling

Browse files
Files changed (2) hide show
  1. README.md +34 -10
  2. index.html +308 -1
README.md CHANGED
@@ -1,10 +1,34 @@
1
- ---
2
- title: Hospital AI Proposal
3
- emoji: 📊
4
- colorFrom: blue
5
- colorTo: gray
6
- sdk: static
7
- pinned: false
8
- ---
9
-
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ # Hospital AI Proposals
2
+
3
+ A bilingual (Spanish/English) web platform for AI implementation proposals in healthcare systems.
4
+
5
+ ## Project Structure
6
+
7
+ ```
8
+ .
9
+ ├── index.html # Main landing page
10
+ ├── proposals/ # Proposal documents
11
+ │ ├── 12-octubre-proposal.html
12
+ │ ├── spanish-hospital-proposal.html
13
+ │ ├── nhs-detailed-proposal.html
14
+ │ └── nhs-formal-proposal.html
15
+ ├── docs/ # Documentation
16
+ │ ├── spanish-hospital-context.txt
17
+ │ ├── requirements-conversation.txt
18
+ │ └── requirements-conversation.py
19
+ └── assets/ # Static assets (images, etc.)
20
+ ```
21
+
22
+ ## Features
23
+
24
+ - Bilingual support (Spanish/English)
25
+ - Responsive design with Tailwind CSS
26
+ - Interactive language switching
27
+ - Search functionality
28
+ - Modern UI with hover effects and animations
29
+
30
+ ## Setup
31
+
32
+ 1. Clone the repository
33
+ 2. Open index.html in a modern web browser
34
+ 3. No build process required - uses CDN for dependencies
index.html CHANGED
@@ -1 +1,308 @@
1
- <!DOCTYPE html><html><head><title>Hospital AI Proposals</title><link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet"></head><body class="bg-gray-900 text-white p-8"><div class="max-w-4xl mx-auto"><h1 class="text-4xl font-bold mb-8">Hospital AI Proposals</h1><div class="grid gap-8"><div class="bg-gray-800 p-6 rounded"><h2 class="text-2xl mb-4">Proposals</h2><ul class="space-y-2"><li><a href="proposals/spanish-hospital-proposal.html" class="text-blue-400">Spanish Hospital Proposal</a></li><li><a href="proposals/nhs-detailed-proposal.html" class="text-blue-400">NHS Detailed Proposal</a></li><li><a href="proposals/nhs-formal-proposal.html" class="text-blue-400">NHS Formal Proposal</a></li></ul></div><div class="bg-gray-800 p-6 rounded"><h2 class="text-2xl mb-4">Documentation</h2><ul class="space-y-2"><li><a href="docs/spanish-hospital-context.txt" class="text-blue-400">Spanish Hospital Context</a></li><li><a href="docs/requirements-conversation.py" class="text-blue-400">Requirements Analysis</a></li></ul></div></div></div></body></html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="es">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <meta name="theme-color" content="#000000">
7
+ <meta name="description" content="Instituto IA para Salud - Transformando el futuro de la medicina con inteligencia artificial">
8
+ <meta name="keywords" content="IA médica, salud, inteligencia artificial, medicina, diagnóstico">
9
+ <title>Instituto IA para Salud | Innovación en Medicina</title>
10
+
11
+ <!-- Enhanced UI Libraries -->
12
+ <link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
13
+ <link href="https://cdn.jsdelivr.net/npm/daisyui@2.6.0/dist/full.css" rel="stylesheet">
14
+ <link href="https://cdn.jsdelivr.net/npm/@materializecss/materialize@2.0.1-alpha/dist/css/materialize.min.css" rel="stylesheet">
15
+ <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
16
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css">
17
+
18
+ <!-- Modern Fonts -->
19
+ <link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@200;400;500;700&family=Space+Grotesk:wght@300;400;500;600;700&display=swap" rel="stylesheet">
20
+
21
+ <!-- Interactive Components -->
22
+ <script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
23
+ <script src="https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.min.js"></script>
24
+ <script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script>
25
+ <script src="https://cdn.jsdelivr.net/npm/@materializecss/materialize@2.0.1-alpha/dist/js/materialize.min.js"></script>
26
+
27
+ <!-- Minimal Custom Styles -->
28
+ <style>
29
+ .nav-link:hover {
30
+ transform: translateY(-2px);
31
+ transition: all 0.2s;
32
+ }
33
+ .card {
34
+ transition: all 0.3s ease;
35
+ }
36
+ .card:hover {
37
+ transform: translateY(-4px);
38
+ box-shadow: 0 10px 25px rgba(0,0,0,0.3);
39
+ }
40
+ [lang="en"] { display: none; }
41
+ .lang-en [lang="en"] { display: block; }
42
+ .lang-en [lang="es"] { display: none; }
43
+
44
+ /* Document Reader Styles */
45
+ .doc-reader {
46
+ width: 100%;
47
+ height: 800px;
48
+ border: none;
49
+ border-radius: 10px;
50
+ box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
51
+ background: white;
52
+ }
53
+
54
+ .doc-section {
55
+ padding: 2rem;
56
+ margin: 2rem 0;
57
+ background: rgba(255, 255, 255, 0.05);
58
+ border-radius: 10px;
59
+ backdrop-filter: blur(10px);
60
+ }
61
+
62
+ .doc-card {
63
+ cursor: pointer;
64
+ transition: all 0.3s ease;
65
+ }
66
+
67
+ .doc-card:hover {
68
+ transform: translateY(-5px);
69
+ }
70
+
71
+ .doc-viewer {
72
+ display: none;
73
+ position: fixed;
74
+ top: 0;
75
+ left: 0;
76
+ width: 100%;
77
+ height: 100%;
78
+ background: rgba(0, 0, 0, 0.9);
79
+ z-index: 1000;
80
+ padding: 2rem;
81
+ }
82
+
83
+ .doc-viewer.active {
84
+ display: block;
85
+ }
86
+
87
+ .doc-viewer iframe {
88
+ width: 100%;
89
+ height: 100%;
90
+ border: none;
91
+ border-radius: 10px;
92
+ background: white;
93
+ }
94
+
95
+ .doc-viewer .close-btn {
96
+ position: absolute;
97
+ top: 1rem;
98
+ right: 1rem;
99
+ color: white;
100
+ font-size: 2rem;
101
+ cursor: pointer;
102
+ }
103
+ </style>
104
+ </head>
105
+ <body class="bg-gradient-to-br from-gray-900 to-gray-800 text-white min-h-screen" data-language="es">
106
+ <nav class="bg-gray-800 bg-opacity-90 p-4 sticky top-0 z-50 shadow-lg">
107
+ <div class="max-w-6xl mx-auto flex flex-wrap justify-between items-center">
108
+ <a href="/" class="text-2xl font-bold text-blue-400">
109
+ <span lang="es">IA Hospital Hub</span>
110
+ <span lang="en">Hospital AI Hub</span>
111
+ </a>
112
+ <div class="flex items-center space-x-6">
113
+ <button onclick="toggleLanguage()" class="bg-blue-500 px-3 py-1 rounded-full text-sm hover:bg-blue-600">
114
+ <span lang="es">EN</span>
115
+ <span lang="en">ES</span>
116
+ </button>
117
+ <a href="#proposals" class="nav-link hover:text-blue-400">
118
+ <span lang="es">Propuestas</span>
119
+ <span lang="en">Proposals</span>
120
+ </a>
121
+ <a href="#docs" class="nav-link hover:text-blue-400">
122
+ <span lang="es">Documentación</span>
123
+ <span lang="en">Documentation</span>
124
+ </a>
125
+ <a href="paper.html" class="nav-link hover:text-blue-400">
126
+ <span lang="es">Paper</span>
127
+ <span lang="en">Paper</span>
128
+ </a>
129
+ </div>
130
+ </div>
131
+ </nav>
132
+
133
+ <div class="max-w-6xl mx-auto p-8">
134
+ <!-- Hero Section -->
135
+ <div class="text-center mb-12">
136
+ <h1 class="text-5xl font-bold mb-4 bg-clip-text text-transparent bg-gradient-to-r from-blue-400 to-purple-500">
137
+ <span lang="es">Propuestas IA Hospital</span>
138
+ <span lang="en">Hospital AI Proposals</span>
139
+ </h1>
140
+ <p class="text-xl text-gray-300 mb-8">
141
+ <span lang="es">Soluciones Integrales de IA para Sanidad</span>
142
+ <span lang="en">Comprehensive AI Solutions for Healthcare</span>
143
+ </p>
144
+ </div>
145
+
146
+ <!-- Main Content -->
147
+ <div class="grid gap-8">
148
+ <!-- Spanish Proposals Section -->
149
+ <div id="proposals" class="bg-gray-800 bg-opacity-50 p-8 rounded-xl shadow-lg">
150
+ <h2 class="text-3xl font-bold mb-6 text-blue-400">
151
+ <span lang="es">Propuestas</span>
152
+ <span lang="en">Proposals</span>
153
+ </h2>
154
+ <div class="grid md:grid-cols-2 gap-6">
155
+ <a href="proposals/12-octubre-proposal.html"
156
+ class="card block p-6 bg-gray-700 rounded-lg border border-gray-600">
157
+ <div class="flex items-center mb-4">
158
+ <span class="text-blue-400 text-2xl mr-3">🏥</span>
159
+ <h3 class="text-xl font-bold">Hospital 12 de Octubre</h3>
160
+ </div>
161
+ <p class="text-gray-300">
162
+ <span lang="es">Propuesta específica para el Hospital 12 de Octubre</span>
163
+ <span lang="en">Specific proposal for Hospital 12 de Octubre</span>
164
+ </p>
165
+ <div class="mt-4 text-sm text-blue-400">
166
+ <span lang="es">Ver Detalles →</span>
167
+ <span lang="en">View Details →</span>
168
+ </div>
169
+ </a>
170
+ <a href="proposals/spanish-hospital-proposal.html"
171
+ class="card block p-6 bg-gray-700 rounded-lg border border-gray-600">
172
+ <div class="flex items-center mb-4">
173
+ <span class="text-purple-400 text-2xl mr-3">📄</span>
174
+ <h3 class="text-xl font-bold">
175
+ <span lang="es">Sistema Sanitario Español</span>
176
+ <span lang="en">Spanish Healthcare System</span>
177
+ </h3>
178
+ </div>
179
+ <p class="text-gray-300">
180
+ <span lang="es">Propuesta general para el sistema sanitario español</span>
181
+ <span lang="en">General proposal for Spanish healthcare system</span>
182
+ </p>
183
+ <div class="mt-4 text-sm text-blue-400">
184
+ <span lang="es">Ver Detalles →</span>
185
+ <span lang="en">View Details →</span>
186
+ </div>
187
+ </a>
188
+ </div>
189
+ </div>
190
+
191
+ <!-- Documentation Section -->
192
+ <div id="docs" class="bg-gray-800 bg-opacity-50 p-8 rounded-xl shadow-lg">
193
+ <h2 class="text-3xl font-bold mb-6 text-purple-400">
194
+ <span lang="es">Documentación</span>
195
+ <span lang="en">Documentation</span>
196
+ </h2>
197
+ <div class="grid md:grid-cols-3 gap-6">
198
+ <div onclick="openDoc('docs/spanish-hospital-context.txt')"
199
+ class="doc-card card block p-6 bg-gray-700 rounded-lg border border-gray-600">
200
+ <div class="flex items-center mb-4">
201
+ <span class="text-yellow-400 text-2xl mr-3">📚</span>
202
+ <h3 class="text-xl font-bold">
203
+ <span lang="es">Contexto Hospitalario</span>
204
+ <span lang="en">Hospital Context</span>
205
+ </h3>
206
+ </div>
207
+ <p class="text-gray-300">
208
+ <span lang="es">Información completa e investigación de fondo</span>
209
+ <span lang="en">Comprehensive background information and research</span>
210
+ </p>
211
+ <div class="mt-4 text-sm text-blue-400">
212
+ <span lang="es">Leer Más →</span>
213
+ <span lang="en">Read More →</span>
214
+ </div>
215
+ </div>
216
+ <div onclick="openDoc('docs/requirements-conversation.txt')"
217
+ class="doc-card card block p-6 bg-gray-700 rounded-lg border border-gray-600">
218
+ <div class="flex items-center mb-4">
219
+ <span class="text-green-400 text-2xl mr-3">⚙️</span>
220
+ <h3 class="text-xl font-bold">
221
+ <span lang="es">Requisitos</span>
222
+ <span lang="en">Requirements</span>
223
+ </h3>
224
+ </div>
225
+ <p class="text-gray-300">
226
+ <span lang="es">Especificaciones técnicas y requisitos del sistema</span>
227
+ <span lang="en">Technical specifications and system requirements</span>
228
+ </p>
229
+ <div class="mt-4 text-sm text-blue-400">
230
+ <span lang="es">Ver Documento →</span>
231
+ <span lang="en">View Document →</span>
232
+ </div>
233
+ </div>
234
+ <div onclick="openDoc('paper.html')"
235
+ class="doc-card card block p-6 bg-gray-700 rounded-lg border border-gray-600">
236
+ <div class="flex items-center mb-4">
237
+ <span class="text-blue-400 text-2xl mr-3">📝</span>
238
+ <h3 class="text-xl font-bold">
239
+ <span lang="es">Paper Completo</span>
240
+ <span lang="en">Full Paper</span>
241
+ </h3>
242
+ </div>
243
+ <p class="text-gray-300">
244
+ <span lang="es">Propuesta detallada y análisis completo</span>
245
+ <span lang="en">Detailed proposal and complete analysis</span>
246
+ </p>
247
+ <div class="mt-4 text-sm text-blue-400">
248
+ <span lang="es">Ver Paper →</span>
249
+ <span lang="en">View Paper →</span>
250
+ </div>
251
+ </div>
252
+ </div>
253
+ </div>
254
+ </div>
255
+ </div>
256
+
257
+ <!-- Document Viewer -->
258
+ <div id="docViewer" class="doc-viewer">
259
+ <i class="fas fa-times close-btn" onclick="closeDoc()"></i>
260
+ <iframe id="docFrame" src=""></iframe>
261
+ </div>
262
+
263
+ <footer class="bg-gray-800 bg-opacity-90 mt-12 py-8 text-center text-gray-400">
264
+ <p>
265
+ <span lang="es">IA Hospital Hub - Transformando la Sanidad con IA</span>
266
+ <span lang="en">Hospital AI Hub - Transforming Healthcare with AI</span>
267
+ </p>
268
+ </footer>
269
+
270
+ <script>
271
+ function toggleLanguage() {
272
+ const body = document.body;
273
+ const currentLang = body.getAttribute('data-language');
274
+ const newLang = currentLang === 'es' ? 'en' : 'es';
275
+ body.setAttribute('data-language', newLang);
276
+ body.classList.toggle('lang-en');
277
+ localStorage.setItem('preferred-language', newLang);
278
+ }
279
+
280
+ // Initialize
281
+ document.addEventListener('DOMContentLoaded', () => {
282
+ const preferredLanguage = localStorage.getItem('preferred-language') || 'es';
283
+ if (preferredLanguage === 'en') {
284
+ document.body.setAttribute('data-language', 'en');
285
+ document.body.classList.add('lang-en');
286
+ }
287
+ });
288
+
289
+ // Document viewer functions
290
+ function openDoc(url) {
291
+ document.getElementById('docFrame').src = url;
292
+ document.getElementById('docViewer').classList.add('active');
293
+ document.body.style.overflow = 'hidden';
294
+ }
295
+
296
+ function closeDoc() {
297
+ document.getElementById('docViewer').classList.remove('active');
298
+ document.getElementById('docFrame').src = '';
299
+ document.body.style.overflow = 'auto';
300
+ }
301
+
302
+ // Close doc viewer on escape key
303
+ document.addEventListener('keydown', (e) => {
304
+ if (e.key === 'Escape') closeDoc();
305
+ });
306
+ </script>
307
+ </body>
308
+ </html>