/* ============================================================
   INDIC LEAGUE NEWS — Splash screen
   First impression. Brand mark + tag + CTA.
   ============================================================ */

function Splash({ onContinue }) {
  return (
    <div className="screen splash">
      <div className="splash-body">
        <div className="splash-mark">
          i<em className="dot" />L
        </div>
        <div className="splash-name">INDIC LEAGUE <span>NEWS</span></div>
        <div className="splash-tag">Indian roots.<br />Global perspectives.</div>
      </div>

      <div className="splash-cta">
        <button
          className="btn"
          onClick={() => {
            window.IL_Sounds && window.IL_Sounds.tap();
            onContinue();
          }}
        >
          Get started
          <Icon name="arrow-right" size={18} stroke={2.2} color="#fff" />
        </button>
        <button
          className="btn btn-ghost"
          onClick={() => onContinue('login')}
        >
          I already have an account
        </button>
      </div>
    </div>
  );
}

Object.assign(window, { Splash });