Spaces:
Running
Running
| class CustomFooter extends HTMLElement { | |
| connectedCallback() { | |
| this.attachShadow({ mode: 'open' }); | |
| this.shadowRoot.innerHTML = ` | |
| <style> | |
| .footer { | |
| background: linear-gradient(to right, #667eea, #764ba2); | |
| color: white; | |
| box-shadow: 0 -4px 6px rgba(0, 0, 0, 0.1); | |
| } | |
| .footer-link { | |
| transition: all 0.2s ease; | |
| } | |
| .footer-link:hover { | |
| color: #3B82F6; | |
| } | |
| </style> | |
| <footer class="footer py-4"> | |
| <div class="container mx-auto px-4"> | |
| <div class="flex flex-col md:flex-row justify-between items-center"> | |
| <div class="mb-4 md:mb-0"> | |
| <p class="text-blue-100">© 2023 ProjectTracker Pro. Tous droits réservés.</p> | |
| </div> | |
| <div class="flex space-x-6"> | |
| <a href="#" class="footer-link text-white hover:text-blue-100">Conditions d'utilisation</a> | |
| <a href="#" class="footer-link text-white hover:text-blue-100">Politique de confidentialité</a> | |
| <a href="#" class="footer-link text-white hover:text-blue-100">Contact</a> | |
| </div> | |
| </div> | |
| </div> | |
| </footer> | |
| `; | |
| } | |
| } | |
| customElements.define('custom-footer', CustomFooter); |