Skip to content

Commit e037c98

Browse files
fusatyfusaty
committed
adding contact form
1 parent 70b82c3 commit e037c98

File tree

4 files changed

+131
-3
lines changed

4 files changed

+131
-3
lines changed

‎blog/posts.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -80,7 +80,7 @@ <h2><a href="Orabc Jacrlun - jubx jw ngyujwjcrxw.html">Orabc Jacrlun - jubx jw n
8080

8181

8282
<footer style="background-color: black; color: white; text-align: center; padding: 1em;">
83-
<p><a href="../index.html">Main page</a> - <a href="posts.html">Blog</a> - <a href="../insertcoin.html">Curriculum vitae</a> - <a href="../links.html">Links</a></p>
83+
<p><a href="../index.html">Main page</a> - <a href="posts.html">Blog</a> - <a href="../insertcoin.html">Curriculum vitae</a> - <a href="../links.html">Links</a> - <a href="../contact.html">Contact</a></p>
8484
<p style="font-size: 14px;">Hack the world to make it a better place.</p>
8585
</footer>
8686

‎contact.html

+126
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,126 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>Contact Me</title>
5+
<link rel="shortcut icon" type="image/jpg" href="/pictures/favicon.jpg"/>
6+
<style>
7+
body {
8+
font-family: "Courier New", Courier, monospace;
9+
color: #fff;
10+
background-color: #000;
11+
margin: 0;
12+
padding: 0;
13+
display: flex;
14+
flex-direction: column;
15+
min-height: 100vh;
16+
}
17+
18+
header {
19+
text-align: center;
20+
padding: 2em;
21+
background-color: #000000;
22+
border-bottom: 1px solid #333;
23+
}
24+
25+
h1 {
26+
font-size: 2.5em;
27+
margin-bottom: 0.2em;
28+
}
29+
30+
p {
31+
font-size: 1.2em;
32+
color: #fff;
33+
}
34+
35+
main {
36+
flex: 1;
37+
display: flex;
38+
justify-content: center;
39+
align-items: center;
40+
padding: 2em;
41+
}
42+
43+
form {
44+
background-color: #000000;
45+
border: 1px solid #fff;
46+
padding: 2em;
47+
width: 100%;
48+
max-width: 500px;
49+
border-radius: 8px;
50+
}
51+
52+
label {
53+
display: block;
54+
margin-bottom: 1em;
55+
font-size: 1.1em;
56+
}
57+
58+
input[type="email"], textarea {
59+
width: 94.5%;
60+
padding: 1em;
61+
margin-top: 0.5em;
62+
background-color: #151515;
63+
border: 1px solid #ffffff;
64+
color: #fff;
65+
border-radius: 4px;
66+
}
67+
68+
button {
69+
background-color: #000000;
70+
color: #fff;
71+
border: 1px solid #fff;
72+
padding: 0.8em 1.5em;
73+
font-size: 1em;
74+
border-radius: 4px;
75+
cursor: pointer;
76+
transition: background-color 0.3s ease;
77+
}
78+
79+
button:hover {
80+
background-color: #151515;
81+
}
82+
83+
footer {
84+
background-color: black;
85+
color: white;
86+
text-align: center;
87+
padding: 1em;
88+
border-top: 1px solid #333;
89+
}
90+
91+
footer a {
92+
color: #fff;
93+
text-decoration: none;
94+
margin: 0 0.5em;
95+
}
96+
97+
footer a:hover {
98+
color: #ccc;
99+
border: 1px solid #ccc;
100+
}
101+
</style>
102+
</head>
103+
<body>
104+
<header>
105+
<h1>Get in touch</h1>
106+
<p>Not sure why you would, but you can fill the form below to contact me.</p>
107+
</header>
108+
109+
<main>
110+
<form action="https://formspree.io/f/mdknrnyp" method="POST">
111+
<label for="email">Your email:</label>
112+
<input type="email" id="email" name="email" required>
113+
<p></p>
114+
<label for="message">Your message:</label>
115+
<p></p>
116+
<textarea id="message" name="message" rows="5" required></textarea>
117+
<p></p>
118+
<center><button type="submit">Send</button></center>
119+
</form>
120+
</main>
121+
122+
<footer style="background-color: black; color: white; text-align: center; padding: 1em;">
123+
<p><a href="/index.html">Main page</a> - <a href="/blog/posts.html">Blog</a> - <a href="/insertcoin.html">Curriculum vitae</a> - <a href="/links.html">Links</a> - <a href="/contact.html">Contact</a></p>
124+
</footer>
125+
</body>
126+
</html>

‎death.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -90,7 +90,7 @@ <h1>Game Over</h1>
9090
</script>
9191

9292
<footer style="background-color: black; color: white; text-align: center; padding: 1em;">
93-
<p><a href="/index.html" >Main page</a> - <a href="blog/posts.html">Blog</a> - <a href="/links.html">Links</a></p>
93+
<p><a href="/index.html" >Main page</a> - <a href="blog/posts.html">Blog</a> - <a href="/links.html">Links</a> - <a href="/contact.html">Contact</a></p>
9494
</footer>
9595

9696
</html>

‎index.html

+3-1
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ <h2 class="title">
66
<p><a href="blog/posts.html" class="link-1" >_blog</a>
77
<p><a href="insertcoin.html" class="link-1">_curriculum-vitae</a></p>
88
<p><a href="links.html" class="link-1" >_links</a></p>
9+
<p><a href="contact.html" class="link-1" >_contact</a></p>
910
<p style="font-family: Arial, sans-serif; font-size: 20px;">#### ### ######</p>
1011
</h2>
1112
</div>
@@ -117,7 +118,8 @@ <h2 class="title">
117118
<h2 class="title">
118119
<p><a href="blog/posts.html" class="link-2" onmouseover="playAudio()" >_blog</a>
119120
<p><a href="insertcoin.html" class="link-2" onmouseover="playAudio()">_curriculum-vitae </a></p>
120-
<p><a href="links.html" class="link-2" onmouseover="playAudio()">_links</a></p>
121+
<p><a href="links.html" class="link-2" onmouseover="playAudio()">_links</a></p>
122+
<p><a href="contact.html" class="link-2" onmouseover="playAudio()">_contact</a></p>
121123
<p style="font-family: Arial, sans-serif; font-size: 20px;">Hack the world!</p>
122124
</h2>
123125

0 commit comments

Comments
 (0)