ohmu/dev/minukodu-web/static/index.html

<!DOCTYPE html>
<html lang="et" data-theme="light">
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
  <meta name="theme-color" content="#1f6feb" id="meta-theme" />
  <meta name="robots" content="noindex" />
  <title>Minu kodu</title>
  <link rel="icon" href="/icon.svg" type="image/svg+xml" />
  <link rel="manifest" href="/manifest.webmanifest" />
  <link rel="apple-touch-icon" href="/icon.svg" />
  <link rel="stylesheet" href="/style.css" />
</head>
<body>
  <header>
    <div class="brand">
      <span class="logo" aria-hidden="true">🏠</span>
      <div>
        <h1>Minu kodu</h1>
        <div class="sub" id="subtitle">Suuremõisa</div>
      </div>
    </div>
    <div class="header-actions">
      <span class="status" id="status" title="Ühenduse olek"></span>
      <button id="theme-toggle" class="icon-btn" title="Vaheta teema" aria-label="Vaheta teema">🌙</button>
    </div>
  </header>

  <main>
    <nav class="tabs" id="tabs" aria-label="Vahelehed">
      <button type="button" class="tab active" data-view="andurid">🏠 Andurid</button>
      <button type="button" class="tab" data-view="transport">🚌 Transport</button>
    </nav>

    <div id="view-andurid" class="view">
      <section class="cards single" id="cards"></section>

      <footer class="foot">
        <span id="range-label"></span>
      </footer>
    </div>

    <div id="view-transport" class="view" hidden>
      <section class="panel">
        <h2 class="panel-title">🚌 Suuremõisa küla — bussid</h2>
        <div id="bus-list" class="dep-list"></div>
        <div id="bus-hint" class="hint" hidden></div>
      </section>

      <section class="panel">
        <div class="panel-head">
          <h2 class="panel-title">🚢 Heltermaa – Rohuküla</h2>
          <div class="seg" id="praam-days">
            <button type="button" data-days="1" class="active">Täna</button>
            <button type="button" data-days="2">Täna + homme</button>
          </div>
        </div>
        <div id="praam-warning" class="warn-banner" hidden></div>
        <div id="praam-list" class="dep-list"></div>
        <div id="praam-hint" class="hint" hidden></div>
      </section>

      <footer class="foot">
        <span id="transport-updated"></span>
      </footer>
    </div>
  </main>

  <script src="/app.js"></script>
</body>
</html>