Hugging Face's logo

Spaces:
Julien355
/
arkan-services-page
Running

App Files Community
Julien355 commited on
Commit
8f66f47
·
verified ·
1 Parent(s): 3f52ca4

replace the background photo by solar farm photo - Follow Up Deployment

Browse files
Files changed (1) hide show
  1. index.html +42 -22
index.html CHANGED
@@ -165,21 +165,34 @@
165
  <i class="fas fa-lightbulb mr-3 text-secondary"></i>
166
  <div>
167
  <div class="font-semibold">Fields of Expertise</div>
168
- <div class="text-xs text-gray-500">Our specialized areas</div>
169
  </div>
170
  </a>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
171
  <a href="#services" class="block px-4 py-3 hover:bg-gray-50 rounded-lg transition flex items-center">
172
  <i class="fas fa-list-alt mr-3 text-secondary"></i>
173
  <div>
174
  <div class="font-semibold">Service Categories</div>
175
- <div class="text-xs text-gray-500">Complete service offerings</div>
176
- </div>
177
  </a>
178
  <a href="#industries-we-serve" class="block px-4 py-3 hover:bg-gray-50 rounded-lg transition flex items-center">
179
  <i class="fas fa-industry mr-3 text-secondary"></i>
180
  <div>
181
  <div class="font-semibold">Industries We Serve</div>
182
- <div class="text-xs text-gray-500">Our industry expertise</div>
183
  </div>
184
  </a>
185
  </div>
@@ -198,21 +211,18 @@
198
  <i class="fas fa-building mr-3 text-secondary"></i>
199
  <div>
200
  <div class="font-semibold">About Us</div>
201
- <div class="text-xs text-gray-500">Our company overview</div>
202
  </div>
203
  </a>
204
  <a href="#team" class="block px-4 py-3 hover:bg-gray-50 rounded-lg transition flex items-center">
205
  <i class="fas fa-users mr-3 text-secondary"></i>
206
  <div>
207
  <div class="font-semibold">Our Team</div>
208
- <div class="text-xs text-gray-500">Meet our leadership</div>
209
  </div>
210
  </a>
211
  <a href="#strategic-partners" class="block px-4 py-3 hover:bg-gray-50 rounded-lg transition flex items-center">
212
  <i class="fas fa-handshake mr-3 text-secondary"></i>
213
  <div>
214
  <div class="font-semibold">Partners</div>
215
- <div class="text-xs text-gray-500">Our strategic alliances</div>
216
  </div>
217
  </a>
218
  </div>
@@ -234,40 +244,53 @@
234
  </header>
235
 
236
  <!-- Mobile Menu -->
237
- <div class="mobile-menu hidden md:hidden fixed inset-0 z-40 bg-white pt-20 overflow-y-auto">
238
- <div class="container mx-auto px-4 py-4">
239
- <a href="#home" class="block py-3 px-4 text-gray-700 hover:bg-gray-100 rounded-lg transition flex items-center">
240
- <i class="fas fa-home mr-3 text-primary"></i> Home
241
  </a>
242
 
243
  <!-- Services Dropdown -->
244
  <div class="group">
245
- <button class="mobile-menu-dropdown flex items-center justify-between w-full py-3 px-4 text-gray-700 hover:bg-gray-100 rounded-lg transition">
246
  <div class="flex items-center">
247
- <i class="fas fa-cogs mr-3 text-primary"></i> Services
248
  </div>
249
- <i class="fas fa-chevron-down text-xs transition-transform duration-200"></i>
250
  </button>
251
- <div class="mobile-submenu hidden pl-8">
252
  <a href="#expertise" class="block py-3 px-4 text-gray-700 hover:bg-gray-100 rounded-lg transition flex items-center">
253
  <i class="fas fa-lightbulb mr-3 text-secondary"></i>
254
  <div>
255
  <div class="font-medium">Fields of Expertise</div>
256
- <div class="text-xs text-gray-500">Our specialized areas</div>
257
  </div>
258
  </a>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
259
  <a href="#services" class="block py-3 px-4 text-gray-700 hover:bg-gray-100 rounded-lg transition flex items-center">
260
  <i class="fas fa-list-alt mr-3 text-secondary"></i>
261
  <div>
262
  <div class="font-medium">Service Categories</div>
263
- <div class="text-xs text-gray-500">Complete service offerings</div>
264
  </div>
265
  </a>
266
  <a href="#industries-we-serve" class="block py-3 px-4 text-gray-700 hover:bg-gray-100 rounded-lg transition flex items-center">
267
  <i class="fas fa-industry mr-3 text-secondary"></i>
268
  <div>
269
  <div class="font-medium">Industries We Serve</div>
270
- <div class="text-xs text-gray-500">Our industry expertise</div>
271
  </div>
272
  </a>
273
  </div>
@@ -290,21 +313,18 @@
290
  <i class="fas fa-building mr-3 text-secondary"></i>
291
  <div>
292
  <div class="font-medium">About Us</div>
293
- <div class="text-xs text-gray-500">Our company overview</div>
294
  </div>
295
  </a>
296
  <a href="#team" class="block py-3 px-4 text-gray-700 hover:bg-gray-100 rounded-lg transition flex items-center">
297
  <i class="fas fa-users mr-3 text-secondary"></i>
298
  <div>
299
- <div class="font-medium">Our Team</div>
300
- <div class="text-xs text-gray-500">Meet our leadership</div>
301
  </div>
302
  </a>
303
  <a href="#strategic-partners" class="block py-3 px-4 text-gray-700 hover:bg-gray-100 rounded-lg transition flex items-center">
304
  <i class="fas fa-handshake mr-3 text-secondary"></i>
305
  <div>
306
  <div class="font-medium">Partners</div>
307
- <div class="text-xs text-gray-500">Our strategic alliances</div>
308
  </div>
309
  </a>
310
  </div>
 
165
  <i class="fas fa-lightbulb mr-3 text-secondary"></i>
166
  <div>
167
  <div class="font-semibold">Fields of Expertise</div>
 
168
  </div>
169
  </a>
170
+ <a href="/building-mep-services.html" class="block px-4 py-3 hover:bg-gray-50 rounded-lg transition flex items-center pl-12">
171
+ <i class="fas fa-building mr-3 text-secondary text-sm"></i>
172
+ <div class="text-sm">Building MEP Services</div>
173
+ </a>
174
+ <a href="/site-utilities-infrastructure.html" class="block px-4 py-3 hover:bg-gray-50 rounded-lg transition flex items-center pl-12">
175
+ <i class="fas fa-water mr-3 text-secondary text-sm"></i>
176
+ <div class="text-sm">Site Utilities Infrastructure</div>
177
+ </a>
178
+ <a href="/renewable-energy-systems.html" class="block px-4 py-3 hover:bg-gray-50 rounded-lg transition flex items-center pl-12">
179
+ <i class="fas fa-solar-panel mr-3 text-secondary text-sm"></i>
180
+ <div class="text-sm">Renewable Energy Systems</div>
181
+ </a>
182
+ <a href="/extended-integrated-services.html" class="block px-4 py-3 hover:bg-gray-50 rounded-lg transition flex items-center pl-12">
183
+ <i class="fas fa-hands-helping mr-3 text-secondary text-sm"></i>
184
+ <div class="text-sm">Extended & Integrated Services</div>
185
+ </a>
186
  <a href="#services" class="block px-4 py-3 hover:bg-gray-50 rounded-lg transition flex items-center">
187
  <i class="fas fa-list-alt mr-3 text-secondary"></i>
188
  <div>
189
  <div class="font-semibold">Service Categories</div>
190
+ </div>
 
191
  </a>
192
  <a href="#industries-we-serve" class="block px-4 py-3 hover:bg-gray-50 rounded-lg transition flex items-center">
193
  <i class="fas fa-industry mr-3 text-secondary"></i>
194
  <div>
195
  <div class="font-semibold">Industries We Serve</div>
 
196
  </div>
197
  </a>
198
  </div>
 
211
  <i class="fas fa-building mr-3 text-secondary"></i>
212
  <div>
213
  <div class="font-semibold">About Us</div>
 
214
  </div>
215
  </a>
216
  <a href="#team" class="block px-4 py-3 hover:bg-gray-50 rounded-lg transition flex items-center">
217
  <i class="fas fa-users mr-3 text-secondary"></i>
218
  <div>
219
  <div class="font-semibold">Our Team</div>
 
220
  </div>
221
  </a>
222
  <a href="#strategic-partners" class="block px-4 py-3 hover:bg-gray-50 rounded-lg transition flex items-center">
223
  <i class="fas fa-handshake mr-3 text-secondary"></i>
224
  <div>
225
  <div class="font-semibold">Partners</div>
 
226
  </div>
227
  </a>
228
  </div>
 
244
  </header>
245
 
246
  <!-- Mobile Menu -->
247
+ <div class="mobile-menu hidden md:hidden fixed inset-0 z-40 bg-white pt-16 overflow-y-auto transition-all duration-300 ease-in-out">
248
+ <div class="container mx-auto px-6 py-4">
249
+ <a href="#home" class="block py-4 px-4 text-gray-700 hover:bg-gray-50 rounded-lg transition flex items-center text-lg">
250
+ <i class="fas fa-home mr-3 text-primary text-xl"></i> Home
251
  </a>
252
 
253
  <!-- Services Dropdown -->
254
  <div class="group">
255
+ <button class="mobile-menu-dropdown flex items-center justify-between w-full py-4 px-4 text-gray-700 hover:bg-gray-50 rounded-lg transition text-lg">
256
  <div class="flex items-center">
257
+ <i class="fas fa-cogs mr-3 text-primary text-xl"></i> Services
258
  </div>
259
+ <i class="fas fa-chevron-down text-sm transition-transform duration-200"></i>
260
  </button>
261
+ <div class="mobile-submenu hidden pl-8 transition-all duration-300 ease-in-out">
262
  <a href="#expertise" class="block py-3 px-4 text-gray-700 hover:bg-gray-100 rounded-lg transition flex items-center">
263
  <i class="fas fa-lightbulb mr-3 text-secondary"></i>
264
  <div>
265
  <div class="font-medium">Fields of Expertise</div>
 
266
  </div>
267
  </a>
268
+ <a href="/building-mep-services.html" class="block py-3 px-4 text-gray-700 hover:bg-gray-100 rounded-lg transition flex items-center pl-12">
269
+ <i class="fas fa-building mr-3 text-secondary text-sm"></i>
270
+ <div class="text-sm">Building MEP Services</div>
271
+ </a>
272
+ <a href="/site-utilities-infrastructure.html" class="block py-3 px-4 text-gray-700 hover:bg-gray-100 rounded-lg transition flex items-center pl-12">
273
+ <i class="fas fa-water mr-3 text-secondary text-sm"></i>
274
+ <div class="text-sm">Site Utilities Infrastructure</div>
275
+ </a>
276
+ <a href="/renewable-energy-systems.html" class="block py-3 px-4 text-gray-700 hover:bg-gray-100 rounded-lg transition flex items-center pl-12">
277
+ <i class="fas fa-solar-panel mr-3 text-secondary text-sm"></i>
278
+ <div class="text-sm">Renewable Energy Systems</div>
279
+ </a>
280
+ <a href="/extended-integrated-services.html" class="block py-3 px-4 text-gray-700 hover:bg-gray-100 rounded-lg transition flex items-center pl-12">
281
+ <i class="fas fa-hands-helping mr-3 text-secondary text-sm"></i>
282
+ <div class="text-sm">Extended & Integrated Services</div>
283
+ </a>
284
  <a href="#services" class="block py-3 px-4 text-gray-700 hover:bg-gray-100 rounded-lg transition flex items-center">
285
  <i class="fas fa-list-alt mr-3 text-secondary"></i>
286
  <div>
287
  <div class="font-medium">Service Categories</div>
 
288
  </div>
289
  </a>
290
  <a href="#industries-we-serve" class="block py-3 px-4 text-gray-700 hover:bg-gray-100 rounded-lg transition flex items-center">
291
  <i class="fas fa-industry mr-3 text-secondary"></i>
292
  <div>
293
  <div class="font-medium">Industries We Serve</div>
 
294
  </div>
295
  </a>
296
  </div>
 
313
  <i class="fas fa-building mr-3 text-secondary"></i>
314
  <div>
315
  <div class="font-medium">About Us</div>
 
316
  </div>
317
  </a>
318
  <a href="#team" class="block py-3 px-4 text-gray-700 hover:bg-gray-100 rounded-lg transition flex items-center">
319
  <i class="fas fa-users mr-3 text-secondary"></i>
320
  <div>
321
+ <div class="font-medium">Our Team</div>>
 
322
  </div>
323
  </a>
324
  <a href="#strategic-partners" class="block py-3 px-4 text-gray-700 hover:bg-gray-100 rounded-lg transition flex items-center">
325
  <i class="fas fa-handshake mr-3 text-secondary"></i>
326
  <div>
327
  <div class="font-medium">Partners</div>
 
328
  </div>
329
  </a>
330
  </div>