Re-write of base template using bootstrap 2

pull/59/head
Michael Jett 2012-04-19 16:27:25 -04:00
parent b38c8c18d6
commit 2573c98c2d
4 changed files with 104 additions and 101 deletions

View File

@ -10,47 +10,42 @@
<meta charset="utf-8"> <meta charset="utf-8">
<title>OpenID Connect - ${title}</title> <title>OpenID Connect - ${title}</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content=""> <meta name="description" content="">
<meta name="author" content=""> <meta name="author" content="">
<!-- Le javascript --> <!-- Le styles -->
<script src="http://code.jquery.com/jquery-1.7.min.js"></script> <link href="resources/boostrap2/css/bootstrap.css" rel="stylesheet">
<script src="resources/js/app.js"></script> <link href="resources/boostrap2/css/bootstrap-responsive.css" rel="stylesheet">
<script src="resources/js/tmpl.js"></script>
<script src="resources/bootstrap/js/bootstrap-modal.js"></script> <style type="text/css">
<script src="resources/bootstrap/js/bootstrap-alerts.js"></script> body {
<script src="resources/bootstrap/js/bootstrap-twipsy.js"></script> padding-top: 60px;
<script src="resources/bootstrap/js/bootstrap-popover.js"></script> padding-bottom: 40px;
<script src="resources/bootstrap/js/bootstrap-dropdown.js"></script> }
<script src="resources/bootstrap/js/bootstrap-scrollspy.js"></script> .sidebar-nav {
<script src="resources/bootstrap/js/bootstrap-tabs.js"></script> padding: 9px 0;
<script src="resources/bootstrap/js/bootstrap-buttons.js"></script> }
h1,label {
text-shadow: 1px 1px 1px #FFFFFF;
}
<!-- Le HTML5 shim, for IE6-8 support of HTML elements --> .brand {
background: url("resources/images/openid_small.png") no-repeat scroll 7px 7px transparent;
}
</style>
<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]> <!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script> <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]--> <![endif]-->
<!-- Le styles -->
<link href="resources/bootstrap/bootstrap.css" rel="stylesheet">
<style type="text/css">
body {
padding-top: 60px;
}
.logo {
background: url("resources/images/openid_small.png") no-repeat left center;
padding-left: 30px;
}
</style>
<!-- Le fav and touch icons --> <!-- Le fav and touch icons -->
<link rel="shortcut icon" href="images/favicon.ico"> <link rel="shortcut icon" href="../boostrap2/ico/favicon.ico">
<link rel="apple-touch-icon" href="images/apple-touch-icon.png"> <link rel="apple-touch-icon-precomposed" sizes="114x114" href="../boostrap2/ico/apple-touch-icon-114-precomposed.png">
<link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png"> <link rel="apple-touch-icon-precomposed" sizes="72x72" href="../boostrap2/ico/apple-touch-icon-72-precomposed.png">
<link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png"> <link rel="apple-touch-icon-precomposed" href="../boostrap2/ico/apple-touch-icon-57-precomposed.png">
</head> </head>
<body> <body>

View File

@ -1,16 +1,14 @@
<div class="sidebar"> <div class="span2">
<div class="well"> <div class="well sidebar-nav">
<h5>Administrative</h5> <ul class="nav nav-list">
<ul> <li class="nav-header">Administrative</li>
<li><a href="admin/manage/clients">Manage Clients</a></li> <li><a href="admin/manage/clients">Manage Clients</a></li>
<li><a href="#">White Lists</a></li> <li><a href="#">White Lists</a></li>
<li><a href="#">Black Lists</a></li> <li><a href="#">Black Lists</a></li>
</ul> <li class="nav-header">Personal</li>
<h5>Personal</h5>
<ul>
<li><a href="#">Manage Sites</a></li> <li><a href="#">Manage Sites</a></li>
<li><a href="#">Manage Active Tokens</a></li> <li><a href="#">Manage Active Tokens</a></li>
<li><a href="#">Profile</a></li> <li><a href="#">Manage Profiles</a></li>
</ul> </ul>
</div> </div><!--/.well -->
</div> </div><!--/span-->

View File

@ -1,14 +1,21 @@
<div class="topbar"> <div class="navbar navbar-fixed-top">
<div class="topbar-inner"> <div class="navbar-inner">
<div class="container-fluid"> <div class="container-fluid">
<a class="brand" href="#"><span class="logo">OpenID Connect Server</span></a> <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<a class="brand" style="padding-left: 35px" href="#">OpenID Connect Server</a>
<div class="nav-collapse">
<ul class="nav"> <ul class="nav">
<li class="active"><a href="#">Home</a></li> <li class="active"><a href="#">Home</a></li>
<li><a href="#about">About</a></li> <li><a href="#about">About</a></li>
<li><a href="#about">Statistics</a></li> <li><a href="#contact">Statistics</a></li>
<li><a href="#contact">Contact</a></li> <li><a href="#contact">Contact</a></li>
</ul> </ul>
<p class="pull-right">Logged in as <a href="#">username</a></p> <p class="navbar-text pull-right">Logged in as <a href="#">username</a></p>
</div><!--/.nav-collapse -->
</div> </div>
</div> </div>
</div> </div>

View File

@ -1,24 +1,26 @@
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib prefix="o" tagdir="/WEB-INF/tags" %> <%@ taglib prefix="o" tagdir="/WEB-INF/tags" %>
<o:header title="welcome" /> <o:header title="welcome"/>
<o:topbar/> <o:topbar/>
<div class="container-fluid"> <div class="container-fluid">
<div class="row-fluid">
<o:sidebar/> <o:sidebar/>
<div class="content"> <div class="span10">
<!-- Main hero unit for a primary marketing message or call to action --> <!-- Main hero unit for a primary marketing message or call to action -->
<div class="hero-unit"> <div class="hero-unit">
<h1>Welcome, User Name!</h1> <h1>Welcome, User Name!</h1>
<p>Can't remember your passwords? Tired of filling out registration forms? <p>Can't remember your passwords? Tired of filling out registration forms?
OpenID is a <strong>safe</strong>, <strong>faster</strong>, and <strong>easier</strong> way to log in to OpenID is a <strong>safe</strong>, <strong>faster</strong>, and <strong>easier</strong> way to log
in to
web sites.</p> web sites.</p>
<p><a class="btn primary large" href="http://openid.net/connect/">Learn more &raquo;</a></p> <p><a class="btn btn-primary btn-large" href="http://openid.net/connect/">Learn more &raquo;</a></p>
</div> </div>
<!-- Example row of columns --> <!-- Example row of columns -->
<div class="row"> <div class="row">
<div class="span8"> <div class="span6">
<h2>About</h2> <h2>About</h2>
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo,
@ -29,7 +31,7 @@
<p><a class="btn" href="#">More &raquo;</a></p> <p><a class="btn" href="#">More &raquo;</a></p>
</div> </div>
<div class="span8"> <div class="span6">
<h2>Contact</h2> <h2>Contact</h2>
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo,
@ -45,17 +47,18 @@
<hr> <hr>
<!-- Example row of columns --> <!-- Example row of columns -->
<div class="row"> <div class="row">
<div class="span16"> <div class="span12">
<h2>Current Statistics</h2> <h2>Current Statistics</h2>
<p>You'll be keen to know that there have been <span class="label notice">4720</span> users of this <p>You'll be keen to know that there have been <span class="label label-info">4720</span> users of this
system who have logged in to system who have logged in to
<span class="label notice">203</span> <span class="label label-info">203</span>
total sites, for a total of <span class="label notice">6224</span> site approvals.</p> total sites, for a total of <span class="label label-info">6224</span> site approvals.</p>
</div> </div>
</div> </div>
</div>
<o:copyright/> <o:copyright/>
</div> </div>
</div> </div>