-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
76 lines (73 loc) · 3.16 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
<!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">
<link rel="stylesheet" href="styles.css">
<title>Whitehawk Industries</title>
</head>
<body>
<div class="flex-container-one">
<div class="header-logo">
<img src="./images/logo.png" >
</div>
<div class="header-links">
<ul>
<li><a class="resume-link" href="./resume/IT Resume.pdf" download>Resume</a></li>
<li>Socials</li>
<li>About Me</li>
</ul>
</div>
</div>
<div class="flex-container-two">
<div>
<h1 class="hero-text">Welcome to Whitehawk Industries</h1> <!--This heading will be for the 48px text -->
<p class="hero-subtext">My name is William Bray and I am an aspiring Front End Developer and Cybersecurity professional.</p> <!--This paragraph will be for the 18px subherotext -->
</div>
<div class="flex-container-two">
<img src="./images/portfolioimage.jpg" class="hero-image" >
</div>
</div>
<h1 style="text-align: center;">Recent Projects</h1>
<div class="flex-container-three">
<div class="image-flex-items">
<figure>
<img class="project-images" src="./images/placeholderprojectimage1.jpg" > <!--The images will be for projects and will likely include links underneath as well-->
<figcaption class="image-caption-style">This is placeholder project text</figcaption>
</figure>
<figure>
<img class="project-images" src="./images/projectsplaceholderimage2.jpg" >
<figcaption class="image-caption-style">This is placeholder project text</figcaption>
</figure>
<figure>
<img class="project-images" src="./images/placeholderprojectimage1.jpg" >
<figcaption class="image-caption-style">This is placeholder project text</figcaption>
</figure>
<figure>
<img class="project-images" src="./images/projectsplaceholderimage2.jpg" >
<figcaption class="image-caption-style">This is placeholder project text</figcaption>
</figure>
</div>
</div>
<div class="flex-container-four">
<div class="testimonial-flex-items">
<p class="testimonial-paragraph">This is placeholder text for where endorsements from references will go in the near future.</p>
<p class="testimonial-author">This is a placeholder author name -Whitehawk Writer</p>
</div>
</div>
<div class="flex-container-five">
<div class="calltoaction-paragraph">
<p>To learn more about me and see some of my accomplishments and full work experience check me out at my linkedin profile. Feel free to message me with any ideas, concerns, suggestions.</p>
<button class="calltoaction-button"><a href="https://www.linkedin.com/in/wbray93/" target="_blank">Linkedin Profile</a></button> <!--this will be for theodinprojects signup button i will most likely use this for a contact me for work or interviews idea of a button-->
</div>
</div>
<div class="footer-container">
<div class="flex-container-six">
<footer>
<p>Copyright of William Bray 2022</p>
</footer>
</div>
</div>
</body>
</html>