MokoConsulting/MokoSuiteClient
0
0
Fork 0
Code Issues 109 Pull Requests Releases 1 Wiki Activity

style(dashboard): use Bootstrap grid columns for extension version bar
Platform: moko-platform CI / Gate 2: Unit Tests (8.1) (push) Blocked by required conditions
Details
Platform: moko-platform CI / Gate 2: Unit Tests (8.2) (push) Blocked by required conditions
Details
Platform: moko-platform CI / Gate 2: Unit Tests (8.3) (push) Blocked by required conditions
Details
Platform: moko-platform CI / Gate 3: Self-Health Check (push) Blocked by required conditions
Details
Platform: moko-platform CI / Gate 4: Governance (push) Blocked by required conditions
Details
Platform: moko-platform CI / Gate 5: Template Integrity (push) Blocked by required conditions
Details
Platform: moko-platform CI / CI Summary (push) Blocked by required conditions
Details
Universal: Auto Version Bump / Version Bump (push) Successful in 14s
Details
Universal: Pre-Release / Build Pre-Release (${{ inputs.stability || github.ref_name }}) (push) Successful in 16s
Details
Platform: moko-platform CI / Gate 1: Code Quality (push) Failing after 1m16s
Details

Browse Source 
Dynamically calculates col-N from extension count (12/count) so items
spread evenly across the full width as horizontal cells, not stacked.
Removed custom flex CSS in favour of Bootstrap row/g-0.
This commit is contained in:
Jonathan Miller
2026-06-23 08:04:27 -05:00
parent cca6ae3326
commit 29bf75051f
2 changed files with 4 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files
source/packages/com_mokosuiteclient/admin/tmpl/dashboard/default.php
+4 -2
View File
@@ -85,7 +85,7 @@ $categoryOrder = ['core', 'security', 'monitoring', 'content', 'tools', 'api'];
<?php if (!empty($mokoExts)): ?>
<!-- Moko Component & Module Versions -->
<div class="mokosuiteclient-ext-bar card mb-4">
<div class="row g-0 mb-4 border rounded overflow-hidden">
<?php
$extIcons = [
'com_mokosuiteclient' => 'icon-cogs',
@@ -94,12 +94,14 @@ $categoryOrder = ['core', 'security', 'monitoring', 'content', 'tools', 'api'];
'mod_mokosuiteclient_cache' => 'icon-bolt',
'mod_mokosuiteclient_categories' => 'icon-folder',
];
$extCount = count($mokoExts);
$colClass = $extCount > 0 ? 'col-' . max(1, (int) floor(12 / $extCount)) : 'col';
foreach ($mokoExts as $ext):
$icon = $extIcons[$ext->element] ?? 'icon-puzzle-piece';
$label = str_replace(['mod_mokosuiteclient_', 'com_mokosuiteclient'], ['', 'Component'], $ext->element);
$label = ucfirst($label ?: 'Component');
?>
<div class="mokosuiteclient-ext-item">
<div class="<?php echo $colClass; ?> d-flex align-items-center justify-content-center gap-2 py-2 bg-white border-end" style="font-size:0.82rem;">
<span class="<?php echo $icon; ?>" aria-hidden="true" style="color:#1a2744;"></span>
<span><?php echo $this->escape($label); ?></span>
<span class="badge bg-light text-dark"><?php echo $this->escape($ext->version); ?></span>
source/packages/com_mokosuiteclient/media/css/dashboard.css
-24
View File
@@ -39,30 +39,6 @@
padding: 0.3em 0.6em;
}
/* Moko extensions version bar — full-width auto-sized */
.mokosuiteclient-ext-bar {
display: flex;
flex-wrap: wrap;
gap: 0;
width: 100%;
}
.mokosuiteclient-ext-bar .mokosuiteclient-ext-item {
flex: 1 1 0;
min-width: 0;
display: flex;
align-items: center;
justify-content: center;
gap: 0.4rem;
padding: 0.5rem 0.75rem;
font-size: 0.82rem;
border-right: 1px solid #dee2e6;
white-space: nowrap;
}
.mokosuiteclient-ext-bar .mokosuiteclient-ext-item:last-child {
border-right: none;
}
/* Plugin cards */
.mokosuiteclient-plugin-card {