Fix admin layout in new header bar

app/partials/admin/admin-memberships.jade

@@ -4,7 +4,7 @@ div.wrapper.memberships(ng-controller="MembershipsController as ctrl",
                         ng-init="section='admin'; sectionName='ADMIN.MEMBERSHIPS.TITLE'", tg-memberships)
     nav.menu.hidden(tg-project-menu)
 
-    sidebar.menu-secondary.sidebar(tg-admin-navigation="memberships")
+    sidebar.menu-secondary.sidebar.settings-nav(tg-admin-navigation="memberships")
         include ../includes/modules/admin-menu
 
     section.main.admin-membership

app/partials/admin/admin-project-default-values.jade

@@ -3,7 +3,7 @@ doctype html
 div.wrapper(tg-project-default-values, ng-controller="ProjectProfileController as ctrl",
             ng-init="section='admin'; sectionName='ADMIN.PROJECT_DEFAULT_VALUES.TITLE'")
     nav.menu.hidden(tg-project-menu)
-    sidebar.menu-secondary.sidebar(tg-admin-navigation="project-profile")
+    sidebar.menu-secondary.sidebar.settings-nav(tg-admin-navigation="project-profile")
         include ../includes/modules/admin-menu
 
     sidebar.menu-tertiary.sidebar(tg-admin-navigation="default-values")

app/partials/admin/admin-project-export.jade

@@ -4,7 +4,7 @@ div.wrapper(ng-controller="ProjectProfileController as ctrl",
             ng-init="section='admin'; sectionName='ADMIN.PROJECT_EXPORT.TITLE'")
     nav.menu.hidden(tg-project-menu)
 
-    sidebar.menu-secondary.sidebar(tg-admin-navigation="project-profile")
+    sidebar.menu-secondary.sidebar.settings-nav(tg-admin-navigation="project-profile")
         include ../includes/modules/admin-menu
 
     sidebar.menu-tertiary.sidebar(tg-admin-navigation="export")

app/partials/admin/admin-project-modules.jade

@@ -3,7 +3,7 @@ doctype html
 div.wrapper(tg-project-modules, ng-controller="ProjectProfileController as ctrl",
             ng-init="section='admin'; sectionName='ADMIN.MODULES.TITLE'")
     nav.menu.hidden(tg-project-menu)
-    sidebar.menu-secondary.sidebar(tg-admin-navigation="project-profile")
+    sidebar.menu-secondary.sidebar.settings-nav(tg-admin-navigation="project-profile")
         include ../includes/modules/admin-menu
 
     sidebar.menu-tertiary.sidebar(tg-admin-navigation="modules")

app/partials/admin/admin-project-profile.jade

@@ -3,7 +3,7 @@ doctype html
 div.wrapper(tg-project-profile, ng-controller="ProjectProfileController as ctrl",
             ng-init="section='admin'; sectionName='ADMIN.PROJECT_PROFILE.PROJECT_DETAILS'")
     nav.menu.hidden(tg-project-menu)
-    sidebar.menu-secondary.sidebar(tg-admin-navigation="project-profile")
+    sidebar.menu-secondary.sidebar.settings-nav(tg-admin-navigation="project-profile")
         include ../includes/modules/admin-menu
 
     sidebar.menu-tertiary.sidebar(tg-admin-navigation="details")

app/partials/admin/admin-project-reports.jade

@@ -3,7 +3,7 @@ doctype html
 div.wrapper(ng-controller="ProjectProfileController as ctrl",
             ng-init="section='admin'; sectionName='ADMIN.REPORTS.TITLE'")
     nav.menu.hidden(tg-project-menu)
-    sidebar.menu-secondary.sidebar(tg-admin-navigation="project-profile")
+    sidebar.menu-secondary.sidebar.settings-nav(tg-admin-navigation="project-profile")
         include ../includes/modules/admin-menu
 
     sidebar.menu-tertiary.sidebar(tg-admin-navigation="reports")

app/partials/admin/admin-project-values-custom-fields.jade

@@ -5,7 +5,7 @@ div.wrapper(ng-controller="ProjectValuesSectionController",
 
     nav.menu.hidden(tg-project-menu)
 
-    sidebar.menu-secondary.sidebar(tg-admin-navigation="project-values")
+    sidebar.menu-secondary.sidebar.settings-nav(tg-admin-navigation="project-values")
         include ../includes/modules/admin-menu
 
     sidebar.menu-tertiary.sidebar(tg-admin-navigation="values-custom-fields")

app/partials/admin/admin-project-values-points.jade

@@ -4,7 +4,7 @@ div.wrapper(ng-controller="ProjectValuesSectionController")
 
     nav.menu.hidden(tg-project-menu)
 
-    sidebar.menu-secondary.sidebar(tg-admin-navigation="project-values")
+    sidebar.menu-secondary.sidebar.settings-nav(tg-admin-navigation="project-values")
         include ../includes/modules/admin-menu
 
     sidebar.menu-tertiary.sidebar(tg-admin-navigation="values-points")

app/partials/admin/admin-project-values-priorities.jade

@@ -3,7 +3,7 @@ doctype html
 div.wrapper(ng-controller="ProjectValuesSectionController")
     nav.menu.hidden(tg-project-menu)
 
-    sidebar.menu-secondary.sidebar(tg-admin-navigation="project-values")
+    sidebar.menu-secondary.sidebar.settings-nav(tg-admin-navigation="project-values")
         include ../includes/modules/admin-menu
 
     sidebar.menu-tertiary.sidebar(tg-admin-navigation="values-priorities")

app/partials/admin/admin-project-values-severities.jade

@@ -3,7 +3,7 @@ doctype html
 div.wrapper(ng-controller="ProjectValuesSectionController")
     nav.menu.hidden(tg-project-menu)
 
-    sidebar.menu-secondary.sidebar(tg-admin-navigation="project-values")
+    sidebar.menu-secondary.sidebar.settings-nav(tg-admin-navigation="project-values")
         include ../includes/modules/admin-menu
 
     sidebar.menu-tertiary.sidebar(tg-admin-navigation="values-severities")

app/partials/admin/admin-project-values-status.jade

@@ -3,7 +3,7 @@ doctype html
 div.wrapper(ng-controller="ProjectValuesSectionController",
             ng-init="section='admin'; sectionName='ADMIN.PROJECT_VALUES_STATUS.TITLE'")
     nav.menu.hidden(tg-project-menu)
-    sidebar.menu-secondary.sidebar(tg-admin-navigation="project-values")
+    sidebar.menu-secondary.sidebar.settings-nav(tg-admin-navigation="project-values")
         include ../includes/modules/admin-menu
 
     sidebar.menu-tertiary.sidebar(tg-admin-navigation="values-status")

app/partials/admin/admin-project-values-types.jade

@@ -4,7 +4,7 @@ div.wrapper(ng-controller="ProjectValuesSectionController"
             ng-init="sectionName='ADMIN.PROJECT_VALUES_TYPES.TITLE'")
     nav.menu.hidden(tg-project-menu)
 
-    sidebar.menu-secondary.sidebar(tg-admin-navigation="project-values")
+    sidebar.menu-secondary.sidebar.settings-nav(tg-admin-navigation="project-values")
         include ../includes/modules/admin-menu
 
     sidebar.menu-tertiary.sidebar(tg-admin-navigation="values-types")

app/partials/admin/admin-roles.jade

@@ -4,7 +4,7 @@ div.wrapper.roles(ng-controller="RolesController as ctrl",
                         ng-init="section='admin'", tg-roles)
     nav.menu.hidden(tg-project-menu)
 
-    sidebar.menu-secondary.sidebar(tg-admin-navigation="roles")
+    sidebar.menu-secondary.sidebar.settings-nav(tg-admin-navigation="roles")
         include ../includes/modules/admin-menu
 
     sidebar.menu-tertiary.sidebar

app/partials/admin/admin-third-parties-bitbucket.jade

@@ -3,7 +3,7 @@ doctype html
 div.wrapper.roles(tg-bitbucket-webhooks, ng-controller="BitbucketController as ctrl",
                         ng-init="section='admin'")
     nav.menu.hidden(tg-project-menu)
-    sidebar.menu-secondary.sidebar(tg-admin-navigation="third-parties")
+    sidebar.menu-secondary.sidebar.settings-nav(tg-admin-navigation="third-parties")
         include ../includes/modules/admin-menu
     sidebar.menu-tertiary.sidebar(tg-admin-navigation="third-parties-bitbucket")
         include ../includes/modules/admin-submenu-third-parties

app/partials/admin/admin-third-parties-github.jade

@@ -3,7 +3,7 @@ doctype html
 div.wrapper.roles(tg-github-webhooks, ng-controller="GithubController as ctrl",
                         ng-init="section='admin'")
     nav.menu.hidden(tg-project-menu)
-    sidebar.menu-secondary.sidebar(tg-admin-navigation="third-parties")
+    sidebar.menu-secondary.sidebar.settings-nav(tg-admin-navigation="third-parties")
         include ../includes/modules/admin-menu
     sidebar.menu-tertiary.sidebar(tg-admin-navigation="third-parties-github")
         include ../includes/modules/admin-submenu-third-parties

app/partials/admin/admin-third-parties-gitlab.jade

@@ -3,7 +3,7 @@ doctype html
 div.wrapper.roles(tg-gitlab-webhooks, ng-controller="GitlabController as ctrl",
                         ng-init="section='admin'")
     nav.menu.hidden(tg-project-menu)
-    sidebar.menu-secondary.sidebar(tg-admin-navigation="third-parties")
+    sidebar.menu-secondary.sidebar.settings-nav(tg-admin-navigation="third-parties")
         include ../includes/modules/admin-menu
     sidebar.menu-tertiary.sidebar(tg-admin-navigation="third-parties-gitlab")
         include ../includes/modules/admin-submenu-third-parties

app/partials/admin/admin-third-parties-webhooks.jade

@@ -3,7 +3,7 @@ doctype html
 div.wrapper.roles(ng-controller="WebhooksController as ctrl",
                         ng-init="section='admin'")
     nav.menu.hidden(tg-project-menu)
-    sidebar.menu-secondary.sidebar(tg-admin-navigation="third-parties")
+    sidebar.menu-secondary.sidebar.settings-nav(tg-admin-navigation="third-parties")
         include ../includes/modules/admin-menu
     sidebar.menu-tertiary.sidebar(tg-admin-navigation="third-parties-webhooks")
         include ../includes/modules/admin-submenu-third-parties

app/partials/contrib/main.jade

@@ -2,7 +2,7 @@ doctype html
 
 div.wrapper.roles(ng-init="section='admin'", ng-controller="ContribController as ctrl")
     nav.menu.hidden(tg-project-menu)
-    sidebar.menu-secondary.sidebar(tg-admin-navigation="contrib")
+    sidebar.menu-secondary.sidebar.settings-nav(tg-admin-navigation="contrib")
         include ../includes/modules/admin-menu
 
     sidebar.menu-tertiary.sidebar

app/partials/includes/modules/admin-menu.jade

@@ -4,24 +4,18 @@ section.admin-menu
             li#adminmenu-project-profile
                 a(href="", tg-nav="project-admin-project-profile-details:project=project.slug")
                     span.title(translate="ADMIN.MENU.PROJECT")
-                    span.icon.icon-arrow-right
             li#adminmenu-project-values
                 a(href="", tg-nav="project-admin-project-values-status:project=project.slug")
                     span.title(translate="ADMIN.MENU.ATTRIBUTES")
-                    span.icon.icon-arrow-right
             li#adminmenu-memberships
                 a(href="" tg-nav="project-admin-memberships:project=project.slug")
                     span.title(translate="ADMIN.MENU.MEMBERS")
-                    span.icon.icon-arrow-right
             li#adminmenu-roles
                 a(href="" tg-nav="project-admin-roles:project=project.slug")
                     span.title(translate="ADMIN.MENU.PERMISSIONS")
-                    span.icon.icon-arrow-right
             li#adminmenu-third-parties
                 a(href="" tg-nav="project-admin-third-parties-webhooks:project=project.slug")
                     span.title(translate="ADMIN.MENU.INTEGRATIONS")
-                    span.icon.icon-arrow-right
             li#adminmenu-contrib(ng-show="adminPlugins.length > 0")
                 a(href="" tg-nav="project-admin-contrib:project=project.slug,plugin=adminPlugins[0].slug")
                     span.title(translate="COMMON.PLUGINS")
-                    span.icon.icon-arrow-right

app/partials/includes/modules/admin-submenu-project-profile.jade

@@ -1,26 +1,18 @@
 section.admin-submenu
-    header
-        h1(translate="ADMIN.SUBMENU_PROJECT_PROFILE.TITLE")
-
     nav
         ul
             li#adminmenu-details
                 a(href="", tg-nav="project-admin-project-profile-details:project=project.slug")
                     span.title(translate="ADMIN.PROJECT_PROFILE.PROJECT_DETAILS")
-                    span.icon.icon-arrow-right
             li#adminmenu-default-values
                 a(href="", tg-nav="project-admin-project-profile-default-values:project=project.slug")
                     span.title(translate="ADMIN.PROJECT_DEFAULT_VALUES.TITLE")
-                    span.icon.icon-arrow-right
             li#adminmenu-modules
                 a(href="", tg-nav="project-admin-project-profile-modules:project=project.slug")
                     span.title(translate="ADMIN.MODULES.TITLE")
-                    span.icon.icon-arrow-right
             li#adminmenu-export
                 a(href="", tg-nav="project-admin-project-profile-export:project=project.slug")
                     span.title(translate="ADMIN.PROJECT_EXPORT.TITLE")
-                    span.icon.icon-arrow-right
             li#adminmenu-reports
                 a(href="", tg-nav="project-admin-project-profile-reports:project=project.slug")
                     span.title(translate="ADMIN.REPORTS.TITLE")
-                    span.icon.icon-arrow-right

app/partials/includes/modules/admin-submenu-project-values.jade

@@ -1,35 +1,26 @@
 section.admin-submenu
-    header
-        h1(translate="ADMIN.SUBMENU_PROJECT_ATTRIBUTES.TITLE")
-
     nav
         ul
             li#adminmenu-values-status
                 a(href="", tg-nav="project-admin-project-values-status:project=project.slug")
                     span.title(translate="ADMIN.SUBMENU_PROJECT_VALUES.STATUS")
-                    span.icon.icon-arrow-right
 
             li#adminmenu-values-points
                 a(href="", tg-nav="project-admin-project-values-points:project=project.slug")
                     span.title(translate="ADMIN.SUBMENU_PROJECT_VALUES.POINTS")
-                    span.icon.icon-arrow-right
 
             li#adminmenu-values-priorities
                 a(href="", tg-nav="project-admin-project-values-priorities:project=project.slug")
                     span.title(translate="ADMIN.SUBMENU_PROJECT_VALUES.PRIORITIES")
-                    span.icon.icon-arrow-right
 
             li#adminmenu-values-severities
                 a(href="", tg-nav="project-admin-project-values-severities:project=project.slug")
                     span.title(translate="ADMIN.SUBMENU_PROJECT_VALUES.SEVERITIES")
-                    span.icon.icon-arrow-right
 
             li#adminmenu-values-types
                 a(href="", tg-nav="project-admin-project-values-types:project=project.slug")
                     span.title(translate="ADMIN.SUBMENU_PROJECT_VALUES.TYPES")
-                    span.icon.icon-arrow-right
 
             li#adminmenu-values-custom-fields
                 a(href="", tg-nav="project-admin-project-values-custom-fields:project=project.slug")
                     span.title(translate="ADMIN.SUBMENU_PROJECT_VALUES.CUSTOM_FIELDS")
-                    span.icon.icon-arrow-right

app/partials/includes/modules/admin-submenu-roles.jade

@@ -1,13 +1,9 @@
-section.admin-submenu-roles
+section.admin-submenu.admin-submenu-roles
-    header
-        h1(translate="ADMIN.SUBMENU_ROLES.TITLE")
-
     nav
         ul
             li(ng-repeat="item in roles")
                 a(href="" ng-click="ctrl.setRole(item)", ng-class="{active: role.id == item.id}")
                   span.single-role {{ item.name }}
-                  span.icon.icon-arrow-right
 
         div(tg-new-role)
             a.button-gray.add-button(href="", title="{{'ADMIN.SUBMENU_ROLES.TITLE_ACTION_NEW_ROLE' | translate}}")

app/partials/includes/modules/admin-submenu-third-parties.jade

@@ -1,22 +1,15 @@
 section.admin-submenu
-    header
-        h1(translate="ADMIN.SUBMENU_THIDPARTIES.TITLE")
-
     nav
         ul
             li#adminmenu-third-parties-webhooks.third-parties-webhooks
                 a(href="", tg-nav="project-admin-third-parties-webhooks:project=project.slug")
                     span.title Webhooks
-                    span.icon.icon-arrow-right
             li#adminmenu-third-parties-github
                 a(href="", tg-nav="project-admin-third-parties-github:project=project.slug")
                     span.title Github
-                    span.icon.icon-arrow-right
             li#adminmenu-third-parties-gitlab
                 a(href="", tg-nav="project-admin-third-parties-gitlab:project=project.slug")
                     span.title Gitlab
-                    span.icon.icon-arrow-right
             li#adminmenu-third-parties-bitbucket
                 a(href="", tg-nav="project-admin-third-parties-bitbucket:project=project.slug")
                     span.title Bitbucket
-                    span.icon.icon-arrow-right

app/partials/includes/modules/admin/admin-submenu-contrib.jade

@@ -1,10 +1,6 @@
 section.admin-submenu
-    header
-        h1(translate="COMMON.PLUGINS")
-
     nav
         ul
             li#adminmenu-contrib(ng-repeat="plugin in adminPlugins")
                 a(href="", tg-nav="project-admin-contrib:project=projectSlug,plugin=plugin.slug" ng-class="{active: plugin.slug == currentPlugin.slug}")
                     span.title {{ plugin.name }}
-                    span.icon.icon-arrow-right

app/partials/user/mail-notifications.jade

@@ -4,7 +4,7 @@ div.wrapper(tg-user-notifications, ng-controller="UserNotificationsController as
                 ng-init="section='mail-notifications'")
     nav.menu.hidden(tg-project-menu)
 
-    sidebar.menu-secondary.sidebar.user-profile-nav(tg-user-settings-navigation="mail-notifications")
+    sidebar.menu-secondary.sidebar.settings-nav(tg-user-settings-navigation="mail-notifications")
         include ../includes/modules/user-settings-menu
 
     section.main.admin-common

app/partials/user/user-change-password.jade

@@ -3,7 +3,7 @@ doctype html
 div.wrapper(tg-user-change-password, ng-controller="UserChangePasswordController as ctrl",
             ng-init="section='user-settings'")
     nav.menu.hidden(tg-project-menu)
-    sidebar.menu-secondary.sidebar.user-profile-nav(tg-user-settings-navigation="change-password")
+    sidebar.menu-secondary.sidebar.settings-nav(tg-user-settings-navigation="change-password")
         include ../includes/modules/user-settings-menu
 
     section.main.user-change-password

app/partials/user/user-profile.jade

@@ -3,7 +3,7 @@ doctype html
 div.wrapper(tg-user-profile, ng-controller="UserSettingsController as ctrl",
             ng-init="section='user-settings'")
     nav.menu.hidden(tg-project-menu)
-    sidebar.menu-secondary.sidebar.user-profile-nav(tg-user-settings-navigation="user-profile")
+    sidebar.menu-secondary.sidebar.settings-nav(tg-user-settings-navigation="user-profile")
         include ../includes/modules/user-settings-menu
 
     section.main.user-profile

app/styles/components/settings-nav.scss

@@ -0,0 +1,6 @@
+.settings-nav {
+    padding: 0;
+    .active {
+        background: $white;
+    }
+}

app/styles/core/base.scss

@@ -83,7 +83,6 @@ body {
     background-color: $dark-taiga;
     flex: 0 0 auto;
     min-height: 100vh;
-    padding: 2em 1em;
     width: 255px;
 }
 

app/styles/modules/admin/admin-menu.scss

@@ -11,22 +11,5 @@
     a {
         display: block;
         padding: 1rem 0 1rem 1rem;
-        &:hover {
-            .icon {
-                opacity: 1;
-                transition: opacity .3s linear;
-            }
-        }
-    }
-    .active {
-        .icon {
-            opacity: 1;
-            transition: opacity .3s linear;
-        }
-    }
-    .icon {
-        color: $blackish;
-        float: right;
-        opacity: 0;
     }
 }

app/styles/modules/admin/admin-submenu-roles.scss

@@ -1,44 +1,6 @@
 .admin-submenu-roles {
-    h1 {
-        @extend %xlarge;
-        color: $white;
-    }
-    li {
-        @extend %larger;
-        @extend %title;
-        border-bottom: 1px solid $gray-light;
-        text-transform: uppercase;
-        &:last-child {
-            border-bottom: 0;
-        }
-    }
-    a {
-        color: $white;
-        display: block;
-        padding: 1rem 0 1rem 1rem;
-        &.active,
-        &:hover {
-            color: $blackish;
-            .icon {
-                opacity: 1;
-                transition: opacity .3s linear;
-            }
-        }
-    }
     .single-role {
         @include ellipsis(175px);
         display: inline-block;
     }
-    .icon {
-        color: $white;
-        float: right;
-        opacity: 0;
-    }
-    .button-gray {
-        padding: .5rem 0;
-        text-align: center;
-        &:hover {
-            background-color: $blackish;
-        }
-    }
 }

app/styles/modules/admin/admin-submenu.scss

@@ -1,8 +1,4 @@
 .admin-submenu {
-    h1 {
-        @extend %xlarge;
-        color: $white;
-    }
     li {
         @extend %larger;
         @extend %title;
@@ -17,14 +13,15 @@
         display: flex;
         justify-content: space-between;
         padding: 1rem 0 1rem 1rem;
-        &.active,
         &:hover {
-            color: $blackish;
+            background: lighten($dark-taiga, 3%);
-            .icon {
+            color: $white;
-                color: $blackish;
+            transition: all .2s;
-                opacity: 1;
+        }
-                transition: opacity .3s linear;
+        &.active {
-            }
+            background: lighten($dark-taiga, 10%);
+            color: $white;
+            transition: all .2s;
         }
         span {
             display: block;
@@ -34,12 +31,12 @@
             white-space: nowrap;
         }
     }
-    .icon {
+    input {
-        color: $white;
+        margin: 0 1rem;
-        float: right;
+        width: 85%;
-        opacity: 0;
     }
     .button-gray {
+        margin: 0 1rem;
         padding: .5rem 0;
         text-align: center;
         &:hover {

app/styles/modules/common/nav.scss

@@ -1,6 +1,7 @@
 $label-arrow-wh: 12px;
 
 .menu {
+    background-color: $dark-taiga;
     background-image: url('../images/menu.png');
     background-position: center center;
     min-height: 100vh;

app/styles/modules/user-settings/user-profile.scss

@@ -1,11 +1,3 @@
-.user-profile-nav {
-    padding: 0;
-    .active {
-        background: $white;
-        color: $fresh-taiga;
-    }
-}
-
 .user-profile {
     form {
         max-width: 700px;