JSFiddle - React, Tailwind, and code Playground

by edwardsharp

HTML

<script src="https://content.jwplatform.com/libraries/IDzF9Zmk.js"></script>
<script src="https://unpkg.com/@webcomponents/[email protected]/webcomponents-bundle.js"></script>
<script src="https://unpkg.com/@edwardsharp/[email protected]/dist/main.bundle.js"></script>
<a-player 
    height="225"
    width="400"
    file="https://player.vimeo.com/external/274956993.m3u8?s=b1d06838d9eb645d303020011d447c8fe69acf72"
    image="https://i.vimeocdn.com/video/707121198.webp"
    captions-file="https://edwardsharp.github.io/a-player/How_do_I_answer_and_end_calls.vtt"
  ></a-player>

CSS

background: #0095D6;
      color: white;
    }
    .transcript span:not(.current):hover {
      color: #0095D6;
    }
    .searchbox input {
      border: thin solid gray;
    }
    /* search results */
    .transcript span em.current {
      background: red;
      color: white;
    }