const FEED_ITEMS = [
  { src: "images/content_sc_1.jpeg" },
  { src: "images/content_sc_2.jpeg" },
  { src: "images/content_sc_3.jpg" },
  { src: "images/content_sc_4.jpg" },
  { src: "images/content_sc_5.jpeg" },
  { src: "images/content_sc_6.jpeg" },
];

const Feed = () => {
  return (
    <section className="feed wrap">
      <div className="feed-header">
        <h2>
          Op <em>Instagram</em> — <span style={{color:"var(--ink-3)",fontSize:"0.6em"}}>@stylistcoach.nl</span>
        </h2>
        <a href="https://www.instagram.com/destylistcoach/" className="feed-link" target="_blank" rel="noopener noreferrer">Volg mee op Instagram →</a>
      </div>
      <div className="feed-strip">
        {FEED_ITEMS.map((it, i) => (
          <a key={i} className="tile" href="https://www.instagram.com/destylistcoach/" target="_blank" rel="noopener noreferrer">
            <img src={it.src} alt="" style={{width:"100%",height:"100%",objectFit:"cover",display:"block"}} />
          </a>
        ))}
      </div>
    </section>
  );
};

window.Feed = Feed;