HTML_Playground/SurveyForm.html at main · TorresTorresMJ/HTML_Playground · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Survey Form</title>
  </head>

  <body>
    <main>
      <h1 id="title">Survey Form</h1>
      <p id="description">Leet me know where does my code is!</p>
      <form id="survey-form">
        <label for="name" id="name-label">Name</name>
        <input required
        type="text"
        id="name"
        name="name-label"
        placeholder="Juan Perez">
        <label for="email" id="email-label">Email</email>
        <input required
        type="email"
        id="email"
        name="email-label"
        placeholder="example@email.com">
        <label for="number" id="number-label">Age</label>
        <input type="number" id="number" name="number-label" min="18" max="99" placeholder="18">
        <fieldset>
          <legend>From where are you visit this webpage?</legend>
        <label for="location"></label>
        <select name="location" id="dropdown">
          <option value="america-latina">America Latina</option>
          <option selected value="north-america">North America</option>
          <option value="asia">Asia Pacific</option>
          <option value="europe">Europe</option>
        </select>
        </fieldset>
        <fieldset>
          <legend>Are you into coding?</legend>
        <label for="yes">Yes</label>
        <input type="radio" value="yes" name="dev" id="yes">
        <label for="no">No</label>
        <input type="radio" value="no" name="dev" id="no">
        <label for="omw">omw</label>
        <input type="radio" value="omw" name="dev" id="omw">
      </form>
      <legend>Tech sector: (check all that apply)</legend>
      <label for="frontend">Frontend</label>
      <input type="checkbox"
        id="front"
        name="front"
        value="front">
      <label for="backend">Backend</label>
      <input type="checkbox"
        id="back"
        name="back"
        value="back">
      <label for="data-analysis">Data analysis</label>
      <input type="checkbox"
      id="analysis"
      name="analysis"
      value="analysis">
      <label for="data-science">Data science</label>
      <input type="checkbox"
      id="science"
      name="science"
      value="science">
      <label for="software-test">Software test</label>
      <input type="checkbox"
      id="test"
      name="test"
      value="test">
      <label for="embedded">Embedded Software</label>
      <input type="checkbox"
      id="embedded"
      name="embedded"
      value="embedded">
      </fieldset>
      <fieldset>
        <legend>Leave any comment/suggestion! Just be respectful. Thx</legend>
        <textarea cols="50" rows="3" name="comments" id="comments" placeholder="Thanks for passing by!"></textarea>
      </fieldset>
      <button type="submit" id="submit">Submit <3</button>
      </form>
    </main>
  </body>
</html>