hyzen/hyzendust.github.io
1
0
Fork 0
mirror of https://github.com/hyzendust/hyzendust.github.io.git synced 2026-06-30 23:12:16 +02:00
Code Issues Packages Projects Releases Wiki Activity

Update: search panel, colors

Browse Source
This commit is contained in:
hyzen
2026-06-13 12:04:53 +05:30
parent e79fa2eb5f
commit bae7bd8325
4 changed files with 126 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
docs/admin/index.html
View File

File diff suppressed because one or more lines are too long

33
docs/css/custom.css
View File

@@ -1364,6 +1364,7 @@
border-collapse: collapse;
font-size: 0.88rem;
margin-top: 1rem;
background: var(--background-color);
}
.admin-table th,
@@ -1373,9 +1374,9 @@
border-bottom: 1px solid var(--background-color1, #e0e0e0);
}
.admin-table th {
.admin-table__header th {
font-weight: 700;
background: var(--background-color1, #f5f5f5);
background: var(--background-color);
}
.admin-table tr:last-child td {
@@ -1400,11 +1401,39 @@
background: #d4edda;
color: #155724;
}
.admin-badge--admin {
background: #dbeafe;
color: #1e3a8a;
}
.admin-badge--blocked {
background: #f8d7da;
color: #721c24;
}
.admin-search {
display: block;
max-width: 32rem;
margin-top: 1rem;
}
.admin-search__label {
display: block;
margin-bottom: 0.35rem;
font-size: 0.88rem;
font-weight: 600;
}
.admin-search__input {
box-sizing: border-box;
width: 100%;
padding: 0.55rem 0.7rem;
border: 1px solid var(--background-color1, #ccc);
border-radius: 4px;
background: var(--background-color);
color: var(--foreground-color);
font: inherit;
}
.admin-btn {
padding: 0.25rem 0.65rem;
border: none;

79
layouts/admin/single.html
View File

@@ -6,6 +6,16 @@
<div id="admin-panel" style="display: none">
<h1>User Management</h1>
<label class="admin-search" for="admin-user-search">
<span class="admin-search__label">Search users</span>
<input
id="admin-user-search"
class="admin-search__input"
type="search"
placeholder="Search by username or email"
autocomplete="off"
/>
</label>
<div id="admin-msg" class="auth-message" style="display: none" aria-live="polite"></div>
<div id="admin-table-wrap"></div>
</div>
@@ -19,6 +29,8 @@
var panel = document.getElementById('admin-panel');
var msg = document.getElementById('admin-msg');
var wrap = document.getElementById('admin-table-wrap');
var search = document.getElementById('admin-user-search');
var allUsers = [];
if (username !== 'hyzen') {
gate.style.display = '';
@@ -41,24 +53,32 @@
function renderTable(users) {
if (!users.length) {
wrap.innerHTML = '<p>No users found.</p>';
wrap.innerHTML = '<p>No matching users found.</p>';
return;
}
var adminIndex = users.findIndex(function (u) {
return u.username === username;
});
var adminUser = adminIndex === -1 ? null : users[adminIndex];
var otherUsers = users.filter(function (u) {
return u.username !== username;
});
var html =
'<table class="admin-table">' +
'<thead><tr>' +
'<th>#</th><th>Username</th><th>Email</th><th>Joined</th><th>Status</th><th>Actions</th>' +
'</tr></thead><tbody>';
'<tbody><tr class="admin-table__header">' +
'<th>#</th><th>Username</th><th>Email</th><th>Joined</th><th>Status</th>' +
(adminUser ? '<th rowspan="2">Actions</th>' : '<th>Actions</th>') +
'</tr>';
users.forEach(function (u) {
function userRow(u, isCurrentUser) {
var joined = new Date(u.created_at).toLocaleDateString();
var blocked = u.blocked === true || u.blocked === 't' || u.blocked === '1';
var status = blocked
var status = isCurrentUser
? '<span class="admin-badge admin-badge--admin">Admin</span>'
: blocked
? '<span class="admin-badge admin-badge--blocked">Blocked</span>'
: '<span class="admin-badge admin-badge--active">Active</span>';
var isCurrentUser = u.username === username;
var blockBtn = '';
var deleteBtn = '';
@@ -79,7 +99,7 @@
'" data-action="delete_user">Delete Records</button>';
}
html +=
return (
'<tr id="user-row-' +
u.id +
'">' +
@@ -98,12 +118,18 @@
'<td>' +
status +
'</td>' +
'<td class="admin-actions">' +
blockBtn +
' ' +
deleteBtn +
'</td>' +
'</tr>';
(isCurrentUser
? ''
: '<td class="admin-actions">' + blockBtn + ' ' + deleteBtn + '</td>') +
'</tr>'
);
}
if (adminUser) {
html += userRow(adminUser, true);
}
otherUsers.forEach(function (u) {
html += userRow(u, false);
});
html += '</tbody></table>';
@@ -145,11 +171,12 @@
.then(function (data) {
if (data.success) {
if (action === 'delete_user') {
var row = document.getElementById('user-row-' + id);
if (row) row.remove();
allUsers = allUsers.filter(function (u) {
return Number(u.id) !== id;
});
filterUsers();
showMsg('User deleted.', 'success');
} else {
// Reload to reflect new block state
loadUsers();
}
} else {
@@ -175,7 +202,8 @@
})
.then(function (data) {
if (data.success) {
renderTable(data.users);
allUsers = data.users;
filterUsers();
} else {
wrap.innerHTML =
'<p class="admin-error">' +
@@ -188,6 +216,19 @@
});
}
function filterUsers() {
var query = search.value.trim().toLowerCase();
var users = allUsers.filter(function (u) {
return (
!query ||
String(u.username).toLowerCase().includes(query) ||
String(u.email).toLowerCase().includes(query)
);
});
renderTable(users);
}
search.addEventListener('input', filterUsers);
loadUsers();
})();
</script>

33
static/css/custom.css
View File

@@ -1364,6 +1364,7 @@
border-collapse: collapse;
font-size: 0.88rem;
margin-top: 1rem;
background: var(--background-color);
}
.admin-table th,
@@ -1373,9 +1374,9 @@
border-bottom: 1px solid var(--background-color1, #e0e0e0);
}
.admin-table th {
.admin-table__header th {
font-weight: 700;
background: var(--background-color1, #f5f5f5);
background: var(--background-color);
}
.admin-table tr:last-child td {
@@ -1400,11 +1401,39 @@
background: #d4edda;
color: #155724;
}
.admin-badge--admin {
background: #dbeafe;
color: #1e3a8a;
}
.admin-badge--blocked {
background: #f8d7da;
color: #721c24;
}
.admin-search {
display: block;
max-width: 32rem;
margin-top: 1rem;
}
.admin-search__label {
display: block;
margin-bottom: 0.35rem;
font-size: 0.88rem;
font-weight: 600;
}
.admin-search__input {
box-sizing: border-box;
width: 100%;
padding: 0.55rem 0.7rem;
border: 1px solid var(--background-color1, #ccc);
border-radius: 4px;
background: var(--background-color);
color: var(--foreground-color);
font: inherit;
}
.admin-btn {
padding: 0.25rem 0.65rem;
border: none;