tinolin commited on
Commit
2c353d9
·
verified ·
1 Parent(s): a89d81a

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +295 -19
  3. prompts.txt +2 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Coco4
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
  ---
2
+ title: coco4
3
+ emoji: 🐳
4
+ colorFrom: pink
5
+ colorTo: pink
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,295 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </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
+ <title>Abogado Especializado</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>
10
+ @keyframes fadeIn {
11
+ from { opacity: 0; transform: translateY(20px); }
12
+ to { opacity: 1; transform: translateY(0); }
13
+ }
14
+
15
+ @keyframes pulse {
16
+ 0% { transform: scale(1); }
17
+ 50% { transform: scale(1.05); }
18
+ 100% { transform: scale(1); }
19
+ }
20
+
21
+ .animate-fade-in {
22
+ animation: fadeIn 0.8s ease-out forwards;
23
+ }
24
+
25
+ .animate-pulse-slow {
26
+ animation: pulse 3s infinite;
27
+ }
28
+
29
+ .menu-content {
30
+ max-height: 0;
31
+ overflow: hidden;
32
+ transition: max-height 0.5s ease-out;
33
+ }
34
+
35
+ .menu-content.open {
36
+ max-height: 500px;
37
+ transition: max-height 0.5s ease-in;
38
+ }
39
+
40
+ .language-selector {
41
+ opacity: 0;
42
+ transform: translateY(-10px);
43
+ transition: all 0.3s ease;
44
+ pointer-events: none;
45
+ }
46
+
47
+ .language-selector.open {
48
+ opacity: 1;
49
+ transform: translateY(0);
50
+ pointer-events: all;
51
+ }
52
+
53
+ .gold-divider {
54
+ height: 2px;
55
+ background: linear-gradient(90deg, rgba(212,175,55,0) 0%, rgba(212,175,55,1) 50%, rgba(212,175,55,0) 100%);
56
+ }
57
+
58
+ .logo-container {
59
+ width: 80px;
60
+ height: 80px;
61
+ display: flex;
62
+ align-items: center;
63
+ justify-content: center;
64
+ margin: 0 auto 20px;
65
+ border-radius: 50%;
66
+ background: rgba(212, 175, 55, 0.1);
67
+ border: 2px solid rgba(212, 175, 55, 0.5);
68
+ }
69
+
70
+ .logo {
71
+ font-size: 40px;
72
+ color: #D4AF37;
73
+ }
74
+ </style>
75
+ </head>
76
+ <body class="bg-black text-white min-h-screen flex flex-col overflow-hidden">
77
+ <!-- Language Selector -->
78
+ <div class="absolute top-4 right-4 z-50">
79
+ <div class="relative">
80
+ <button id="languageBtn" class="bg-black border border-gold-500 text-gold-500 px-3 py-1 rounded-full flex items-center">
81
+ <span id="currentLang">ES</span>
82
+ <i class="fas fa-chevron-down ml-2 text-xs"></i>
83
+ </button>
84
+ <div id="languageDropdown" class="language-selector absolute right-0 mt-2 w-24 bg-black border border-gold-500 rounded-lg shadow-lg">
85
+ <button class="lang-option w-full text-left px-3 py-2 hover:bg-gray-800" data-lang="es">Español</button>
86
+ <button class="lang-option w-full text-left px-3 py-2 hover:bg-gray-800" data-lang="en">English</button>
87
+ <button class="lang-option w-full text-left px-3 py-2 hover:bg-gray-800" data-lang="it">Italiano</button>
88
+ </div>
89
+ </div>
90
+ </div>
91
+
92
+ <!-- Main Content -->
93
+ <div class="container mx-auto px-4 py-8 flex-grow flex flex-col items-center justify-center">
94
+ <!-- Logo -->
95
+ <div class="logo-container animate-fade-in" style="animation-delay: 0.1s;">
96
+ <i class="fas fa-balance-scale logo"></i>
97
+ </div>
98
+
99
+ <!-- Name/Title -->
100
+ <div class="text-center mb-8 animate-fade-in" style="animation-delay: 0.2s;">
101
+ <h1 class="text-4xl md:text-5xl font-bold text-gold-500 mb-2" data-es="Dr. Javier Mendoza" data-en="Dr. Javier Mendoza" data-it="Dott. Javier Mendoza">Dr. Javier Mendoza</h1>
102
+ <div class="gold-divider w-32 mx-auto my-4"></div>
103
+ <p class="text-xl text-gold-300" data-es="Abogado Especializado" data-en="Specialized Lawyer" data-it="Avvocato Specializzato">Abogado Especializado</p>
104
+ </div>
105
+
106
+ <!-- Menu Buttons -->
107
+ <div class="w-full max-w-md space-y-4 mb-8">
108
+ <!-- About Me Button -->
109
+ <div class="menu-item animate-fade-in" style="animation-delay: 0.4s;">
110
+ <button class="menu-btn w-full bg-black border border-gold-500 text-white py-3 px-6 rounded-lg flex justify-between items-center hover:bg-gray-900 transition-colors">
111
+ <span data-es="Sobre Mí" data-en="About Me" data-it="Su di Me">Sobre Mí</span>
112
+ <i class="fas fa-chevron-down transition-transform"></i>
113
+ </button>
114
+ <div class="menu-content bg-gray-900 rounded-b-lg overflow-hidden">
115
+ <div class="p-6">
116
+ <p class="text-gray-300 mb-4" data-es="Más de 15 años de experiencia en derecho corporativo y litigios complejos. Formado en las mejores universidades y con un enfoque centrado en el cliente." data-en="Over 15 years of experience in corporate law and complex litigation. Educated at top universities with a client-centered approach." data-it="Oltre 15 anni di esperienza nel diritto societario e contenziosi complessi. Formato nelle migliori università con un approccio centrato sul cliente.">
117
+ Más de 15 años de experiencia en derecho corporativo y litigios complejos. Formado en las mejores universidades y con un enfoque centrado en el cliente.
118
+ </p>
119
+ <div class="flex space-x-4">
120
+ <div class="flex-1">
121
+ <h3 class="text-gold-400 font-semibold mb-2" data-es="Educación" data-en="Education" data-it="Formazione">Educación</h3>
122
+ <ul class="text-sm text-gray-300 space-y-1">
123
+ <li data-es="• Doctorado en Derecho, Universidad de Madrid" data-en="• PhD in Law, Madrid University" data-it="• Dottorato in Giurisprudenza, Università di Madrid">• Doctorado en Derecho, Universidad de Madrid</li>
124
+ <li data-es="• Máster en Derecho Corporativo" data-en="• Master in Corporate Law" data-it="• Master in Diritto Societario">• Máster en Derecho Corporativo</li>
125
+ </ul>
126
+ </div>
127
+ <div class="flex-1">
128
+ <h3 class="text-gold-400 font-semibold mb-2" data-es="Especialidades" data-en="Specialties" data-it="Specializzazioni">Especialidades</h3>
129
+ <ul class="text-sm text-gray-300 space-y-1">
130
+ <li data-es="• Derecho Corporativo" data-en="• Corporate Law" data-it="• Diritto Societario">• Derecho Corporativo</li>
131
+ <li data-es="• Litigios Complejos" data-en="• Complex Litigation" data-it="• Contenziosi Complessi">• Litigios Complejos</li>
132
+ </ul>
133
+ </div>
134
+ </div>
135
+ </div>
136
+ </div>
137
+ </div>
138
+
139
+ <!-- Experience Button -->
140
+ <div class="menu-item animate-fade-in" style="animation-delay: 0.6s;">
141
+ <button class="menu-btn w-full bg-black border border-gold-500 text-white py-3 px-6 rounded-lg flex justify-between items-center hover:bg-gray-900 transition-colors">
142
+ <span data-es="Trayectoria" data-en="Experience" data-it="Esperienza">Trayectoria</span>
143
+ <i class="fas fa-chevron-down transition-transform"></i>
144
+ </button>
145
+ <div class="menu-content bg-gray-900 rounded-b-lg overflow-hidden">
146
+ <div class="p-6">
147
+ <div class="space-y-4">
148
+ <div>
149
+ <h3 class="text-gold-400 font-semibold" data-es="Bufete Mendoza & Asociados" data-en="Mendoza & Associates" data-it="Studio Mendoza & Associati">Bufete Mendoza & Asociados</h3>
150
+ <p class="text-gray-400 text-sm" data-es="Fundador y Socio Principal | 2015 - Presente" data-en="Founder & Senior Partner | 2015 - Present" data-it="Fondatore e Socio Senior | 2015 - Presente">Fundador y Socio Principal | 2015 - Presente</p>
151
+ <p class="text-gray-300 mt-2 text-sm" data-es="Liderando un equipo de 12 abogados especializados en derecho corporativo y litigación compleja." data-en="Leading a team of 12 lawyers specialized in corporate law and complex litigation." data-it="Dirigendo un team di 12 avvocati specializzati in diritto societario e contenziosi complessi.">Liderando un equipo de 12 abogados especializados en derecho corporativo y litigación compleja.</p>
152
+ </div>
153
+ <div>
154
+ <h3 class="text-gold-400 font-semibold" data-es="Bufete Legal Internacional" data-en="International Legal Firm" data-it="Studio Legale Internazionale">Bufete Legal Internacional</h3>
155
+ <p class="text-gray-400 text-sm" data-es="Abogado Senior | 2008 - 2015" data-en="Senior Lawyer | 2008 - 2015" data-it="Avvocato Senior | 2008 - 2015">Abogado Senior | 2008 - 2015</p>
156
+ <p class="text-gray-300 mt-2 text-sm" data-es="Especializado en fusiones y adquisiciones internacionales." data-en="Specialized in international mergers and acquisitions." data-it="Specializzato in fusioni e acquisizioni internazionali.">Especializado en fusiones y adquisiciones internacionales.</p>
157
+ </div>
158
+ </div>
159
+ </div>
160
+ </div>
161
+ </div>
162
+
163
+ <!-- Contact Button -->
164
+ <div class="menu-item animate-fade-in" style="animation-delay: 0.8s;">
165
+ <button class="menu-btn w-full bg-black border border-gold-500 text-white py-3 px-6 rounded-lg flex justify-between items-center hover:bg-gray-900 transition-colors">
166
+ <span data-es="Contacto" data-en="Contact" data-it="Contatto">Contacto</span>
167
+ <i class="fas fa-chevron-down transition-transform"></i>
168
+ </button>
169
+ <div class="menu-content bg-gray-900 rounded-b-lg overflow-hidden">
170
+ <div class="p-6">
171
+ <div class="space-y-4">
172
+ <div class="flex items-center">
173
+ <i class="fas fa-envelope text-gold-500 mr-4"></i>
174
+ <span>contacto@bufetemendoza.com</span>
175
+ </div>
176
+ <div class="flex items-center">
177
+ <i class="fas fa-phone text-gold-500 mr-4"></i>
178
+ <span>+34 123 456 789</span>
179
+ </div>
180
+ <div class="flex items-center">
181
+ <i class="fas fa-map-marker-alt text-gold-500 mr-4"></i>
182
+ <span data-es="Calle Principal 123, Madrid, España" data-en="Main Street 123, Madrid, Spain" data-it="Via Principale 123, Madrid, Spagna">Calle Principal 123, Madrid, España</span>
183
+ </div>
184
+ </div>
185
+ <div class="mt-6 pt-4 border-t border-gray-700">
186
+ <h3 class="text-gold-400 font-semibold mb-3" data-es="Horario de Atención" data-en="Office Hours" data-it="Orari di Ufficio">Horario de Atención</h3>
187
+ <p class="text-gray-300 text-sm" data-es="Lunes a Viernes: 9:00 - 18:00" data-en="Monday to Friday: 9:00 - 18:00" data-it="Lunedì a Venerdì: 9:00 - 18:00">Lunes a Viernes: 9:00 - 18:00</p>
188
+ <p class="text-gray-300 text-sm" data-es="Sábados: Cita previa" data-en="Saturdays: By appointment" data-it="Sabato: Su appuntamento">Sábados: Cita previa</p>
189
+ </div>
190
+ </div>
191
+ </div>
192
+ </div>
193
+ </div>
194
+
195
+ <!-- Download CV Button -->
196
+ <button id="downloadBtn" class="animate-fade-in animate-pulse-slow bg-gold-600 hover:bg-gold-700 text-black font-bold py-3 px-8 rounded-full flex items-center mt-4 transition-colors" style="animation-delay: 1s;">
197
+ <i class="fas fa-download mr-2"></i>
198
+ <span data-es="Descargar CV" data-en="Download CV" data-it="Scarica CV">Descargar CV</span>
199
+ </button>
200
+ </div>
201
+
202
+ <!-- Footer -->
203
+ <footer class="bg-black border-t border-gold-500 py-4">
204
+ <div class="container mx-auto px-4 text-center text-gray-400 text-sm">
205
+ <p data-es="© 2023 Bufete Mendoza. Todos los derechos reservados." data-en="© 2023 Mendoza Law Firm. All rights reserved." data-it="© 2023 Studio Legale Mendoza. Tutti i diritti riservati.">© 2023 Bufete Mendoza. Todos los derechos reservados.</p>
206
+ </div>
207
+ </footer>
208
+
209
+ <script>
210
+ // Menu toggle functionality
211
+ document.querySelectorAll('.menu-btn').forEach(btn => {
212
+ btn.addEventListener('click', function() {
213
+ const content = this.nextElementSibling;
214
+ const icon = this.querySelector('i');
215
+
216
+ // Close all other menus first
217
+ document.querySelectorAll('.menu-content').forEach(item => {
218
+ if (item !== content) {
219
+ item.classList.remove('open');
220
+ const otherIcon = item.previousElementSibling.querySelector('i');
221
+ otherIcon.classList.remove('fa-chevron-up');
222
+ otherIcon.classList.add('fa-chevron-down');
223
+ }
224
+ });
225
+
226
+ // Toggle current menu
227
+ content.classList.toggle('open');
228
+ icon.classList.toggle('fa-chevron-up');
229
+ icon.classList.toggle('fa-chevron-down');
230
+ });
231
+ });
232
+
233
+ // Language selector functionality
234
+ const languageBtn = document.getElementById('languageBtn');
235
+ const languageDropdown = document.getElementById('languageDropdown');
236
+ const currentLang = document.getElementById('currentLang');
237
+
238
+ languageBtn.addEventListener('click', function() {
239
+ languageDropdown.classList.toggle('open');
240
+ this.querySelector('i').classList.toggle('fa-chevron-up');
241
+ this.querySelector('i').classList.toggle('fa-chevron-down');
242
+ });
243
+
244
+ document.querySelectorAll('.lang-option').forEach(option => {
245
+ option.addEventListener('click', function() {
246
+ const lang = this.getAttribute('data-lang');
247
+ currentLang.textContent = lang.toUpperCase();
248
+
249
+ // Update all translatable elements
250
+ document.querySelectorAll('[data-es], [data-en], [data-it]').forEach(element => {
251
+ const text = element.getAttribute(`data-${lang}`);
252
+ if (text) {
253
+ element.textContent = text;
254
+ }
255
+ });
256
+
257
+ // Close dropdown
258
+ languageDropdown.classList.remove('open');
259
+ languageBtn.querySelector('i').classList.remove('fa-chevron-up');
260
+ languageBtn.querySelector('i').classList.add('fa-chevron-down');
261
+ });
262
+ });
263
+
264
+ // Download CV button
265
+ document.getElementById('downloadBtn').addEventListener('click', function() {
266
+ // In a real scenario, this would link to an actual PDF file
267
+ const lang = currentLang.textContent;
268
+ let message = '';
269
+
270
+ if (lang === 'ES') message = 'Descargando CV...';
271
+ else if (lang === 'EN') message = 'Downloading CV...';
272
+ else message = 'Scaricamento CV...';
273
+
274
+ alert(message);
275
+
276
+ // Simulate download (in a real implementation, this would be a link to the PDF)
277
+ const link = document.createElement('a');
278
+ link.href = '#';
279
+ link.download = 'CV_Javier_Mendoza.pdf';
280
+ document.body.appendChild(link);
281
+ link.click();
282
+ document.body.removeChild(link);
283
+ });
284
+
285
+ // Close dropdowns when clicking outside
286
+ document.addEventListener('click', function(e) {
287
+ if (!languageBtn.contains(e.target) && !languageDropdown.contains(e.target)) {
288
+ languageDropdown.classList.remove('open');
289
+ languageBtn.querySelector('i').classList.remove('fa-chevron-up');
290
+ languageBtn.querySelector('i').classList.add('fa-chevron-down');
291
+ }
292
+ });
293
+ </script>
294
+ <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=tinolin/coco4" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
295
+ </html>
prompts.txt ADDED
@@ -0,0 +1,2 @@
 
 
 
1
+ preciso una sola página sin scroll para un abogado que tenga menus que muestren contacto y trayectoria y sobre mi. Co animaciones. Debe tener los colores negro dorado y blanco con la posibilidad d descargar un archivo pdf con el cv del mismo y tiene que tener un disño de toda la página y además seer resposive. sin mucho texto y con la posibilidad de traducir en 3 idiomas, español, inglés y italiano. EL diseño debe ser limpio y no tener scrooll.
2
+ podrías agregar arriba del nombre una imagen de justicia a modo de logotipo y además un botón para descargar su curriculum