<!DOCTYPE html>
<html class="no-js">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>{% block title %}TwoCans{% endblock %}</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href='http://fonts.googleapis.com/css?family=Varela+Round' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="/static/css/normalize.min.css">
<link rel="stylesheet" href="/static/css/main.css">
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<script>window.html5 || document.write('<script src="/static/js/vendor/html5shiv.js"><\/script>')</script>
<![endif]-->
</head>
<body>
<header>
<div class="row">
<div class="grid-33">
<a href="{{ url_for('index') }}" class="icon-logo"></a>
</div>
<div class="grid-33">
<!-- Say Hi -->
<h1>Hello{% if current_user.is_authenticated %} {{ current_user.username }}{% endif %}!</h1>
</div>
<div class="grid-33">
<!-- Log in/Log out -->
{% if current_user.is_authenticated %}
<a href="{{ url_for('logout') }}" class="icon-power" title="Log out"></a>
{% else %}
<a href="{{ url_for('login') }}" class="icon-power" title="Log in"></a>
<a href="{{ url_for('register') }}" class="icon-profile" title="Register"></a>
{% endif %}
</div>
</div>
</header>
<!-- Flash messages -->
{% with messages = get_flashed_messages(with_categories=True) %}
{% if messages %}
{% for category, message in messages %}
<div class="notification {{ category }}">{{ message }}</div>
{% endfor %}
{% endif %}
{% endwith %}
<div class="row">
<div class="main">
<nav>
<a href="{{ url_for('index') }}">All</a>
{% if current_user.is_authenticated %}
<a href="{{ url_for('stream', username=current_user.username) }}">Following</a>
<a href="{{ url_for('post') }}" class="new">Create New Post</a>
{% endif %}
</nav>
{% block content %} {% endblock %}
</div>
</div>
<footer>
<div class="row">
<p>A Social App built with Flask<br>by <a href="http://teamtreehouse.com">Treehouse</a></p>
</div>
</footer>
<script src="/static/js/vendor/disTime.min.js"></script>
<script src="/static/js/main.js"></script>
</body>
</html>
