-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
112 lines (100 loc) · 4.99 KB
/
index.html
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Portfolio Page</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<header class="header">
<img src="" alt="Logo">
<nav class="navbar">
<ul>
<li><a href="#sect1">Home</a></li>
<li><a href="#sect2">Projects</a></li>
<li><a href="#sect3">Contact</a></li>
</ul>
</nav>
</header>
<main>
<section id="sect1" class="hero">
<img src="/images/hero.jpg" width="60%" height="auto" alt="Hero page">
<div class="about">
<h1>About</h1>
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Possimus sit unde nam dolorem ratione
quaerat doloribus esse quibusdam obcaecati enim. Doloremque, ratione. Sequi dolores dolorum dolor
distinctio labore hic amet ipsa quia qui corrupti laudantium nisi odio consequuntur aut magnam a
quam totam quisquam optio reprehenderit neque, odit itaque mollitia rem? Hic similique cupiditate,
porro, quas alias qui amet suscipit voluptas eos exercitationem, repellat est distinctio? Incidunt
suscipit, voluptates exercitationem harum excepturi ea explicabo natus ipsa adipisci distinctio sit
culpa eius eum reiciendis molestias recusandae quis praesentium id. Aliquid dignissimos officiis hic
provident officia quod aperiam minima possimus, odit nisi.</p>
</div>
</section>
<section id="sect2" class="project">
<div>
<h2>Skills</h2>
<hr>
<ul class="skills-list">
<li>HTML & CSS <span>-100%</span></li>
<li>Javascript <span>-100%</span></li>
</ul>
</div>
<div class="project1">
<h2>Projects</h2>
<div class="row">
<div class="col">
<img src="./images/Computer-Lab-Image_Francos-1024x768.jpg" alt="project1" width="500px"
height="250px">
<p>Computer Training</p>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Ipsum vel, facere nam modi odio qui
temporibus harum rerum autem libero accusamus optio accusantium, repudiandae illo adipisci
dolor, nesciunt aperiam nisi.</p>
</div>
<div class="col">
<img src="./images/inline_image_preview.jpg" alt="project2" width="500px" height="250px">
<div>
<p>Computer Training</p>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Ipsum vel, facere nam modi odio
qui temporibus harum rerum autem libero accusamus optio accusantium, repudiandae illo
adipisci dolor, nesciunt aperiam nisi.</p>
</div>
</div>
<div class="col">
<img src="./images/406991.jpg" alt="project3" width="500px" height="250px">
<p>Computer Training</p>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Ipsum vel, facere nam modi odio qui
temporibus harum rerum autem libero accusamus optio accusantium, repudiandae illo adipisci
dolor, nesciunt aperiam nisi.</p>
</div>
</div>
</div>
</section>
<section id="sect3" class="Contact">
<form data-dom="contact-form" name='contactForm'>
<input data-dom="input_email" name="email" type="email" placeholder="Email">
<br />
<label for="message">Message</label>
<br />
<textarea data-dom="input_textarea" class="textarea" name="message" id="message" cols="30" rows="10"
placeholder="send us a message"></textarea>
<br />
<input value="submit" type="submit" />
</form>
</section>
</main>
<footer>
<p> © Glasshouse 2019 </p>
<div class="social">
<img src="./images/twitter.png" alt="">
<img src="./images/facebook.png" alt="">
<img src="./images/pinterest.png" alt="">
<img src="./images/instagram.png" alt="">
</div>
</footer>
<button data-dom="scrollButton" class="scrollButton">scroll</button>
<script src="app.js"></script>
</body>
</html>