Implement Text Input

index.html

@@ -38,6 +38,14 @@
         Board Control
       </a>
 
+      <a class="sidebar-nav-item" id="nav-input-text" href="#input-text" data-route="input-text" role="button"
+        aria-label="Go to Input Text">
+        <svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+          <path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z"/>
+        </svg>
+        Input Text
+      </a>
+
       <a class="sidebar-nav-item" id="nav-stepper-test" href="#stepper-test" data-route="stepper-test" role="button"
         aria-label="Go to Stepper Test">
         <svg class="nav-icon"><use href="web/assets/icons.svg#icon-stepper"></use></svg>
@@ -108,11 +116,13 @@
     import HomeSection from './web/js/sections/home.js';
     import StepperSection from './web/js/sections/stepper-test.js';
     import BoardControlSection from './web/js/sections/board-control.js';
+    import InputTextSection from './web/js/sections/input-text.js';
 
     // ── Register routes ────────────────────────────────────────────
     Router.register('home', HomeSection);
     Router.register('stepper-test', StepperSection);
     Router.register('board-control', BoardControlSection);
+    Router.register('input-text', InputTextSection);
 
     // ── Sidebar toggle logic ───────────────────────────────────────
     const sidebar = document.getElementById('sidebar');