Spaces:
Running
Running
| class CustomFooter extends HTMLElement { | |
| connectedCallback() { | |
| this.attachShadow({ mode: 'open' }); | |
| this.shadowRoot.innerHTML = ` | |
| <style> | |
| .footer-links a:hover { | |
| color: #f59e0b; | |
| transition: color 0.3s ease; | |
| } | |
| .social-icon:hover { | |
| transform: translateY(-3px); | |
| transition: transform 0.3s ease; | |
| } | |
| </style> | |
| <footer class="bg-gray-900 text-white py-12"> | |
| <div class="container mx-auto px-4"> | |
| <div class="grid md:grid-cols-4 gap-8"> | |
| <div> | |
| <h3 class="text-xl font-bold mb-4 flex items-center"> | |
| <i data-feather="box" class="w-6 h-6 mr-2 text-yellow-400"></i> | |
| StageCrafters Pro | |
| </h3> | |
| <p class="text-gray-400 mb-4">Specialisti in allestimenti scenografici e palchi professionali per ogni tipo di evento.</p> | |
| <div class="flex space-x-4"> | |
| <a href="#" class="social-icon text-gray-400 hover:text-yellow-400"> | |
| <i data-feather="facebook" class="w-5 h-5"></i> | |
| </a> | |
| <a href="#" class="social-icon text-gray-400 hover:text-yellow-400"> | |
| <i data-feather="instagram" class="w-5 h-5"></i> | |
| </a> | |
| <a href="#" class="social-icon text-gray-400 hover:text-yellow-400"> | |
| <i data-feather="linkedin" class="w-5 h-5"></i> | |
| </a> | |
| </div> | |
| </div> | |
| <div> | |
| <h3 class="text-lg font-bold mb-4">Servizi</h3> | |
| <ul class="space-y-2 footer-links"> | |
| <li><a href="servizi.html" class="text-gray-400">Allestimenti Palchi</a></li> | |
| <li><a href="servizi.html" class="text-gray-400">Scenografie</a></li> | |
| <li><a href="servizi.html" class="text-gray-400">Illuminazione</a></li> | |
| <li><a href="servizi.html" class="text-gray-400">Sistemi Audio</a></li> | |
| </ul> | |
| </div> | |
| <div> | |
| <h3 class="text-lg font-bold mb-4">Azienda</h3> | |
| <ul class="space-y-2 footer-links"> | |
| <li><a href="chi-siamo.html" class="text-gray-400">Chi Siamo</a></li> | |
| <li><a href="portfolio.html" class="text-gray-400">Portfolio</a></li> | |
| <li><a href="blog.html" class="text-gray-400">Blog</a></li> | |
| <li><a href="contatti.html" class="text-gray-400">Lavora con noi</a></li> | |
| </ul> | |
| </div> | |
| <div> | |
| <h3 class="text-lg font-bold mb-4">Contatti</h3> | |
| <ul class="space-y-2"> | |
| <li class="flex items-center text-gray-400"> | |
| <i data-feather="map-pin" class="w-4 h-4 mr-2"></i> Via dello Spettacolo 123, Milano | |
| </li> | |
| <li class="flex items-center text-gray-400"> | |
| <i data-feather="mail" class="w-4 h-4 mr-2"></i> info@stagecrafterspro.it | |
| </li> | |
| <li class="flex items-center text-gray-400"> | |
| <i data-feather="phone" class="w-4 h-4 mr-2"></i> +39 012 345 6789 | |
| </li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div class="border-t border-gray-800 mt-12 pt-8 text-center text-gray-500"> | |
| <p>© 2023 StageCrafters Pro. Tutti i diritti riservati.</p> | |
| </div> | |
| </div> | |
| </footer> | |
| <script>feather.replace();</script> | |
| `; | |