zedshaw-games/views/stream.html

<script>
  let req = new GetJson("/api/stream/1");
  let link_req = new GetJson("/api/stream/1/links");
</script>

<div x-init="Stream = await req.theData()" x-data="{Stream: {}}">
  <blockstart>

  <block style="--value: 7">
  <h1 x-text="Stream.title"></h1>

    <div>
      <p x-text="Stream.description"></p>
    </div>
  </block>

  <block>
    <p>Qui animated corpse, cricket bat max brucks terribilem incessu zomby. The voodoo sacerdos flesh eater, suscitat mortuos comedere carnem virus. Zonbi tattered for solum oculi eorum defunctis go lum cerebro. Nescio brains an Undead zombies. Sicut malus putrid voodoo horror.</p>
  </block>

  <block>
    <h2>Links Posted</h2>

    <ul x-init="links = await link_req.theData()" x-data="{links: {}}">
      <template x-for="item in links">
        <li><a x-text="item.description" x-bind:href="item.url"></a></li>
      </template>
    </ul>
  </block>

  <block style="--value: 7; --border: 1px;" class="horizontal">
  <grid style="--cols: 2">
  <shape>Left Image</shape>
  <div>
    <h3>I stream on Twitch.</h3>

    <p>I stream every day at 10AM/10PM EST time.  60% of the time it's a chill laid back stream with only programming and a bit of talking about programming.  30% of the time it's art for games I'm making. 10% of the time it's games I'm playing.</p>

    <a href="https://twitch.tv/zedashaw"><button style="--value: 2; --text: 9">Watch me on Twitch</button></a>
  </div>
  </grid>
  </block>

  </blockstart>
</div>