Skip to content

Instantly share code, notes, and snippets.

@sethxd

sethxd/index.html

Created August 27, 2015 19:05
Show Gist options
  • Save sethxd/df27d90fca173eaa4189 to your computer and use it in GitHub Desktop.
Save sethxd/df27d90fca173eaa4189 to your computer and use it in GitHub Desktop.
Download ZIP
sethxd portfolio
Raw
index.html
<div class='container-fluid'>
<div class="row">
<div class="col-md-12">
<nav class="navbar navbar-default" role="navigation">
<div class='col-md-12'>
<div class="navbar-header">
</button> <a class="navbar-brand" href="#">Seth's Portfolio</a>
</div>
<ul class="nav navbar-nav navbar-right">
<li>
<a href="#">About</a>
</li>
<li>
<a href="#social">Social Media</a>
</li>
<li>
<a href="#">Portfolio</a>
</li>
</ul>
</div>
</nav>
</div>
</div>
<div class="section about">
<h2>Seth DeHaan </h2>
<p>
I'm a <a href='http://freecodecamp.com/' target='_blank'>coder</a>. This space is just a placeholder/skeleton.
</p>
</div>
<div class="portfolio row">
<div class="col-sm-4">
<h2> Sample Post 1 </h2>
<img class='img-responsive' src='http://lorempixel.com/720/480'>
<p>
Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
</p>
</div>
<div class="col-sm-4">
<h2> Sample Post 2</h2>
<img class='img-responsive' src='http://unsplash.it/720/480'>
<p>
Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
</p>
</div>
<div class="col-sm-4">
<h2> Sample Post 3 </h2>
<img class='img-responsive' src='http://lorempixel.com/720/480'>
<p>
Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
</p>
</div>
</div>
<div id="social" class='jumbotron'>
<h2 class='text-center'>Contact me</h2><br>
<div class='row'>
<div class='col-md-3'>
<a target="_blank" href="http://www.twitter.com/sethdehaan"><button class='btn btn-block' href='#' target='_blank'>Twitter</button></a>
</div>
<div class='col-md-3'>
<button class='btn btn-block' href='#' target='_blank'>LinkedIn</button>
</div>
<div class='col-md-3'>
<a target="_blank" href="https://github.com/sethxd"><button class='btn btn-block' href='#' target='_blank'>GitHub</button></a>
</div>
<div class='col-md-3'>
<button class='btn btn-block' href='#' target='_blank'>Free Code Camp</button>
</div>
</div>
</div>
</div>
Raw
style.css
body {
font-family: 'Open Sans', sans-serif;
margin:0;
padding:0;
}
.container-fluid {
padding:0;
overflow:hidden;
}
.about {
text-align:center;
background: url(http://lorempixel.com/g/1920/900/nature/) no-repeat center center fixed;
color: #fff;
}
.portfolio h2 {
text-align:center
}
.portfolio p {
padding:10px;
text-align:center;
}
.section {
margin-top:-50px;
padding-top:50px;
height:355px;
background-size:cover;
}
Raw
styles
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<link href="//cdnjs.cloudflare.com/ajax/libs/animate.css/3.2.3/animate.min.css" rel="stylesheet" />
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment