HTML-Static-Project/index.html at main · SushiS1ay3r/HTML-Static-Project · 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
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
<!--
HTML Static Project
Your name: Daniel Huang
Class: Web Development Period 3 & 4 ODD
Teacher: Iulian Irimina
Date: 9/29/23
-->

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>Main | Daniel Huang</title>
    <meta name="author" content="HTML Static Website">
    <meta name="description" content="HTML Static Website">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="icon" type="image/png" href="images/webDevFavicon.png">
    <link  href="styles.css" type="text/css" rel="stylesheet">
    <link href="normalize.css" type="text/css" rel="stylesheet">
    <meta name=“viewport” content=“width-device-width, initial-scale=1, maximum-scale=1”>


    <!--Google Font Code--> <!--One HTML comment-->
    <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=Bahiana&family=Coming+Soon&family=Neucha&family=Zeyada&display=swap" rel="stylesheet">


</head>


<body>
    <div class="headerRoot">
        <header class="headerTop">
            <section class="header">
                <a href="https://www.bths.edu/"><img src="images/bthsLogoTransparent.png" id="bthsLogo"/></a> <!--Copyright Symbol (BTHS LOGO)--> <!--absolute link-->
                <h1 class="nameOfPage">MAIN</h1> <!--Heading #1-->
            </section>
        </header>
    </div>

    <nav class="headerNav">
        <section class="navSection">
            <ul class="navStructure">
                <li class="navList">
                    <a class="navLinkActive" href="index.html"> <span class="navText">Main</span></a> <!--relative link-->
                </li>

                <li class="navList">
                    <a class="navLink" href="favorites.html"><span class="navText">Favorites</span></a>
                </li>

                <li class="navList">
                    <a class="navLink" href="skills.html"> <span class="navText">Skills</span></a>
                </li>

                <li class="navList">
                    <a class="navLink" href="spots.html"><span class="navText">Spots</span></a>
                </li>
            </ul>
        </section>
    </nav>

    <main class="mainPage"> <!-- Semantic Container Element (main)-->

        <!--The Form -->
        <aside class="formAside">
            <h1>Feedback Form (Beta)</h1>
            <form action = "http://127.0.0.1:5500/index.html" method="POST" enctype="application/x-www-form-urlencoded"> <!--Form does not actually work-->
            <fieldset>
                <legend>Contact Information</legend>
                <p><label for=nameField> Your Name: </label>
                <input type="text" minLength="1" maxLength="100"  required name="userName"><br/> </p>
                <p><label> Your Email: <input type="email" name="userEmail"><br/></label></p>
                <p><label> Your Phone Number: <input type="tel" pattern="\(\d{3}\) \d{3}-\d{4}" name="userTelephoneNumber"></label></p>
                <label><input type="radio" name="phoneType" value="cell">Cell </label>
                <label><input type="radio" name="phoneType" value="work">Work</label>
                <label><input type="radio" name="phoneType" value="home">Home </label>
                <br/>
            <p>
                You may contact me:
                <input type="checkbox" name="userCheckbox" value="phone"> by Phone
                <input type="checkbox" name="userCheckbox" value="email"> by Email
                <br/>
            </p>

            </fieldset>

            <br/>

            <fieldset>
                <legend>Feedback</legend>
               <textarea required name="feedbackText" cols="40" rows="4"></textarea>
            </fieldset>

            <p><input type="submit" value="Submit"></p>
        </aside>

        <header class="mainHeader">
            <h2>DANIEL</h2> <!-- Heading #2 -->
            <img src="images/profilePicture2.jpg" class="profile"/>

        </header>


        <section class="sectionContainer">
            <div class="textContainer"> <!-- Generic Container Element (div)-->
                <!--Paragraph #1-->
                <p>
                    Hello! I am Daniel Huang.
                </p>

                <p>
                    I am currently a Senior at Brooklyn Technical High School in the Software Engineering major.
                </p>

                <p>
                    I am also a Software Engineer Apprentice working within the Mastercard Research & Development Team <br/>coding super cool mixed
                    applications as well as discovery project demos on payment technology.
                </p>

                <p>
                    Besides all the tech stuff, I really enjoy gaming, eating good food, biking, <br/>playing basketball & handball, rock climbing, watching anime, and really anything!
                </p>

                <p>
                    I am a really outgoing and vibey person, so please let me know if you ever want to talk about anything! :D
                </p>
            </div>

        </section>

        <footer>
            <p>
                <address>
                    © Brooklyn Technical High School - Web Development - Irimina PD 3 & 4
                </address>
            </p>

            <small>
                2023 - Daniel Huang - All Rights Reserved ®
            </small>

            <p>
                <small>
                    <a href="https://www.linkedin.com/in/danielhuang519/">Created by Daniel Huang</a>
                </small>
            </p>
        </footer>
    </main>
</body>

</html>