SparkAmerica-website-clone/createAccountPage.html at main · Awresh/SparkAmerica-website-clone · 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
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>SparkAmerica: Get Started-Welcome</title>
    <link rel="icon" href="SPARK-America.png">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link
        href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600&family=Roboto&display=swap"
        rel="stylesheet">
    <link rel="stylesheet" href="./Style/commonStyles.css">
    <link rel="stylesheet" href="./Style/createAccountPage.css">
</head>

<body>
    <main>
        <div id="logo_div">
            <img src="https://portal.peopleonehealth.com/Content/Images/CityImages/SparkAmerica2020-02-768x96.png"
                class="logo" alt="SparkAmerica 2022 Fit City Challenge ">
        </div>
        <!-- <img src="./SparkAmericaCityPageHeader.jpg" class="img" alt="SparkAmerica skyline"> -->
        <div class="container">
            <form>
                <div>
                    <div id="welcome">Welcome to SparkAmerica !</div>
                    <div>We need to get to know you and you'll be on your way in no time.</div>
                    <div id="req">All fields required.</div>
                    <div>
                        <input id="mail" type="email" placeholder="Enter E-mail"><span class="req">*required</span>
                    </div>
                    <div class="input_div">
                        <input id="password" type="password" class="input" placeholder="Enter Password"><span
                            class="req">*required</span>
                        <input id="re_password" type="password" class="input" placeholder="Enter Password Again"><span
                            class="req">*required</span>
                    </div>
                    <div class="input_div">
                        <input id="f_name" class="input" placeholder="First Name"><span class="req">*required</span>
                        <input id="l_name" class="input" placeholder="Last Name"><span class="req">*required</span>
                    </div>
                    <div class="input_div">
                        <input id="date" class="input" type="date" placeholder="Date of Birth (dd/mm/yyyy)"><span
                            class="req">*required</span>
                    </div>
                    <div class="input_div">
                        <input id="zipCode" class="input" placeholder="Zip Code"><span class="req">*required</span>
                    </div>
                    <div class="note">
                        Create a username that will be displayed publicly on leaderboards. This can be fun and must be
                        unique, so try adding some numbers to the end if your first choice is already taken.<br><br>
                    </div>
                    <div class="input_div">
                        <input id="username" class="input" placeholder="Username"><span class="req">*required</span>
                    </div>
                    <div class="note">
                        Select the city closest to you to participate in city challenges (optional).
                    </div><br>
                    <div class="input_div">
                        <select id="city" name="Select City" class="input">
                            <option value="">[Select City]</option>
                            <option value="atlanta">Atlanta</option>
                            <option value="boston">Boston</option>
                            <option value="chicago">Chicago</option>
                            <option value="denver">Denver</option>
                            <option value="newyork">New York</option>
                        </select><span class="req">*required</span>
                    </div>
                    <div>
                        <input type="checkbox" id="checkbox_1">
                        <label>I have read and agree to PeopleOne's <a href=""
                                target="_blank">Terms&nbsp;of&nbsp;Use.</a></label>
                    </div>
                    <div>
                        <input type="checkbox" id="checkbox_2">
                        <label>I have read and agree to PeopleOne's <a href=""
                                target="_blank">Privacy&nbsp;Use.</a></label>
                    </div>

                    <div id="btns">
                        <a href="./registerPage.html">
                            GO BACK
                        </a>
                        <input type="submit" value="CREATE ACCOUNT >">
                    </div>
                </div>
            </form>
        </div>
        <div id="faq">
            <a href="./FAQPage.html">Frequently Asked Questions</a>
        </div>
        <footer>
            <div id="footer">
                <span>
                    © PeopleOne Health 2022
                </span>
                <a href="https://portal.peopleonehealth.com/HealthyLiving/Article/1464">Privacy Policy</a>
                <a href="https://portal.peopleonehealth.com/HealthyLiving/Article/1463">Terms of Use</a>
            </div>
        </footer>
    </main>
</body>

</html>
<script src="./Script/createAccountPage.js"></script>