Winiry/math-o-s-dark-code-cave

1class CustomFooter extends HTMLElement {2    connectedCallback() {3        this.attachShadow({ mode: 'open' });4        this.shadowRoot.innerHTML = `5            <style>6                .social-link {7                    transition: transform 0.3s ease, color 0.3s ease;8                }9                .social-link:hover {10                    transform: translateY(-3px);11                    color: #6D28D9;12                }13            </style>14            <footer class="bg-dark-800 border-t border-gray-800 py-8">15                <div class="container mx-auto px-4">16                    <div class="flex flex-col md:flex-row justify-between items-center">17                        <div class="mb-6 md:mb-0">18                            <h3 class="text-xl font-bold text-accent-500 mb-2">Mathéo</h3>19                            <p class="text-gray-400">Étudiant en informatique à EPITA</p>20                        </div>21                        <div class="flex flex-col items-center md:items-end">22                            <div class="flex gap-4 mb-4">23                                <a href="#" class="social-link text-gray-400">24                                    <i data-feather="github"></i>25                                </a>26                                <a href="#" class="social-link text-gray-400">27                                    <i data-feather="linkedin"></i>28                                </a>29                                <a href="#" class="social-link text-gray-400">30                                    <i data-feather="twitter"></i>31                                </a>32                                <a href="#" class="social-link text-gray-400">33                                    <i data-feather="mail"></i>34                                </a>35                            </div>36                            <p class="text-gray-500 text-sm">© ${new Date().getFullYear()} Mathéo. Tous droits réservés.</p>37                        </div>38                    </div>39                </div>40            </footer>41        `;42    }43}44 45customElements.define('custom-footer', CustomFooter);