import { r as registerInstance, h, e as getElement } from './index-c04b9ed5.js';

const sparkleIntroCss = ".people{display:flex}.character-intro{width:100%;padding:15px;border:1px red solid;border-radius:5px}.character-image{opacity:0.5}.character-image:hover{opacity:1}";

const SparkleIntro = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
  }
  componentDidLoad() { }
  introOnMouseOver(description, event) {
    this.description = description;
    console.log(event);
    event.target.style.opacity = 1;
  }
  render() {
    return (h("div", null, h("div", { class: "people" }, h("div", { class: "character-image zynab", onMouseOver: evt => this.introOnMouseOver('<strong>I’m Zinab or Z.</strong> My family’s from Nigeria, and we live in the Melrose section of the South Bronx. I’m all about racial justice, and watch… I’m going to be the first Muslim mayor of New York City. Believe that!', evt) }, h("img", { src: "/assets/img/characters/zynab.png" })), h("div", { class: "character-image kimberley", onMouseOver: evt => this.introOnMouseOver('<strong>Hey, everyone, this is Kimberly </strong>and I’m from Brooklyn. My dream is to become a venture capitalist, so I can fund businesses and causes led by other Black Women. I love watching reality TV shows that are related to business like Shark Tank and Undercover Boss.', evt) }, h("img", { src: "/assets/img/characters/kimberly.png" })), h("div", { class: "character-image jen", onMouseOver: evt => this.introOnMouseOver('<strong>Hi, my name’s Jen</strong> and I’m from Murray Hill Queens. Second-generation Korean American. I love softball and statistics, so right now my dream job would be in sabermetrics. You know, basically a data analyst in baseball.', evt) }, h("img", { src: "/assets/img/characters/jen.png" })), h("div", { class: "character-image yuna", onMouseOver: evt => this.introOnMouseOver('<strong>Hi, my name’s Yuna</strong> and I’m from Murray Hill Queens. Second-generation Korean American. I love softball and statistics, so right now my dream job would be in sabermetrics. You know, basically a data analyst in baseball.', evt) }, h("img", { src: "/assets/img/characters/yuna.png" })), h("div", { class: "character-image valeria", onMouseOver: evt => this.introOnMouseOver('<strong>I’m VALERIA but most of my friends call me Val.</strong> First-generation Dominican from Washington Heights. I could watch MSNBC and CNN all day. In fact, one day I’m going to have my own political talk show like my crushes Rachel Maddow and Robin Roberts.', evt) }, h("img", { src: "/assets/img/characters/valeria.png" }))), h("div", { class: "people-description" }, this.description ? h("div", { class: "character-intro", innerHTML: this.description }) : '')));
  }
  get el() { return getElement(this); }
};
SparkleIntro.style = sparkleIntroCss;

export { SparkleIntro as sparkle_intro };
