-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
152 lines (119 loc) · 5.85 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
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
<!DOCTYPE html>
<html lang="en">
<!--
Author: Tianna Hatch
Last Updated Date: 03/07/2022
Filename: index.html
-->
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>T's Portfolio</title>
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/normalize/7.0.0/normalize.min.css">
<!--- social icons --->
<script src="https://kit.fontawesome.com/fc8bcfb164.js" crossorigin="anonymous"></script>
<!--- Font Link --->
<link href="https://fonts.googleapis.com/css?family=Source+Code+Pro:400,900|Source+Sans+Pro:300,900&display=swap" rel="stylesheet">
<!--- link CSS Style Sheets --->
<link rel="stylesheet" href="style.css">
</head>
<body>
<header class="header">
<div class="logo">
<!--- insert logo img here-->
</div>
<button class="nav-toggle" aria-label="toggle navigation">
<span class="hamburger"></span>
</button>
<!--- navigation --->
<nav class="nav">
<ul class="nav__list">
<li class="nav__item"><a href="#home" class="nav__link">Home</a></li>
<li class="nav__item"><a href="#services" class="nav__link">Skills</a></li>
<li class="nav__item"><a href="#about" class="nav__link">About Me</a></li>
<li class="nav__item"><a href="#work" class="nav__link">My Work</a></li>
<li class="nav__item"><a href="#footer" class="nav__link">Contact</a></li>
</ul>
</nav>
</header>
<!--- intro/home --->
<section class="intro" id="home">
<h1 class="section__title section__title--intro">
Hello, I am <strong>Tianna</strong>
</h1>
<p class="section__subtitle section__subtitle--intro">NY Based Developer</p>
<img src="media/profile.JPG" alt="a photo of T" class="intro__img">
</section>
<!--- My Services --->
<section class="my-services" id="services">
<!---<h2 class="section__title section__title--services">Skills</h2> --->
<p class="section__subtitle section__subtitle--services">Skills</p>
<div class="services">
<div class="service">
<p>Unreal Engine 5 C++ React Native
<br>JavaScript Python HTML/CSS
SQL Figma</br></p>
<p>Front and Back End Development <br>UI/UX Design
Game Design </br></p>
</div> <!--- column 1 --->
</div>
<a href="#work" class=btn>My Work</a>
</section>
<!--- About Me --->
<section class="about-me" id="about">
<h2 class="section__title section__title--about">About Me</h2>
<p class="section__subtitle section__subtitle--about">NY Based Developer</p>
<div class="about-me__body">
<p>In 2014, during my senior year of high school, I enlisted into the U.S. ARMY National Guard, Simultaneous Membership Program (SMP). While attending
Buffalo State College I earned ROTC commission in 2017. I have served as Platoon Leader for A Co. 642nd Aviation Support Battalion as well as Executive
Officer for A Co. 642nd Aviation Support Battalion. I've also earned my Pathfinder additional skill identifier.
In 2017, I earned my first Bachelors Degree in Sociology. In 2022, I earned a secondary Bachelor’s Degree in Computer Information Systems with a 4.0 Major GPA.</p>
</div>
<img src="media/logo.jpg" alt="profile photo" class="about-me__img" />
</section>
<!--- My Work--->
<section class="my-work" id="work">
<h2 class="section__title section__title--work">My Work</h2>
<p class="section__subtitle section__subtitle--work"></p>
<div class="portfolio">
<!--- Glass UI Design Portfolio Piece -->
<a target="_blank" rel="noopener noreferrer" href="https://github.com/tiannacodes/glass-ui-figma/blob/main/glass.css" class="portfolio__item">
<img src="media/glass1.png" alt="" class="portfolio__img">
<!--- Tesla App iOS React Native App Portfolio Piece -->
<a target="_blank" rel="noopener noreferrer" href="https://github.com/tiannacodes/TeslaClone" class="portfolio__item">
<img src="media/port.PNG" alt="" class="portfolio__img">
</a>
<!--- Midnight Society iOS Reach Native App Portfolio Piece -->
<a target="_blank" rel="noopener noreferrer" href="https://github.com/tiannacodes/12am" class="portfolio__item">
<img src="media/port2.PNG" alt="" class="portfolio__img">
<!--- Midnight Society iOS Reach Native App Portfolio Piece -->
<a target="_blank" rel="noopener noreferrer" href="https://github.com/tiannacodes/12am" class="portfolio__item">
<img src="media/port3.PNG" alt="" class="portfolio__img">
<!--- Gold Core Adobe Illustrator -->
<a target="_blank" rel="noopener noreferrer" class="portfolio__item">
<img src="media/gold.png" alt="" class="portfolio__img">
<!--- T.H. Adobe Illustrator -->
<a target="_blank" rel="noopener noreferrer" class="portfolio__item">
<img src="media/th.png" alt="" class="portfolio__img">
</div>
</section>
<!--- Footer--->
<footer class="footer" id="footer">
<ul class="social-list">
<li class=social-list__item>
<a target="_blank" rel="noopener noreferrer" class="social-list__link"
href="https://www.linkedin.com/in/t-hatch/">
<i class="fa-brands fa-linkedin"></i>
</a>
</li>
<li class=social-list__item>
<a target="_blank" rel="noopener noreferrer" class="social-list__link" href="https://github.com/tiannacodes">
<i class="fa-brands fa-github"></i>
</a>
</li>
</ul>
</footer>
<script src="index.js"></script>
</body>
</html>