intro_component_signup/index.html at main · Lenugo/intro_component_signup · 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
<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<link rel="icon" type="image/png" sizes="32x32" href="./public/images/favicon-32x32.png" />
		<title>Frontend Mentor | Intro component with sign up form</title>
		<link rel="stylesheet" href="./src/main.css" />
	</head>
	<body>
		<main class="container">
			<div class="container__info">
				<h1 class="container__info-title">Learn to code by watching others</h1>
				<p class="container__info-text">
					See how experienced developers solve problems in real-time. Watching scripted tutorials is great,
					but understanding how developers think is invaluable.
				</p>
			</div>

			<div class="container__middle">
				<div class="container__try">
					<p class="container__try-text">
						<span class="try-text-strong">Try it free 7 days</span> then $20/mo. thereafter
					</p>
				</div>

				<div class="container__form">
					<form id="form" class="form">
						<input class="form__input-text" type="text" id="first-name" placeholder="First Name" />
						<input class="form__input-text" type="text" id="last-name" placeholder="Last Name" />
						<input class="form__input-text" type="email" id="email" placeholder="Email Address" />
						<input class="form__input-text" type="password" id="password" placeholder="Password" />
						<button class="btn-form">Claim your free trial</button>
						<p id="form-warning" class="footer-text">
							By clicking the button, you are agreeing to our
							<span class="form-text-strong">Terms and Services</span>
						</p>
					</form>
				</div>
			</div>
			<footer class="footer">
				<p class="attribution">
					Challenge by
					<a
						href="https://www.frontendmentor.io/challenges/intro-component-with-signup-form-5cf91bd49edda32581d28fd1/hub/intro-component-with-signup-form-gnoE7jfMZ"
						target="_blank"
						>Frontend Mentor</a
					>. Coded by <a href="https://github.com/Lenugo/intro_component_signup" target="_blank">Lenugo</a>.
				</p>
			</footer>
		</main>

		<script src="./src/main.js"></script>
	</body>
</html>