From 8505823c876ade2cbe278b40cbd3d118693cfdbe Mon Sep 17 00:00:00 2001
From: Tan Zhen Yong <Xenonym@users.noreply.github.com>
Date: Fri, 21 Jan 2022 06:04:44 +0800
Subject: [PATCH] Add additional form elements to demo (#271)

* Fix multiple checked in radio group

There should only be one value checked by default in a radio group.

* Add additional form elements to demo
---
 docs/index.html | 38 +++++++++++++++++++++++++-------------
 1 file changed, 25 insertions(+), 13 deletions(-)

diff --git a/docs/index.html b/docs/index.html
index 96690de..9df9619 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -211,19 +211,31 @@
       <label for="about">About me</label>
       <textarea name="about" id="about" placeholder="I am a textarea..."></textarea>
 
-      <label>Choose a Doe:</label>
-      <div>
-        <input type="radio" id="john" name="drone" value="john" checked />
-        <label for="john">John Doe</label>
-      </div>
-      <div>
-        <input type="radio" id="jane" name="drone" value="jane" checked />
-        <label for="jane">Jane Doe</label>
-      </div>
-      <div>
-        <input type="radio" id="johnny" name="drone" value="johnny" checked />
-        <label for="johnny">Johnny Doe</label>
-      </div>
+      <label for="rating">Rate this site</label>
+      <input name="rating" id="rating" type="range" min="1" max="10"></input>
+
+      <label for="flavor">Choose a flavor</label>
+      <select name="flavor" id="flavor">
+        <option>Chocolate</option>
+        <option>Strawberry</option>
+        <option>Vanilla</option>
+      </select>
+
+      <fieldset>
+        <legend>Choose a Doe</legend>
+        <div>
+          <input type="radio" id="john" name="drone" value="john" checked />
+          <label for="john">John Doe</label>
+        </div>
+        <div>
+          <input type="radio" id="jane" name="drone" value="jane" />
+          <label for="jane">Jane Doe</label>
+        </div>
+        <div>
+          <input type="radio" id="johnny" name="drone" value="johnny" />
+          <label for="johnny">Johnny Doe</label>
+        </div>
+      </fieldset>
 
       <br />