Skip to content

Instantly share code, notes, and snippets.

@andrefe90
Created July 4, 2015 11:49
Show Gist options
  • Save andrefe90/fcea09ceac3111aca652 to your computer and use it in GitHub Desktop.
Save andrefe90/fcea09ceac3111aca652 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Hello World!</title>
<!-- Bootstrap core CSS -->
<link href="css/normalize.css" rel="stylesheet">
<link href="css/bootstrap.css" rel="stylesheet">
<link href="css/styles.css" rel="stylesheet">
<!-- Just for debugging purposes. Don't actually copy this line! -->
<!--[if lt IE 9]><script src="../../docs-assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="nav">
<a href="#">Home</a>
<ul>
<li><a href="#">Contact</a></li>
<li><a href="#">Project Name</a></li>
<li><a href="#">Random link</a></li>
</ul>
</div>
<!-- Main jumbotron for a primary marketing message or call to action -->
<div class="jumbotron">
<div class="container">
<h1>Andre Feldhuis</h1>
<a href="about.html">More about me</a>
<a href="contact.html">My contacts and such</a>
<p><strong>This is hopefully going to look good at some point in the end</strong></p>
<p>Then I will probably also be more confident about the way i write texts and present my so-called portfolio.</p>
</div>
</div>
<div class="container">
<!-- Example row of columns -->
<div class="row">
<div class="col-md-4">
<h2>Portfolio Concept</h2>
<p>One of the websites that I would like to have in my concept is a site similar to www.heuteinhamburg.de. Just something where you can list events, parties, projects and the like while giving everything a simple, intuitive and novel look that stays in your mind and that is not readily forgotten after the user has left the website</p>
<p><a class="btn btn-default" href="#" role="button">View details &raquo;</a></p>
</div>
<div class="col-md-4">
<h2>Project Goals</h2>
<p>My course officially runs for 6 months but i want to try to do a lot of work during july and august as I am basically free then. From september on, I will either continue to study or work. Depending on which it will be i might have to go a bit slower then.</p>
<p><a class="btn btn-default" href="#" role="button">View details &raquo;</a></p>
</div>
<div class="col-md-4">
<h2>Course Goals</h2>
<p>I am not changing careers, because I dont even have one yet. I would like to build something own and me and my friends already had some nice ideas, but its just impossible to do anything today without knowing how to write at least some code. I would also find it extremely helpful to be able to earn some extra money as a freelancer all the while doing something I (probabyl) like and which will be helpful for me. So in that sense I am trying to enhance my skill set. And in the future, when I have succesfully finished this course I might even go further and start a mobile developing course.</p>
<p><a class="btn btn-default" href="#" role="button">View details &raquo;</a></p>
</div>
</div>
<hr>
</div> <!-- /container -->
<!--
================================================== -->
<!-- Can place script tags with JavaScript files here -->
</body>
</html>
.jumbotron {
background-image:url("../img/landscape.jpg");
background-size: cover;
}
.jumbotron p{
color: white;
}
.nav ul li {
display: inline-block;
float: right;
width:
}
.nav {
background-color: black;
position: fixed;
width: 100%;
top: 0;
}
.nav ul li a {
color: white;
text-transform: uppercase;
padding: 20px 10px 20px;
top: 0;
}
.nav a {
color: white;
text-transform: uppercase;
padding: 100px 10px 20px;
top: 0;
transition: color 600ms;
}
.nav a:hover {
color: #ff0;
text-decoration: none;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment