add day9

day9/src/pages/index.ts

@@ -0,0 +1,29 @@
+import { Counter } from '../components/counter';
+import { TextInput } from '../components/textInput';
+import { RouterLink } from '../components/routerLink';
+import { HtmlInput } from '../components/htmlInput';
+
+
+export default () => {
+    return `
+    <div class="grid place-items-center p-3 content-center min-h-screen">
+        <div class="p-6 border-neutral-800 rounded-lg container__content  border">
+            ${Counter()}
+            <br/>
+            ${TextInput()}
+            <br/>
+            ${HtmlInput()}
+            <br/>
+            1 + 2 = {1 + 2}
+            <br/>
+            <p d-if="appState.contents.count == 0">The count is exactly 0.</p>
+            "string" substringed with 0, 1 = {"string".substring(0, 1)}
+            <div class="flex gap-1 justify-center">
+            Go to ${RouterLink('/page2', 'Page 2')}
+            </div>
+        </div>
+    </div>
+    `;
+}
+
+export const layout = 'default'

day9/src/pages/page2.ts

@@ -0,0 +1,22 @@
+import { Counter } from '../components/counter';
+import { TextInput } from '../components/textInput';
+import { RouterLink  } from '../components/routerLink';
+import { CookieInput } from '../components/cookieInput';
+
+export default () => {
+    return `
+    <div class="grid place-items-center p-3 content-center min-h-screen">
+        <div class="p-6 border-neutral-800 rounded-lg container__content  border">
+            ${Counter()}
+            <br/>
+            ${TextInput()}
+            <br/>
+            ${CookieInput()}
+            <br/>
+            <div class="flex gap-1 justify-center">
+            Go to ${RouterLink('/subroute/page', 'subroute page')}
+            </div>
+        </div>
+    </div>
+    `
+}

day9/src/pages/subroute/page.ts

@@ -0,0 +1,16 @@
+import { Counter } from '../../components/counter';
+import { RouterLink } from '../../components/routerLink';
+
+export default () => {
+    return `
+    <div class="grid place-items-center p-3 content-center min-h-screen">
+        <div class="p-6 border-neutral-800 rounded-lg container__content  border">
+            ${Counter()}
+            <br/>
+            <div class="flex gap-1 justify-center">
+            return ${RouterLink('/', 'home')}
+            </div>
+        </div>
+    </div>
+    `
+}