Spaces:
Running
Running
| class CustomNavbar extends HTMLElement { | |
| connectedCallback() { | |
| this.attachShadow({ mode: 'open' }); | |
| this.shadowRoot.innerHTML = ` | |
| <style> | |
| nav { | |
| background: rgba(10, 10, 10, 0.8); | |
| backdrop-filter: blur(10px); | |
| padding: 1.5rem; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| position: fixed; | |
| top: 0; | |
| left: 0; | |
| right: 0; | |
| z-index: 1000; | |
| border-bottom: 1px solid rgba(249, 255, 0, 0.1); | |
| } | |
| .logo { | |
| color: #f9ff00; | |
| font-weight: bold; | |
| font-size: 1.5rem; | |
| letter-spacing: 1px; | |
| text-transform: uppercase; | |
| } | |
| </style> | |
| <nav> | |
| <a href="/" class="logo">CYBERGLOW</a> | |
| </nav> | |
| `; | |
| } | |
| } | |
| customElements.define('custom-navbar', CustomNavbar); |