workshop-started.html

<!--
  Body of the dialog shown when a workshop session starts.
  Tigera corporate / light look (matches tigera.io).
-->

<style>
  .tigera-welcome {
    font-family: 'DM Sans', system-ui, sans-serif;
    color: #231F1F;
    background-color: #FBF7F1;
    padding: 24px;
    border-radius: 8px;
  }
  .tigera-welcome .stamp {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.05em;
    color: #E76D2B;
    text-transform: uppercase;
    margin-bottom: 8px;
  }
  .tigera-welcome h2 {
    font-family: 'DM Sans', system-ui, sans-serif;
    font-weight: 900;
    letter-spacing: -0.02em;
    font-size: 28px;
    line-height: 1.15;
    margin: 0 0 12px;
    color: #231F1F;
  }
  .tigera-welcome h2 .accent {
    background: linear-gradient(135deg, #FAA51B 0%, #E76D2B 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
  }
  .tigera-welcome p { color: #5a6573; line-height: 1.6; margin: 0 0 12px; font-size: 15px; }
  .tigera-welcome .callout {
    background-color: #fffbeb;
    border: 1px solid rgba(217, 119, 6, 0.20);
    border-left: 4px solid #d97706;
    border-radius: 5px;
    padding: 14px 18px;
    margin: 16px 0;
  }
  .tigera-welcome .callout strong {
    color: #d97706;
    font-size: 13px;
    font-weight: 700;
    display: block;
    margin-bottom: 4px;
  }
  .tigera-welcome ul {
    margin: 12px 0 0;
    padding-left: 20px;
    color: #5a6573;
  }
  .tigera-welcome ul li::marker { color: #E76D2B; }
  .tigera-welcome ul li + li { margin-top: 4px; }
</style>

<div class="tigera-welcome">
  <div class="stamp">Tigera Labs</div>
  <h2>Your <span class="accent">lab</span> is ready</h2>

  <p>
    The hands-on environment is live. Work through the instructions panel;
    the terminal, editor, and console tabs are pre-wired to the cluster.
  </p>

  <div class="callout">
    <strong>Heads up</strong>
    The completion dialog &mdash; with the survey link and discount code
    &mdash; only appears if you finish the workshop end-to-end. Exit early
    and you'll miss it.
  </div>

  <ul>
    <li>Use the inline <code>EXECUTE</code> blocks to run commands automatically.</li>
    <li>The session timer lives in the top-right of the chrome.</li>
    <li>"Reset session" is one click away if you want to start clean.</li>
  </ul>
</div>