<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">

<!--
    by: Sharon Tuttle
    last modified: 2024-02-06

    you can run this using the URL:

    https://nrs-projects.humboldt.edu/~st10/s24cs328/328lect04-1/328lect04-1-play.html
-->

<head>
    <title> 328lect04-1-play </title>
    <meta charset="utf-8" />

    <link href="https://nrs-projects.humboldt.edu/~st10/styles/normalize.css"
          type="text/css" rel="stylesheet" />
</head>

<body>

    <form action="https://nrs-projects.humboldt.edu/~st10"
          method="get">
    <fieldset>
        <legend> Enter info </legend>

        <label for="nickname"> Nickname: </label>
	<input type="text" name="nick" id="nickname"
	       required="required" maxlength="10" />
        <br />

        <fieldset>
	    <legend> Ice cream flavor choice </legend>

	    <input type="radio" name="ice_cream" id="choc" value="chocolate" />
	    <label for="choc"> Chocolate </label><br />

	    <input type="radio" name="ice_cream" id="strawb" value="strawberry"
	           checked="checked" />
	    <label for="strawb"> Strawberry </label> <br />

	    <input type="radio" name="ice_cream" id="mint" value="peppermint" />
	    <label for="mint"> Peppermint </label>
        </fieldset>

        <fieldset>
	    <legend> Your transportation options </legend>
	    
	    <input type="checkbox" name="bicycle" id="bike" checked="checked"
	           value="4201" />
	    <label for="bike"> Bicycle </label> <br />

	    <input type="checkbox" name="car" id="car" />
	    <label for="car"> Car </label> <br />

	    <input type="checkbox" name="skateboard" id="board" checked="checked" />
	    <label for="board"> Skateboard </label>
        </fieldset>

        <fieldset>
	    <legend> Personal info </legend>
	
            <label for="about_yourself"> Tell us about yourself </label>
            <textarea name="about_you" id="about_yourself"
                      rows="5" cols="15"
                      placeholder="Start typing here"></textarea><br />

            <label for="state_of_res">
	        What state is your legal residence? </label>
	    <select name="state" id="state_of_res">
	        <option value="CA" selected="selected"> California </option>
                <option value="OR"> Oregon </option>
                <option value="NV"> Nevada </option> 
                <option value="WA"> Washington </option>
                <option value="CO"> Colorado </option>
            </select> 
	</fieldset>
	
	<label for="secret"> What's the secret word? </label>
	<input type="password" name="secret_word" id="secret" /><br />

        <input type="submit" value="Submit Info" />
    </fieldset>
    </form>

    <footer>
    <hr />
    <p>
        Validate by pasting .xhtml copy's URL into<br />
        <a href="https://html5.validator.nu/">
            https://html5.validator.nu/
        </a>
    </p>
    </footer>
</body>
</html>