-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
139 lines (137 loc) · 8.28 KB
/
index.html
File metadata and controls
139 lines (137 loc) · 8.28 KB
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="msvalidate.01" content="E170F3C82982B582595F6B2655F0563E" />
<meta charset="utf-8" />
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=320, height=device-height, target-densitydpi=medium-dpi" />
<title>JD Francis Portfolio</title>
<!-- Bootstrap Core CSS -->
<!-- Normalize.css -->
<link rel="stylesheet" href="css/normalize.min.css">
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<!-- Fonts -->
<link href="http://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css">
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,600,700' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Raleway:500' rel='stylesheet' type='text/css'>
<!-- FontAwesome Icons -->
<link href="css/font-awesome.min.css" rel="stylesheet">
<!-- My CSS -->
<link href="css/styles.css" rel="stylesheet">
<!-- My Favicon -->
<link rel="shortcut icon" href="img/favicon.ico">
</head>
<body>
<nav class="navbar navbar-fixed-top">
<div class="navbar-header">
<a class="navbar-brand" href="#top">
<span class="fname">JD</span> <span class="lname">FRANCIS</span>
</a>
<button type="button" class="navbar-toggle collapsed box-shadow-menu" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" ariexpanded="false">
<span class="sr-only">Toggle navigation</span>
</button>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li class="navlist"><a href="#about">About</a></li>
<li class="navlist"><a href="#block-skills">Skills</a></li>
<li class="navlist"><a href="#portfolio">Portfolio</a></li>
<li class="navlist"><a href="#contact">Contact</a></li>
</ul>
</div>
</nav>
<div class="block-body head-block" id="top">
<div class="center">
<img alt="" class="icon-img" src="img/gameico.gif" />
<h1 class="header"> John David (JD) Francis </h1>
<hr style="margin-bottom:0" class="line-style" >
<hr style="margin-top:4px" class="line-style" >
<h2 class="header"> Web Developer/<br> Game Programmer </h2>
<a class="cta-block" href="#about">
<div class="cta-button blue">Who Am I</div>
</a>
</div>
</div>
<div class="block-body" id="about">
<div class="container">
<div class="about-icon">
<img src="img/headshotPic.jpg" alt="" />
</div>
<div class="about-block">
<h2>Hi There!</h2>
<p class="animate1"> My name is John David Francis, but everyone calls me JD. </p>
<p class="animate1"> I'm currently a third-year programming student at Southern Methodist University studying Computer Science with a Game Development specialization. I am many things including: programming student, gaming fanatic, self-proclaimed nerd, e-sports enthusiast, avid coffee drinker, but most importantly:
<br> I love developing games and websites. </p>
<p class="animate1"> I have a few years of engineering experience, over a year of web development experience, and I am in love with web development, games, and engineering. I live to be creative and thinking outside the box is my forte. One of my greatest strengths in life is my ability to learn new things and adapt to anything.
</p>
</div>
<div class="double-cta-button-container">
<a class="cta-button green green-border animate1" href="#contact">Contact Me <i class="fa fa-envelope"></i></a>
<a class="cta-button blue blue-border animate1" href="#portfolio">See My Work<i class="fa fa-arrow-down"></i></a>
</div>
</div>
</div>
<div class="block-body green" id="block-skills">
<h2 id="h2-skills"> Skills </h2>
<div class="container">
<div class="col-md-4 animate1">
<i class="fa fa-gamepad skill-icon"></i>
<h2> Game Development </h2>
<p> I develop games using C++, Python, Java, and other languages with engines like Unity, PyGame, Processing, Gamemaker, as well as custom engines from scratch. I'm very familiar with OOP and modular programming, as well as good memory management. </p>
</div>
<div class="col-md-4 animate1">
<i class="fa fa-laptop skill-icon"></i>
<h2> Web Development </h2>
<p> I develop User Interfaces (UI) and general front-end for both static and dynamic websites using tools and languages such as HTML5, CSS3, Javascript, JQuery, Bower, Mustache, AngularJS, Bootstrap, the Adobe Creative Suite, and others. I am also very competent with REST APIs. </p>
</div>
<div class="col-md-4 animate1">
<i class="fa fa-terminal skill-icon"></i>
<h2> Software Engineering </h2>
<p> I have extensive knowledge of object-oriented and modular programming, algorithms, memory management, and scrum-agile development methodology. I have experience in multiple different languages including C++, Java, Python, Javascript, among others. I also have a wealth of experience using Git versioning with both Atlassian Stash and GitHub.</p>
</div>
<div class="col-md-12 animate1">
<h2> Want to see more?</h2>
<a class="cta-button green" href="downloads/John_Francis_Resume.pdf" download> My Resume <i class="fa fa-download"></i> </a>
</div>
</div>
</div>
<div class="block-body" id="portfolio">
<h2> My Portfolio </h2>
<h4> With links to the code for each <br> Or visit my GitHub: <a href="https://github.com/DejayJD" target="_top"><i class="fa fa-github"></i></a> </h4>
<div class="container">
<div id="portfolio-block-template"></div>
</div>
<div id="portfolio-modal-template"></div>
</div>
<div class="block-body contact-block orange" id="contact">
<h2 style="margin-bottom:40px"> Contact Me </h2>
<div class="form-style-8">
<form action="//formspree.io/jdfrancis@smu.edu" method="POST">
<input type="text" placeholder="Name" name="name" />
<input type="text" placeholder="Email" name="_replyto" />
<input type="text" placeholder="Subject" name="_subject" />
<input type="text" name="_gotcha" style="display:none" />
<input type="hidden" name="_next" value="//site.io/thanks.html" />
<textarea placeholder="Type your message here..." name="message" onkeyup="adjust_textarea(this)"></textarea>
<button class="cta-button orange" type="submit">Send <i class="fa fa-paper-plane send-icon"></i></button>
</form>
</div>
</div>
<footer class="footer">
<a href="https://github.com/DejayJD" target="_top"><i class="fa fa-github"></i></a>
<a href="https://www.linkedin.com/in/johndfrancis" target="_top"><i class="fa fa-linkedin"></i></a>
<a href="https://www.facebook.com/bombbomb45" target="_top"><i style="padding-left:6px;" class="fa fa-facebook"></i></a>
<a href="mailto:jdfrancis@smu.edu" target="_top"><i class="fa fa-envelope"></i></a>
<hr style="width:200px;">
<p><a style="color:#E0DFDF" href="mailto:jdfrancis@smu.edu"> jdfrancis@smu.edu </a> | 817-682-6693 </p>
</footer>
<!-- Latest compiled and minified JavaScript -->
<script src="js/jquery.min.js"></script>
<script src="js/jquery.easing.min.js"></script>
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<!-- Mustache -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/mustache.js/0.8.1/mustache.min.js"></script>
<!-- My JavaScript -->
<script src="js/site.min.js"></script>
</body>