Merge pull request #65 from github/add-main-to-example-page

keithamus · web-flow · commit 2141ef1cb647 · 2023-06-23T10:22:27.000+01:00
add &lt;main&gt; to example page, reorder headers to avoid multiple h1s
diff --git a/examples/index.html b/examples/index.html
@@ -9,27 +9,30 @@
     </style>
   </head>
   <body>
-    <h1>Simple form</h1>
-    <p>Input 422 for an error response.</p>
-    <form>
-      <label for="simple-field">Input</label>
-      <auto-check csrf="foo" src="/demo" required>
-        <input id="simple-field" autofocus name="foo" required />
-        <code class="state"></code>
-      </auto-check>
-      <button>submit</button>
-    </form>
+    <main>
+      <h1>auto-check-element</h1>
+      <h2>Simple form</h2>
+      <p>Input 422 for an error response.</p>
+      <form>
+        <label for="simple-field">Input</label>
+        <auto-check csrf="foo" src="/demo" required>
+          <input id="simple-field" autofocus name="foo" required />
+          <code class="state"></code>
+        </auto-check>
+        <button>submit</button>
+      </form>
 
-    <h1>Form that has custom validity messages</h1>
-    <p>Input 422 for an error response.</p>
-    <form id="custom">
-      <label for="custom-field">Input</label>
-      <auto-check csrf="foo" src="/demo" required>
-        <input id="custom-field" autofocus class="json" name="foo" required />
-        <code class="state"></code>
-      </auto-check>
-      <button>submit</button>
-    </form>
+      <h2>Form that has custom validity messages</h2>
+      <p>Input 422 for an error response.</p>
+      <form id="custom">
+        <label for="custom-field">Input</label>
+        <auto-check csrf="foo" src="/demo" required>
+          <input id="custom-field" autofocus class="json" name="foo" required />
+          <code class="state"></code>
+        </auto-check>
+        <button>submit</button>
+      </form>
+    </main>
 
     <script>
       let focusedInput
