add icons to custom profile fields

up themes
This commit is contained in:
Barış Soner Uşaklı
2024-11-11 13:03:25 -05:00
parent 4ad082b426
commit 5e3102b0ad
5 changed files with 24 additions and 6 deletions

View File

@@ -107,9 +107,9 @@
"nodebb-plugin-ntfy": "1.7.7",
"nodebb-plugin-spam-be-gone": "2.2.2",
"nodebb-rewards-essentials": "1.0.0",
"nodebb-theme-harmony": "1.2.82",
"nodebb-theme-harmony": "1.2.83",
"nodebb-theme-lavender": "7.1.16",
"nodebb-theme-peace": "2.2.14",
"nodebb-theme-peace": "2.2.15",
"nodebb-theme-persona": "13.3.49",
"nodebb-widget-essentials": "7.0.31",
"nodemailer": "6.9.16",

View File

@@ -6,6 +6,7 @@
"type-of-input": "Type of input",
"key": "Key",
"name": "Name",
"icon": "Icon",
"type": "Type",
"min-rep": "Minimum Reputation",
"input-type-text": "Input (Text)",

View File

@@ -1,6 +1,6 @@
define('admin/manage/user/custom-fields', [
'bootbox', 'alerts', 'jquery-ui/widgets/sortable',
], function (bootbox, alerts) {
'bootbox', 'alerts', 'iconSelect', 'jquery-ui/widgets/sortable',
], function (bootbox, alerts, iconSelect) {
const manageUserFields = {};
manageUserFields.init = function () {
@@ -48,6 +48,7 @@ define('admin/manage/user/custom-fields', [
return {
key: el.attr('data-key'),
name: el.attr('data-name'),
icon: el.attr('data-icon'),
type: el.attr('data-type'),
'select-options': el.attr('data-select-options'),
'min:rep': el.attr('data-min-rep'),
@@ -92,6 +93,14 @@ define('admin/manage/user/custom-fields', [
modal.find(`[data-input-type]`).addClass('hidden');
modal.find(`[data-input-type="${type}"]`).removeClass('hidden');
});
modal.find('#icon-select').on('click', function () {
iconSelect.init($(this).find('i'), function (el, icon, styles) {
styles.push(icon);
modal.find('[name="icon"]').val(styles.join(' '));
});
return false;
});
}
return manageUserFields;

View File

@@ -27,12 +27,12 @@
</thead>
<tbody>
{{{ each fields }}}
<tr data-key="{./key}" data-name="{./name}" data-type="{./type}" data-min-rep="{./min:rep}" data-select-options="{./select-options}" class="align-middle">
<tr data-key="{./key}" data-name="{./name}" data-icon="{./icon}" data-type="{./type}" data-min-rep="{./min:rep}" data-select-options="{./select-options}" class="align-middle">
<td style="width: 32px;">
<a href="#" component="sort/handle" class="btn btn-light btn-sm d-none d-md-block ui-sortable-handle" style="cursor:grab;"><i class="fa fa-arrows-up-down text-muted"></i></a>
</td>
<td class="text-nowrap">{./key}</td>
<td class="text-nowrap">{./name}</td>
<td class="text-nowrap">{{{ if ./icon }}}<i class="text-muted {./icon}"></i> {{{ end }}}{./name}</td>
<td>
{./type}
{{{ if (./type == "select") }}}

View File

@@ -19,6 +19,14 @@
<input class="form-control" type="text" name="name" value="{./name}">
</div>
<div class="mb-3">
<label class="form-label">[[admin/manage/user-custom-fields:icon]]</label>
<div class=" d-flex gap-1">
<input class="form-control" type="text" name="icon" value="{./icon}">
<button id="icon-select" class="btn btn-light"><i class="fa fa-search text-primary"></i></button>
</div>
</div>
<div class="mb-3">
<label class="form-label">[[admin/manage/user-custom-fields:minimum-reputation]]</label>
<input class="form-control" type="number" name="min:rep" value="{./min:rep}" placeholder="0">