components/example.js

// This is an example of a web component - not used in this specific implementation
class CustomExample extends HTMLElement {
  connectedCallback() {
    this.attachShadow({ mode: 'open' });
    this.shadowRoot.innerHTML = `
      <style>
        :host {
          display: block;
          padding: 1rem;
          background-color: #f3f4f6;
          border-radius: 0.5rem;
          margin-bottom: 1rem;
        }
        
        h2 {
          margin-top: 0;
          color: #1f2937;
        }
        
        p {
          color: #6b7280;
        }
      </style>
      <div>
        <h2>Web Component Example</h2>
        <p>This is a reusable web component.</p>
      </div>
    `;
  }
}

customElements.define('custom-example', CustomExample);