Nemcio/NodeBB
1
0
Fork 0
mirror of https://github.com/NodeBB/NodeBB.git synced 2025-10-26 08:36:12 +01:00
Code Issues Packages Projects Releases Wiki Activity

fix(acp): hard-to-discover dropdown selector in ACP

Browse Source 
Made the dropdown an MDL button fab with better positioning via
a p.lead so that it is more easily discoverable and obvious that
it is a button that can be pressed.

Fixes #6899
This commit is contained in:
Julian Lam
2018-11-12 16:43:47 -05:00
parent 612170b671
commit b3f96d28aa
3 changed files with 25 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
public/src/admin/manage/privileges.js
View File

@@ -13,12 +13,11 @@ define('admin/manage/privileges', [
Privileges.init = function () {
cid = ajaxify.data.cid || 0;
$('#category-selector').on('change', function () {
var val = $(this).val();
ajaxify.go('admin/manage/privileges/' + (val === 'global' ? '' : $(this).val()));
$('ul[for="category-selector"]').on('click', 'li', function () {
var val = this.getAttribute('data-cid');
ajaxify.go('admin/manage/privileges/' + (val === 'global' ? '' : val));
});
Privileges.setupPrivilegeTable();
};

5
src/controllers/admin/privileges.js
View File

@@ -40,11 +40,16 @@ privilegesController.get = function (req, res, callback) {
if (category) {
category.selected = category.cid === cid;
}
if (category.selected) {
data.selected = category;
}
});
res.render('admin/manage/privileges', {
privileges: data.privileges,
allCategories: data.allCategories,
selected: data.selected ? data.selected.name : '[[admin/manage/privileges:global]]',
cid: cid,
});
},

31
src/views/admin/manage/privileges.tpl
View File

@@ -1,23 +1,26 @@
<div class="row">
<form role="form" class="category">
<div class="row">
<div class="col-md-3 pull-right">
<select id="category-selector" class="form-control">
<option value="global" <!-- IF !cid --> selected <!-- ENDIF !cid -->>[[admin/manage/privileges:global]]</option>
<option disabled>_____________</option>
<!-- BEGIN allCategories -->
<option value="{allCategories.value}" <!-- IF allCategories.selected -->selected<!-- ENDIF allCategories.selected -->>{allCategories.text}</option>
<!-- END allCategories -->
</select>
</div>
</div>
<br/>
<div class="">
<p>
[[admin/manage/categories:privileges.description]]
</p>
<p class="lead">
Currently viewing privileges for
<button type="button" id="category-selector" class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored">
{selected}
</button>
<ul class="mdl-menu mdl-menu--bottom-left mdl-js-menu mdl-js-ripple-effect" for="category-selector">
<li class="mdl-menu__item mdl-menu__item--full-bleed-divider" data-cid="global">[[admin/manage/privileges:global]]</li>
<!-- BEGIN allCategories -->
<li class="mdl-menu__item" data-cid="{../value}">{../text}</li>
<!-- END -->
</ul>
</p>
<hr />
<div class="privilege-table-container">
<!-- IF cid -->
<!-- IMPORT admin/partials/categories/privileges.tpl -->