made sidebar size-responsive, added sticky footer

12 years ago · 7c36f9fb38
parent ad3a22e5d4
commit 7c36f9fb38
13 changed files with 101 additions and 46 deletions
--- a/openid-connect-server/src/main/webapp/WEB-INF/tags/actionmenu.tag
+++ b/openid-connect-server/src/main/webapp/WEB-INF/tags/actionmenu.tag
@ -0,0 +1,14 @@
+<%@ tag language="java" pageEncoding="UTF-8"%>
+<%@ taglib prefix="security" uri="http://www.springframework.org/security/tags" %>
+<security:authorize access="hasRole('ROLE_ADMIN')">
+   <li class="nav-header">Administrative</li>
+   <li><a href="manage/#admin/clients">Manage Clients</a></li>
+   <li><a href="manage/#admin/whitelists">Whitelisted Clients</a></li>
+   <li><a href="manage/#admin/blacklist">Blacklisted Clients</a></li>
+   <li><a href="manage/#admin/scope">System Scopes</a></li>
+   <li class="divider"></li>
+</security:authorize>
+<li class="nav-header">Personal</li>
+<li><a href="manage/#user/approved">Manage Sites</a></li>
+<li><a href="manage/#user/tokens">Manage Active Tokens</a></li>
+<li><a href="manage/#user/profile">Manage Profiles</a></li>
--- a/openid-connect-server/src/main/webapp/WEB-INF/tags/copyright.tag
+++ b/openid-connect-server/src/main/webapp/WEB-INF/tags/copyright.tag
@ -1,3 +1,5 @@
-<footer class="navbar navbar-fixed-bottom">
-    <p>Powered by <a href="https://github.com/mitreid-connect/">MITREid Connect</a> &copy; 2013 The MITRE Corporation</p>
-</footer>
+<div id="footer">
+    <div class="container">
+    	<p class="muted credit">Powered by <a href="https://github.com/mitreid-connect/">MITREid Connect</a> &copy; 2013 The MITRE Corporation</p>
+    </div>
+</div>
--- a/openid-connect-server/src/main/webapp/WEB-INF/tags/footer.tag
+++ b/openid-connect-server/src/main/webapp/WEB-INF/tags/footer.tag
@ -1,6 +1,10 @@
 <%@attribute name="js" required="false" %>
 <%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
 <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
+<%@ taglib prefix="o" tagdir="/WEB-INF/tags" %>
+<div id="push"></div>
+</div> <!-- end #wrap -->
+<o:copyright />
 <!-- Le javascript
 ================================================== -->
 <!-- Placed at the end of the document so the pages load faster -->
--- a/openid-connect-server/src/main/webapp/WEB-INF/tags/header.tag
+++ b/openid-connect-server/src/main/webapp/WEB-INF/tags/header.tag
@ -17,10 +17,13 @@
    <!-- Le styles -->
    <link href="resources/bootstrap2/css/bootstrap.min.css" rel="stylesheet">
    <style type="text/css">
-        body {
-            padding-top: 60px;
-            padding-bottom: 40px;
-        }
+
+      html,
+      body {
+        height: 100%;
+        /* The html and body elements cannot have any padding or margin. */
+      }
+
        .sidebar-nav {
            padding: 9px 0;
        }
@ -32,12 +35,54 @@
        .brand {
            padding-left: 35px !important;
        }
-        
-		-webkit-input-placeholder{color:#999999;}
+
+      /* Wrapper for page content to push down footer */
+      #wrap {
+        min-height: 100%;
+        height: auto !important;
+        height: 100%;
+        /* Negative indent footer by it's height */
+        margin: 0 auto -60px;
+      }
+
+      /* Set the fixed height of the footer here */
+      #push,
+      #footer {
+        min-height: 60px;
+      }
+      #footer {
+        background-color: #f5f5f5;
+      }
+
+      .main {
+        padding-top: 60px;
+      }
+
+      .credit {
+        margin: 20px 0;
+      }

    </style>
    <link href="resources/bootstrap2/css/bootstrap-responsive.css" rel="stylesheet">
-
+	<style type="text/css">
+		@media (min-width: 768px) and (max-width: 979px) {
+	        .main {
+	        	padding-top: 0px;
+	        }
+	
+	    }
+	    
+	    @media (max-width: 767px) {
+	        #footer {
+	          margin-left: -20px;
+	          margin-right: -20px;
+	          padding-left: 20px;
+	          padding-right: 20px;
+	        }
+	    }
+	
+	
+	</style>

    <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
@ -55,3 +100,4 @@
 </head>

 <body>
+<div id="wrap">
--- a/openid-connect-server/src/main/webapp/WEB-INF/tags/sidebar.tag
+++ b/openid-connect-server/src/main/webapp/WEB-INF/tags/sidebar.tag
@ -1,21 +1,12 @@
 <%@ taglib prefix="security" uri="http://www.springframework.org/security/tags" %>
+<%@ taglib prefix="o" tagdir="/WEB-INF/tags" %>

-<div class="span2">
+<div class="span2 visible-desktop">

 <security:authorize access="hasRole('ROLE_USER')">
    <div class="well sidebar-nav">
        <ul class="nav nav-list">
-            <security:authorize access="hasRole('ROLE_ADMIN')">
-                <li class="nav-header">Administrative</li>
-                <li><a href="manage/#admin/clients">Manage Clients</a></li>
-                <li><a href="manage/#admin/whitelists">Whitelisted Clients</a></li>
-                <li><a href="manage/#admin/blacklist">Blacklisted Clients</a></li>
-                <li><a href="manage/#admin/scope">System Scopes</a></li>
-            </security:authorize>
-	            <li class="nav-header">Personal</li>
-	            <li><a href="manage/#user/approved">Manage Sites</a></li>
-	            <li><a href="manage/#user/tokens">Manage Active Tokens</a></li>
-	            <li><a href="manage/#user/profile">Manage Profiles</a></li>
+        	<o:actionmenu />
        </ul>
    </div><!--/.well -->
 </security:authorize>
--- a/openid-connect-server/src/main/webapp/WEB-INF/tags/topbar.tag
+++ b/openid-connect-server/src/main/webapp/WEB-INF/tags/topbar.tag
@ -2,6 +2,7 @@
 <%@attribute name="title" required="true" %>
 <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
 <%@ taglib prefix="security" uri="http://www.springframework.org/security/tags" %>
+<%@ taglib prefix="o" tagdir="/WEB-INF/tags" %>
 <c:choose>
 	<c:when test="${ not empty userInfo.preferredUsername }">
 		<c:set var="shortName" value="${ userInfo.preferredUsername }" />
@ -76,6 +77,19 @@ $(document).ready(function() {
                			<li><a href="contact">Contact</a></li>
                		</c:otherwise>
                	</c:choose>
+
+
+					<security:authorize access="hasRole('ROLE_USER')">
+
+					<li class="dropdown hidden-desktop">
+						<a href="#" class="dropdown-toggle" data-toggle="dropdown">Action <b class="caret"></b></a>
+				        <ul class="dropdown-menu">
+				        	<o:actionmenu />
+				        </ul>
+				    </li>
+				    
+				    </security:authorize>
+				    
                </ul>
 				<ul class="nav pull-right">
                    <security:authorize access="hasRole('ROLE_USER')">
--- a/openid-connect-server/src/main/webapp/WEB-INF/views/about.jsp
+++ b/openid-connect-server/src/main/webapp/WEB-INF/views/about.jsp
@ -6,7 +6,7 @@

 <o:header title="welcome"/>
 <o:topbar title="${topbarTitle}" pageName="About"/>
-<div class="container-fluid">
+<div class="container-fluid main">
    <div class="row-fluid">
        <o:sidebar/>
        <div class="span10">
@ -21,5 +21,4 @@
        </div>
    </div>
 </div>
-<o:copyright/>
 <o:footer/>
--- a/openid-connect-server/src/main/webapp/WEB-INF/views/admin/manage.jsp
+++ b/openid-connect-server/src/main/webapp/WEB-INF/views/admin/manage.jsp
@ -3,7 +3,7 @@

 <o:header title="welcome"/>
 <o:topbar title="${topbarTitle}"/>
-<div class="container-fluid">
+<div class="container-fluid main">
    <div class="row-fluid">
        <o:sidebar/>
        <div class="span10">
@ -16,5 +16,4 @@
        </div>
    </div>
 </div>
-<o:copyright />
 <o:footer js="resources/js/admin.js"/>
--- a/openid-connect-server/src/main/webapp/WEB-INF/views/contact.jsp
+++ b/openid-connect-server/src/main/webapp/WEB-INF/views/contact.jsp
@ -6,11 +6,10 @@

 <o:header title="welcome"/>
 <o:topbar title="${topbarTitle}" pageName="Contact"/>
-<div class="container-fluid">
+<div class="container-fluid main">
    <div class="row-fluid">
        <o:sidebar/>
        <div class="span10">
-            <!-- Main hero unit for a primary marketing message or call to action -->
            <div class="hero-unit">

 				<o:contactContent/>
@ -21,5 +20,4 @@
        </div>
    </div>
 </div>
-<o:copyright/>
 <o:footer/>
--- a/openid-connect-server/src/main/webapp/WEB-INF/views/home.jsp
+++ b/openid-connect-server/src/main/webapp/WEB-INF/views/home.jsp
@ -4,11 +4,10 @@

 <o:header title="welcome"/>
 <o:topbar title="${topbarTitle}"/>
-<div class="container-fluid">
+<div class="container-fluid main">
    <div class="row-fluid">
        <o:sidebar/>
        <div class="span10">
-            <!-- Main hero unit for a primary marketing message or call to action -->
            <div class="hero-unit">
                <o:landingPageWelcome/>
            </div>
@ -33,5 +32,4 @@
        </div>
    </div>
 </div>
-<o:copyright/>
 <o:footer/>
--- a/openid-connect-server/src/main/webapp/WEB-INF/views/login.jsp
+++ b/openid-connect-server/src/main/webapp/WEB-INF/views/login.jsp
@ -12,7 +12,7 @@ $(document).ready(function() {
 //-->
 </script>
 <o:topbar title="${topbarTitle}"/>
-<div class="container">
+<div class="container main">

 <h1>Login with Username and Password</h1>

@ -20,9 +20,7 @@ $(document).ready(function() {
 <div class="alert alert-error">The system was unable to log you in. Please try again.</div>
 </c:if>

-<!-- TODO: this is an ugly form but it gets the job done -->
-
-<form action="<%=request.getContextPath()%>/j_spring_security_check" method="POST" class="well">
+<form action="<%=request.getContextPath()%>/j_spring_security_check" method="POST" class="well span3 offset1">
 <fieldset>
    <div class="input-prepend"><span class="add-on"><i class="icon-user"></i></span><input type="text" name="j_username" id="j_username" value="" spellcheck="false" autocomplete="off" autocapitalize="off" autocorrect="off" placeholder="Username"></div>
    <div class="input-prepend"><span class="add-on"><i class="icon-lock"></i></span><input type="password" name="j_password" id="j_password" spellcheck="false" autocomplete="off" autocapitalize="off" autocorrect="off" placeholder="Password"></div>
@ -30,6 +28,5 @@ $(document).ready(function() {
  </fieldset>
 </form>

-<o:copyright/>
 </div>
 <o:footer/>
--- a/openid-connect-server/src/main/webapp/WEB-INF/views/oauth/approve.jsp
+++ b/openid-connect-server/src/main/webapp/WEB-INF/views/oauth/approve.jsp
@ -4,10 +4,9 @@
 <%@ taglib prefix="authz" uri="http://www.springframework.org/security/tags" %>
 <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
 <%@ taglib prefix="o" tagdir="/WEB-INF/tags" %>
-
 <o:header title="Approve Access"/>
 <o:topbar title="${topbarTitle}"/>
-<div class="container">
+<div class="container main">
    <% if (session.getAttribute(AbstractAuthenticationProcessingFilter.SPRING_SECURITY_LAST_EXCEPTION_KEY) != null && !(session.getAttribute(AbstractAuthenticationProcessingFilter.SPRING_SECURITY_LAST_EXCEPTION_KEY) instanceof UnapprovedClientAuthenticationException)) { %>
    <div class="alert-message error">
        <a href="#" class="close">&times;</a>
@ -19,8 +18,6 @@
    <% } %>
    <c:remove scope="session" var="SPRING_SECURITY_LAST_EXCEPTION"/>

-    <authz:authorize ifAnyGranted="ROLE_USER">
-
    <div class="well" style="text-align:center">
        <h1>Approve New Site</h1>

@ -127,9 +124,7 @@

        </form>

-        </authz:authorize>

-        <o:copyright/>
    </div>
 </div>
 <o:footer/>
--- a/openid-connect-server/src/main/webapp/WEB-INF/views/stats.jsp
+++ b/openid-connect-server/src/main/webapp/WEB-INF/views/stats.jsp
@ -6,11 +6,10 @@

 <o:header title="welcome"/>
 <o:topbar title="${topbarTitle}" pageName="Statistics"/>
-<div class="container-fluid">
+<div class="container-fluid main">
    <div class="row-fluid">
        <o:sidebar/>
        <div class="span10">
-            <!-- Main hero unit for a primary marketing message or call to action -->
            <div class="hero-unit">
 				<o:statsContent/>
            </div>
@ -19,5 +18,4 @@
        </div>
    </div>
 </div>
-<o:copyright/>
 <o:footer/>