Beginnings of Mod CP

misago/acl/permissions/admin.py

@@ -1,29 +0,0 @@
-from django.utils.translation import ugettext_lazy as _
-from django import forms
-from misago.acl.builder import BaseACL
-from misago.forms import YesNoSwitch
-
-def make_form(request, role, form):
-    if not role.token and request.user.is_god():
-        form.base_fields['can_use_acp'] = forms.BooleanField(widget=YesNoSwitch, initial=False, required=False)
-        form.layout.append((
-                            _("Admin Control Panel"),
-                            (('can_use_acp', {'label': _("Can use Admin Control Panel"), 'help_text': _("Change this permission to yes to grant admin access for users with this role.")}),),
-                            ))
-
-
-class AdminACL(BaseACL):
-    def is_admin(self):
-        return self.acl['can_use_acp']
-
-
-def build(acl, roles):
-    acl.admin = AdminACL()
-    acl.admin.acl['can_use_acp'] = False
-
-    for role in roles:
-        if 'can_use_acp' in role and role['can_use_acp'] > acl.admin.acl['can_use_acp']:
-            acl.admin.acl['can_use_acp'] = role['can_use_acp']
-
-    if acl.admin.acl['can_use_acp']:
-        acl.team = True

misago/acl/permissions/special.py

@@ -0,0 +1,38 @@
+from django.utils.translation import ugettext_lazy as _
+from django import forms
+from misago.acl.builder import BaseACL
+from misago.forms import YesNoSwitch
+
+def make_form(request, role, form):
+    if not role.token and request.user.is_god():
+        form.base_fields['can_use_acp'] = forms.BooleanField(widget=YesNoSwitch, initial=False, required=False)
+        form.base_fields['can_use_mcp'] = forms.BooleanField(widget=YesNoSwitch, initial=False, required=False)
+        form.layout.append((
+                            _("Special Access"),
+                            (('can_use_mcp', {'label': _("Can use Moderator Control Panel"), 'help_text': _("Change this permission to yes to grant access to Mod CP for users with this role.")}),),
+                            (('can_use_acp', {'label': _("Can use Admin Control Panel"), 'help_text': _("Change this permission to yes to grant admin access for users with this role.")}),),
+                            ))
+
+
+class SpecialACL(BaseACL):
+    def is_admin(self):
+        return self.acl['can_use_acp']
+
+    def can_use_mcp(self):
+        return self.acl['can_use_mcp']
+
+
+def build(acl, roles):
+    acl.special = SpecialACL()
+    acl.special.acl['can_use_acp'] = False
+    acl.special.acl['can_use_mcp'] = False
+
+    for role in roles:
+        if 'can_use_acp' in role:
+            acl.special.acl['can_use_acp'] = True
+            acl.special.acl['can_use_mcp'] = True
+        elif 'can_use_mcp' in role:
+            acl.special.acl['can_use_mcp'] = True
+
+    if acl.special.acl['can_use_acp'] or acl.special.acl['can_use_mcp']:
+        acl.team = True

misago/context_processors.py

@@ -1,11 +1,12 @@
 from django.conf import settings
 from misago import __version__
-from misago.admin import site
+from misago.admin import ADMIN_PATH, site
 
 def common(request):
     try:
         return {
             'acl': request.acl,
+            'ADMIN_PATH': ADMIN_PATH,
             'board_address': settings.BOARD_ADDRESS,
             'csrf_id': request.csrf.csrf_id,
             'csrf_token': request.csrf.csrf_token,

misago/firewalls.py

@@ -32,7 +32,7 @@ class FirewallAdmin(FirewallForum):
             # If we are not authenticated or not admin, force us to sign in right way
             if not request.user.is_authenticated():
                 return signin(request)
-            elif not request.user.is_god() and not request.acl.admin.is_admin():
+            elif not request.user.is_god() and not request.acl.special.is_admin():
                 request.messages.set_message(Message(_("Your account does not have admin privileges")), 'error', 'security')
                 return signin(request)
             return None

misago/fixtures/userroles.py

@@ -7,6 +7,7 @@ def load():
                         'name_changes_allowed': 5,
                         'changes_expire': 7,
                         'can_use_acp': True,
+                        'can_use_mcp': True,
                         'can_use_signature': True,
                         'allow_signature_links': True,
                         'allow_signature_images': True,
@@ -22,6 +23,7 @@ def load():
     role.permissions = {
                         'name_changes_allowed': 3,
                         'changes_expire': 14,
+                        'can_use_mcp': True,
                         'can_use_signature': True,
                         'allow_signature_links': True,
                         'can_search_users': True,

misago/settings_base.py

@@ -107,11 +107,11 @@ MIDDLEWARE_CLASSES = (
 
 # List of application permission providers
 PERMISSION_PROVIDERS = (
-    'misago.acl.permissions.admin',
     'misago.acl.permissions.usercp',
     'misago.acl.permissions.users',
     'misago.acl.permissions.forums',
     'misago.acl.permissions.threads',
+    'misago.acl.permissions.special',
 )
 
 # List of UserCP extensions

static/cranefly/css/cranefly.css

@@ -865,22 +865,28 @@ footer{background-color:#eeeeee;border-top:1px solid #dadada;height:80px;padding
 footer .credits{color:#555555;font-size:90%;}footer .credits a:link,footer .credits a:active,footer .credits a:visited,footer .credits a:hover{color:#555555;}
 ::selection{background:#f89406;color:#ffffff;}
 ::-moz-selection{background:#f89406;color:#ffffff;}
-.navbar .navbar-inner{background:none;background-color:#f3f3f3;border-bottom:1px solid #dfdfdf;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}.navbar .navbar-inner .container{background:url("../img/logo.png");background-position:left center;background-repeat:no-repeat;}
-.navbar .navbar-inner .brand{margin-left:6px;text-shadow:none;}.navbar .navbar-inner .brand:link,.navbar .navbar-inner .brand:active,.navbar .navbar-inner .brand:visited,.navbar .navbar-inner .brand:hover{color:#c24a3b;font-size:200%;}.navbar .navbar-inner .brand:link span,.navbar .navbar-inner .brand:active span,.navbar .navbar-inner .brand:visited span,.navbar .navbar-inner .brand:hover span{color:#c0c0c0;}
-.navbar .navbar-inner .navbar-search-form{background-color:#ffffff;border:1px solid #dfdfdf;border-radius:3px;margin-top:9px;padding:1px 0px;color:#333333;}.navbar .navbar-inner .navbar-search-form input{border:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;margin:0px;}
-.navbar .navbar-inner .navbar-search-form button{margin:0px;opacity:0.3;filter:alpha(opacity=30);}.navbar .navbar-inner .navbar-search-form button:hover,.navbar .navbar-inner .navbar-search-form button:active{opacity:0.8;filter:alpha(opacity=80);}
-.navbar .navbar-inner .navbar-blocks{margin-left:6px;}.navbar .navbar-inner .navbar-blocks li{margin-left:6px;}.navbar .navbar-inner .navbar-blocks li form{margin:0px;padding:0px;}
-.navbar .navbar-inner .navbar-blocks li a:link,.navbar .navbar-inner .navbar-blocks li a:visited,.navbar .navbar-inner .navbar-blocks li .btn-link{background-color:#f8f8f8;border:1px solid #dadada;border-radius:3px;padding:5px 8px;margin-top:9px;}.navbar .navbar-inner .navbar-blocks li a:link i,.navbar .navbar-inner .navbar-blocks li a:visited i,.navbar .navbar-inner .navbar-blocks li .btn-link i{opacity:0.7;filter:alpha(opacity=70);}
-.navbar .navbar-inner .navbar-blocks li a:link .label,.navbar .navbar-inner .navbar-blocks li a:visited .label,.navbar .navbar-inner .navbar-blocks li .btn-link .label{background-color:#cf402e;margin-left:4px;padding-left:6px;padding-right:5px;position:relative;bottom:1px;}
-.navbar .navbar-inner .navbar-blocks li a:hover,.navbar .navbar-inner .navbar-blocks li a:active,.navbar .navbar-inner .navbar-blocks li .btn-link:hover,.navbar .navbar-inner .navbar-blocks li .btn-link:active{background-color:#0088cc;border-color:#006699;}.navbar .navbar-inner .navbar-blocks li a:hover.danger,.navbar .navbar-inner .navbar-blocks li a:active.danger,.navbar .navbar-inner .navbar-blocks li .btn-link:hover.danger,.navbar .navbar-inner .navbar-blocks li .btn-link:active.danger{background-color:#cf402e;border-color:#a53325;}
-.navbar .navbar-inner .navbar-blocks li a:hover.hot,.navbar .navbar-inner .navbar-blocks li a:active.hot,.navbar .navbar-inner .navbar-blocks li .btn-link:hover.hot,.navbar .navbar-inner .navbar-blocks li .btn-link:active.hot{background-color:#f89406;border-color:#c67605;}
-.navbar .navbar-inner .navbar-blocks li a:hover.fresh,.navbar .navbar-inner .navbar-blocks li a:active.fresh,.navbar .navbar-inner .navbar-blocks li .btn-link:hover.fresh,.navbar .navbar-inner .navbar-blocks li .btn-link:active.fresh{background-color:#46a546;border-color:#378137;}
-.navbar .navbar-inner .navbar-blocks li a:hover i,.navbar .navbar-inner .navbar-blocks li a:active i,.navbar .navbar-inner .navbar-blocks li .btn-link:hover i,.navbar .navbar-inner .navbar-blocks li .btn-link:active i{background-image:url("../img/glyphicons-halflings-white.png");opacity:1;filter:alpha(opacity=100);}
-.navbar .navbar-inner .navbar-blocks li a:hover .label,.navbar .navbar-inner .navbar-blocks li a:active .label,.navbar .navbar-inner .navbar-blocks li .btn-link:hover .label,.navbar .navbar-inner .navbar-blocks li .btn-link:active .label{background-color:#eeeeee;color:#333333;}
-.navbar .navbar-inner .navbar-blocks li.user-profile a:link,.navbar .navbar-inner .navbar-blocks li.user-profile a:visited,.navbar .navbar-inner .navbar-blocks li.user-profile a:hover,.navbar .navbar-inner .navbar-blocks li.user-profile a:active{background:none;border:none;margin-right:8px;margin-top:5px;font-weight:bold;text-shadow:none;}.navbar .navbar-inner .navbar-blocks li.user-profile a:link img,.navbar .navbar-inner .navbar-blocks li.user-profile a:visited img,.navbar .navbar-inner .navbar-blocks li.user-profile a:hover img,.navbar .navbar-inner .navbar-blocks li.user-profile a:active img{background-color:#ffffff;border-radius:3px;-webkit-box-shadow:0px 0px 4px #eeeeee;-moz-box-shadow:0px 0px 4px #eeeeee;box-shadow:0px 0px 4px #eeeeee;margin-right:4px;width:32px;height:32px;position:relative;bottom:1px;}
-.navbar .navbar-inner .navbar-user-nav li .btn{padding:2px 8px;margin-left:8px;margin-top:13px;}.navbar .navbar-inner .navbar-user-nav li .btn:link,.navbar .navbar-inner .navbar-user-nav li .btn:active,.navbar .navbar-inner .navbar-user-nav li .btn:hover,.navbar .navbar-inner .navbar-user-nav li .btn:visited{color:#ffffff;}
-.navbar .navbar-inner .navbar-user-nav li .btn.btn-danger{text-shadow:0px 1px 0px #902d20;}.navbar .navbar-inner .navbar-user-nav li .btn.btn-danger:hover,.navbar .navbar-inner .navbar-user-nav li .btn.btn-danger:active,.navbar .navbar-inner .navbar-user-nav li .btn.btn-danger:focus{background-color:#e82c15;border-color:#d12813;}
-.navbar .navbar-inner .navbar-user-nav li .btn.btn-inverse{text-shadow:0px 1px 0px #0d0d0d;}.navbar .navbar-inner .navbar-user-nav li .btn.btn-inverse:hover,.navbar .navbar-inner .navbar-user-nav li .btn.btn-inverse:active,.navbar .navbar-inner .navbar-user-nav li .btn.btn-inverse:focus{background-color:#262626;border-color:#1a1a1a;}
+.navbar-header .navbar-inner{background:none;background-color:#f3f3f3;border-bottom:1px solid #dfdfdf;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}.navbar-header .navbar-inner .container{background:url("../img/logo.png");background-position:left center;background-repeat:no-repeat;}
+.navbar-header .navbar-inner .brand{margin-left:6px;text-shadow:none;}.navbar-header .navbar-inner .brand:link,.navbar-header .navbar-inner .brand:active,.navbar-header .navbar-inner .brand:visited,.navbar-header .navbar-inner .brand:hover{color:#c24a3b;font-size:200%;}.navbar-header .navbar-inner .brand:link span,.navbar-header .navbar-inner .brand:active span,.navbar-header .navbar-inner .brand:visited span,.navbar-header .navbar-inner .brand:hover span{color:#c0c0c0;}
+.navbar-header .navbar-inner .navbar-search-form{background-color:#ffffff;border:1px solid #dfdfdf;border-radius:3px;margin-top:9px;padding:1px 0px;color:#333333;}.navbar-header .navbar-inner .navbar-search-form input{border:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;margin:0px;}
+.navbar-header .navbar-inner .navbar-search-form button{margin:0px;opacity:0.3;filter:alpha(opacity=30);}.navbar-header .navbar-inner .navbar-search-form button:hover,.navbar-header .navbar-inner .navbar-search-form button:active{opacity:0.8;filter:alpha(opacity=80);}
+.navbar-header .navbar-inner .navbar-blocks{margin-left:6px;}.navbar-header .navbar-inner .navbar-blocks li{margin-left:6px;}.navbar-header .navbar-inner .navbar-blocks li form{margin:0px;padding:0px;}
+.navbar-header .navbar-inner .navbar-blocks li a:link,.navbar-header .navbar-inner .navbar-blocks li a:visited,.navbar-header .navbar-inner .navbar-blocks li .btn-link{background-color:#f8f8f8;border:1px solid #dadada;border-radius:3px;padding:5px 8px;margin-top:9px;}.navbar-header .navbar-inner .navbar-blocks li a:link i,.navbar-header .navbar-inner .navbar-blocks li a:visited i,.navbar-header .navbar-inner .navbar-blocks li .btn-link i{opacity:0.7;filter:alpha(opacity=70);}
+.navbar-header .navbar-inner .navbar-blocks li a:link .label,.navbar-header .navbar-inner .navbar-blocks li a:visited .label,.navbar-header .navbar-inner .navbar-blocks li .btn-link .label{background-color:#cf402e;margin-left:4px;padding-left:6px;padding-right:5px;position:relative;bottom:1px;}
+.navbar-header .navbar-inner .navbar-blocks li a:hover,.navbar-header .navbar-inner .navbar-blocks li a:active,.navbar-header .navbar-inner .navbar-blocks li .btn-link:hover,.navbar-header .navbar-inner .navbar-blocks li .btn-link:active{background-color:#0088cc;border-color:#006699;}.navbar-header .navbar-inner .navbar-blocks li a:hover.danger,.navbar-header .navbar-inner .navbar-blocks li a:active.danger,.navbar-header .navbar-inner .navbar-blocks li .btn-link:hover.danger,.navbar-header .navbar-inner .navbar-blocks li .btn-link:active.danger{background-color:#cf402e;border-color:#a53325;}
+.navbar-header .navbar-inner .navbar-blocks li a:hover.hot,.navbar-header .navbar-inner .navbar-blocks li a:active.hot,.navbar-header .navbar-inner .navbar-blocks li .btn-link:hover.hot,.navbar-header .navbar-inner .navbar-blocks li .btn-link:active.hot{background-color:#f89406;border-color:#c67605;}
+.navbar-header .navbar-inner .navbar-blocks li a:hover.fresh,.navbar-header .navbar-inner .navbar-blocks li a:active.fresh,.navbar-header .navbar-inner .navbar-blocks li .btn-link:hover.fresh,.navbar-header .navbar-inner .navbar-blocks li .btn-link:active.fresh{background-color:#46a546;border-color:#378137;}
+.navbar-header .navbar-inner .navbar-blocks li a:hover i,.navbar-header .navbar-inner .navbar-blocks li a:active i,.navbar-header .navbar-inner .navbar-blocks li .btn-link:hover i,.navbar-header .navbar-inner .navbar-blocks li .btn-link:active i{background-image:url("../img/glyphicons-halflings-white.png");opacity:1;filter:alpha(opacity=100);}
+.navbar-header .navbar-inner .navbar-blocks li a:hover .label,.navbar-header .navbar-inner .navbar-blocks li a:active .label,.navbar-header .navbar-inner .navbar-blocks li .btn-link:hover .label,.navbar-header .navbar-inner .navbar-blocks li .btn-link:active .label{background-color:#eeeeee;color:#333333;}
+.navbar-header .navbar-inner .navbar-blocks li.user-profile a:link,.navbar-header .navbar-inner .navbar-blocks li.user-profile a:visited,.navbar-header .navbar-inner .navbar-blocks li.user-profile a:hover,.navbar-header .navbar-inner .navbar-blocks li.user-profile a:active{background:none;border:none;margin-right:8px;margin-top:5px;font-weight:bold;text-shadow:none;}.navbar-header .navbar-inner .navbar-blocks li.user-profile a:link img,.navbar-header .navbar-inner .navbar-blocks li.user-profile a:visited img,.navbar-header .navbar-inner .navbar-blocks li.user-profile a:hover img,.navbar-header .navbar-inner .navbar-blocks li.user-profile a:active img{background-color:#ffffff;border-radius:3px;-webkit-box-shadow:0px 0px 4px #eeeeee;-moz-box-shadow:0px 0px 4px #eeeeee;box-shadow:0px 0px 4px #eeeeee;margin-right:4px;width:32px;height:32px;position:relative;bottom:1px;}
+.navbar-header .navbar-inner .navbar-user-nav li .btn{padding:2px 8px;margin-left:8px;margin-top:13px;}.navbar-header .navbar-inner .navbar-user-nav li .btn:link,.navbar-header .navbar-inner .navbar-user-nav li .btn:active,.navbar-header .navbar-inner .navbar-user-nav li .btn:hover,.navbar-header .navbar-inner .navbar-user-nav li .btn:visited{color:#ffffff;}
+.navbar-header .navbar-inner .navbar-user-nav li .btn.btn-danger{text-shadow:0px 1px 0px #902d20;}.navbar-header .navbar-inner .navbar-user-nav li .btn.btn-danger:hover,.navbar-header .navbar-inner .navbar-user-nav li .btn.btn-danger:active,.navbar-header .navbar-inner .navbar-user-nav li .btn.btn-danger:focus{background-color:#e82c15;border-color:#d12813;}
+.navbar-header .navbar-inner .navbar-user-nav li .btn.btn-inverse{text-shadow:0px 1px 0px #0d0d0d;}.navbar-header .navbar-inner .navbar-user-nav li .btn.btn-inverse:hover,.navbar-header .navbar-inner .navbar-user-nav li .btn.btn-inverse:active,.navbar-header .navbar-inner .navbar-user-nav li .btn.btn-inverse:focus{background-color:#262626;border-color:#1a1a1a;}
+.navbar-modbar{background-color:#902d20;background-image:-webkit-gradient(linear, 0 0, 100% 100%, color-stop(0.25, #c24a3b), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, #c24a3b), color-stop(0.75, #c24a3b), color-stop(0.75, transparent), to(transparent));background-image:-webkit-linear-gradient(-45deg, #c24a3b 25%, transparent 25%, transparent 50%, #c24a3b 50%, #c24a3b 75%, transparent 75%, transparent);background-image:-moz-linear-gradient(-45deg, #c24a3b 25%, transparent 25%, transparent 50%, #c24a3b 50%, #c24a3b 75%, transparent 75%, transparent);background-image:-ms-linear-gradient(-45deg, #c24a3b 25%, transparent 25%, transparent 50%, #c24a3b 50%, #c24a3b 75%, transparent 75%, transparent);background-image:-o-linear-gradient(-45deg, #c24a3b 25%, transparent 25%, transparent 50%, #c24a3b 50%, #c24a3b 75%, transparent 75%, transparent);background-image:linear-gradient(-45deg, #c24a3b 25%, transparent 25%, transparent 50%, #c24a3b 50%, #c24a3b 75%, transparent 75%, transparent);-webkit-background-size:15px 15px;-moz-background-size:15px 15px;background-size:15px 15px;padding-bottom:6px;}.navbar-modbar .navbar-inner{background:none;background-color:#222222;background-image:-webkit-gradient(linear, 0 0, 100% 100%, color-stop(0.25, rgba(0, 0, 0, 0.1)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(0, 0, 0, 0.1)), color-stop(0.75, rgba(0, 0, 0, 0.1)), color-stop(0.75, transparent), to(transparent));background-image:-webkit-linear-gradient(-45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.1) 75%, transparent 75%, transparent);background-image:-moz-linear-gradient(-45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.1) 75%, transparent 75%, transparent);background-image:-ms-linear-gradient(-45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.1) 75%, transparent 75%, transparent);background-image:-o-linear-gradient(-45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.1) 75%, transparent 75%, transparent);background-image:linear-gradient(-45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.1) 75%, transparent 75%, transparent);-webkit-background-size:15px 15px;-moz-background-size:15px 15px;background-size:15px 15px;min-height:1px;}.navbar-modbar .navbar-inner .nav a:link,.navbar-modbar .navbar-inner .nav a:visited{padding:10.5px 14.7px;color:#b3b3b3;text-shadow:0px 1px 0px #000000;}
+.navbar-modbar .navbar-inner .nav a:hover,.navbar-modbar .navbar-inner .nav a:active{color:#ffffff;}
+.navbar-modbar .navbar-inner .nav li.active a:link,.navbar-modbar .navbar-inner .nav li.active a:visited{color:#ffffff;}
+.navbar-modbar .navbar-inner .navbar-search-form{background-color:#0d0d0d;border-radius:3px;margin-top:6px;padding:1px 0px;}.navbar-modbar .navbar-inner .navbar-search-form input{background-color:#0d0d0d;border:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;margin:0px;color:#eeeeee;text-shadow:0px 1px 0px #000000;}
+.navbar-modbar .navbar-inner .navbar-search-form button{margin:0px;opacity:0.6;filter:alpha(opacity=60);}.navbar-modbar .navbar-inner .navbar-search-form button i{background-image:url("../img/glyphicons-halflings-white.png");opacity:1;filter:alpha(opacity=100);}
+.navbar-modbar .navbar-inner .navbar-search-form button:hover,.navbar-modbar .navbar-inner .navbar-search-form button:active{opacity:1;filter:alpha(opacity=100);}
 footer .breadcrumb{background:none;border:none;margin:0px;padding:0px;font-weight:bold;text-shadow:none;}footer .breadcrumb li{text-shadow:none;}footer .breadcrumb li a:link,footer .breadcrumb li a:active,footer .breadcrumb li a:visited,footer .breadcrumb li a:hover{color:#333333;}
 footer .breadcrumb li .divider{opacity:0.3;filter:alpha(opacity=30);margin-left:-6px;}
 footer .breadcrumb li.active{color:#555555;}

static/cranefly/css/cranefly/navbar.less

@@ -1,7 +1,6 @@
 // Navbar
 // -------------------------
-
-.navbar {
+.navbar-header {
   .navbar-inner {
     background: none;
     background-color: @navbarBackground;
@@ -174,4 +173,112 @@
       }
     }
   }
+}
+
+// Inversed navbar, used for moderation tools
+.navbar-modbar {
+  background-color: darken(@red, 15%);
+  background-image: -webkit-gradient(linear, 0 0, 100% 100%,
+              color-stop(.25, rgba(194, 74, 59, 1)), color-stop(.25, transparent),
+              color-stop(.5, transparent), color-stop(.5, rgba(194, 74, 59, 1)),
+              color-stop(.75, rgba(194, 74, 59, 1)), color-stop(.75, transparent),
+              to(transparent));
+  background-image: -webkit-linear-gradient(-45deg, rgba(194, 74, 59, 1) 25%, transparent 25%,
+            transparent 50%, rgba(194, 74, 59, 1) 50%, rgba(194, 74, 59, 1) 75%,
+            transparent 75%, transparent);
+  background-image: -moz-linear-gradient(-45deg, rgba(194, 74, 59, 1) 25%, transparent 25%,
+            transparent 50%, rgba(194, 74, 59, 1) 50%, rgba(194, 74, 59, 1) 75%,
+            transparent 75%, transparent);
+  background-image: -ms-linear-gradient(-45deg, rgba(194, 74, 59, 1) 25%, transparent 25%,
+            transparent 50%, rgba(194, 74, 59, 1) 50%, rgba(194, 74, 59, 1) 75%,
+            transparent 75%, transparent);
+  background-image: -o-linear-gradient(-45deg, rgba(194, 74, 59, 1) 25%, transparent 25%,
+            transparent 50%, rgba(194, 74, 59, 1) 50%, rgba(194, 74, 59, 1) 75%,
+            transparent 75%, transparent);
+  background-image: linear-gradient(-45deg, rgba(194, 74, 59, 1) 25%, transparent 25%,
+            transparent 50%, rgba(194, 74, 59, 1) 50%, rgba(194, 74, 59, 1) 75%,
+            transparent 75%, transparent);
+  -webkit-background-size: 15px 15px;
+  -moz-background-size: 15px 15px;
+  background-size: 15px 15px;
+  padding-bottom: 6px;
+
+  .navbar-inner {
+    background: none;
+    background-color: @grayDarker;
+    background-image: -webkit-gradient(linear, 0 0, 100% 100%,
+                color-stop(.25, rgba(0, 0, 0, 0.1)), color-stop(.25, transparent),
+                color-stop(.5, transparent), color-stop(.5, rgba(0, 0, 0, 0.1)),
+                color-stop(.75, rgba(0, 0, 0, 0.1)), color-stop(.75, transparent),
+                to(transparent));
+    background-image: -webkit-linear-gradient(-45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%,
+              transparent 50%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.1) 75%,
+              transparent 75%, transparent);
+    background-image: -moz-linear-gradient(-45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%,
+              transparent 50%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.1) 75%,
+              transparent 75%, transparent);
+    background-image: -ms-linear-gradient(-45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%,
+              transparent 50%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.1) 75%,
+              transparent 75%, transparent);
+    background-image: -o-linear-gradient(-45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%,
+              transparent 50%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.1) 75%,
+              transparent 75%, transparent);
+    background-image: linear-gradient(-45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%,
+              transparent 50%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.1) 75%,
+              transparent 75%, transparent);
+    -webkit-background-size: 15px 15px;
+    -moz-background-size: 15px 15px;
+    background-size: 15px 15px;
+    min-height: 1px;
+
+    .nav {
+      a:link, a:visited {
+        padding: @fontSizeMini (@fontSizeMini * 1.4);
+
+        color: darken(@white, 30%);
+        text-shadow: 0px 1px 0px @black;
+      }
+
+      a:hover, a:active {
+        color: @white;
+      }
+
+      li.active {
+        a:link, a:visited {
+          color: @white;
+        }
+      }
+    }
+
+    .navbar-search-form {
+      background-color: darken(@grayDark, 15%);
+      border-radius: @baseBorderRadius;
+      margin-top: ((@navbarHeight - @baseLineHeight) / 2) - 9px;
+      padding: 1px 0px;
+
+      input {
+        background-color: darken(@grayDark, 15%);
+        border: none;
+        .box-shadow(none);
+        margin: 0px;
+
+        color: @grayLighter;
+        text-shadow: 0px 1px 0px @black;
+      }
+
+      button {
+        margin: 0px;
+        .opacity(60);
+
+        i {
+          background-image: url("@{iconWhiteSpritePath}");
+          .opacity(100);
+        }
+
+        &:hover, &:active {
+          .opacity(100);
+        }
+      }
+    }
+  }
 }

templates/cranefly/layout.html

@@ -4,7 +4,28 @@
 {% block body %}
 <div id="wrap">
 
-  <div class="navbar navbar-static-top">
+  {% if acl.special.can_use_mcp() %}
+  <div class="navbar navbar-inverse navbar-modbar navbar-static-top">
+    <div class="navbar-inner">
+      <div class="container">
+        <ul class="nav">
+          <li><a href="#">Frontlines</a></li>
+          <li class="active"><a href="#">Reports <span class="label label-important">5</span></a></li>
+          <li><a href="#">Warnings</a></li>
+          <li><a href="#">Annoucements</a></li>
+        </ul>
+        <form class="navbar-form pull-right">
+          <div class="navbar-search-form">
+            <input type="text" class="span2" placeholder="{% trans %}Search IP Address...{% endtrans %}">
+            <button type="submit" class="btn btn-link"><i class="icon-search"></i></button>
+          </div>
+        </form>
+      </div>
+    </div>
+  </div>
+  {% endif %}
+
+  <div class="navbar navbar-header navbar-static-top">
     <div class="navbar-inner">
       <div class="container">
         <a href="{% url 'index' %}" class="brand">{% if settings.board_header %}{{ settings.board_header }}{% else %}{{ settings.board_name }}{% endif %}</a>
@@ -28,9 +49,8 @@
         {% if user.is_authenticated() %}
         <ul class="nav navbar-blocks pull-right">
           <li class="user-profile"><a href="{% url 'user' user=user.id, username=user.username_slug %}" title="{% trans %}Go to your profile{% endtrans %}" class="tooltip-bottom"><div><img src="{{ user.get_avatar(28) }}" alt=""> {{ user.username }}</div></a></li>
-          {#<li><a href="#" title="{% trans %}Active Reports{% endtrans %}" class="tooltip-bottom"><i class="icon-warning-sign"></i><span class="stat">5</span></a></li>#}
           <li><a href="{% url 'alerts' %}" title="{% if user.alerts %}{% trans %}You have new notifications!{% endtrans %}{% else %}{% trans %}Your Notifications{% endtrans %}{% endif %}" class="tooltip-bottom"><i class="icon-asterisk"></i>{% if user.alerts %}<span class="label label-important">{{ user.alerts }}</span>{% endif %}</a></li>
-          {#<li><a href="#" title="{% trans %}Private messages{% endtrans %}" class="tooltip-bottom"><i class="icon-inbox"></i><span class="stat">2</span></a></li>#}
+          <li><a href="#" title="{% trans %}Private messages{% endtrans %}" class="tooltip-bottom"><i class="icon-inbox"></i><span class="label label-important">2</span></a></li>
           <li><a href="{% url 'newsfeed' %}" title="{% trans %}Your News Feed{% endtrans %}" class="tooltip-bottom"><i class="icon-signal"></i></a></li>
           <li><a href="{% url 'watched_threads' %}" title="{% trans %}Threads you are watching{% endtrans %}" class="tooltip-bottom"><i class="icon-bookmark"></i></a></li>
           <li><a href="{% url 'usercp' %}" title="{% trans %}Edit your profile options{% endtrans %}" class="tooltip-bottom"><i class="icon-cog"></i></a></li>