marcoallegretti/likwid
1
0
Fork 0
mirror of https://codeberg.org/likwid/likwid.git synced 2026-02-09 21:13:09 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

ux: modernize admin plugins UI

Browse source
This commit is contained in:
Marco Allegretti 2026-01-30 09:07:04 +01:00
parent c1327613dc
commit 60df68b9dd
1 changed files with 22 additions and 61 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

81
frontend/src/pages/admin/plugins.astro
View file

@ -10,31 +10,33 @@ import { API_BASE } from '../../lib/api';
<AdminNav currentPage="/admin/plugins" />
<main class="admin-content">
<header class="page-header">
<header class="ui-page-header">
<div class="ui-page-title">
<h1>Plugin Management</h1>
<p class="subtitle">Enable and configure platform plugins</p>
<p class="ui-subtitle">Enable and configure platform plugins</p>
</div>
</header>
<div class="plugin-categories">
<div class="category" id="category-core">
<div class="category ui-card ui-card-soft ui-card-pad-md" id="category-core">
<h2>Core Plugins</h2>
<p class="category-desc">Essential plugins that cannot be disabled</p>
<div class="plugins-list" data-category="core"></div>
</div>
<div class="category" id="category-voting">
<div class="category ui-card ui-card-soft ui-card-pad-md" id="category-voting">
<h2>Voting Plugins</h2>
<p class="category-desc">Advanced voting methods for proposals</p>
<div class="plugins-list" data-category="voting"></div>
</div>
<div class="category" id="category-governance">
<div class="category ui-card ui-card-soft ui-card-pad-md" id="category-governance">
<h2>Governance Features</h2>
<p class="category-desc">Delegation, deliberation, and moderation</p>
<div class="plugins-list" data-category="governance"></div>
</div>
<div class="category" id="category-integrations">
<div class="category ui-card ui-card-soft ui-card-pad-md" id="category-integrations">
<h2>Integrations</h2>
<p class="category-desc">Connect with external services</p>
<div class="plugins-list" data-category="integrations"></div>
@ -50,53 +52,14 @@ import { API_BASE } from '../../lib/api';
min-height: calc(100vh - 60px);
}
.admin-nav {
width: 200px;
background: var(--bg-secondary);
padding: 1.5rem;
border-right: 1px solid var(--border-color);
}
.admin-nav a {
display: block;
padding: 0.75rem 1rem;
color: var(--text-secondary);
text-decoration: none;
border-radius: 0.5rem;
margin-bottom: 0.25rem;
}
.admin-nav a:hover {
background: var(--bg-hover);
color: var(--text-primary);
}
.admin-nav a.active {
background: var(--accent-color);
color: white;
}
.admin-content {
flex: 1;
padding: 2rem;
max-width: 1000px;
}
.page-header {
margin-bottom: 2rem;
}
.page-header h1 {
margin: 0;
}
.subtitle {
color: var(--text-secondary);
margin-top: 0.5rem;
}
.category {
margin-bottom: 2.5rem;
margin-bottom: 1.25rem;
}
.category h2 {
@ -105,7 +68,7 @@ import { API_BASE } from '../../lib/api';
}
.category-desc {
color: var(--text-secondary);
color: var(--color-text-muted);
margin: 0 0 1rem 0;
font-size: 0.9rem;
}
@ -116,10 +79,6 @@ import { API_BASE } from '../../lib/api';
}
.plugin-card {
background: var(--bg-secondary);
border: 1px solid var(--border-color);
border-radius: 0.75rem;
padding: 1.25rem;
display: flex;
justify-content: space-between;
align-items: center;
@ -145,18 +104,20 @@ import { API_BASE } from '../../lib/api';
font-size: 0.7rem;
padding: 0.15rem 0.5rem;
border-radius: 1rem;
background: var(--accent-color);
color: white;
background: var(--color-primary);
color: var(--color-primary-contrast);
font-weight: normal;
}
.plugin-info h3 .badge.core {
background: #6c757d;
background: var(--color-bg);
border: 1px solid var(--color-border);
color: var(--color-text-muted);
}
.plugin-info p {
margin: 0;
color: var(--text-secondary);
color: var(--color-text-muted);
font-size: 0.9rem;
}
@ -182,7 +143,7 @@ import { API_BASE } from '../../lib/api';
position: absolute;
cursor: pointer;
inset: 0;
background: var(--border-color);
background: var(--color-border);
border-radius: 26px;
transition: 0.3s;
}
@ -194,13 +155,13 @@ import { API_BASE } from '../../lib/api';
width: 20px;
left: 3px;
bottom: 3px;
background: white;
background: var(--color-surface);
border-radius: 50%;
transition: 0.3s;
}
input:checked + .toggle-slider {
background: var(--accent-color);
background: var(--color-primary);
}
input:checked + .toggle-slider:before {
@ -215,7 +176,7 @@ import { API_BASE } from '../../lib/api';
.loading {
text-align: center;
padding: 2rem;
color: var(--text-secondary);
color: var(--color-text-muted);
}
</style>
@ -301,7 +262,7 @@ import { API_BASE } from '../../lib/api';
function createPluginCard(plugin, isEnabled) {
const isCore = plugin.is_core;
return `
<div class="plugin-card ${isEnabled ? '' : 'disabled'}">
<div class="plugin-card ui-card ui-card-soft ui-card-pad-md ${isEnabled ? '' : 'disabled'}">
<div class="plugin-info">
<h3>
${plugin.display_name}