import {useEffect, useState} from 'react';
import SpinnerImage from '../components/SpinnerImage';

const MemberSection = () => {
    const [opacity, setOpacity] = useState(0);

    useEffect( () => {
        let callback = (entries, observer) => {
            entries.forEach(entry => {
              if (entry.isIntersecting) {
                setOpacity(1);
              } else {
                setOpacity(0);
              }
            });
        };
          const observer = new IntersectionObserver(callback);
          const observed = document.getElementById("member-glow");
          observer.observe(observed);
    }, [])
    
  return (
    <section id="member" className="member-section">
        <div id="member-glow" className="glow" style={{opacity: opacity}}></div>
        <div className="member-section__container">
        <SpinnerImage />
        <div className='member-section__text-box'>
             <h2>Bli medlem</h2>
                <p>Medlemskapet är gratis. För att kunna delta i våra evenemang, använda våra lokaler och 
                    verksamheter behöver du bli medlem i föreningen. Är du omyndig måste du även ange kontaktuppgifter 
                    till din vårdnadshavare. Medlemskapet kan avbrytas när som helst. </p>
                    
                <p>Som medlen får du tillgång till vår lokal och spel och kan delta i våra aktiviteter kring LAN, Makerskvällar, 
                    dokumentär- och filmkvällar och utbildningstillfällen som handlar om elektronik och programmering.</p>
                

                <p>Antalet deltagare i specifika evenemang och aktiviteter kan vara begränsade på grund av utrymmes- och bemanningsskäl. 
                    Det är en god ide att vara snabb på anmälan när annonserna väl kommer ut.</p>

                <a href="https://ebas.sverok.se/blimedlem/22393" target="_blank" className='glowing-btn'><span className='glowing-txt'>Bli medlem</span></a>
                   
        </div>
      </div>
    </section>
);
};

export default MemberSection;

