Navigation Menu

Skip to content

Instantly share code, notes, and snippets.

@LucasSeveryn

LucasSeveryn/index Secret

Created May 31, 2013 23:24
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save LucasSeveryn/d1590bcafbf6e23b1239 to your computer and use it in GitHub Desktop.
Save LucasSeveryn/d1590bcafbf6e23b1239 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
index
<!DOCTYPE html>
<html>
<head>
<title>ActRecognitionWeb</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="http://code.jquery.com/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/backbone.js"></script>
<script src="js/underscore.js"></script>
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
<style type='text/css'>
html{
height: 100%;
}
body {
background-color: #FFF;
height: 100%;
}
#login-screen
{
background-image: url('img/login_background.jpg');
padding-top: 40px;
height: 100%;
padding: 60px;
padding-right: 200px;
margin-bottom: 30px;
font-size: 18px;
font-weight: 200;
line-height: 30px;
}
.container-fluid
{
padding-top: 40px;
height: 100%;
padding: 60px;
padding-right: 200px;
margin-bottom: 30px;
font-size: 18px;
font-weight: 200;
line-height: 30px;
}
#login-sidebar
{
text-align: right;
opacity:0.8;
padding-top: 10%;
}
.navbar .brand
{
padding-left: 30px;
}
h1 {
margin-bottom: 0;
font-size: 60px;
line-height: 1;
letter-spacing: -1px;
color: inherit;
}
</style>
</head>
<body>
<div class="container">
<div class='navbar navbar-inverse navbar-fixed-top'>
<div class='navbar-inner' style="height: auto;" >
<a class="brand" href="#">ActRecognition</a>
<ul class="nav" data-bind="visible: loggedIn()">
<li class="active"><a href="#">Summary</a></li>
<li><a href="#">Challenges</a></li>
<li><a href="#">Routes</a></li>
</li>
</ul>
<ul class="nav pull-right" data-bind="visible: loggedIn()">
<li class="dropdown" >
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<span data-bind="text: userName"></span>
<b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li><a tabindex="-1" href="#">Settings</a></li>
<li class="divider"></li>
<li><a tabindex="-1" href="#">Log Out</a></li>
</ul>
</ul>
</div>
</div>
</div>
<div class="container-fluid" id="login-screen" data-bind="visible: !loggedIn()">
<div class="row-fluid">
<div class="span10">
<h1>Log in</h1>
<p>To see your daily, weekly and overall statistics</p>
</div>
<div class="span2" id="login-sidebar">
<div class="login-form">
<!-- <form> -->
<fieldset>
<div class="clearfix">
<input type="text" placeholder="Username">
</div>
<div class="clearfix">
<input type="password" placeholder="Password">
</div>
<button class="btn primary" data-bind="click: logIn">Log in</button>
</fieldset>
<!-- </form> -->
</div>
</div>
</div>
</div>
<div class="container-fluid" id="small-screen" data-bind="visible: loggedIn()">
<div class="row-fluid">
<div class="span10">
<h1>Logged in</h1>
<p>Hai.</p>
</div>
<div class="span2" id="login-sidebar">
Small span
</div>
</div>
</div>
</body>
<script type='text/javascript' src='js/knockout-2.2.1.js'></script>
<script src='js/viewModel.js'></script>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment