permissions: unified looks and buttons on permission pages.

- new quick menu for some super-admin actions. e.g show permissions link

rhodecode/public/css/navigation.less

@@ -1,695 +1,696 b''
 // navigation.less
 // For use in RhodeCode applications;
 // see style guide documentation for guidelines.
 
 // HEADER NAVIGATION
 
 .horizontal-list {
     float: right;
     display: block;
     margin: 0;
     padding: 0;
     -webkit-padding-start: 0;
     text-align: left;
     font-size: @navigation-fontsize;
     color: @grey6;
     z-index:10;
 
     li {
         line-height: 1em;
         list-style-type: none;
 
         a {
             padding: 0 .5em;
 
             &.menu_link_notifications {
                 .pill(7px,@rcblue);
                 display: inline;
                 margin: 0 7px 0 .7em;
                 font-size: @basefontsize;
                 color: white;
 
                 &.empty {
                     background-color: @grey4;
                 }
 
                 &:hover {
                     background-color: @rcdarkblue;
                 }
             }
         }
         .pill_container {
             margin: 1.25em 0px 0px 0px;
             float: right;
         }
 
         &#quick_login_li {
             &:hover {
                 color: @grey5;
             }
 
             a.menu_link_notifications {
                 color: white;
             }
 
             .user {
                 padding-bottom: 10px;
             }
 
             &.open {
                 .user {
                     border-bottom: 5px solid @rcblue;
                 }
             }
         }
 
         &:before { content: none; }
 
         &:last-child {
             .menulabel {
                 padding-right: 0;
                 border-right: none;
 
                 .show_more {
                     padding-right: 0;
                 }
             }
 
             &> a {
                 border-bottom: none;
             }
         }
 
         &.active {
             border-bottom: 5px solid @rcblue;
         }
 
         &.open {
 
             a {
                 color: white;
             }
         }
 
         &:focus {
             outline: none;
         }
 
         ul li  {
             display: block;
 
             &:last-child> a {
                 border-bottom: none;
             }
 
             ul li:last-child a {
                 /* we don't expect more then 3 levels of submenu and the third
                 level can have different html structure */
                 border-bottom: none;
             }
         }
     }
 
     > li {
         float: left;
         display: block;
         padding: 0;
 
         > a,
         &.has_select2 a {
             display: block;
             padding: 10px 0 2px;
 
             .show_more {
                 margin-top: -4px;
                 padding-right: .5em;
             }
         }
 
         .menulabel {
             padding: 0 .5em;
             line-height: 1em;
             // for this specifically we do not use a variable
             border-right: 1px solid @grey4;
         }
 
         .pr_notifications {
             padding-left: .5em;
         }
 
         .pr_notifications + .menulabel {
             display:inline;
             padding-left: 0;
         }
 
         &:hover,
         &.open,
         &.active {
             a {
                 color: @grey1;
             }
         }
     }
 
     pre {
         margin: 0;
         padding: 0;
     }
 
     .select2-container,
     .menulink.childs {
         position: relative;
     }
 
     #quick_login {
 
         li a {
             padding: .5em 0;
             border-bottom: none;
             color: @grey2;
 
             &:hover { color: @grey1; }
         }
 
         .show_more {
             padding-left: .5em;
         }
     }
 
     #quick_login_link {
         display: inline-block;
 
         .gravatar {
             border: 1px solid @grey2;
         }
 
         .gravatar-login {
             height: 20px;
             width: 20px;
             margin: -8px 0;
             padding: 0;
         }
 
         &:hover .user {
             color: @grey6;
         }
     }
 }
 .header .horizontal-list {
 
     li {
 
         &#quick_login_li {
             padding-left: .5em;
 
             &:hover #quick_login_link {
                 color: inherit;
             }
         }
 
         &:before { content: none; }
     }
 
     > li {
 
         a {
             padding: 18px 0 12px 0;
             color: @nav-grey;
 
             &.menu_link_notifications {
                 padding: 1px 8px;
             }
         }
 
         &:hover,
         &.open,
         &.active {
             .pill_container a {
                 // don't select text for the pill container, it has it' own
                 // hover behaviour
                 color: @nav-grey;
             }
         }
 
         &:hover,
         &.open,
         &.active {
             a {
                 color: @grey6;
             }
         }
 
         .select2-dropdown-open a {
             color: @grey6;
         }
 
         .repo-switcher {
             padding-left: 0;
 
             .menulabel {
                 padding-left: 0;
             }
         }
     }
 
     li ul li  {
         background-color:@grey2;
 
         a {
             padding: .5em 0;
             border-bottom: @border-thickness solid @border-default-color;
             color: @grey6;
         }
 
          &:last-child a, &.last a{
             border-bottom: none;
         }
 
         &:hover {
             background-color: @grey3;
         }
     }
 
     .submenu {
         margin-top: 5px;
     }
 }
 
 // SUBMENUS
 .navigation .submenu {
     display: none;
 }
 
 .navigation li.open {
     .submenu {
         display: block;
     }
 }
 
 .navigation li:last-child .submenu {
     right: -20px;
     left: auto;
 }
 
 .submenu {
     position: absolute;
     top: 100%;
     left: 0;
     min-width: 150px;
     margin: 6px 0 0;
     padding: 0;
     text-align: left;
     font-family: @text-light;
     border-radius: @border-radius;
     z-index: 20;
 
     li {
         display: block;
         margin: 0;
         padding: 0 .5em;
         line-height: 1em;
         color: @grey3;
         background-color: @grey6;
 
         &:before { content: none; }
 
         a {
             display: block;
             width: 100%;
             padding: .5em 0;
             border-right: none;
             border-bottom: @border-thickness solid white;
             color: @grey3;
         }
 
         ul {
             display: none;
             position: absolute;
             top: 0;
             right: 100%;
             padding: 0;
             z-index: 30;
         }
         &:hover {
             background-color: @grey5;
             -webkit-transition: background .3s;
                -moz-transition: background .3s;
                  -o-transition: background .3s;
                     transition: background .3s;
 
             ul {
                 display: block;
             }
         }
     }
 }
 
 
 
 
 // repo dropdown
 .quick_repo_menu {
     width: 15px;
     text-align: center;
     position: relative;
     cursor: pointer;
 
     div {
         overflow: visible !important;
     }
 
     &.sorting {
         cursor: auto;
     }
 
     &:hover {
         .menu_items_container {
             position: absolute;
             display: block;
         }
         .menu_items {
             display: block;
         }
     }
 
     i {
         margin: 0;
         color: @grey4;
     }
 
     .menu_items_container {
         position: absolute;
         top: 0;
         left: 100%;
         margin: 0;
         padding: 0;
         list-style: none;
         background-color: @grey6;
         z-index: 999;
         text-align: left;
 
         a {
             color: @grey2;
         }
 
         ul.menu_items {
             margin: 0;
             padding: 0;
         }
 
         li {
             margin: 0;
             padding: 0;
             line-height: 1em;
             list-style-type: none;
 
             &:before { content: none; }
 
             a {
                 display: block;
                 height: 16px;
                 padding: 8px; //must add up to td height (28px)
+                width: 120px; // set width
 
                 &:hover {
                     background-color: @grey5;
                     -webkit-transition: background .3s;
                        -moz-transition: background .3s;
                          -o-transition: background .3s;
                             transition: background .3s;
                 }
             }
         }
     }
 }
 
 // Header Repository Switcher
 // Select2 Dropdown
 #select2-drop.select2-drop.repo-switcher-dropdown  {
     width: auto !important;
     margin-top: 5px;
     padding: 1em 0;
     text-align: left;
     .border-radius-bottom(@border-radius);
     border-color: transparent;
     color: @grey6;
     background-color: @grey2;
 
     input {
         min-width: 90%;
     }
 
     ul.select2-result-sub {
 
         li {
             line-height: 1em;
 
             &:hover,
             &.select2-highlighted {
                 background-color: @grey3;
             }
         }
 
         &:before { content: none; }
     }
 
     ul.select2-results {
         min-width: 200px;
         margin: 0;
         padding: 0;
         list-style-type: none;
         overflow-x: visible;
         overflow-y: scroll;
 
         li {
             padding: 0 8px;
             line-height: 1em;
             color: @grey6;
 
             &:before { content: none; }
 
             &>.select2-result-label {
                 padding: 8px 0;
                 border-bottom: @border-thickness solid @grey3;
                 white-space: nowrap;
                 color: @grey5;
                 cursor: pointer;
             }
 
             &.select2-result-with-children {
                 margin: 0;
                 padding: 0;
             }
 
             &.select2-result-unselectable > .select2-result-label {
                 margin: 0 8px;
             }
 
         }
     }
 
     ul.select2-result-sub {
         margin: 0;
         padding: 0;
 
         li {
             display: block;
             margin: 0;
             border-right: none;
             line-height: 1em;
             font-family: @text-light;
             color: @grey2;
 
             &:before { content: none; }
 
             &:hover {
                 background-color: @grey3;
             }
         }
     }
 }
 
 
 #context-bar {
     display: block;
     margin: 0 auto;
     padding: 0 @header-padding;
     background-color: @grey6;
     border-bottom: @border-thickness solid @grey5;
 
     .clear {
         clear: both;
     }
 }
 
 ul#context-pages {
     li {
         line-height: 1em;
 
         &:before { content: none; }
 
         a {
             color: @grey3;
         }
 
         &.active {
             // special case, non-variable color
             border-bottom: 4px solid @nav-grey;
 
             a {
                 color: @grey1;
             }
         }
     }
 }
 
 // PAGINATION
 
 .pagination {
     border: @border-thickness solid @rcblue;
     color: @rcblue;
 
     .current {
         color: @grey4;
     }
 }
 
 .dataTables_processing {
     text-align: center;
     font-size: 1.1em;
     position: relative;
     top: 95px;
 }
 
 .dataTables_paginate, .pagination-wh {
     text-align: left;
     display: inline-block;
     border-left: 1px solid @rcblue;
     float: none;
     overflow: hidden;
 
     .paginate_button, .pager_curpage,
     .pager_link, .pg-previous, .pg-next, .pager_dotdot {
         display: inline-block;
         padding: @menupadding/4 @menupadding;
         border: 1px solid @rcblue;
         border-left: 0;
         color: @rcblue;
         cursor: pointer;
         float: left;
     }
 
     .pager_curpage, .pager_dotdot,
     .paginate_button.current, .paginate_button.disabled,
     .disabled {
         color: @grey3;
         cursor: default;
     }
 
     .ellipsis {
         display: inline-block;
         text-align: left;
         padding: @menupadding/4 @menupadding;
         border: 1px solid @rcblue;
         border-left: 0;
         float: left;
     }
 }
 
 // SIDEBAR
 
 .sidebar {
     .block-left;
     clear: left;
     max-width: @sidebar-width;
     margin-right: @sidebarpadding;
     padding-right: @sidebarpadding;
     font-family: @text-regular;
     color: @grey1;
 
     &#graph_nodes {
         clear:both;
         width: auto;
         margin-left: -100px;
         padding: 0;
         border: none;
     }
 
     .nav-pills {
         margin: 0;
     }
 
     .nav {
         list-style: none;
         padding: 0;
 
         li {
             padding-bottom: @menupadding;
             line-height: 1em;
             color: @grey4;
 
             &.active a {
                 color: @grey2;
             }
 
             a {
                 color: @grey4;
             }
 
             &:before { content: none; }
         }
 
     }
 }
 
 .main_filter_help_box {
     padding: 7px 7px;
     border-top: 1px solid @grey4;
     border-right: 1px solid @grey4;
     border-bottom: 1px solid @grey4;
     display: inline-block;
     vertical-align: top;
     margin-left: -5px;
     background: @grey3;
 }
 
 .main_filter_input_box {
     display: inline-block;
 }
 
 .main_filter_box {
     margin: 9px 0 0 0;
 }
 
 #main_filter_help {
     background: @grey3;
     border: 1px solid black;
     position: absolute;
     white-space: pre-wrap;
     z-index: 9999;
     color: @nav-grey;
     margin: 1px 7px;
     padding: 0 2px;
 }
 
 .main_filter_input {
     padding: 6px;
     min-width: 220px;
     color: @nav-grey;
     background: @grey3;
 }
 
 .main_filter_input::placeholder {
    color: @nav-grey;
    opacity: 1;
 }
 
 .notice-box {
     display:block !important;
     padding: 9px 0 !important;
 }
 
 .menulabel-notice {
     border: 1px solid @color5;
     padding:7px 10px;
     color: @color5;
 }

rhodecode/templates/admin/repo_groups/repo_group_edit_permissions.mako

@@ -1,189 +1,218 b''
 <%namespace name="base" file="/base/base.mako"/>
 
 <div class="panel panel-default">
     <div class="panel-heading">
         <h3 class="panel-title">${_('Repository Group Permissions')}</h3>
     </div>
     <div class="panel-body">
         ${h.secure_form(h.route_path('edit_repo_group_perms_update', repo_group_name=c.repo_group.group_name), request=request)}
         <table id="permissions_manage" class="rctable permissions">
             <tr>
                 <th class="td-radio">${_('None')}</th>
                 <th class="td-radio">${_('Read')}</th>
                 <th class="td-radio">${_('Write')}</th>
                 <th class="td-radio">${_('Admin')}</th>
                 <th class="td-owner">${_('User/User Group')}</th>
-                <th></th>
-                <th></th>
+                <th class="td-action"></th>
+                <th class="td-action"></th>
             </tr>
             ## USERS
             %for _user in c.repo_group.permissions():
                 ## super admin/owner row
                 %if getattr(_user, 'admin_row', None) or getattr(_user, 'owner_row', None):
                     <tr class="perm_admin_row">
                         <td class="td-radio">${h.radio('admin_perm_%s' % _user.user_id,'repository.none', disabled="disabled")}</td>
                         <td class="td-radio">${h.radio('admin_perm_%s' % _user.user_id,'repository.read', disabled="disabled")}</td>
                         <td class="td-radio">${h.radio('admin_perm_%s' % _user.user_id,'repository.write', disabled="disabled")}</td>
                         <td class="td-radio">${h.radio('admin_perm_%s' % _user.user_id,'repository.admin', 'repository.admin', disabled="disabled")}</td>
                         <td class="td-user">
                             ${base.gravatar(_user.email, 16)}
                                 ${h.link_to_user(_user.username)}
                                 %if getattr(_user, 'admin_row', None):
                                     (${_('super admin')})
                                 %endif
                                 %if getattr(_user, 'owner_row', None):
                                     (${_('owner')})
                                 %endif
                         </td>
                         <td></td>
-                        <td>
+                        <td class="quick_repo_menu">
                             % if c.rhodecode_user.is_admin:
-                                ${h.link_to('show permissions', h.route_path('edit_user_perms_summary', user_id=_user.user_id, _anchor='repositories-permissions'))}
+                                <i class="icon-more"></i>
+                                <div class="menu_items_container" style="display: none;">
+                                <ul class="menu_items">
+                                  <li>
+                                     ${h.link_to('show permissions', h.route_path('edit_user_perms_summary', user_id=_user.user_id, _anchor='repositories-groups-permissions'))}
+                                  </li>
+                                </ul>
+                                </div>
                             % endif
                         </td>
                     </tr>
                 %else:
                     <tr>
                         ##forbid revoking permission from yourself, except if you're an super admin
                         %if c.rhodecode_user.user_id != _user.user_id or c.rhodecode_user.is_admin:
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'group.none', checked=_user.permission=='group.none')}</td>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'group.read', checked=_user.permission=='group.read')}</td>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'group.write', checked=_user.permission=='group.write')}</td>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'group.admin', checked=_user.permission=='group.admin')}</td>
                         <td class="td-user">
                             ${base.gravatar(_user.email, 16)}
                             <span class="user">
                                 % if _user.username == h.DEFAULT_USER:
                                     ${h.DEFAULT_USER} <span class="user-perm-help-text"> - ${_('permission for all other users')}</span>
                                 % else:
                                     ${h.link_to_user(_user.username)}
                                     %if getattr(_user, 'duplicate_perm', None):
                                         (${_('inactive duplicate')})
                                     %endif
                                 % endif
                             </span>
                         </td>
                         <td class="td-action">
                             %if _user.username != h.DEFAULT_USER:
                                 <span  class="btn btn-link btn-danger revoke_perm"
                                   member="${_user.user_id}" member_type="user">
-                                ${_('Revoke')}
+                                ${_('Remove')}
                                 </span>
                             %endif
                         </td>
-                        <td>
+                        <td class="quick_repo_menu">
                             % if c.rhodecode_user.is_admin:
-                                % if _user.username == h.DEFAULT_USER:
-                                    ${h.link_to('show permissions', h.route_path('admin_permissions_overview', _anchor='repositories-permissions'))}
-                                % else:
-                                    ${h.link_to('show permissions', h.route_path('edit_user_perms_summary', user_id=_user.user_id, _anchor='repositories-permissions'))}
-                                % endif
+                                <i class="icon-more"></i>
+                                <div class="menu_items_container" style="display: none;">
+                                <ul class="menu_items">
+                                  <li>
+                                    % if _user.username == h.DEFAULT_USER:
+                                        ${h.link_to('show permissions', h.route_path('admin_permissions_overview', _anchor='repositories-groups-permissions'))}
+                                    % else:
+                                        ${h.link_to('show permissions', h.route_path('edit_user_perms_summary', user_id=_user.user_id, _anchor='repositories-groups-permissions'))}
+                                    % endif
+                                  </li>
+                                </ul>
+                                </div>
                             % endif
                         </td>
                         %else:
                             ## special case for currently logged-in user permissions, we make sure he cannot take his own permissions
                             <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'group.none', disabled="disabled")}</td>
                             <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'group.read', disabled="disabled")}</td>
                             <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'group.write', disabled="disabled")}</td>
                             <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'group.admin', disabled="disabled")}</td>
                             <td class="td-user">
                                 ${base.gravatar(_user.email, 16)}
                                 <span class="user">
                                     % if _user.username == h.DEFAULT_USER:
                                         ${h.DEFAULT_USER} <span class="user-perm-help-text"> - ${_('permission for all other users')}</span>
                                     % else:
                                         ${h.link_to_user(_user.username)}
                                         %if getattr(_user, 'duplicate_perm', None):
                                             (${_('inactive duplicate')})
                                         %endif
                                     % endif
                                     <span class="user-perm-help-text">(${_('delegated admin')})</span>
                                 </span>
                             </td>
                             <td></td>
-                            <td>
+                            <td class="quick_repo_menu">
                                 % if c.rhodecode_user.is_admin:
-                                    ${h.link_to('show permissions', h.route_path('edit_user_perms_summary', user_id=_user.user_id, _anchor='repositories-permissions'))}
+                                    <i class="icon-more"></i>
+                                    <div class="menu_items_container" style="display: none;">
+                                    <ul class="menu_items">
+                                      <li>
+                                         ${h.link_to('show permissions', h.route_path('edit_user_perms_summary', user_id=_user.user_id, _anchor='repositories-groups-permissions'))}
+                                      </li>
+                                    </ul>
+                                    </div>
                                 % endif
                             </td>
                         %endif
                     </tr>
                 %endif
             %endfor
 
             ## USER GROUPS
             %for _user_group in c.repo_group.permission_user_groups():
                 <tr id="id${id(_user_group.users_group_name)}">
                     <td class="td-radio">${h.radio('g_perm_%s' % _user_group.users_group_id,'group.none', checked=_user_group.permission=='group.none')}</td>
                     <td class="td-radio">${h.radio('g_perm_%s' % _user_group.users_group_id,'group.read', checked=_user_group.permission=='group.read')}</td>
                     <td class="td-radio">${h.radio('g_perm_%s' % _user_group.users_group_id,'group.write', checked=_user_group.permission=='group.write')}</td>
                     <td class="td-radio">${h.radio('g_perm_%s' % _user_group.users_group_id,'group.admin', checked=_user_group.permission=='group.admin')}</td>
                     <td class="td-componentname">
                         <i class="icon-user-group"></i>
                         %if h.HasPermissionAny('hg.admin')():
                          <a href="${h.route_path('edit_user_group',user_group_id=_user_group.users_group_id)}">
                              ${_user_group.users_group_name}
                          </a>
                         %else:
                          ${h.link_to_group(_user_group.users_group_name)}
                         %endif
                     </td>
                     <td class="td-action">
                         <span  class="btn btn-link btn-danger revoke_perm"
                               member="${_user_group.users_group_id}" member_type="user_group">
-                        ${_('Revoke')}
+                        ${_('Remove')}
                         </span>
                     </td>
-                    <td>
+                    <td class="quick_repo_menu">
                         % if c.rhodecode_user.is_admin:
-                            ${h.link_to('show permissions', h.route_path('edit_user_group_perms_summary', user_group_id=_user_group.users_group_id, _anchor='repositories-permissions'))}
+                            <i class="icon-more"></i>
+                            <div class="menu_items_container" style="display: none;">
+                            <ul class="menu_items">
+                              <li>
+                                 ${h.link_to('show permissions', h.route_path('edit_user_group_perms_summary', user_group_id=_user_group.users_group_id, _anchor='repositories-groups-permissions'))}
+                              </li>
+                            </ul>
+                            </div>
                         % endif
                     </td>
                 </tr>
             %endfor
 
             <tr class="new_members" id="add_perm_input"></tr>
             <tr>
                 <td></td>
                 <td></td>
                 <td></td>
                 <td></td>
                 <td></td>
                 <td>
                     <span id="add_perm" class="link">
                         ${_('Add user/user group')}
                     </span>
                 </td>
                 <td></td>
             </tr>
         </table>
 
         <div class="fields">
             <div class="field">
                <div class="label label-radio">
                    ${_('Apply to children')}:
                </div>
                <div class="radios">
                    ${h.radio('recursive', 'none', label=_('None'), checked="checked")}
                    ${h.radio('recursive', 'groups', label=_('Repository Groups'))}
                    ${h.radio('recursive', 'repos', label=_('Repositories'))}
                    ${h.radio('recursive', 'all', label=_('Both'))}
                <span class="help-block">${_('Set or revoke permissions to selected types of children of this group, including non-private repositories and other groups if chosen.')}</span>
                </div>
             </div>
         </div>
         <div class="buttons">
           ${h.submit('save',_('Save'),class_="btn btn-primary")}
           ${h.reset('reset',_('Reset'),class_="btn btn-danger")}
         </div>
         ${h.end_form()}
     </div>
 </div>
 <script type="text/javascript">
     $('#add_perm').on('click', function(e){
         addNewPermInput($(this), 'group');
     });
     $('.revoke_perm').on('click', function(e){
         markRevokePermInput($(this), 'group');
-    })
+    });
+    quick_repo_menu();
 </script>

rhodecode/templates/admin/repos/repo_edit_permissions.mako

@@ -1,172 +1,201 b''
 <%namespace name="base" file="/base/base.mako"/>
 
 <div class="panel panel-default">
     <div class="panel-heading">
         <h3 class="panel-title">${_('Repository Permissions')}</h3>
     </div>
     <div class="panel-body">
         ${h.secure_form(h.route_path('edit_repo_perms', repo_name=c.repo_name), request=request)}
         <table id="permissions_manage" class="rctable permissions">
             <tr>
                 <th class="td-radio">${_('None')}</th>
                 <th class="td-radio">${_('Read')}</th>
                 <th class="td-radio">${_('Write')}</th>
                 <th class="td-radio">${_('Admin')}</th>
                 <th class="td-owner">${_('User/User Group')}</th>
-                <th></th>
-                <th></th>
+                <th class="td-action"></th>
+                <th class="td-action"></th>
             </tr>
             ## USERS
             %for _user in c.rhodecode_db_repo.permissions():
                 %if getattr(_user, 'admin_row', None) or getattr(_user, 'owner_row', None):
                     <tr class="perm_admin_row">
                         <td class="td-radio">${h.radio('admin_perm_%s' % _user.user_id,'repository.none', disabled="disabled")}</td>
                         <td class="td-radio">${h.radio('admin_perm_%s' % _user.user_id,'repository.read', disabled="disabled")}</td>
                         <td class="td-radio">${h.radio('admin_perm_%s' % _user.user_id,'repository.write', disabled="disabled")}</td>
                         <td class="td-radio">${h.radio('admin_perm_%s' % _user.user_id,'repository.admin', 'repository.admin', disabled="disabled")}</td>
                         <td class="td-user">
                             ${base.gravatar(_user.email, 16)}
                             ${h.link_to_user(_user.username)}
                             %if getattr(_user, 'admin_row', None):
                                 (${_('super admin')})
                             %endif
                             %if getattr(_user, 'owner_row', None):
                                 (${_('owner')})
                             %endif
                         </td>
                         <td></td>
-                        <td>
+                        <td class="quick_repo_menu">
                             % if c.rhodecode_user.is_admin:
-                                ${h.link_to('show permissions', h.route_path('edit_user_perms_summary', user_id=_user.user_id, _anchor='repositories-permissions'))}
+                                <i class="icon-more"></i>
+                                <div class="menu_items_container" style="display: none;">
+                                <ul class="menu_items">
+                                  <li>
+                                     ${h.link_to('show permissions', h.route_path('edit_user_perms_summary', user_id=_user.user_id, _anchor='repositories-permissions'))}
+                                  </li>
+                                </ul>
+                                </div>
                             % endif
                         </td>
                     </tr>
                 %elif _user.username == h.DEFAULT_USER and c.rhodecode_db_repo.private:
                     <tr>
                         <td colspan="4">
                             <span class="private_repo_msg">
                             <strong title="${h.tooltip(_user.permission)}">${_('private repository')}</strong>
                             </span>
                         </td>
                         <td class="private_repo_msg">
                             ${base.gravatar(h.DEFAULT_USER_EMAIL, 16)}
                             ${h.DEFAULT_USER} - ${_('only users/user groups explicitly added here will have access')}</td>
                         <td></td>
-                        <td>
+                        <td class="quick_repo_menu">
                             % if c.rhodecode_user.is_admin:
-                                ${h.link_to('show permissions', h.route_path('admin_permissions_overview', _anchor='repositories-permissions'))}
+                                <i class="icon-more"></i>
+                                <div class="menu_items_container" style="display: none;">
+                                <ul class="menu_items">
+                                  <li>
+                                     ${h.link_to('show permissions', h.route_path('admin_permissions_overview', _anchor='repositories-permissions'))}
+                                  </li>
+                                </ul>
+                                </div>
                             % endif
                         </td>
                     </tr>
                 %else:
                     <tr>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'repository.none', checked=_user.permission=='repository.none')}</td>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'repository.read', checked=_user.permission=='repository.read')}</td>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'repository.write', checked=_user.permission=='repository.write')}</td>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'repository.admin', checked=_user.permission=='repository.admin')}</td>
                         <td class="td-user">
                             ${base.gravatar(_user.email, 16)}
                             <span class="user">
                                 % if _user.username == h.DEFAULT_USER:
                                     ${h.DEFAULT_USER} <span class="user-perm-help-text"> - ${_('permission for all other users')}</span>
                                 % else:
                                     ${h.link_to_user(_user.username)}
                                     %if getattr(_user, 'duplicate_perm', None):
                                         (${_('inactive duplicate')})
                                     %endif
                                     %if getattr(_user, 'branch_rules', None):
                                         <% used_by_n_rules = len(_user.branch_rules) %>
                                         % if used_by_n_rules == 1:
                                             (${_('used by {} branch rule').format(used_by_n_rules)})
                                         % else:
                                             (${_('used by {} branch rules').format(used_by_n_rules)})
                                         % endif
                                     %endif
                                 % endif
                             </span>
                         </td>
                         <td class="td-action">
                           %if _user.username != h.DEFAULT_USER and getattr(_user, 'branch_rules', None) is None:
                             <span class="btn btn-link btn-danger revoke_perm"
                                   member="${_user.user_id}" member_type="user">
-                            ${_('Revoke')}
+                            ${_('Remove')}
                             </span>
                           %endif
                         </td>
-                        <td>
+                        <td class="quick_repo_menu">
                             % if c.rhodecode_user.is_admin:
-                                % if _user.username == h.DEFAULT_USER:
-                                    ${h.link_to('show permissions', h.route_path('admin_permissions_overview', _anchor='repositories-permissions'))}
-                                % else:
-                                    ${h.link_to('show permissions', h.route_path('edit_user_perms_summary', user_id=_user.user_id, _anchor='repositories-permissions'))}
-                                % endif
+                                <i class="icon-more"></i>
+                                <div class="menu_items_container" style="display: none;">
+                                <ul class="menu_items">
+                                  <li>
+                                     % if _user.username == h.DEFAULT_USER:
+                                        ${h.link_to('show permissions', h.route_path('admin_permissions_overview', _anchor='repositories-permissions'))}
+                                    % else:
+                                        ${h.link_to('show permissions', h.route_path('edit_user_perms_summary', user_id=_user.user_id, _anchor='repositories-permissions'))}
+                                    % endif
+                                  </li>
+                                </ul>
+                                </div>
                             % endif
                         </td>
                     </tr>
                 %endif
             %endfor
 
             ## USER GROUPS
             %for _user_group in c.rhodecode_db_repo.permission_user_groups():
                 <tr>
                     <td class="td-radio">${h.radio('g_perm_%s' % _user_group.users_group_id,'repository.none', checked=_user_group.permission=='repository.none')}</td>
                     <td class="td-radio">${h.radio('g_perm_%s' % _user_group.users_group_id,'repository.read', checked=_user_group.permission=='repository.read')}</td>
                     <td class="td-radio">${h.radio('g_perm_%s' % _user_group.users_group_id,'repository.write', checked=_user_group.permission=='repository.write')}</td>
                     <td class="td-radio">${h.radio('g_perm_%s' % _user_group.users_group_id,'repository.admin', checked=_user_group.permission=='repository.admin')}</td>
                     <td class="td-componentname">
                         <i class="icon-user-group"></i>
                         %if h.HasPermissionAny('hg.admin')():
                          <a href="${h.route_path('edit_user_group',user_group_id=_user_group.users_group_id)}">
                              ${_user_group.users_group_name}
                          </a>
                         %else:
                          ${h.link_to_group(_user_group.users_group_name)}
                         %endif
                     </td>
                     <td class="td-action">
                         <span class="btn btn-link btn-danger revoke_perm"
                               member="${_user_group.users_group_id}" member_type="user_group">
-                        ${_('Revoke')}
+                        ${_('Remove')}
                         </span>
                     </td>
-                    <td>
+                    <td class="quick_repo_menu">
                         % if c.rhodecode_user.is_admin:
-                            ${h.link_to('show permissions', h.route_path('edit_user_group_perms_summary', user_group_id=_user_group.users_group_id, _anchor='repositories-permissions'))}
+                            <i class="icon-more"></i>
+                            <div class="menu_items_container" style="display: none;">
+                            <ul class="menu_items">
+                              <li>
+                                 ${h.link_to('show permissions', h.route_path('edit_user_group_perms_summary', user_group_id=_user_group.users_group_id, _anchor='repositories-permissions'))}
+                              </li>
+                            </ul>
+                            </div>
                         % endif
                     </td>
                 </tr>
             %endfor
             <tr class="new_members" id="add_perm_input"></tr>
 
             <tr>
                 <td></td>
                 <td></td>
                 <td></td>
                 <td></td>
                 <td></td>
                 <td>
                     <span id="add_perm" class="link">
                         ${_('Add user/user group')}
                     </span>
                 </td>
                 <td></td>
             </tr>
 
         </table>
 
         <div class="buttons">
           ${h.submit('save',_('Save'),class_="btn btn-primary")}
           ${h.reset('reset',_('Reset'),class_="btn btn-danger")}
         </div>
         ${h.end_form()}
     </div>
 </div>
 
 <script type="text/javascript">
     $('#add_perm').on('click', function(e){
         addNewPermInput($(this), 'repository');
     });
     $('.revoke_perm').on('click', function(e){
         markRevokePermInput($(this), 'repository');
     });
+    quick_repo_menu();
 </script>

rhodecode/templates/admin/user_groups/user_group_edit_perms.mako

@@ -1,177 +1,206 b''
 <%namespace name="base" file="/base/base.mako"/>
 
 <div class="panel panel-default">
     <div class="panel-heading">
         <h3 class="panel-title">${_('User Group Permissions')}</h3>
     </div>
     <div class="panel-body">
         ${h.secure_form(h.route_path('edit_user_group_perms_update', user_group_id=c.user_group.users_group_id), request=request)}
         <table id="permissions_manage" class="rctable permissions">
             <tr>
                 <th class="td-radio">${_('None')}</th>
                 <th class="td-radio">${_('Read')}</th>
                 <th class="td-radio">${_('Write')}</th>
                 <th class="td-radio">${_('Admin')}</th>
                 <th>${_('User/User Group')}</th>
-                <th></th>
-                <th></th>
+                <th class="td-action"></th>
+                <th class="td-action"></th>
             </tr>
             ## USERS
             %for _user in c.user_group.permissions():
                 ## super admin/owner row
                 %if getattr(_user, 'admin_row', None) or getattr(_user, 'owner_row', None):
                     <tr class="perm_admin_row">
                         <td class="td-radio">${h.radio('admin_perm_%s' % _user.user_id,'repository.none', disabled="disabled")}</td>
                         <td class="td-radio">${h.radio('admin_perm_%s' % _user.user_id,'repository.read', disabled="disabled")}</td>
                         <td class="td-radio">${h.radio('admin_perm_%s' % _user.user_id,'repository.write', disabled="disabled")}</td>
                         <td class="td-radio">${h.radio('admin_perm_%s' % _user.user_id,'repository.admin', 'repository.admin', disabled="disabled")}</td>
                         <td class="td-user">
                             ${base.gravatar(_user.email, 16)}
                             <span class="user">
                                 ${h.link_to_user(_user.username)}
                                 %if getattr(_user, 'admin_row', None):
                                     (${_('super admin')})
                                 %endif
                                 %if getattr(_user, 'owner_row', None):
                                     (${_('owner')})
                                 %endif
                             </span>
                         </td>
                         <td></td>
-                        <td>
+                        <td class="quick_repo_menu">
                             % if c.rhodecode_user.is_admin:
-                                ${h.link_to('show permissions', h.route_path('edit_user_perms_summary', user_id=_user.user_id, _anchor='repositories-permissions'))}
+                                <i class="icon-more"></i>
+                                <div class="menu_items_container" style="display: none;">
+                                <ul class="menu_items">
+                                  <li>
+                                     ${h.link_to('show permissions', h.route_path('edit_user_perms_summary', user_id=_user.user_id, _anchor='user-groups-permissions'))}
+                                  </li>
+                                </ul>
+                                </div>
                             % endif
                         </td>
                     </tr>
                 %else:
                     ##forbid revoking permission from yourself, except if you're an super admin
                     <tr>
                         %if c.rhodecode_user.user_id != _user.user_id or c.rhodecode_user.is_admin:
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'usergroup.none')}</td>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'usergroup.read')}</td>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'usergroup.write')}</td>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'usergroup.admin')}</td>
                         <td class="td-user">
                             ${base.gravatar(_user.email, 16)}
                             <span class="user">
                                 % if _user.username == h.DEFAULT_USER:
                                     ${h.DEFAULT_USER} <span class="user-perm-help-text"> - ${_('permission for all other users')}</span>
                                 % else:
                                     ${h.link_to_user(_user.username)}
                                     %if getattr(_user, 'duplicate_perm', None):
                                         (${_('inactive duplicate')})
                                     %endif
                                 % endif
                             </span>
                         </td>
                         <td class="td-action">
                           %if _user.username != h.DEFAULT_USER:
                             <span class="btn btn-link btn-danger revoke_perm"
                                   member="${_user.user_id}" member_type="user">
-                            ${_('Revoke')}
+                            ${_('Remove')}
                             </span>
                           %endif
                         </td>
-                        <td>
+                        <td class="quick_repo_menu">
                             % if c.rhodecode_user.is_admin:
-                                % if _user.username == h.DEFAULT_USER:
-                                    ${h.link_to('show permissions', h.route_path('admin_permissions_overview', _anchor='repositories-permissions'))}
-                                % else:
-                                    ${h.link_to('show permissions', h.route_path('edit_user_perms_summary', user_id=_user.user_id, _anchor='repositories-permissions'))}
-                                % endif
+                                <i class="icon-more"></i>
+                                <div class="menu_items_container" style="display: none;">
+                                <ul class="menu_items">
+                                  <li>
+                                    % if _user.username == h.DEFAULT_USER:
+                                        ${h.link_to('show permissions', h.route_path('admin_permissions_overview', _anchor='user-groups-permissions'))}
+                                    % else:
+                                        ${h.link_to('show permissions', h.route_path('edit_user_perms_summary', user_id=_user.user_id, _anchor='user-groups-permissions'))}
+                                    % endif
+                                  </li>
+                                </ul>
+                                </div>
                             % endif
                         </td>
                         %else:
                         ## special case for currently logged-in user permissions, we make sure he cannot take his own permissions
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'usergroup.none', disabled="disabled")}</td>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'usergroup.read', disabled="disabled")}</td>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'usergroup.write', disabled="disabled")}</td>
                         <td class="td-radio">${h.radio('u_perm_%s' % _user.user_id,'usergroup.admin', disabled="disabled")}</td>
                         <td class="td-user">
                             ${base.gravatar(_user.email, 16)}
                             <span class="user">
                                 % if _user.username == h.DEFAULT_USER:
                                     ${h.DEFAULT_USER} <span class="user-perm-help-text"> - ${_('permission for all other users')}</span>
                                 % else:
                                     ${h.link_to_user(_user.username)}
                                     %if getattr(_user, 'duplicate_perm', None):
                                         (${_('inactive duplicate')})
                                     %endif
                                 % endif
                                 <span class="user-perm-help-text">(${_('delegated admin')})</span>
                             </span>
                         </td>
                         <td></td>
-                        <td>
+                        <td class="quick_repo_menu">
                             % if c.rhodecode_user.is_admin:
-                                ${h.link_to('show permissions', h.route_path('edit_user_perms_summary', user_id=_user.user_id, _anchor='repositories-permissions'))}
+                                <i class="icon-more"></i>
+                                <div class="menu_items_container" style="display: none;">
+                                <ul class="menu_items">
+                                  <li>
+                                     ${h.link_to('show permissions', h.route_path('edit_user_perms_summary', user_id=_user.user_id, _anchor='user-groups-permissions'))}
+                                  </li>
+                                </ul>
+                                </div>
                             % endif
                         </td>
                         %endif
                     </tr>
                 %endif
             %endfor
 
             ## USER GROUPS
             %for _user_group in c.user_group.permission_user_groups():
                 <tr>
                     <td class="td-radio">${h.radio('g_perm_%s' % _user_group.users_group_id,'usergroup.none')}</td>
                     <td class="td-radio">${h.radio('g_perm_%s' % _user_group.users_group_id,'usergroup.read')}</td>
                     <td class="td-radio">${h.radio('g_perm_%s' % _user_group.users_group_id,'usergroup.write')}</td>
                     <td class="td-radio">${h.radio('g_perm_%s' % _user_group.users_group_id,'usergroup.admin')}</td>
                     <td class="td-user">
                         <i class="icon-user-group"></i>
                         %if h.HasPermissionAny('hg.admin')():
                          <a href="${h.route_path('edit_user_group',user_group_id=_user_group.users_group_id)}">
                              ${_user_group.users_group_name}
                          </a>
                         %else:
                          ${h.link_to_group(_user_group.users_group_name)}
                         %endif
                     </td>
                     <td class="td-action">
                         <span class="btn btn-link btn-danger revoke_perm"
                               member="${_user_group.users_group_id}" member_type="user_group">
-                        ${_('Revoke')}
+                        ${_('Remove')}
                         </span>
                     </td>
-                    <td>
+                    <td class="quick_repo_menu">
                         % if c.rhodecode_user.is_admin:
-                            ${h.link_to('show permissions', h.route_path('edit_user_group_perms_summary', user_group_id=_user_group.users_group_id, _anchor='repositories-permissions'))}
+                            <i class="icon-more"></i>
+                            <div class="menu_items_container" style="display: none;">
+                            <ul class="menu_items">
+                              <li>
+                                 ${h.link_to('show permissions', h.route_path('edit_user_group_perms_summary', user_group_id=_user_group.users_group_id, _anchor='user-groups-permissions'))}
+                              </li>
+                            </ul>
+                            </div>
                         % endif
                     </td>
                 </tr>
             %endfor
             <tr class="new_members" id="add_perm_input"></tr>
             <tr>
                 <td></td>
                 <td></td>
                 <td></td>
                 <td></td>
                 <td></td>
                 <td>
                     <span id="add_perm" class="link">
                         ${_('Add user/user group')}
                     </span>
                 </td>
                 <td></td>
             </tr>
         </table>
 
         <div class="buttons">
           ${h.submit('save',_('Save'),class_="btn btn-primary")}
           ${h.reset('reset',_('Reset'),class_="btn btn-danger")}
         </div>
         ${h.end_form()}
     </div>
 </div>
 
 <script type="text/javascript">
     $('#add_perm').on('click', function(e){
         addNewPermInput($(this), 'usergroup');
     });
     $('.revoke_perm').on('click', function(e){
         markRevokePermInput($(this), 'usergroup');
     });
+    quick_repo_menu()
 </script>