MokoConsulting/MokoOnyx
1
0
Fork 0
Code Issues 10 Pull Requests 1 Releases 5 Wiki Activity

Merge pull request 'feat(social): collapsible + collapsed-by-default config for floating social bar' (#149) from feature/social-floating-collapsible-config into dev
Universal: Auto Version Bump / Version Bump (push) Has been skipped
Details
Universal: Pre-Release / Build Pre-Release (${{ inputs.stability || github.ref_name }}) (push) Successful in 10s
Details

Browse Source
This commit was merged in pull request #149.
This commit is contained in:
Jonathan Miller
2026-07-13 00:12:04 +00:00
parent 1d428d0944 0fbff8671c
commit 782abe81db
11 changed files with 60 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.mokogitea/workflows/issue-branch.yml
+1 -1
View File
@@ -5,7 +5,7 @@
# FILE INFORMATION
# DEFGROUP: Gitea.Workflow
# INGROUP: mokocli.Automation
# VERSION: 02.27.03
# VERSION: 02.27.04
# BRIEF: Auto-create feature branch when an issue is opened
name: "Universal: Issue Branch"
CHANGELOG.md
+2 -2
View File
@@ -8,11 +8,11 @@
DEFGROUP: Joomla.Template.Site
INGROUP: MokoOnyx.Documentation
PATH: ./CHANGELOG.md
VERSION: 02.27.03
VERSION: 02.27.04
BRIEF: Changelog file documenting version history of MokoOnyx
-->
# Changelog — MokoOnyx (VERSION: 02.27.03)
# Changelog — MokoOnyx (VERSION: 02.27.04)
## [Unreleased]
### Added
SECURITY.md
+1 -1
View File
@@ -10,7 +10,7 @@
INGROUP: MokoOnyx.Governance
REPO: https://git.mokoconsulting.tech/MokoConsulting/MokoOnyx
FILE: SECURITY.md
VERSION: 02.27.03
VERSION: 02.27.04
BRIEF: Security policy and vulnerability reporting process for MokoOnyx.
PATH: /SECURITY.md
NOTE: This policy is process oriented and does not replace secure engineering practices.
source/html/layouts/joomla/module/card.php
+1 -1
View File
@@ -10,7 +10,7 @@
* INGROUP: MokoOnyx
* REPO: https://git.mokoconsulting.tech/MokoConsulting/MokoOnyx
* PATH: /html/layouts/joomla/module/card.php
* VERSION: 02.27.03
* VERSION: 02.27.04
* BRIEF: Custom card module chrome — renders module titles for all modules
*/
source/html/layouts/mokoonyx/article-metadata.php
+1 -1
View File
@@ -11,7 +11,7 @@
* INGROUP: MokoOnyx.Layouts
* REPO: https://git.mokoconsulting.tech/MokoConsulting/MokoOnyx
* PATH: /src/html/layouts/mokoonyx/article-metadata.php
* VERSION: 02.27.03
* VERSION: 02.27.04
* BRIEF: Article metadata footer layout -- renders jcfields grouped by field group
*/
source/html/layouts/mokoonyx/social-icons.php
+13 -4
View File
@@ -84,6 +84,10 @@ $floatingPos = in_array($params->get('social_floating_pos'), ['left', 'right'],
$colorMode = in_array($params->get('social_icon_color'), ['theme', 'brand', 'black', 'white'], true)
? $params->get('social_icon_color') : 'theme';
// Floating collapse behaviour (only meaningful for the floating position)
$collapsible = (bool) $params->get('social_floating_collapsible', 1);
$collapsedDefault = $collapsible && (bool) $params->get('social_floating_collapsed', 1);
$listClass = 'moko-social-icons';
$listClass .= ' moko-social-icons--' . htmlspecialchars($style, ENT_QUOTES, 'UTF-8');
$listClass .= ' moko-social-icons--' . htmlspecialchars($size, ENT_QUOTES, 'UTF-8');
@@ -94,8 +98,10 @@ if ($position === 'floating') {
}
?>
<?php if ($position === 'floating') : ?>
<div class="moko-social-floating-wrap moko-social-floating-wrap--<?php echo htmlspecialchars($floatingPos, ENT_QUOTES, 'UTF-8'); ?>"
id="mokoSocialFloating">
<div class="moko-social-floating-wrap moko-social-floating-wrap--<?php echo htmlspecialchars($floatingPos, ENT_QUOTES, 'UTF-8'); ?><?php echo $collapsedDefault ? ' is-collapsed' : ''; ?>"
id="mokoSocialFloating"
data-collapsible="<?php echo $collapsible ? '1' : '0'; ?>"
data-default-collapsed="<?php echo $collapsedDefault ? '1' : '0'; ?>">
<?php endif; ?>
<nav class="<?php echo $listClass; ?>" aria-label="<?php echo Text::_('TPL_MOKOONYX_SOCIAL_NAV_LABEL'); ?>">
<ul>
@@ -114,13 +120,16 @@ if ($position === 'floating') {
<?php endforeach; ?>
</ul>
</nav>
<?php if ($position === 'floating') : ?>
<?php if ($position === 'floating' && $collapsible) : ?>
<button type="button"
class="moko-social-floating-toggle"
id="mokoSocialFloatingToggle"
aria-controls="mokoSocialFloating"
aria-label="<?php echo Text::_('TPL_MOKOONYX_SOCIAL_FLOATING_TOGGLE'); ?>"
aria-expanded="true">
aria-expanded="<?php echo $collapsedDefault ? 'false' : 'true'; ?>">
<span class="fa-solid fa-chevron-<?php echo $floatingPos === 'left' ? 'left' : 'right'; ?>" aria-hidden="true"></span>
</button>
<?php endif; ?>
<?php if ($position === 'floating') : ?>
</div>
<?php endif; ?>
source/language/en-GB/tpl_mokoonyx.ini
+4
View File
@@ -287,6 +287,10 @@ TPL_MOKOONYX_SOCIAL_FLOATING_POS_DESC="Which side of the screen the floating soc
TPL_MOKOONYX_SOCIAL_FLOATING_POS_LEFT="Left"
TPL_MOKOONYX_SOCIAL_FLOATING_POS_RIGHT="Right"
TPL_MOKOONYX_SOCIAL_FLOATING_TOGGLE="Toggle social icons sidebar"
TPL_MOKOONYX_SOCIAL_FLOATING_COLLAPSIBLE_LABEL="Collapsible"
TPL_MOKOONYX_SOCIAL_FLOATING_COLLAPSIBLE_DESC="Show a toggle handle so visitors can collapse and expand the floating social bar. Their choice is remembered on their device."
TPL_MOKOONYX_SOCIAL_FLOATING_COLLAPSED_LABEL="Collapsed by Default"
TPL_MOKOONYX_SOCIAL_FLOATING_COLLAPSED_DESC="Start the floating social bar collapsed on a visitor's first visit. Visitors who have already set their own preference keep it."
TPL_MOKOONYX_SOCIAL_COLOR_LABEL="Icon Colour"
TPL_MOKOONYX_SOCIAL_COLOR_DESC="Choose the colour scheme for social icons."
TPL_MOKOONYX_SOCIAL_COLOR_THEME="Theme (CSS variables)"
source/language/en-US/tpl_mokoonyx.ini
+4
View File
@@ -287,6 +287,10 @@ TPL_MOKOONYX_SOCIAL_FLOATING_POS_DESC="Which side of the screen the floating soc
TPL_MOKOONYX_SOCIAL_FLOATING_POS_LEFT="Left"
TPL_MOKOONYX_SOCIAL_FLOATING_POS_RIGHT="Right"
TPL_MOKOONYX_SOCIAL_FLOATING_TOGGLE="Toggle social icons sidebar"
TPL_MOKOONYX_SOCIAL_FLOATING_COLLAPSIBLE_LABEL="Collapsible"
TPL_MOKOONYX_SOCIAL_FLOATING_COLLAPSIBLE_DESC="Show a toggle handle so visitors can collapse and expand the floating social bar. Their choice is remembered on their device."
TPL_MOKOONYX_SOCIAL_FLOATING_COLLAPSED_LABEL="Collapsed by Default"
TPL_MOKOONYX_SOCIAL_FLOATING_COLLAPSED_DESC="Start the floating social bar collapsed on a visitor's first visit. Visitors who have already set their own preference keep it."
TPL_MOKOONYX_SOCIAL_COLOR_LABEL="Icon Color"
TPL_MOKOONYX_SOCIAL_COLOR_DESC="Choose the color scheme for social icons."
TPL_MOKOONYX_SOCIAL_COLOR_THEME="Theme (CSS variables)"
source/media/css/a11y-high-contrast.css
+1 -1
View File
@@ -10,7 +10,7 @@
* INGROUP: MokoOnyx.Accessibility
* REPO: https://git.mokoconsulting.tech/MokoConsulting/MokoOnyx
* PATH: ./media/css/a11y-high-contrast.css
* VERSION: 02.27.03
* VERSION: 02.27.04
* BRIEF: High-contrast stylesheet for accessibility toolbar
*/
source/media/js/template.js
+17 -10
View File
@@ -797,20 +797,27 @@
function initSocialFloating() {
var wrap = doc.getElementById("mokoSocialFloating");
var toggle = doc.getElementById("mokoSocialFloatingToggle");
// The toggle is only rendered when the "collapsible" param is enabled.
if (!wrap || !toggle) return;
// Restore saved state
try {
if (localStorage.getItem(socialStorageKey) === "1") {
wrap.classList.add("is-collapsed");
toggle.setAttribute("aria-expanded", "false");
}
} catch (e) {}
// Resolve the initial collapsed state:
// - A returning visitor's explicit choice (localStorage) always wins.
// - Otherwise fall back to the admin's "collapsed by default" setting,
// which the layout also renders server-side to avoid a state flash.
var saved = null;
try { saved = localStorage.getItem(socialStorageKey); } catch (e) {}
var collapsed = (saved === "1" || saved === "0")
? (saved === "1")
: (wrap.getAttribute("data-default-collapsed") === "1");
wrap.classList.toggle("is-collapsed", collapsed);
toggle.setAttribute("aria-expanded", collapsed ? "false" : "true");
toggle.addEventListener("click", function () {
var collapsed = wrap.classList.toggle("is-collapsed");
toggle.setAttribute("aria-expanded", collapsed ? "false" : "true");
try { localStorage.setItem(socialStorageKey, collapsed ? "1" : "0"); } catch (e) {}
var isCollapsed = wrap.classList.toggle("is-collapsed");
toggle.setAttribute("aria-expanded", isCollapsed ? "false" : "true");
try { localStorage.setItem(socialStorageKey, isCollapsed ? "1" : "0"); } catch (e) {}
});
}
source/templateDetails.xml
+15 -1
View File
@@ -35,7 +35,7 @@
</updateservers>
<dlid prefix="dlid=" suffix=""/>
<name>mokoonyx</name>
<version>02.27.03</version>
<version>02.27.04</version>
<scriptfile>script.php</scriptfile>
<creationDate>2026-05-16</creationDate>
<author>Jonathan Miller || Moko Consulting</author>
@@ -354,6 +354,20 @@
<option value="left">TPL_MOKOONYX_SOCIAL_FLOATING_POS_LEFT</option>
<option value="right">TPL_MOKOONYX_SOCIAL_FLOATING_POS_RIGHT</option>
</field>
<field name="social_floating_collapsible" type="radio" default="1"
label="TPL_MOKOONYX_SOCIAL_FLOATING_COLLAPSIBLE_LABEL" description="TPL_MOKOONYX_SOCIAL_FLOATING_COLLAPSIBLE_DESC"
layout="joomla.form.field.radio.switcher" filter="boolean"
showon="social_floating:1">
<option value="0">JNO</option>
<option value="1">JYES</option>
</field>
<field name="social_floating_collapsed" type="radio" default="1"
label="TPL_MOKOONYX_SOCIAL_FLOATING_COLLAPSED_LABEL" description="TPL_MOKOONYX_SOCIAL_FLOATING_COLLAPSED_DESC"
layout="joomla.form.field.radio.switcher" filter="boolean"
showon="social_floating:1[AND]social_floating_collapsible:1">
<option value="0">JNO</option>
<option value="1">JYES</option>
</field>
<!-- Style options -->
<field name="social_sep_style" type="spacer" label="Style" hr="false" class="text fw-bold"