-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
153 lines (137 loc) · 8.01 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
153
<!DOCTYPE html>
<html >
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" id = "lobster">
<link href="https://fonts.googleapis.com/css?family=Questrial" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.rawgit.com/konpa/devicon/master/devicon.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel='stylesheet prefetch' href='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css'>
<link rel="stylesheet" href="css/style.css">
<title>Matt White Portfolio</title>
</head>
<body>
<div id="header" class="container-fluid">
<img id="profilePicture"src="ProfilePhoto.jpg" class="img-circle img-responsive center"></img>
</div>
<div class = "container-fluid text-center hideme" id="introduction">
<h1>Matt White</h1>
<h2>Senior at Sac State studying Computer Science</h2>
<h2>Aspiring Web Developer and Software Engineer seeking employment in the California Bay Area</h2>
</div>
<br><br><br><br><br>
<div id = "previousExperience" class = "containter-fluid hideme">
<h1>Previous work experience</h1>
<hr class = "divider"></hr>
<i class="devicon-oracle-original" style="font-size:72px"></i>
<h2>Documentation Intern at Smart ERP Solutions (3 Months, Summer 2013)</h2>
<h2>Quality Assurance Intern at Smart ERP Solutions (3 Months, Summer 2014)</h2>
<h2>Student Assistant at Legislative Data Center (LDC) (3 Months, Summer 2015)</h2>
<br><br><br><br><br>
</div>
<div id="languageIcons" class = "container-fluid hideme">
<h2>Some languages I've enjoyed learning so far!</h2>
<div class="row" id ="languageRow1">
<i class="devicon-javascript-plain .col-md-2" style="font-size:72px"></i>
<i class="devicon-bootstrap-plain .col-md-2" style="font-size:72px"></i>
<i class="devicon-css3-plain .col-md-2" style="font-size:72px"></i>
<i class="devicon-html5-plain .col-md-2" style="font-size:72px"></i>
<i class="devicon-java-plain .col-md-2" style="font-size:72px"></i>
<i class="devicon-jquery-plain .col-md-2" style="font-size:72px"></i>
</div>
<h2>Some languages I'm excited to start learning!</h2>
<div class="row" id ="languageRow2">
<i class="devicon-angularjs-plain" style="font-size:72px"></i>
<i class="devicon-d3js-plain" style="font-size:72px"></i>
<i class="devicon-mongodb-plain" style="font-size:72px"></i>
<i class="devicon-nodejs-plain" style="font-size:72px"></i>
<i class="devicon-python-plain" style="font-size:72px"></i>
<i class="devicon-sass-original" style="font-size:72px"></i>
<i class="devicon-react-original" style="font-size:72px"></i>
</div>
</div>
<div class = "container-fluid" id = "projects">
<h1>Projects</h1>
<div id="accordion" role="tablist" aria-multiselectable="true">
<div class="card">
<div class="card-header" role="tab">
<h5 class="mb-0">
<a data-toggle="collapse" data-parent="#accordion" href="#randomQuoteGenerator" aria-expanded="false" aria-controls="collapseOne">
<h3>Random Quote Generator</h3>
</a>
</h5>
</div>
<div id="randomQuoteGenerator" class="collapse" role="tabpanel" aria-labelledby="headingOne">
<div class="card-block">
<p data-height="673" data-theme-id="dark" data-slug-hash="RGRwgA" data-default-tab="result" data-user="Matt-White12" data-embed-version="2" data-pen-title="Random Quote Machine" class="codepen">See the Pen <a href="https://codepen.io/Matt-White12/pen/RGRwgA/">Random Quote Machine</a> by Matt White (<a href="http://codepen.io/Matt-White12">@Matt-White12</a>) on <a href="http://codepen.io">CodePen</a>.</p>
<script async src="https://production-assets.codepen.io/assets/embed/ei.js"></script>
</div>
</div>
<div class="card">
<div class="card-header" role="tab">
<h5 class="mb-0">
<a data-toggle="collapse" data-parent="#accordion" href="#sudokuSolver" aria-expanded="false" aria-controls="collapseOne">
<h3>Sudoku Solver</h3>
</a>
</h5>
</div>
<div id="sudokuSolver" class="collapse" role="tabpanel" aria-labelledby="headingOne">
<div class="card-block">
<p data-height="561" data-theme-id="dark" data-slug-hash="zoYzxL" data-default-tab="result" data-user="Matt-White12" data-embed-version="2" data-pen-title="sudoku solver" class="codepen">See the Pen <a href="https://codepen.io/Matt-White12/pen/zoYzxL/">sudoku solver</a> by Matt White (<a href="http://codepen.io/Matt-White12">@Matt-White12</a>) on <a href="http://codepen.io">CodePen</a>.</p>
<script async src="https://production-assets.codepen.io/assets/embed/ei.js"></script>
</div>
</div>
</div>
<div class="card">
<div class="card-header" role="tab" id="headingOne">
<h5 class="mb-0">
<a data-toggle="collapse" data-parent="#accordion" href="#recipeBook" aria-expanded="false" aria-controls="collapseOne">
<h3>Recipe Book</h3>
</a>
</h5>
</div>
<div id="recipeBook" class="collapse" role="tabpanel" aria-labelledby="headingOne">
<div class="card-block">
<p data-height="980" data-theme-id="dark" data-slug-hash="pNyYwM" data-default-tab="result" data-user="Matt-White12" data-embed-version="2" data-pen-title="pNyYwM" class="codepen">See the Pen <a href="https://codepen.io/Matt-White12/pen/pNyYwM/">pNyYwM</a> by Matt White (<a href="http://codepen.io/Matt-White12">@Matt-White12</a>) on <a href="http://codepen.io">CodePen</a>.</p>
<script async src="https://production-assets.codepen.io/assets/embed/ei.js"></script>
</div>
</div>
</div>
</div>
</div>
<div class ="footer" id="contact">
<a href="https://www.linkedin.com/in/matthew-white-58482ab7" target="_blank"><i class="col-xs-3 fa fa-linkedin-square" style="font-size:48px"></i></a>
<a href="https://github.com/Matt-White12" target="_blank"><i class="col-xs-3 fa fa-github" style="font-size:48px"></i></a>
<a href="http://codepen.io/Matt-White12/" target="_blank"><i class="col-xs-3 fa fa fa-codepen" style="font-size:48px"></i></a>
<a id ="email" href="#" data-toggle="popover" title="Popover Header" data-content="Some content inside the popover"><i class="col-xs-3 fa fa-envelope" aria-hidden="true" style="font-size:48px"></i></a>
</div>
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4>email me at [email protected]!</h4>
</div>
<div class="modal-body">
<form role="form">
<div class="form-group">
<input type="text" class="form-control" id="senderEmail" placeholder="Enter email address">
</div>
<div class="form-group">
<textarea class="form-control" rows ="15" id="senderEmail" placeholder="Whats up!"></textarea>
</div>
</form>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-danger btn-default pull-left" data-dismiss="modal"><span class="glyphicon glyphicon-remove"></span> Cancel</button>
<button type="submit" class="btn btn-success btn-default pull-left"><span class="glyphicon glyphicon-envelope"></span> Send!</button>
</div>
</div>
</div>
</div>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js'></script>
<script src='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js'></script>
<script src="js/index.js"></script>
</body>
</html>