[extensions-web/wip/tomtryf/redesign: 2/18] Update main navigation bar style
- From: Tom Tryfonidis <tomtryf src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [extensions-web/wip/tomtryf/redesign: 2/18] Update main navigation bar style
- Date: Thu, 23 Feb 2017 19:17:54 +0000 (UTC)
commit d8cdc119b051caaa51d7d9e006e99987af9cf48b
Author: Tom Tryfonidis <tomtryf gnome org>
Date: Fri Feb 17 15:57:37 2017 +0200
Update main navigation bar style
sweettooth/auth/forms.py | 5 +-
.../templates/registration/login_popup_form.html | 29 ++-
sweettooth/static/css/style.css | 384 ++++++++++++--------
sweettooth/static/css/sweettooth.css | 117 +------
sweettooth/static/css/text.css | 7 +-
sweettooth/static/images/avatar-default.svg | 152 ++++++++
sweettooth/static/images/gnome-extensions.svg | 139 +++++++
sweettooth/templates/base.html | 109 ++++--
sweettooth/templates/usermenu.html | 15 +-
9 files changed, 640 insertions(+), 317 deletions(-)
---
diff --git a/sweettooth/auth/forms.py b/sweettooth/auth/forms.py
index 92e2182..32300e9 100644
--- a/sweettooth/auth/forms.py
+++ b/sweettooth/auth/forms.py
@@ -7,9 +7,9 @@ from registration.forms import RegistrationFormUniqueEmail
class PlainOutputForm(object):
def as_plain(self):
return self._html_output(
- normal_row = u'%(errors)s%(field)s%(help_text)s',
+ normal_row = u'<div class="form-group">%(field)s</div> %(errors)s%(help_text)s',
error_row = u'%s',
- row_ender = u'',
+ row_ender = u'</div>',
help_text_html = u'<br /><span class="helptext">%s</span>',
errors_on_separate_row = False)
@@ -25,6 +25,7 @@ class InlineForm(object):
super(InlineForm, self).__init__(*a, **kw)
for field in self.fields.itervalues():
field.widget.attrs['placeholder'] = field.label
+ field.widget.attrs['class'] = 'form-control'
class InlineAuthenticationForm(PlainOutputForm, AutoFocusForm,
InlineForm, auth_forms.AuthenticationForm):
diff --git a/sweettooth/auth/templates/registration/login_popup_form.html
b/sweettooth/auth/templates/registration/login_popup_form.html
index 27d2860..bf28862 100644
--- a/sweettooth/auth/templates/registration/login_popup_form.html
+++ b/sweettooth/auth/templates/registration/login_popup_form.html
@@ -1,7 +1,22 @@
-<form action="{% url 'auth-login' %}" method="POST" class="login_popup_form user_popup">
- {% csrf_token %}
- {{ login_popup_form.as_plain }}
- <input type="hidden" name="next" value="{{ request.path }}">
- <input type="submit" value="Login">
- <a href="{% url 'registration_register' %}">Register</a>
-</form>
+<div class="row">
+ <div class="col-sm-12">
+ <form action="{% url 'auth-login' %}" method="POST" class="form">
+ {% csrf_token %}
+ {{ login_popup_form.as_plain }}
+ <div class="form-group">
+ <input type="hidden" name="next" id="id_username" class="form-control" value="{{
request.path }}"/>
+ </div>
+ <div class="form-group">
+ <button type="submit" class="btn btn-primary btn-block">Log in</button>
+ </div>
+ <div class="form-group">
+ <a href="{% url 'auth_password_reset' %}" class="">Forgot your password?</a>
+ </div>
+ <li class="divider"></li>
+ <p>Don't have an account?</p>
+ <div class="form-group">
+ <a href="{% url 'registration_register' %}" class="btn btn-success btn-block
no-decoration">Register</a>
+ </div>
+ </form>
+ </div>
+</div>
diff --git a/sweettooth/static/css/style.css b/sweettooth/static/css/style.css
index b089e55..56b99fb 100644
--- a/sweettooth/static/css/style.css
+++ b/sweettooth/static/css/style.css
@@ -7,7 +7,6 @@ Version: 20160212
*/
-@import url("reset.css");
@import url("text.css");
@import url("960.css");
@import url("sweettooth.css");
@@ -19,12 +18,6 @@ Version: 20160212
/* Base information */
/* ========================================================================== */
-html {
- background: #fff url(../images/html-bg.png) 0 10px repeat-x;
-}
-body {
-
-}
a {
color: #204a87;
}
@@ -51,8 +44,19 @@ a:visited {
width: 780px;
margin: 0 auto;
}
+.col-centered{
+ float: none;
+ margin: 0 auto;
+}
+.no-padding {
+ padding: 0 !important;
+ margin: 0 !important;
+}
-
+.btn-success,
+.btn-primary {
+ color: #fff !important;
+}
/* Accessibility access */
/* ========================================================================== */
@@ -66,179 +70,217 @@ a:visited {
top: -200px;
}
-
-
-/* Global Domain Bar */
+/* GNOME Header */
/* ========================================================================== */
-
-
-#global_domain_bar {
- background: #fff;
- height: 10px;
+.gnome-header {
+ margin-bottom: 90px;
}
-#global_domain_bar .maxwidth {
- position: relative;
+.gnome-header .avatar {
+ margin: 10px 0;
+ padding: 0;
+ border-radius: 50%;
}
-
-/* Tab */
-
-#global_domain_bar .tab {
- background: #fff;
- position: absolute;
- right: 0;
- float: right;
- padding: 6px 8px;
- font-size: 12px;
- line-height: 16px;
- -moz-border-radius: 5px;
- -webkit-border-radius: 5px;
- border-radius: 5px;
- -moz-box-shadow: 0 4px 2px -2px #8fb3d9;
- -webkit-box-shadow: 0 4px 2px -2px #8fb3d9;
- box-shadow: 0 4px 2px -2px #8fb3d9;
- white-space: nowrap;
+.gnome-header .avatar img {
+ width: 30px;
+ height: 30px;
+ border-radius: 50%;
}
-#global_domain_bar .tab a.root {
- color: #555753 !important;
- font-weight: bold;
+.navbar-default .navbar-nav > #userDropdownMenu > a:hover,
+.navbar-default .navbar-nav > #userDropdownMenu > a:focus {
+ background: transparent;
+}
+.gnome-navbar-brand {
+ height: 50px;
+ padding: 6px;
+ float: left;
+ outline: 0;
+ margin-left: 7px;
+ font-weight: 700;
+ text-transform: uppercase;
+ font-size: 80%;
+ color: #ffffff;
text-decoration: none;
- background: #fff url(../images/favicon.png) 0 0 no-repeat;
- padding-left: 18px;
- border-right: 1px solid #ccc;
- padding-right: 6px;
- margin-right: 3px;
}
-#global_domain_bar .tab a.root:last-child {
- border-right: 0;
- padding-right: 0;
- margin-right: 0;
- padding-bottom: 3px;
+.gnome-navbar-brand:hover,
+.gnome-navbar-brand:active {
+ color: #ffffff;
+ text-decoration: none;
}
-#global_domain_bar .tab a.root:hover {
- text-decoration: underline;
+.gnome-navbar-brand img {
+ max-height: 35px;
+ min-height: 35px;
+ min-width: 35px;
+ vertical-align: middle !important;
}
-
-/* Header */
+/* Main Navigation Menu */
/* ========================================================================== */
-
-
-#header {
- margin: 20px auto 0;
+.navbar-default {
+ background-color: #4a86cf;
+ border-color: #3968a1;
}
-#header img {
- vertical-align: middle;
- float: left;
- margin-right: 10px;
+.navbar-default .navbar-brand {
+ color: #ffffff;
}
-#header #logo {
- float: left;
+.navbar-default .navbar-brand:hover,
+.navbar-default .navbar-brand:focus {
+ color: #ffffff;
}
-#header #logo h1 {
- margin: 0;
+.navbar-default .navbar-text {
+ color: #ffffff;
}
-#header #logo img {
- -webkit-transition: opacity 200ms ease-out;
- -moz-transition: opacity 200ms ease-out;
- transition: opacity 200ms ease-out;
- opacity: 1;
- margin-left: -3px;
- height: 76px;
- width: 199px;
+.navbar-default .navbar-nav > li {
+ margin-left: 10px;
+}
+.navbar-default .navbar-nav > li > a {
+ color: #ffffff;
+ text-decoration: none;
}
-#header #logo img:hover {
- opacity: 0.85;
+.navbar-default .navbar-nav > li > a:hover,
+.navbar-default .navbar-nav > li > a:focus {
+ color: #ffffff;
+ background: rgba(100%, 100%, 100%, 0.2);
}
-
-
-
-/* Top bar */
-/* ========================================================================== */
-
-
-
-#top_bar {
- background: #2e3436 url("../images/top_bar-bg.png") top repeat-x;
- padding: 8px 0;
- margin-top: 23px;
- font-size: 13px;
- line-height: normal;
- -moz-border-radius: 6px;
- -webkit-border-radius: 6px;
- border-radius: 6px;
- -moz-box-shadow: 0 2px 4px rgba(0,0,0,0.2);
- -webkit-box-shadow: 0 2px 4px rgba(0,0,0,0.2);
- box-shadow: 0 2px 4px rgba(0,0,0,0.2);
+.navbar-default .navbar-nav > .active > a,
+.navbar-default .navbar-nav > .active > a:hover,
+.navbar-default .navbar-nav > .active > a:focus {
+ color: #ffffff;
+ background-color: #3968a1;
}
-#top_bar ul {
- list-style: none;
- margin: 0;
- padding: 0 5px;
+.navbar-default .navbar-nav > .open > a,
+.navbar-default .navbar-nav > .open > a:hover,
+.navbar-default .navbar-nav > .open > a:focus {
+ color: #ffffff;
+ background-color: #3968a1;
}
-#top_bar ul li {
- display: inline;
- margin: 0 5px 0 0;
+.navbar-default .navbar-toggle {
+ border-color: #3968a1;
}
-#top_bar a {
- color: #fff;
- text-decoration: none;
- padding: 4px 8px;
- -moz-border-radius: 4px;
- -webkit-border-radius: 4px;
- border-radius: 4px;
- outline: 0;
- -webkit-transition: background 100ms linear;
- -moz-transition: background 100ms linear;
- transition: background 100ms linear;
- text-shadow: 0 1px 0 #000;
+.navbar-default .navbar-toggle:hover,
+.navbar-default .navbar-toggle:focus {
+ background-color: #3968a1;
}
-#top_bar a:hover {
- background: #64696d;
- background: rgba(100%, 100%, 100%, 0.2);
+.navbar-default .navbar-toggle .icon-bar {
+ background-color: #ffffff;
}
-#top_bar a:focus {
- background: rgba(100%, 100%, 100%, 0.15);
+.navbar-default .navbar-collapse,
+.navbar-default .navbar-form {
+ border-color: transparent;
}
-#top_bar a:active, #top_bar li.current-menu-item a, #top_bar li.current-page-ancestor a {
- background: #1c2021 url("../images/top_bar-item-bg.png") top repeat-x;
- -moz-box-shadow: inset 0 -1px 0 rgba(100%,100%,100%, 0.4), inset 0 1px 3px rgba(0,0,0,0.4);
- -webkit-box-shadow: inset 0 -1px 0 rgba(100%,100%,100%, 0.4), inset 0 1px 3px rgba(0,0,0,0.4);
- box-shadow: inset 0 -1px 0 rgba(100%,100%,100%, 0.4), inset 0 1px 3px rgba(0,0,0,0.4);
+.navbar-default .navbar-link {
+ color: #ffffff;
}
-#top_bar li.selected a {
- font-weight: bold;
+.navbar-default .navbar-link:hover {
+ color: #ffffff;
}
-#top_bar #main_search {
- text-align: right;
+.navbar-default .navbar-header .icons{
+ display: block;
+ float: right;
+ margin: 5px 20px !important;
}
-#top_bar input {
- margin: -8px 0 -8px -8px;
- line-height: 22px;
- width: 150px;
- border: 0;
- font: inherit;
- color: inherit;
- padding: 8px 8px 8px 28px;
- background: transparent url(../images/search-icon.png) 8px center no-repeat;
- color: #fff;
- border-left: 1px solid rgba(100%,100%,100%,0.3);
- outline: none;
+.navbar-default .navbar-header .icons li{
+ display: inline-block !important;
}
-#top_bar input.placeholder {
- color: #CCC;
+
+/* User settings */
+
+.login_popup_form {
+ padding: 15px 15px;
+ min-width: 220px;
}
-#top_bar input:focus {
- background-color: rgba(100%,100%,100%,0.1);
- -moz-border-radius-topright: 5px;
- -moz-border-radius-bottomright: 5px;
- -webkit-border-top-right-radius: 6px;
- -webkit-border-bottom-right-radius: 6px;
- border-top-right-radius: 6px;
- border-bottom-right-radius: 6px;
+ul.login_popup_form li p {
+ margin: 0;
}
+.navbar-nav>li>.dropdown-menu {
+ margin-top: 18px;
+}
+.navbar-nav>li>.dropdown-menu, ul.dropdown-menu {
+ border-radius: 6px;
+}
+.navbar-nav>li>.dropdown-menu li {
+ margin-left: 0px;
+}
+
+@media screen and (min-width:767px) {
+ #userDropdownMenu .dropdown-menu:after {
+ position: absolute;
+ top: -11px;
+ left: 83%;
+ display: inline-block;
+ border-right: 11px solid transparent;
+ border-bottom: 11px solid #ffffff;
+ border-left: 11px solid transparent;
+ content:'';
+ }
+ #userDropdownMenu .dropdown-menu:before {
+ position: absolute;
+ top: -12px;
+ left: 83%;
+ display: inline-block;
+ border-right: 11px solid transparent;
+ border-bottom: 11px solid #ccc;
+ border-left: 11px solid transparent;
+ border-bottom-color: rgba(0, 0, 0, 0.2);
+ content:'';
+ }
+}
+
+/* Animated "Close" icon on Navbar */
+/* ========================================================================== */
+
+.navbar-toggle {
+ border: none;
+ background: transparent !important;
+}
+.navbar-toggle:hover {
+ background: transparent !important;
+}
+.navbar-toggle .icon-bar {
+ width: 22px;
+ transition: all 0.2s;
+}
+.navbar-toggle .top-bar {
+ transform: rotate(45deg);
+ -webkit-transform: rotate(45deg);
+ -ms-transform: rotate(45deg);
+ transform-origin: 10% 10%;
+ -webkit-transform-origin: 10% 10%;
+ -ms-transform-origin: 10% 10%;
+}
+.navbar-toggle .middle-bar {
+ opacity: 0;
+}
+.navbar-toggle .bottom-bar {
+ transform: rotate(-45deg);
+ -webkit-transform: rotate(-45deg);
+ -ms-transform: rotate(-45deg);
+ transform-origin: 10% 90%;
+ -webkit-transform-origin: 10% 90%;
+ -ms-transform-origin: 10% 90%;
+}
+.navbar-toggle.collapsed .top-bar {
+ transform: rotate(0);
+ -webkit-transform: rotate(0);
+ -ms-transform: rotate(0);
+}
+.navbar-toggle.collapsed .middle-bar {
+ opacity: 1;
+}
+.navbar-toggle.collapsed .bottom-bar {
+ transform: rotate(0);
+ -webkit-transform: rotate(0);
+ -ms-transform: rotate(0);
+}
+.navbar-form,
+.navbar-collapse {
+ box-shadow: none;
+}
+
+
+
/* -> subpages list */
/*
@@ -640,3 +682,45 @@ hr.bottom_shadow {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
+
+
+/* Responsive Media Queries */
+/* ========================================================================== */
+
+@media screen and (max-width: 767px) {
+
+ .dropdown-menu.login_popup_form li a {
+ color: #ffffff;
+
+ }
+ .dropdown-menu.login_popup_form li{
+ color: #ffffff;
+
+ }
+
+ .navbar-default .navbar-nav .open .dropdown-menu > li > a {
+ color: #ffffff;
+ }
+ .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
+ .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
+ color: #ffffff;
+ }
+ .navbar-default .navbar-nav .open .dropdown-menu > .active > a,
+ .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
+ .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
+ color: #ffffff;
+ background-color: #3968a1;
+ }
+ .navbar-default .btn-link {
+ color: #fff;
+ }
+ .navbar-default .navbar-header .icons {
+ margin: 0px 20px !important;
+ }
+}
+
+@media screen and (min-width: 768px) {
+ .gnome-header .avatar img {
+ margin-right: 15px;
+ }
+}
diff --git a/sweettooth/static/css/sweettooth.css b/sweettooth/static/css/sweettooth.css
index 7cdcc72..76afc21 100644
--- a/sweettooth/static/css/sweettooth.css
+++ b/sweettooth/static/css/sweettooth.css
@@ -20,127 +20,28 @@ span.action_button {
}
-/* Global Domain Bar */
-/* ========================================================================== */
-
-#global_domain_bar .tab a.root {
- margin-right: 0 !important;
-}
-
-#global_domain_bar .tab a.user {
- padding: 2px 14px 2px 4px;
- margin: -2px -4px -2px 2px;
- color: inherit !important;
- text-decoration: none;
- border-radius: 4px;
- background: url(../images/globaldomain-user-arrow.png) right center no-repeat;
- outline: none;
-}
-#global_domain_bar .tab a.user:hover,
-#global_domain_bar .tab a.user:focus {
- background-color: #ececec;
-}
-#global_domain_bar .tab a.user.active {
- background-color: #ececec;
- box-shadow: inset 0 1px 3px rgba(0,0,0,0.2);
-}
-
-/* User settings */
-
-#global_domain_bar .user_popup:before {
- width: 20px;
- height: 10px;
- margin-top: -17px;
- pointer-events: none;
- right: 10px;
- position: absolute;
- content: url(../images/globaldomain-popup-arrow.png);
-}
-#global_domain_bar .user_popup {
- display: none;
- z-index: 10;
- position: absolute;
- background: #000;
- background: rgba(0, 0, 0, 0.9);
- border: 2px solid rgba(100%, 100%, 100%, 0.2);
- right: 0;
- top: -10px;
- margin: 32px 0 0 0;
- min-width: 140px;
- border-radius: 10px;
-}
-#global_domain_bar .user_popup a.text {
- color: #fff;
- text-decoration: none;
- display: block;
- padding: 3px 16px;
-}
-#global_domain_bar .user_settings a.text:hover {
- background: rgba(100%, 100%, 100%, 0.2);
-}
-#global_domain_bar .user_settings ul {
- margin: 14px 0;
-}
-#global_domain_bar .user_settings li {
- list-style-type: none;
- margin-left: 0;
-}
-#global_domain_bar .avatar {
- display: block;
- margin: 14px auto 0 auto;
- width: 70px;
- height: 70px;
- background-color: #fff;
- background-size: contain;
- border: 2px solid #8b8b8b;
- border-radius: 5px;
-}
-#global_domain_bar .avatar:hover {
- border: 2px solid #bbbbbb;
-}
-
/* Unreviewed Extension Counter */
/* ==================================================================== */
#unreviewed_counter {
- border-right: 1px solid #ccc;
- color: #555753;
+ background-color: #3968A1;
+ color: #ffffff;
+ font-weight: 700;
text-decoration: none;
- padding: 0 4px;
+ padding: 0 5px;
+ border-radius: 4px;
+ margin-top: 13px;
+ margin-right: 10px;
+ border: 1px solid #195EB1;
}
#unreviewed_counter:hover {
- background-color: #ececec;
+ background-color: #195EB1;
}
/* Login Area */
/* ==================================================================== */
-#global_domain_bar .login_popup_form * {
- display: block;
- margin: 10px 5px;
-}
-
-#global_domain_bar .login_popup_form input[type=submit],
-#global_domain_bar .login_popup_form a {
- color: #fff;
- display: block;
- margin: 0;
- border: 0;
- background: none;
- font-weight: normal;
- padding: 3px 0;
- border-radius: 0;
- width: 100%;
- text-decoration: none;
- text-align: center;
-}
-
-#global_domain_bar .login_popup_form input[type=submit]:hover,
-#global_domain_bar .login_popup_form a:hover {
- background: rgba(100%, 100%, 100%, 0.2);
-}
-
#auth_form ol {
list-style-type: none;
font-size: 2em;
diff --git a/sweettooth/static/css/text.css b/sweettooth/static/css/text.css
index d6b0eac..2380b5d 100644
--- a/sweettooth/static/css/text.css
+++ b/sweettooth/static/css/text.css
@@ -72,7 +72,12 @@ code {
background: rgba(0,0,0,0.1);
padding: 1px;
}
-
+a {
+ text-decoration: underline;
+}
+.no-decoration {
+ text-decoration: none;
+}
/* Text classes */
/* ========================================================================== */
diff --git a/sweettooth/static/images/avatar-default.svg b/sweettooth/static/images/avatar-default.svg
new file mode 100644
index 0000000..9cb7fc9
--- /dev/null
+++ b/sweettooth/static/images/avatar-default.svg
@@ -0,0 +1,152 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+ xmlns:dc="http://purl.org/dc/elements/1.1/"
+ xmlns:cc="http://creativecommons.org/ns#"
+ xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+ xmlns:svg="http://www.w3.org/2000/svg"
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+ xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+ sodipodi:docname="avatar-default.svg"
+ inkscape:export-filename="/home/sam/dev/RESOURCES/gnome-icon-theme-symbolic/src/gnome-stencils.png"
+ inkscape:export-xdpi="90"
+ inkscape:export-ydpi="90"
+ height="16"
+ id="svg7384"
+ version="1.1"
+ inkscape:version="0.92.0 r"
+ width="16">
+ <metadata
+ id="metadata90">
+ <rdf:RDF>
+ <cc:Work
+ rdf:about="">
+ <dc:format>image/svg+xml</dc:format>
+ <dc:type
+ rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+ <dc:title>Gnome Symbolic Icon Theme</dc:title>
+ </cc:Work>
+ </rdf:RDF>
+ </metadata>
+ <sodipodi:namedview
+ inkscape:bbox-nodes="false"
+ inkscape:bbox-paths="true"
+ bordercolor="#666666"
+ borderopacity="1"
+ inkscape:current-layer="layer9"
+ inkscape:cx="48.900326"
+ inkscape:cy="-9.5721192"
+ gridtolerance="10"
+ inkscape:guide-bbox="true"
+ guidetolerance="10"
+ id="namedview88"
+ inkscape:object-nodes="false"
+ inkscape:object-paths="false"
+ objecttolerance="10"
+ pagecolor="#3a3b39"
+ inkscape:pageopacity="1"
+ inkscape:pageshadow="2"
+ showborder="false"
+ showgrid="false"
+ showguides="true"
+ inkscape:snap-bbox="true"
+ inkscape:snap-bbox-midpoints="false"
+ inkscape:snap-global="true"
+ inkscape:snap-grids="true"
+ inkscape:snap-nodes="true"
+ inkscape:snap-others="false"
+ inkscape:snap-to-guides="true"
+ inkscape:window-height="961"
+ inkscape:window-maximized="1"
+ inkscape:window-width="1280"
+ inkscape:window-x="0"
+ inkscape:window-y="27"
+ inkscape:zoom="9.1743808">
+ <inkscape:grid
+ empspacing="2"
+ enabled="true"
+ id="grid4866"
+ originx="200"
+ originy="120"
+ snapvisiblegridlinesonly="true"
+ spacingx="1"
+ spacingy="1"
+ type="xygrid"
+ visible="true" />
+ </sodipodi:namedview>
+ <title
+ id="title9167">Gnome Symbolic Icon Theme</title>
+ <defs
+ id="defs7386" />
+ <g
+ inkscape:groupmode="layer"
+ id="layer9"
+ inkscape:label="status"
+ style="display:inline"
+ transform="translate(-41.0002,-337)">
+ <path
+ inkscape:connector-curvature="0"
+ d="m 51.55489,345.09373 c -0.70541,0.62353 -1.53918,0.90625 -2.55469,0.90625 -1.01551,0
-1.85318,-0.29053 -2.55859,-0.91406 -1.10938,0.36328 -2.43603,1.28775 -2.4375,2.90234 l -0.0039,3.01172 c
-7.2e-4,0.554 0.446,1.00002 1,1.00002 l 8,0 c 0.554,0 1,-0.44602 1,-1.00002 l 0,-3 c 0,-1.38672
-1.10231,-2.5558 -2.44531,-2.90625 z"
+ id="path3940-5"
+ sodipodi:nodetypes="csccsssscc"
+ style="fill:#ffffff;fill-opacity:1;stroke:none" />
+ <path
+ sodipodi:cx="49.5"
+ sodipodi:cy="342.5"
+ d="M 52,342.5 A 2.5,2.5 0 0 1 49.5,345 2.5,2.5 0 0 1 47,342.5 2.5,2.5 0 0 1 49.5,340 2.5,2.5 0 0 1
52,342.5 Z"
+ id="path3942-6"
+ sodipodi:rx="2.5"
+ sodipodi:ry="2.5"
+
style="color:#bebebe;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:2;marker:none;visibility:visible;display:inline;overflow:visible;enable-background:accumulate"
+ transform="matrix(1.2,0,0,1.2,-10.3998,-69.00003)"
+ sodipodi:type="arc" />
+ </g>
+ <g
+ inkscape:groupmode="layer"
+ id="layer10"
+ inkscape:label="devices"
+ style="display:inline"
+ transform="translate(-41.0002,-337)" />
+ <g
+ inkscape:groupmode="layer"
+ id="layer11"
+ inkscape:label="apps"
+ transform="translate(-41.0002,-337)" />
+ <g
+ inkscape:groupmode="layer"
+ id="layer13"
+ inkscape:label="places"
+ style="display:inline"
+ transform="translate(-41.0002,-337)" />
+ <g
+ inkscape:groupmode="layer"
+ id="layer14"
+ inkscape:label="mimetypes"
+ transform="translate(-41.0002,-337)" />
+ <g
+ inkscape:groupmode="layer"
+ id="layer15"
+ inkscape:label="emblems"
+ style="display:inline"
+ transform="translate(-41.0002,-337)" />
+ <g
+ inkscape:groupmode="layer"
+ id="g71291"
+ inkscape:label="emotes"
+ style="display:inline"
+ transform="translate(-41.0002,-337)" />
+ <g
+ inkscape:groupmode="layer"
+ id="g4953"
+ inkscape:label="categories"
+ style="display:inline"
+ transform="translate(-41.0002,-337)" />
+ <g
+ inkscape:groupmode="layer"
+ id="layer12"
+ inkscape:label="actions"
+ style="display:inline"
+ transform="translate(-41.0002,-337)" />
+</svg>
diff --git a/sweettooth/static/images/gnome-extensions.svg b/sweettooth/static/images/gnome-extensions.svg
new file mode 100644
index 0000000..6497c28
--- /dev/null
+++ b/sweettooth/static/images/gnome-extensions.svg
@@ -0,0 +1,139 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+ xmlns:dc="http://purl.org/dc/elements/1.1/"
+ xmlns:cc="http://creativecommons.org/ns#"
+ xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+ xmlns:svg="http://www.w3.org/2000/svg"
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+ xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+ version="1.0"
+ width="1062.9567"
+ height="408.40155"
+ id="svg3642"
+ inkscape:version="0.92.0 r"
+ sodipodi:docname="gnome-l10n.svg"
+ inkscape:export-xdpi="96"
+ inkscape:export-ydpi="96">
+ <metadata
+ id="metadata24">
+ <rdf:RDF>
+ <cc:Work
+ rdf:about="">
+ <dc:format>image/svg+xml</dc:format>
+ <dc:type
+ rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+ <dc:title />
+ </cc:Work>
+ </rdf:RDF>
+ </metadata>
+ <sodipodi:namedview
+ pagecolor="#000000"
+ bordercolor="#666666"
+ borderopacity="1"
+ objecttolerance="10"
+ gridtolerance="10"
+ guidetolerance="10"
+ inkscape:pageopacity="0"
+ inkscape:pageshadow="2"
+ inkscape:window-width="1280"
+ inkscape:window-height="961"
+ id="namedview22"
+ showgrid="false"
+ inkscape:zoom="1"
+ inkscape:cx="622.15068"
+ inkscape:cy="73.6725"
+ inkscape:window-x="0"
+ inkscape:window-y="27"
+ inkscape:window-maximized="1"
+ inkscape:current-layer="g15041"
+ showborder="true"
+ borderlayer="false"
+ inkscape:showpageshadow="false" />
+ <defs
+ id="defs3644" />
+ <g
+ transform="translate(162.8693,-197.3138)"
+ id="layer1">
+ <g
+ transform="matrix(1.293235,0,0,1.293235,-4878.321,-1224.915)"
+ id="g15041">
+ <g
+ transform="matrix(2.438586,0,0,2.438586,3659.952,1113.451)"
+ style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-miterlimit:4"
+ id="g15043">
+ <g
+ style="fill:#ffffff;fill-opacity:1"
+ id="g15045">
+ <path
+ d="M 86.068,0 C 61.466,0 56.851,35.041 70.691,35.041 84.529,35.041 110.671,0 86.068,0 Z"
+ style="fill:#ffffff;fill-opacity:1"
+ id="path15047"
+ inkscape:connector-curvature="0" />
+ <path
+ d="M 45.217,30.699 C 52.586,31.149 60.671,2.577 46.821,4.374 32.976,6.171 37.845,30.249
45.217,30.699 Z"
+ style="fill:#ffffff;fill-opacity:1"
+ id="path15049"
+ inkscape:connector-curvature="0" />
+ <path
+ d="M 11.445,48.453 C 16.686,46.146 12.12,23.581 3.208,29.735 -5.7,35.89 6.204,50.759
11.445,48.453 Z"
+ style="fill:#ffffff;fill-opacity:1"
+ id="path15051"
+ inkscape:connector-curvature="0" />
+ <path
+ d="M 26.212,36.642 C 32.451,35.37 32.793,9.778 21.667,14.369 10.539,18.961 19.978,37.916
26.212,36.642 l 0,0 z"
+ style="fill:#ffffff;fill-opacity:1"
+ id="path15053"
+ inkscape:connector-curvature="0" />
+ <path
+ d="m 58.791,93.913 c 1.107,8.454 -6.202,12.629 -13.36,7.179 C 22.644,83.743 83.16,75.088
79.171,51.386 75.86,31.712 15.495,37.769 8.621,68.553 3.968,89.374 27.774,118.26 52.614,118.26 c 12.22,0
26.315,-11.034 28.952,-25.012 C 83.58,82.589 57.867,86.86 58.791,93.913 l 0,0 z"
+ style="fill:#ffffff;fill-opacity:1"
+ id="path15055"
+ inkscape:connector-curvature="0" />
+ </g>
+ </g>
+ <g
+ id="g15057"
+ style="fill:#ffffff">
+ <path
+ d="m 4176.2963,1214.4401 c -15.1078,0.4069 -27.0386,5.8367 -35.8126,16.25 -9.0861,10.8369
-13.6562,25.8104 -13.6562,44.9063 0,19.0432 4.5703,33.9757 13.6562,44.8124 9.1305,10.8369 21.6664,16.25
37.6563,16.25 16.034,0 28.6014,-5.4131 37.6875,-16.25 9.0859,-10.8367 13.6251,-25.7692 13.625,-44.8124
-1e-4,-19.0959 -4.5391,-34.0694 -13.625,-44.9063 -9.0861,-10.8366 -21.6536,-16.2499 -37.6875,-16.25 -0.6246,0
-1.2296,-0.016 -1.8437,0 z m 1.125,22 c 0.2415,-0.01 0.4737,0 0.7187,0 7.8833,10e-5 13.9919,3.4114
18.3125,10.25 4.3203,6.8388 6.4999,16.4913 6.5,28.9063 0,12.3623 -2.1799,21.9427 -6.5,28.7812 -4.3204,6.8389
-10.4293,10.2812 -18.3125,10.2812 -7.8391,0 -13.8983,-3.4423 -18.2187,-10.2812 -4.3204,-6.8385
-6.4999,-16.4189 -6.5,-28.7812 0,-12.4149 2.1798,-22.0675 6.5,-28.9063 4.1852,-6.6249 10.0123,-10.0428
17.5,-10.25 z"
+
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:148.699646px;line-height:125%;font-family:'Bitstream
Vera
Sans';text-align:start;writing-mode:lr-tb;text-anchor:start;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1pt;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+ id="path15059"
+ inkscape:connector-curvature="0" />
+ <path
+ d="m 4005.6293,1325.612 c -13.3076,11.1757 -33.1067,11.0472 -41.3549,11.0472 -16.6133,0
-29.7747,-5.471 -39.4842,-16.413 -9.7097,-10.9946 -14.5644,-25.8819 -14.5644,-44.6622 0,-18.9906
4.9438,-33.9305 14.8316,-44.82 9.8878,-10.8892 23.4277,-16.3339 40.62,-16.334 6.6363,10e-5 12.9831,0.7366
19.0406,2.2094 6.1019,1.473 11.8475,3.6562 17.2368,6.5494 l -6.921,20.4608 c -3.0298,-1.6586 -6.4987,-3.2932
-9.7145,-4.4424 -5.4784,-1.8411 -10.979,-2.7617 -16.5018,-2.7618 -10.2442,10e-5 -18.15,3.3932
-23.7173,10.1792 -5.523,6.7336 -8.2844,16.3867 -8.2844,28.9594 0,12.4676 2.6723,22.0945 8.0172,28.8806
5.3446,6.7861 13.3768,10.1791 22.7818,10.1791 9.5548,0 15.4728,-2.4084 18.6291,-4.9461 l 0,-20.3835
-20.7001,0 0,-20.3584 40.0855,0"
+
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:148.699646px;line-height:125%;font-family:'Bitstream
Vera
Sans';text-align:start;writing-mode:lr-tb;text-anchor:start;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1pt;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+ id="path15061"
+ inkscape:connector-curvature="0" />
+ <path
+ d="m 4023.2108,1216.5605 16.2279,0 51.2775,70.8022 0,-70.8022 21.8853,0 0,117.8103 -16.2279,0
-51.2774,-70.8022 0,70.8022 -21.8854,0 0,-117.8103"
+
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:148.699646px;line-height:125%;font-family:'Bitstream
Vera
Sans';text-align:start;writing-mode:lr-tb;text-anchor:start;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1pt;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+ id="path15063"
+ inkscape:connector-curvature="0" />
+ <path
+ d="m 4246.3361,1216.5605 32.7366,0 22.7151,73.5479 22.8487,-73.5479 27.6698,0 12.5,117.8103
-24.3186,0 -7.5,-73.668 -22.9823,74.0213 -16.3015,0 -22.9824,-76.5213 -7.5,76.168 -24.3854,0 12.5,-117.8103"
+
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:148.699646px;line-height:125%;font-family:'Bitstream
Vera
Sans';text-align:start;writing-mode:lr-tb;text-anchor:start;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1pt;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+ id="path15065"
+ inkscape:connector-curvature="0" />
+ <path
+ d="m 4382.3597,1216.5605 69.4147,0 0,22.9624 -43.6933,0 0,24.4365 33.5877,0 0,20.4623 -33.5877,0
0,26.9868 45.1631,0 0,22.9623 -70.8845,0 0,-117.8103"
+
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:148.699646px;line-height:125%;font-family:'Bitstream
Vera
Sans';text-align:start;writing-mode:lr-tb;text-anchor:start;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1pt;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+ id="path15067"
+ inkscape:connector-curvature="0" />
+ </g>
+ <g
+ aria-label="EXTENSIONS"
+ transform="matrix(0.91901991,0,0,0.77325467,3546.302,1136.9622)"
+
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:82.66666412px;line-height:25px;font-family:'Bitstream
Vera Sans';-inkscape-font-specification:'Bitstream Vera
Sans';text-align:center;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:middle;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.91727346px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+ id="flowRoot4500">
+ <path
+ id="path4526"
+
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-family:'Bitstream Vera
Sans';-inkscape-font-specification:'Bitstream Vera Sans Bold';stroke-width:0.91727346px"
+ d="m 982.90235,283.00912 v 12.7552 q -4.96484,-2.22005 -9.6875,-3.35026 -4.72265,-1.1302
-8.92057,-1.1302 -5.57031,0 -8.23438,1.53385 -2.66406,1.53385 -2.66406,4.76302 0,2.42187 1.77604,3.79427
1.81641,1.33203 6.53907,2.30078 l 6.61979,1.33203 q 10.05078,2.01823 14.28906,6.13542 4.23828,4.11719
4.23828,11.70573 0,9.97005 -5.93359,14.85416 -5.89323,4.84375 -18.04297,4.84375 -5.73177,0 -11.50391,-1.08984
-5.77213,-1.08984 -11.54427,-3.22917 v -13.11849 q 5.77214,3.06771 11.14063,4.64193 5.40885,1.53386
10.41406,1.53386 5.08594,0 7.79036,-1.69532 2.70443,-1.69531 2.70443,-4.84375 0,-2.82552 -1.85677,-4.35937
-1.81641,-1.53386 -7.30599,-2.74479 l -6.01432,-1.33203 q -9.04167,-1.9375 -13.23959,-6.17579
-4.15755,-4.23828 -4.15755,-11.42317 0,-9.0013 5.8125,-13.84505 5.8125,-4.84375 16.71094,-4.84375 4.96484,0
10.21224,0.76692 5.24739,0.72657 10.85807,2.22006 z m -111.20442,-1.89714 h 17.35677 l 21.91796,41.33333 v
-41.33333 h 14.73308 V 341.3763 H 908.34897 L 886.431,30
0.04297 v 41.33333 h -14.73307 z m -42.70573,10.17188 q -7.10417,0 -11.01954,5.24739 -3.91536,5.2474
-3.91536,14.77344 0,9.48567 3.91536,14.73307 3.91537,5.2474 11.01954,5.2474 7.14453,0 11.05989,-5.2474
3.91537,-5.2474 3.91537,-14.73307 0,-9.52604 -3.91537,-14.77344 -3.91536,-5.24739 -11.05989,-5.24739 z m
0,-11.26172 q 14.53125,0 22.76562,8.3151 8.23437,8.3151 8.23437,22.96745 0,14.61198 -8.23437,22.92708
-8.23437,8.3151 -22.76562,8.3151 -14.49089,0 -22.76563,-8.3151 -8.23437,-8.3151 -8.23437,-22.92708
0,-14.65235 8.23437,-22.96745 8.27474,-8.3151 22.76563,-8.3151 z m -58.36721,1.08984 h 15.54036 v 60.26432 h
-15.54036 z m -17.63933,1.89714 v 12.7552 q -4.96484,-2.22005 -9.6875,-3.35026 -4.72265,-1.1302
-8.92057,-1.1302 -5.57031,0 -8.23437,1.53385 -2.66407,1.53385 -2.66407,4.76302 0,2.42187 1.77605,3.79427
1.8164,1.33203 6.53906,2.30078 l 6.61979,1.33203 q 10.05078,2.01823 14.28906,6.13542 4.23828,4.11719
4.23828,11.70573 0,9.97005 -5.93359,14.85416 -5.89323,4.84375 -18.04
297,4.84375 -5.73177,0 -11.5039,-1.08984 -5.77214,-1.08984 -11.54427,-3.22917 v -13.11849 q 5.77213,3.06771
11.14062,4.64193 5.40885,1.53386 10.41406,1.53386 5.08594,0 7.79037,-1.69532 2.70442,-1.69531
2.70442,-4.84375 0,-2.82552 -1.85677,-4.35937 -1.8164,-1.53386 -7.30599,-2.74479 l -6.01432,-1.33203 q
-9.04167,-1.9375 -13.23958,-6.17579 -4.15755,-4.23828 -4.15755,-11.42317 0,-9.0013 5.8125,-13.84505
5.8125,-4.84375 16.71093,-4.84375 4.96485,0 10.21224,0.76692 5.2474,0.72657 10.85807,2.22006 z m
-111.20441,-1.89714 h 17.35677 l 21.91797,41.33333 v -41.33333 h 14.73307 v 60.26432 h -17.35677 l
-21.91796,-41.33333 v 41.33333 h -14.73308 z m -56.51042,0 h 41.9388 v 11.74609 H 600.8112 v 11.22136 h
24.82421 v 11.74609 H 600.8112 v 13.80469 h 27.28645 v 11.74609 h -42.82682 z m -63.53385,0 h 55.54167 v
11.74609 h -19.98047 v 48.51823 h -15.54036 v -48.51823 h -20.02084 z m -23.00781,29.50651 20.90886,30.75781
h -16.1862 l -14.08724,-20.58594 -13.96615,20.58594 h -16.26692 l 20.9
0885,-30.75781 -20.10156,-29.50651 h 16.22656 l 13.19922,19.41536 13.15885,-19.41536 h 16.30729 z m
-90.09374,-29.50651 h 41.9388 v 11.74609 h -26.39844 v 11.22136 h 24.82422 v 11.74609 h -24.82422 v 13.80469
h 27.28646 v 11.74609 h -42.82682 z"
+ inkscape:connector-curvature="0" />
+ </g>
+ </g>
+ </g>
+</svg>
diff --git a/sweettooth/templates/base.html b/sweettooth/templates/base.html
index 81346db..b6939b6 100644
--- a/sweettooth/templates/base.html
+++ b/sweettooth/templates/base.html
@@ -1,8 +1,11 @@
+{% load gravatar %}
<!doctype html>
<html>
<head>
{% load static from staticfiles %}
<meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}" />
<link rel="stylesheet" href="{% static 'css/style.css' %}" />
<link rel="shortcut icon" href="{% static 'images/favicon.png' %}" />
<link rel="alternate" type="application/rss+xml"
@@ -28,55 +31,80 @@
{% block head %} {% endblock %}
</head>
<body>
- <!-- global gnome.org domain bar -->
- <div id="global_domain_bar">
- <div class="maxwidth">
- <div class="tab">
- {% spaceless %}
-
- <a class="root" href="http://www.gnome.org/">GNOME.org</a>
- {% if n_unreviewed_extensions %}
- <a id="unreviewed_counter" href="{% url 'review-list' %}">{{ n_unreviewed_extensions }}</a>
- {% endif %}
- {% if request.user.is_authenticated %}
- <a class="user" href="#">{{ request.user.username }}</a>
- {% else %}
- <a class="user" href="{% url 'auth-login' %}">Login</a>
- {% endif %}
-
- {% endspaceless %}
- </div>
- {% include "usermenu.html" %}
- </div>
- </div>
-
- <!-- header -->
- <div id="header" class="container_12">
- <div id="logo" class="grid_3">
- <h1><a title="GNOME Shell Extensions" href="/"><img src="{% static
'images/gnome-logo-extensions.png' %}" alt="GNOME Shell Extensions" /></a></h1>
- </div>
- <div id="top_bar" class="grid_9">
- <div class="left">
- <ul id="globalnav" class="{% block navclass %}{% endblock %}">
- {% with request.resolver_match.url_name as url_name %}
- {% for page in global_menu %}
- <li class="{% if url_name == page.id %}current_page_item current-menu-item{% endif
%}"><a href="{% url page.id %}">{{page.name}}</a></li>
- {% endfor %}
- {% endwith %}
+ <header class="gnome-header">
+ <div class="navbar navbar-fixed-top navbar-default affix-top">
+ <div class="container">
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
data-target="#navbar-wrapper" aria-expanded="false">
+ <span class="sr-only">Toggle navigation</span>
+ <span class="icon-bar top-bar"></span>
+ <span class="icon-bar middle-bar"></span>
+ <span class="icon-bar bottom-bar"></span>
+ </button>
+ <a class="gnome-navbar-brand" title="GNOME Shell Extensions" href="/"><img src="{%
static 'images/gnome-extensions.svg' %}" alt="GNOME Shell Extensions" /></a>
+ <ul class="nav navbar-nav icons visible-xs">
+ {% if n_unreviewed_extensions %}
+ <li>
+ <a id="unreviewed_counter" href="{% url 'review-list' %}">{{
n_unreviewed_extensions }}</a>
+ </li>
+ {% endif%}
+ <li class="dropdown">
+ {% if request.user.is_authenticated %}
+ <a data-target="#userDropdownMenu" class="dropdown-toggle avatar"
data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><img src="{% gravatar_url
request request.user.email %}"></a>
+ {% else %}
+ <a href="#userDropdownMenu" class="dropdown-toggle" data-toggle="dropdown"
role="button" aria-haspopup="true" aria-expanded="false"><img src="{% static 'images/avatar-default.svg' %}"
alt="GNOME Shell Extensions" /></a>
+ {% endif %}
+ </li>
+ </ul>
+ </div>
+ <ul class="nav navbar-nav navbar-right no-padding">
+ <li id="userDropdownMenu" class="dropdown">
+ {% spaceless %}
+ {% if request.user.is_authenticated %}
+ <a href="{% url 'auth-profile' user=request.user.username %}" class="dropdown-toggle
hidden-xs avatar" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><img
src="{% gravatar_url request request.user.email %}"></a>
+ {% else %}
+ <a href="{% url 'auth-login' %}" class="dropdown-toggle hidden-xs"
data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Log in <span
class="caret"></span></a>
+ {% endif %}
+ {% endspaceless %}
+ <ul class="dropdown-menu login_popup_form">
+ <li>
+ {% include "usermenu.html" %}
+ </li>
+ </ul>
+ </li>
</ul>
- </div>
- <div class="right">
- {% block search-bar %}
- {% endblock %}
+ {% if n_unreviewed_extensions %}
+ <div class="nav navbar-nav navbar-right hidden-xs">
+ <li>
+ <a id="unreviewed_counter" href="{% url 'review-list' %}">{{ n_unreviewed_extensions
}}</a>
+ </li>
+ </div>
+ {% endif %}
+ <div id="navbar-wrapper" class="collapse navbar-collapse">
+ <ul class="nav navbar-nav">
+ {% with request.resolver_match.url_name as url_name %}
+ {% for page in global_menu %}
+ <li class="{% if url_name == page.id %}active{% endif %}"><a href="{% url
page.id %}">{{page.name}}</a></li>
+ {% endfor %}
+ {% endwith %}
+ </ul>
+ </div>
</div>
</div>
- </div>
+ </header>
<div class="clearfix"></div>
<div id="container" class="two_columns">
<div class="container_12">
<div id="content" class="without_sidebar">
+ <div class="row">
+ <div class="col-sm-12">
+ {% block search-bar %}
+ {% endblock %}
+ </div>
+ </div>
+
<div id="message_container">
{% for message in messages %}
<p class="message {{ message.tags }}">{{ message }}</p>
@@ -139,5 +167,6 @@
<div class="clear"></div>
</div>
</div>
+ <script src="{% static 'js/bootstrap.min.js' %}"></script>
</body>
</html>
diff --git a/sweettooth/templates/usermenu.html b/sweettooth/templates/usermenu.html
index 5805db2..a2526c2 100644
--- a/sweettooth/templates/usermenu.html
+++ b/sweettooth/templates/usermenu.html
@@ -1,13 +1,10 @@
{% if request.user.is_authenticated %}
-<div class="user_settings user_popup">
- {% load gravatar %}
- <a class="avatar" href="{% url 'auth-profile' user=request.user.username %}" title="Profile">
- <img src="{% gravatar_url request request.user.email %}">
- </a>
- <ul>
- <li><a class="text" href="{% url 'auth-settings' user=request.user.username %}">Website Settings</a></li>
- <li><a class="text" href="{% url 'auth-logout' %}">Log Out</a></li>
- </ul>
+<div class="row">
+ <div class="col-sm-12">
+ <p><a class="btn btn-link no-decoration" href="{% url 'auth-profile' user=request.user.username
%}">User Profile</a></p>
+ <p><a class="btn btn-link no-decoration" href="{% url 'auth-settings' user=request.user.username
%}">User Settings</a></p>
+ <p><a class="btn btn-link no-decoration" href="{% url 'auth-logout' %}">Log out</a></p>
+ </div>
</div>
{% else %}
{% include "registration/login_popup_form.html" %}
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]