dykta dykta 80%

2026-05-21 22:33:21 +02:00
parent 07c76346c9
commit 113a762cf1
4 changed files with 375 additions and 3 deletions
@@ -0,0 +1,65 @@
+<!doctype html>
+<html lang="pl">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover" />
+    <title>Dyktando</title>
+    <link rel="stylesheet" href="styles.css?v=20260521" />
+  </head>
+  <body>
+
+    <!-- ── LIST SCREEN ── -->
+    <div id="list-wrap">
+      <nav class="nav-wrap">
+        <a href="index.html" class="back-to-hub" id="back-to-hub">← Menu</a>
+      </nav>
+      <div class="app-wrap">
+        <main class="screen">
+          <h1 class="app-title">✏️ Dyktando</h1>
+
+          <section class="panel">
+            <h2>Wybierz tekst</h2>
+            <div id="text-list" class="reading-list"></div>
+          </section>
+
+          <section class="panel">
+            <h2>Własny tekst</h2>
+            <textarea id="custom-input" class="custom-input"
+              placeholder="Wklej lub wpisz tekst…"></textarea>
+            <button id="custom-start-btn" class="mode-btn">Zacznij →</button>
+          </section>
+        </main>
+      </div>
+    </div>
+
+    <!-- ── PLAY SCREEN ── -->
+    <div id="play-wrap" class="read-wrap hidden">
+      <header class="read-header">
+        <button id="play-back-btn" class="read-nav-btn">← Lista</button>
+        <span id="play-title" class="read-title-text"></span>
+        <span id="blank-progress" class="blank-progress"></span>
+      </header>
+
+      <div class="dyk-body">
+        <!-- scrollable area: text during play, summary after -->
+        <div class="dyk-scroll" id="dyk-scroll">
+          <div class="dyk-text" id="text-display"></div>
+
+          <div class="dyk-summary hidden" id="summary">
+            <div id="summary-text" class="dyk-summary-text"></div>
+            <p id="summary-score" class="summary-score"></p>
+            <button id="summary-back-btn" class="mode-btn dyk-summary-back">
+              Wróć do listy
+            </button>
+          </div>
+        </div>
+
+        <!-- fixed choice bar at bottom -->
+        <div class="dyk-choices" id="choices"></div>
+      </div>
+    </div>
+
+    <script src="nav.js?v=20260521"></script>
+    <script src="dyktando.js?v=20260521"></script>
+  </body>
+</html>