-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
145 lines (136 loc) · 6.64 KB
/
index.html
File metadata and controls
145 lines (136 loc) · 6.64 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
140
141
142
143
144
145
<!DOCTYPE html>
<html lang="en">
<html>
<head>
<title>Free Code Camp Portfolio Page</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Latest compiled and minified Bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<!-- Local CSS stylesheet -->
<link rel="stylesheet" href="css/stylesheet.css">
<!-- Latest compiled and minified JQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<script src="https://use.fontawesome.com/916b8f404b.js"></script>
<script src="https://use.typekit.net/sac6uzj.js"></script>
<script>try{Typekit.load({ async: true });}catch(e){}</script>
</head>
<body>
<div class="wrapper" id="wrapper">
<!--intro section-->
<div class=jumbotron>
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<span class="navbar-brand">Mark Denton</span>
</div>
<div class="collapse navbar-collapse rightmenu" id="myNavbar">
<ul class="nav navbar-nav navbar-right">
<li><a href="#About">About Me</a></li>
<li><a href="#Portfolio">Portfolio</a></li>
<li><a href="#Contact">Contact</a></li>
</ul>
</div>
</div>
</nav>
<div class=container>
<h1>Hey there. Welcome.</h1>
<h2>You've found the portfolio for my freeCodeCamp projects.</h2>
<div class="btn-placement">
<a href="#About" class="btn btn-more btn-lg">Read More</a>
</div>
</div>
</div>
<!--about me section-->
<div class="container-fluid about">
<a class="anchor" id="About"></a>
<div class="row">
<div class="col-xs-12 col-sm-4"><img class="img-responsive img-circle center-block" src="images/Mark_300x300.jpg"></img>
</div>
<div class="col-xs-12 col-sm-8">
<h2>About Me</h2>
<h4>I'm Mark Denton, a writer and marketing strategist in Austin, Texas. As the owner of <a href="http://www.contentandcontext.com">Content & Context</a>, I help businesses plan and execute marketing and communications programs covering a complete range of traditional and digital tactics.
<h4>I've known the basics of website development since the earliest days of HTML. Now I'm working on expanding my coding knowledge in my spare time, with an emphasis on front-end development.</h4></div>
</div>
</div>
<!--portfolio section-->
<div class="container-fluid portfolio">
<div class="row">
<div class="col-xs-12 col-md-9">
<a class="anchor" id="Portfolio"></a>
<h2>Portfolio</h2>
<h4 style="margin-bottom:25px;">After trying a couple of different tools for learning to code, I'm now focused on completing the thorough and intensive <a href="http://www.freecodecamp.com"> freeCodeCamp</a> program. This portfolio site is where I'm posting the projects that I complete as part of the fCC courses over the coming months.</h4>
</div>
</div>
<div class="row auto-clear">
<div class="col-xs-12 col-sm-6 col-md-3">
<div class="thumbnail">
<a href="https://dentonmark.github.io/local-weather-project/"><img src="images/WeatherApp_600x475.png"></a>
<div class="caption">
<h4 class="caption-head"><a href="https://dentonmark.github.io/local-weather-project/">Local Weather App</a></h4>
<p class="caption-text">An app that detects a user's location and displays the local weather, built with the DarkSky and Google Maps APIs.</p>
</div>
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-3">
<div class="thumbnail">
<a href="https://dentonmark.github.io/thoughts-on-design/"><img src="images/DesignThoughts_600x475.png"></a>
<div class="caption">
<h4 class="caption-head"><a href="https://dentonmark.github.io/thoughts-on-design/">Random Design Thoughts</a></h4>
<p class="caption-text">A random quote generator built using the Quotes on Design API. First project using JavaScript and JQuery.</p>
</div>
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-3">
<div class="thumbnail">
<a href="https://dentonmark.github.io/LuckyCat/"><img src="images/LuckyCat_600x475.png"></a>
<div class="caption">
<h4 class="caption-head"><a href="https://dentonmark.github.io/LuckyCat/">Tribute Page</a></h4>
<p class="caption-text">My first responsive site built from scratch in CSS, using Boostrap.</p>
</div>
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-3">
<div class="thumbnail">
<img src="http://www.placehold.it/600x475.jpg">
<div class="caption">
<h4 class="caption-head">Future Project</h4>
<p class="caption-text">I'll post another project here in the future.</p>
</div>
</div>
</div>
</div>
</div>
<!--contact me section-->
<div class="container-fluid contact">
<div class="row">
<div class="col-xs-12">
<a class="anchor" id="Contact"></a>
<h2>Contact</h2>
<h4>Want to get in touch or learn more? Here are a few of the places you can find me.</h4>
</div>
</div>
<div class="contact-icons">
<div class="col-xs-12">
<a href="https://www.linkedin.com/in/markdenton"><i class="fa fa-linkedin-square fa-2x"></i></a>
<a href="https://twitter.com/contentcontext"><i class="fa fa-twitter-square fa-2x"></i></a>
<a href="https://www.instagram.com/contentandcontext/"><i class="fa fa-instagram fa-2x"></i></a>
<a href="https://www.facebook.com/ContentAndContext/"><i class="fa fa-facebook-square fa-2x"></i></a>
<a href="https://github.com/dentonmark"><i class="fa fa-github-square fa-2x"></i></a>
</div>
</div>
</div>
<!--footer-->
<div class="container-fluid footer">
<p>Site design and production by Mark Denton. Header image from <a href="http://deathtothestockphoto.com/">Death to Stock</a>.</p>
</div>
</div>
</body>
</html>