Online-Registration-Form/index.html at main · Aceer121/Online-Registration-Form · 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
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Online Registration Form</title>
  <link rel="preconnect" href="https://fonts.gstatic.com">
  <link href="https://fonts.googleapis.com/css2?family=Merriweather:wght@300;400&display=swap" rel="stylesheet">
  <link rel="stylesheet" href="css/styles.css">
</head>
<body>
  <header>
    <div class="code">
      <h1>THE CODE REVIEW</h1>
    </div>
  </header>
  <form class="container br">
    <main class="main">
      <h2>Signup for our newsletter</h2>
      <div class="news-p">
        <p>Get the latest news on how your code is doing right in your inbox</p>
      </div>
      <div class="t-border clearfix"></div>
      <fieldset>
        <legend>Contact Information</legend>
      <div class="flex-block">
        <label for="name">Full Name</label>
        <input type="text" id="name" name="user-name" placeholder="required"> </div>
      <div class="flex-block">
        <label for="email">Email Address</label>
        <input type="email" id="email" name="user_email" placeholder="required"> </div>
      <div class="flex-block">
        <label for="tel">Phone Number</label>
        <input type="tel" id="tel" name="phone"> </div>
      <div class="flex-block">
        <label for="street">Street Address</label>
        <input type="text" id="street" name="text"> </div>
      <div class="flex-block">
        <label for="text">City</label>
        <input type="text" id="text" name="text"> </div>
      <div class="flex-block">
        <label for="text">State</label>
        <select id="state" name="user-state">
          <option value="" selected="selected">Choose State</option>
          <option value="_alabama">Alabama</option>
          <option value="_alaska">Alaska</option>
          <option value="_arizona">Arizona</option>
          <option value="_arkansas">Arkansas</option>
          <option value="_califorina">California</option>
          <option value="_colorado">Colorado</option>
          <option value="_connecticut">Connecticut</option>
          <option value="_delaware">Delaware</option>
          <option value="_florida">Florida</option>
          <option value="_georgia">Georgia</option>
          <option value="_hawaii">Hawaii</option>
          <option value="_idaho">Idaho</option>
          <option value="_illinois">Illinois</option>
          <option value="_indiana">Indiana</option>
          <option value="_iowa">Iowa</option>
          <option value="_kansas">Kansas</option>
          <option value="_kentucky">Kentucky</option>
          <option value="_lousiana">Louisiana</option>
          <option value="_maine">Maine</option>
          <option value="_maryland">Maryland</option>
          <option value="_massachusetts">Massachusetts</option>
          <option value="_michigan">Michigan</option>
          <option value="_minnesota">Minnesota</option>
          <option value="_mississippi">Mississippi</option>
          <option value="_missouri">Missouri</option>
          <option value="_montana">Montana</option>
          <option value="_nebraska">Nebraska</option>
          <option value="_nevada">Nevada</option>
          <option value="_new hampshire">New Hampshire</option>
          <option value="_new mexico">New Mexico</option>
          <option value="_new york">New York</option>
          <option value="_north carolina">North Carolina</option>
          <option value="_north dakota">North Dakota</option>
          <option value="_ohio">Ohio</option>
          <option value="_Oklahoma">Oklahoma</option>
          <option value="_oregon">Oregon</option>
          <option value="_pennsylvania">Pennsylvania</option>
          <option value="_rhode island">Rhode Island</option>
          <option value="_south carolina">South Carolina</option>
          <option value="_south dakota">South Dakota</option>
          <option value="_tennessee">Tennessee</option>
          <option value="_texas">Texas</option>
          <option value="_utah">Utah</option>
          <option value="_vermont">Vermont</option>
          <option value="_virginia">Virginia</option>
          <option value="_washington">Washington</option>
          <option value="_west">West Virginia</option>
          <option value="_Wisconsin">Wisconsin</option>
          <option value="_wyoming">Wyoming</option>
        </select>
      </div>
      <!-- </div> -->
      <div class="flex-block">
        <label for="zip">Zip Code</label>
        <input type="text" id="zip" name="_zip"> </div>
      </fieldset>
        <br>
        <div class="container-2">
          <div class="t-border-2 clearfix"></div>
          <br>
          <fieldset>
            <legend>Newsletter</legend>
          <div class="flex">
            <div class="select-p">
              <p>Select the newsletters you would like to receive</p>
            </div>
            <input type="checkbox" id="development" value="interest_development" name="user_interest">
            <label class="light" for="development">HTML News</label>
            <br>
            <input type="checkbox" id="design" value="interest_design" name="user_interest">
            <label class="light" for="design">CSS News</label>
            <br>
            <input type="checkbox" id="business" value="interest_business" name="user_interest">
            <label class="light" for="business">Javascript News</label>
            <br>
            <div class="newsletter">
              <p>Newsletter format</p>
            </div>
            <input type="radio" id="_html" value="_html" name="_format">
            <label for="_html" class="_html">HTML</label>
            <br>
            <input type="radio" id="_plaintext" value="_plaintext" name="_format">
            <label for="_plaintext" class="_plaintext">Plain Text</label>
            <br>
            <label for="bio">Other topics like to hear about</label>
            <textarea id="bio" name="user_bio"></textarea>
            <br>
            <button type="submit">Sign Up</button>
            <p class="copyright">Copyright 2021</p>
          </div>
          </fieldset>
        </div>
    </main>
  </form>
</body>
</html>