Add dropdown menu for user stuff

app/scss/main.scss

@@ -1,4 +1,5 @@
 @import "page.scss";
 @import "components.scss";
+@import "nav.scss";
 @import "packages.scss";
 @import "packagegrid.scss";

app/scss/nav.scss

@@ -0,0 +1,75 @@
+nav {
+	margin: 0 auto 0 auto;
+	list-style: none;
+	background: #333;
+}
+
+nav .navbar-nav {
+	float: left;
+}
+
+nav .navbar-right {
+	float: right;
+}
+
+nav ul {
+	margin: 0 auto 0 auto;
+	padding: 0;
+	list-style: none;
+}
+
+nav li {
+	margin: 0;
+	padding: 0;
+	list-style: none;
+	display: inline-block;
+}
+
+nav li a {
+	color: #ddd;
+	margin: 0;
+	padding: 1em 1em;
+	display: block;
+	border-left: 1px solid #444;
+}
+
+nav a:hover {
+	color: #eee;
+	background: #444;
+	text-decoration: none;
+}
+
+li.dropdown {
+	position: relative;
+	display: inline-block;
+}
+
+.dropdown-menu {
+	display: none;
+	position: absolute;
+	margin: 0;
+	padding: 0;
+	min-width:160px;
+	background: #333;
+	z-index: 1;
+	right: 0;
+    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.4);
+	// display: none;
+}
+
+.dropdown:hover ul {
+	display: block;
+}
+
+.dropdown li {
+	display: block;
+}
+
+.dropdown li a {
+	border: none;
+	border-top: 1px solid #444;
+}
+
+.dropdown li:last-child a {
+	border-bottom: 1px solid #444;
+}

app/scss/page.scss

@@ -14,47 +14,6 @@ nav, main, #alerts {
 	display: block;
 }
 
-nav {
-	margin: 0 auto 0 auto;
-	list-style: none;
-	background: #333;
-}
-
-nav .navbar-nav {
-	float: left;
-}
-
-nav .navbar-right {
-	float: right;
-}
-
-nav ul {
-	margin: 0 auto 0 auto;
-	padding: 0;
-	list-style: none;
-}
-
-nav li {
-	margin: 0;
-	padding: 0;
-	list-style: none;
-	display: inline-block;
-}
-
-nav li a {
-	color: #ddd;
-	margin: 0;
-	padding: 1em 1em;
-	display: block;
-	border-left: 1px solid #444;
-}
-
-nav a:hover {
-	color: #eee;
-	background: #444;
-	text-decoration: none;
-}
-
 header {
 	padding: 20px;
 	background: #258;

app/templates/base.html

@@ -41,8 +41,24 @@
 		<ul class="nav navbar-nav navbar-right">
 			{% if current_user.is_authenticated %}
 				<li><a href="{{ url_for('notifications_page') }}">({{ current_user.notifications | length }})</a></li>
-				<li><a href="{{ url_for('user_profile_page', username=current_user.username) }}">{{ current_user.display_name }}</a></li>
+				<li class="dropdown">
-				<li><a href="{{ url_for('user.logout') }}">Sign out</a></li>
+					<a href="{{ url_for('user_profile_page', username=current_user.username) }}"
+						class="dropdown-toggle"
+						data-toggle="dropdown"
+						role="button"
+						aria-expanded="false">{{ current_user.display_name }}
+							<span class="caret"></span></a>
+
+					<ul class="dropdown-menu" role="menu">
+						<li>
+							<a href="{{ url_for('user_profile_page', username=current_user.username) }}">Profile</a>
+						</li>
+						{% if current_user.rank == current_user.rank.ADMIN %}
+							<li><a href="{{ url_for('admin_page') }}">Admin</a></li>
+						{% endif %}
+						<li><a href="{{ url_for('user.logout') }}">Sign out</a></li>
+					</ul>
+				</li>
 			{% else %}
 				<li><a href="{{ url_for('user.login') }}">Sign in</a></li>
 			{% endif %}

app/views/admin.py

@@ -26,8 +26,6 @@ from flask_wtf import FlaskForm
 from wtforms import *
 from app.utils import loginUser, rank_required
 
-@menu.register_menu(app, ".admin", "Admin", order=30,
-		visible_when=lambda: current_user.rank.atLeast(UserRank.ADMIN))
 @app.route("/admin/", methods=["GET", "POST"])
 @rank_required(UserRank.ADMIN)
 def admin_page():