MokoConsulting/MokoOnyx
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Releases 2 Activity

MokoOnyx v01.00.00 — initial release (successor to MokoCassiopeia)
Some checks failed
Standards Compliance / Secret Scanning (push) Successful in 3s
Details
Standards Compliance / License Header Validation (push) Successful in 4s
Details
Standards Compliance / Repository Structure Validation (push) Successful in 5s
Details
Standards Compliance / Coding Standards Check (push) Failing after 3s
Details
Standards Compliance / Version Consistency Check (push) Successful in 3s
Details
Standards Compliance / Workflow Configuration Check (push) Failing after 2s
Details
Standards Compliance / Documentation Quality Check (push) Successful in 3s
Details
Standards Compliance / README Completeness Check (push) Successful in 3s
Details
Standards Compliance / Git Repository Hygiene (push) Successful in 2s
Details
Standards Compliance / Script Integrity Validation (push) Successful in 4s
Details
Standards Compliance / Line Length Check (push) Failing after 4s
Details
Standards Compliance / File Naming Standards (push) Successful in 2s
Details
Standards Compliance / Insecure Code Pattern Detection (push) Successful in 3s
Details
Standards Compliance / Code Complexity Analysis (push) Successful in 3s
Details
Standards Compliance / Code Duplication Detection (push) Successful in 4s
Details
Standards Compliance / Dead Code Detection (push) Successful in 3s
Details
Standards Compliance / File Size Limits (push) Successful in 2s
Details
CodeQL Security Scanning / Analyze (javascript) (push) Failing after 1m9s
Details
Standards Compliance / Binary File Detection (push) Successful in 4s
Details
CodeQL Security Scanning / Analyze (actions) (push) Failing after 1m11s
Details
Standards Compliance / TODO/FIXME Tracking (push) Successful in 3s
Details
Standards Compliance / Dependency Vulnerability Scanning (push) Successful in 5s
Details
Standards Compliance / Broken Link Detection (push) Successful in 5s
Details
Standards Compliance / Unused Dependencies Check (push) Successful in 7s
Details
Standards Compliance / API Documentation Coverage (push) Successful in 3s
Details
Standards Compliance / Accessibility Check (push) Successful in 3s
Details
Standards Compliance / Performance Metrics (push) Successful in 3s
Details
Standards Compliance / Enterprise Readiness Check (push) Successful in 3s
Details
Standards Compliance / Repository Health Check (push) Successful in 4s
Details
Standards Compliance / Terraform Configuration Validation (push) Successful in 6s
Details
CodeQL Security Scanning / Security Scan Summary (push) Successful in 1s
Details
Standards Compliance / Compliance Summary (push) Successful in 1s
Details
Repo Health / Access control (push) Successful in 1s
Details
Auto-Update SHA Hash / Update SHA-256 Hash in updates.xml (release) Successful in 4s
Details
Repo Health / Release configuration (push) Failing after 3s
Details
Repo Health / Scripts governance (push) Successful in 3s
Details
Repo Health / Repository health (push) Failing after 3s
Details

Browse Source 
All files renamed from mokocassiopeia to mokoonyx.
Update server points to MokoOnyx repo.
Bridge migration removed (clean standalone template).
Version reset to 01.00.00.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Jonathan Miller
2026-04-19 17:19:03 -05:00
parent 3ba2214614
commit 8258ed804a
238 changed files with 85443 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
src/language/en-GB/index.html Normal file
View File

@@ -0,0 +1,76 @@
<!-- Copyright (C) 2025 Moko Consulting <hello@mokoconsulting.tech>
This file is part of a Moko Consulting project.
SPDX-License-Identifier: GPL-3.0-or-later
-->
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Redirecting…</title>
<!-- Search engines: do not index this placeholder redirect page -->
<meta name="robots" content="noindex, nofollow, noarchive" />
<!-- Instant redirect fallback even if JavaScript is disabled -->
<meta http-equiv="refresh" content="0; url=/" />
<!-- Canonical root reference -->
<link rel="canonical" href="/" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script>
(function redirectToRoot() {
// Configuration object with safe defaults.
var opts = {
fallbackPath: "/", // string: fallback destination if origin is unavailable
delayMs: 0, // number: delay before redirect in ms (0 = immediate)
behavior: "replace" // enum: "replace" | "assign"
};
// Determine absolute origin in all mainstream browsers.
var origin = (typeof location.origin === "string" && location.origin)
|| (location.protocol + "//" + location.host);
// Final destination: absolute root of the current site, or fallback path.
var destination = origin ? origin + "/" : opts.fallbackPath;
function go() {
if (opts.behavior === "assign") {
location.assign(destination);
} else {
location.replace(destination);
}
}
// Execute redirect, optionally after a short delay.
if (opts.delayMs > 0) {
setTimeout(go, opts.delayMs);
} else {
go();
}
})();
</script>
<!--
Secondary meta-refresh for no-JS environments is already set above.
Some very old crawlers may ignore JS; the meta refresh ensures coverage.
-->
<noscript>
<!-- Extra defense-in-depth: if JS is disabled, meta refresh (above) handles redirect. -->
<style>
html, body { height:100%; }
body { display:flex; align-items:center; justify-content:center; margin:0; font: 16px/1.4 system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
.msg { opacity: .75; text-align: center; }
</style>
</noscript>
</head>
<body>
<div class="msg">Redirecting to the site root… If you are not redirected, <a href="/">click here</a>.</div>
</body>
</html>

273
src/language/en-GB/tpl_mokoonyx.ini Normal file
View File

@@ -0,0 +1,273 @@
; Copyright (C) 2025 Moko Consulting <hello@mokoconsulting.tech>
;
; This file is part of a Moko Consulting project.
;
; SPDX-License-Identifier: GPL-3.0-or-later
; ===== System / layout =====
TPL_MOKOONYX_DEVELOPMENTMODE_LABEL="Development Mode"
TPL_MOKOONYX_DEVELOPMENTMODE_DESC="When enabled, unminified CSS and JavaScript files are loaded for easier debugging. When disabled, minified assets are served for faster page loads. Google Tag Manager and Google Analytics may also be disabled in development mode."
TPL_MOKOONYX_FLUID_LABEL="Layout"
TPL_MOKOONYX_STATIC="Static"
TPL_MOKOONYX_FLUID="Fluid"
; ===== Custom Code tab =====
TPL_MOKOONYX_CUSTOM_CODE_FIELDSET="Custom Code"
TPL_MOKOONYX_CUSTOM_HEAD_START_LABEL="Custom Head: Start"
TPL_MOKOONYX_CUSTOM_HEAD_START_DESC="This content will be inserted at the beginning of the &lt;head&gt; tag"
TPL_MOKOONYX_CUSTOM_HEAD_END_LABEL="Custom Head: End"
TPL_MOKOONYX_CUSTOM_HEAD_END_DESC="This content will be inserted at the end of the &lt;head&gt; tag"
TPL_MOKOONYX_OFFLINEEMBED_LABEL="Offline Page Embed Code"
TPL_MOKOONYX_OFFLINEEMBED_DESC="In addition to the 'Offline message' defined in 'Global Configuration', this will be displayed on the offline page.<i>Use for Mailchimp code and Social Icons</i>"
; ===== Drawers =====
TPL_MOKOONYX_DRAWERS_FIELDSET_LABEL="Drawers"
TPL_MOKOONYX_DRAWER_LEFT_ICON_LABEL="Drawer Left Icon CSS"
TPL_MOKOONYX_DRAWER_LEFT_ICON_DESC="Enter the Font-Awesome class for the left drawer toggle (e.g. 'fas fa-chevron-left')."
TPL_MOKOONYX_DRAWER_RIGHT_ICON_LABEL="Drawer Right Icon CSS"
TPL_MOKOONYX_DRAWER_RIGHT_ICON_DESC="Enter the Font-Awesome class for the right drawer toggle (e.g. 'fas fa-chevron-right')."
; ===== Favicon =====
TPL_MOKOONYX_FAVICON_FIELDSET_LABEL="Favicon"
TPL_MOKOONYX_FAVICON_NOTE="<p>Upload a square <strong>PNG image</strong> (recommended 512×512 or larger). The template will automatically generate all required favicon sizes including ICO, Apple Touch Icon (180×180), and Android icons (192×192, 512×512). Generated files are cached in <code>images/favicons/</code>.</p>"
TPL_MOKOONYX_FAVICON_SOURCE_LABEL="Favicon Source Image"
TPL_MOKOONYX_FAVICON_SOURCE_DESC="Select a square PNG image to use as the site favicon. Recommended size: 512×512 pixels or larger."
; ===== Google =====
TPL_MOKOONYX_GOOGLE_FIELDSET_LABEL="Google"
TPL_MOKOONYX_GOOGLE_NOTE_TEXT="<h3>PLEASE NOTE:</h3>If fields are left blank, relative Google features will not be used"
TPL_MOKOONYX_GOOGLETAGMANAGER_LABEL="Use Google Tag Manager?"
TPL_MOKOONYX_GOOGLETAGMANAGER_DESC="Do you want to use Google Tag Manager?<br>More information on Google Tag Manager can be found <a target='_blank' href='https://support.google.com/tagmanager/answer/14842164'>here.</a>"
TPL_MOKOONYX_GOOGLETAGMANAGERID_LABEL="Google Tag Manager ID"
TPL_MOKOONYX_GOOGLETAGMANAGERID_DESC="Begins with 'GTM-'"
TPL_MOKOONYX_GOOGLEANALYTICS_LABEL="Use Google Analytics?"
TPL_MOKOONYX_GOOGLEANALYTICS_DESC="Do you want to use Google Analytics?<br>More information on Google Analytics can be found <a target='_blank' href='https://developers.google.com/analytics'>here.</a>"
TPL_MOKOONYX_GOOGLEANALYTICSID_LABEL="Google Analytics ID"
TPL_MOKOONYX_GOOGLEANALYTICSID_DESC="Begins with 'G-'"
TPL_MOKOONYX_GOOGLESITEKEY_LABEL="Google Search Console Verification"
TPL_MOKOONYX_GOOGLESITEKEY_DESC="Paste the content value from the &lt;meta name=&quot;google-site-verification&quot;&gt; tag. Find this in Google Search Console under Ownership Verification &rarr; HTML tag method."
; ===== Branding & icons (Theme tab) =====
TPL_MOKOONYX_BRAND_LABEL="Brand"
TPL_MOKOONYX_LOGO_LABEL="Logo"
TPL_MOKOONYX_TITLE="Title (alternative to logo)"
TPL_MOKOONYX_TAGLINE_LABEL="Tagline"
TPL_MOKOONYX_TAGLINE_DESC="Optional text to show as a subheading"
TPL_MOKOONYX_FA7KITCODE_LABEL="Font Awesome 7 Kit Unique Code"
TPL_MOKOONYX_FA7KITCODE_DESC="<i>If left blank, Font Awesome 7 Free will be used.</i><br>Copy the unique Kit embed code above and paste it into the &lt;head&gt; of your project's HTML file or template.<br><a href='https://fontawesome.com/' target='_blank'>More information at the Font Awesome website.</a>"
; ===== Typography (Theme tab) =====
TPL_MOKOONYX_FONT_LABEL="Fonts Scheme"
TPL_MOKOONYX_FONT_LABEL_DESC="Select a font scheme for your site. Local fonts are loaded from the template folder, while web fonts are loaded from external sources (Google Fonts). The default is Roboto (local). See the note below for important privacy and performance considerations."
TPL_MOKOONYX_FONT_GROUP_LOCAL="Fonts from Folder"
TPL_MOKOONYX_FONT_GROUP_WEB="Fonts from Web"
TPL_MOKOONYX_FONT_NOTE_TEXT="Loading fonts from external sources might be against privacy regulations in some countries.<br>Loading fonts from a local folder might have a performance impact on your site."
; ===== Header & navigation (Theme tab) =====
TPL_MOKOONYX_STICKY_LABEL="Sticky Header"
TPL_MOKOONYX_BACKTOTOP="Back to Top"
TPL_MOKOONYX_TOC_TITLE="Table of Contents"
TPL_MOKOONYX_BACKTOTOP_LABEL="Back-to-top Link"
TPL_MOKOONYX_TOC="Table of Contents"
; ===== Color palette choices (shared) =====
TPL_MOKOONYX_COLOR_NAME_STANDARD="Standard"
TPL_MOKOONYX_COLOR_NAME_CUSTOM="Custom"
; New labels for Theme tab dropdowns
TPL_MOKOONYX_COLOR_LIGHT_NAME_LABEL="Light colour palette"
TPL_MOKOONYX_COLOR_LIGHT_NAME_DESC="Select a colour palette for light mode. <strong>Standard</strong> uses the default blue theme with comprehensive styling for all components. <strong>Custom</strong> loads <code>media/templates/site/mokoonyx/css/theme/light.custom.css</code> — copy the starter file from <code>templates/mokoonyx/templates/light.custom.css</code> and customise the CSS variables to match your brand. This file is stored in the media folder and will not be overwritten by template updates."
TPL_MOKOONYX_COLOR_DARK_NAME_LABEL="Dark colour palette"
TPL_MOKOONYX_COLOR_DARK_NAME_DESC="Select a colour palette for dark mode. <strong>Standard</strong> uses the default blue theme optimised for dark backgrounds with proper contrast. <strong>Custom</strong> loads <code>media/templates/site/mokoonyx/css/theme/dark.custom.css</code> — copy the starter file from <code>templates/mokoonyx/templates/dark.custom.css</code> and customise the CSS variables to match your brand. This file is stored in the media folder and will not be overwritten by template updates."
; ===== Theme tab (core feature strings) =====
TPL_MOKO_THEME_FIELDSET="Theme"
TPL_MOKO_THEME_SECTION_GENERAL="General"
TPL_MOKO_THEME_SECTION_VARS="Variables & Palettes"
TPL_MOKO_THEME_SECTION_TYPO="Typography"
TPL_MOKO_THEME_SECTION_BRAND="Branding & Icons"
TPL_MOKO_THEME_SECTION_HEADER="Header & Navigation"
TPL_MOKO_THEME_SECTION_TOGGLE="Theme Toggle UI"
TPL_MOKO_THEME_ENABLED="Enable theme feature"
TPL_MOKO_THEME_ENABLED_DESC="Turn the entire light/dark feature on or off."
TPL_MOKO_THEME_CONTROL_TYPE="Theme Control Type"
TPL_MOKO_THEME_CONTROL_TYPE_DESC="Choose a visible toggle (Switch or Radios), or no control to follow System only."
TPL_MOKO_THEME_DEFAULT_CHOICE="Default Choice"
TPL_MOKO_THEME_DEFAULT_CHOICE_DESC="Initial theme when no user preference is stored."
TPL_MOKO_THEME_AUTO_DARK="Auto Dark Mode"
TPL_MOKO_THEME_AUTO_DARK_DESC="Force the site to switch to dark mode automatically. When enabled, the template will override the default and use dark unless the user explicitly selects otherwise."
TPL_MOKO_THEME_META_COLOR_SCHEME="Add &lt;meta name=&quot;color-scheme&quot;&gt;"
TPL_MOKO_THEME_META_COLOR_SCHEME_DESC="Advertise light/dark support for UA controls."
TPL_MOKO_THEME_META_THEME_COLOR="Add &lt;meta name=&quot;theme-color&quot;&gt;"
TPL_MOKO_THEME_META_THEME_COLOR_DESC="Update mobile address bar color."
TPL_MOKO_THEME_BASE_CSS="Base template CSS"
TPL_MOKO_THEME_BASE_CSS_DESC="Main stylesheet that consumes variables."
TPL_MOKO_THEME_BRIDGE="Sync data-bs-theme with data-aria-theme"
TPL_MOKO_THEME_BRIDGE_DESC="Keep both attributes in lockstep so Bootstrap and custom CSS stay aligned."
TPL_MOKO_THEME_FAB_ENABLED="Show floating theme switch"
TPL_MOKO_THEME_FAB_ENABLED_DESC="Display a persistent, accessible theme toggle."
TPL_MOKO_THEME_FAB_POS="Floating switch position"
TPL_MOKO_THEME_FAB_POS_DESC="Screen corner for the toggle."
; ===== Accessibility toolbar =====
TPL_MOKO_A11Y_TOOLBAR_ENABLED="Accessibility toolbar"
TPL_MOKO_A11Y_TOOLBAR_ENABLED_DESC="Show a floating accessibility toolbar with text resize and colour inversion controls."
TPL_MOKO_A11Y_TEXT_RESIZE="Text resize"
TPL_MOKO_A11Y_TEXT_RESIZE_DESC="Allow visitors to increase or decrease text size."
TPL_MOKO_A11Y_COLOR_INVERSION="Colour inversion"
TPL_MOKO_A11Y_COLOR_INVERSION_DESC="Allow visitors to invert page colours for improved readability."
TPL_MOKO_A11Y_TOOLBAR_POS="Toolbar position"
TPL_MOKO_A11Y_TOOLBAR_POS_DESC="Screen corner for the accessibility toolbar."
TPL_MOKO_A11Y_BTN_LABEL="Accessibility options"
TPL_MOKO_A11Y_TEXT_DECREASE="Decrease text size"
TPL_MOKO_A11Y_TEXT_RESET="Reset text size"
TPL_MOKO_A11Y_TEXT_INCREASE="Increase text size"
TPL_MOKO_A11Y_INVERT_COLORS="Invert colours"
TPL_MOKO_A11Y_HIGH_CONTRAST="High contrast"
TPL_MOKO_A11Y_HIGH_CONTRAST_DESC="Allow visitors to boost page contrast for improved readability."
TPL_MOKO_A11Y_HIGHLIGHT_LINKS="Highlight links"
TPL_MOKO_A11Y_HIGHLIGHT_LINKS_DESC="Allow visitors to outline all links so they stand out from surrounding text."
TPL_MOKO_A11Y_READABLE_FONT="Readable font"
TPL_MOKO_A11Y_READABLE_FONT_DESC="Allow visitors to switch to a clean system font optimised for readability."
TPL_MOKO_A11Y_PAUSE_ANIMATIONS="Pause animations"
TPL_MOKO_A11Y_PAUSE_ANIMATIONS_DESC="Allow visitors to stop all CSS animations and transitions."
; ===== CSS Variables tab =====
TPL_MOKOONYX_CSS_VARS_FIELDSET_LABEL="CSS Variables"
TPL_MOKOONYX_CSS_VARS_INTRO="<p>All colours, spacing and layout values are driven by CSS custom properties. To override any variable without editing the template, add your overrides to <code>media/templates/site/mokoonyx/css/user.css</code>, or create a custom palette file (see the Theme tab). Variables are scoped to <code>:root[data-bs-theme=&quot;light&quot;]</code> or <code>:root[data-bs-theme=&quot;dark&quot;]</code> so light and dark values are independent.</p>"
TPL_MOKOONYX_CSS_VARS_BRAND_LABEL="Brand &amp; Theme Colours"
TPL_MOKOONYX_CSS_VARS_BRAND_DESC="<code>--color-primary</code> — Primary brand colour (default: <code>#112855</code>)<br><code>--accent-color-primary</code> — Primary accent (default: <code>#3f8ff0</code>)<br><code>--accent-color-secondary</code> — Secondary accent"
TPL_MOKOONYX_CSS_VARS_LINKS_LABEL="Links &amp; Link Utilities"
TPL_MOKOONYX_CSS_VARS_LINKS_DESC="<strong>Core link tokens</strong><br><code>--color-link</code> — Base link colour<br><code>--color-hover</code> — Base hover colour<br><code>--link-color</code> / <code>--link-hover-color</code> — Bootstrap link colours<br><code>--link-decoration</code> — Default text-decoration<br><code>--link-active-color</code> — Active state<br><br><strong>Semantic link utilities</strong> (replace <code>{colour}</code> with <code>primary</code>, <code>secondary</code>, <code>success</code>, <code>info</code>, <code>warning</code>, <code>danger</code>, <code>light</code>, <code>dark</code>)<br><code>--link-{colour}-color</code> — Colour for <code>.link-{colour}</code><br><code>--link-{colour}-hover-color</code> — Hover colour"
TPL_MOKOONYX_CSS_VARS_TYPO_LABEL="Typography &amp; Body"
TPL_MOKOONYX_CSS_VARS_TYPO_DESC="<code>--body-color</code> — Default text colour (default: <code>#22262a</code>)<br><code>--body-bg</code> — Page background (default: <code>#fff</code>)<br><code>--body-font-family</code> — Font stack<br><code>--body-font-size</code> — Base size (default: <code>1rem</code>)<br><code>--body-font-weight</code> — Base weight (default: <code>400</code>)<br><code>--body-line-height</code> — Line height (default: <code>1.5</code>)<br><code>--heading-color</code> — Heading colour (default: <code>inherit</code>)<br><code>--muted-color</code> — Muted/secondary text (default: <code>#6d757e</code>)<br><code>--code-color</code> — Inline code colour<br><code>--emphasis-color</code> — Strong emphasis colour<br><code>--secondary-color</code> / <code>--tertiary-color</code> — Stepped text opacities<br><code>--highlight-color</code> / <code>--highlight-bg</code> — <code>&lt;mark&gt;</code> colours<br><code>--font-sans-serif</code> / <code>--font-monospace</code> — Font stacks"
TPL_MOKOONYX_CSS_VARS_NAV_LABEL="Navigation, Navbar &amp; Offcanvas"
TPL_MOKOONYX_CSS_VARS_NAV_DESC="<strong>Theme nav</strong><br><code>--nav-bg-color</code> — Navbar background<br><code>--nav-text-color</code> — Navbar text<br><code>--mainmenu-nav-link-color</code> — Active nav link<br><br><strong>Navbar tokens</strong><br><code>--navbar-padding-x</code> / <code>--navbar-padding-y</code> — Navbar padding<br><code>--navbar-brand-font-size</code> — Brand font size<br><code>--navbar-toggler-border-color</code> — Mobile toggler border<br><code>--nav-link-padding-x</code> / <code>--nav-link-padding-y</code> — Link padding<br><code>--nav-link-font-weight</code> — Link weight<br><code>--nav-link-disabled-color</code> — Disabled link colour<br><br><strong>Offcanvas</strong><br><code>--offcanvas-color</code> — Offcanvas text colour<br><code>--offcanvas-padding-x</code> / <code>--offcanvas-padding-y</code> — Offcanvas padding"
TPL_MOKOONYX_CSS_VARS_LAYOUT_LABEL="Layout &amp; Spacing"
TPL_MOKOONYX_CSS_VARS_LAYOUT_DESC="<code>--padding-x</code> / <code>--padding-y</code> — Default component padding<br><code>--nav-toggle-size</code> — Mobile nav toggle button size (default: <code>3rem</code>)<br><code>--secondary-bg</code> — Secondary surface background (default: <code>#eaedf0</code>)<br><code>--tertiary-bg</code> — Tertiary surface background (default: <code>#f9fafb</code>)<br><code>--hr-color</code> — Horizontal rule colour<br><code>--border-color-soft</code> — Soft border variant<br><code>--kbd-bg</code> / <code>--kbd-ink</code> — Keyboard element colours<br><code>--toc-bg</code> / <code>--toc-ink</code> — Table of contents colours<br><code>--selection-bg</code> / <code>--selection-ink</code> — Text selection colours<br><code>--gradient</code> — Bootstrap gradient overlay value<br><code>--bg-opacity</code> — Background opacity utility base"
TPL_MOKOONYX_CSS_VARS_BP_LABEL="Breakpoints"
TPL_MOKOONYX_CSS_VARS_BP_DESC="Read-only reference values matching Bootstrap breakpoints.<br><code>--bp-xs</code> — <code>0</code><br><code>--bp-sm</code> — <code>576px</code><br><code>--bp-md</code> — <code>768px</code><br><code>--bp-lg</code> — <code>992px</code><br><code>--bp-xl</code> — <code>1200px</code>"
TPL_MOKOONYX_CSS_VARS_BS_LABEL="Bootstrap Semantic Palette"
TPL_MOKOONYX_CSS_VARS_BS_DESC="These map to Bootstrap components (buttons, alerts, badges). Override to retheme all components at once.<br><code>--primary</code> — <code>#010156</code><br><code>--secondary</code> — <code>#6d757e</code><br><code>--success</code> — <code>#448344</code><br><code>--info</code> — <code>#30638d</code><br><code>--warning</code> — <code>#ad6200</code><br><code>--danger</code> — <code>#a51f18</code><br><code>--light</code> — <code>#f9fafb</code><br><code>--dark</code> — <code>#353b41</code><br>Each colour also has an <code>--{color}-rgb</code> variant for use in <code>rgba()</code> expressions."
TPL_MOKOONYX_CSS_VARS_BS_STATES_LABEL="Bootstrap State Colours"
TPL_MOKOONYX_CSS_VARS_BS_STATES_DESC="Contextual state tokens used by alerts, badges and list groups. Replace <code>{color}</code> with <code>primary</code>, <code>secondary</code>, <code>success</code>, <code>info</code>, <code>warning</code>, <code>danger</code>, <code>light</code>, or <code>dark</code>.<br><code>--{color}-text-emphasis</code> — High-contrast text on subtle backgrounds<br><code>--{color}-bg-subtle</code> — Tinted component background<br><code>--{color}-border-subtle</code> — Tinted component border"
TPL_MOKOONYX_CSS_VARS_ALERT_LIST_LABEL="Alert &amp; List Group Colours"
TPL_MOKOONYX_CSS_VARS_ALERT_LIST_DESC="<strong>Alert link colours</strong> — override to adjust link contrast inside <code>.alert-{color}</code> components.<br><code>--alert-{color}-link-color</code> — e.g. <code>--alert-primary-link-color</code><br><br><strong>List group item colours</strong> — contextual surfaces for <code>.list-group-item-{color}</code>.<br><code>--list-group-item-{color}-color</code> — Text colour<br><code>--list-group-item-{color}-bg</code> — Background<br><code>--list-group-item-{color}-active-bg</code> — Active state background"
TPL_MOKOONYX_CSS_VARS_COLORS_LABEL="Standard Colours, Grays &amp; Opacity"
TPL_MOKOONYX_CSS_VARS_COLORS_DESC="<strong>Named colours</strong><br><code>--blue</code>, <code>--indigo</code>, <code>--purple</code>, <code>--pink</code>, <code>--red</code>, <code>--orange</code>, <code>--yellow</code>, <code>--green</code>, <code>--teal</code>, <code>--cyan</code>, <code>--black</code>, <code>--white</code><br><br><strong>Gray scale</strong><br><code>--gray-100</code> through <code>--gray-900</code> plus <code>--white-rgb</code> and <code>--black-rgb</code><br><br><strong>Opacity utilities</strong><br><code>--opacity-0</code>, <code>--opacity-5</code>, <code>--opacity-10</code>, <code>--opacity-15</code>, <code>--opacity-20</code>, <code>--opacity-25</code>, <code>--opacity-30</code>, <code>--opacity-50</code>, <code>--opacity-75</code>, <code>--opacity-100</code>"
TPL_MOKOONYX_CSS_VARS_HERO_LABEL="Hero / Banner Overlay"
TPL_MOKOONYX_CSS_VARS_HERO_DESC="Applied to the <code>.custom-hero</code> / <code>.banner-overlay</code> layout. Set on <code>:root[data-bs-theme]</code> so light and dark values are independent.<br><code>--hero-height</code> — Banner height (default: <code>70vh</code>)<br><code>--hero-color</code> — Base text colour<br><code>--hero-bg-repeat</code> — Background repeat (default: <code>no-repeat</code>)<br><code>--hero-bg-attachment</code> — Background attachment (default: <code>fixed</code>)<br><code>--hero-bg-position</code> — Background position (default: <code>top center</code>)<br><code>--hero-bg-size</code> — Background size (default: <code>cover</code>)<br><code>--hero-border-bottom</code> — Bottom border (default: <code>solid var(--accent-color-secondary)</code>)<br><code>--hero-overlay-bg</code> — Overlay tint colour (light default: <code>hsla(0,0%,0%,0.1)</code> / dark default: <code>hsla(0,0%,0%,0.3)</code>)<br><code>--hero-overlay-padding</code> — Overlay inner padding (default: <code>1em</code>)<br><code>--hero-overlay-text-align</code> — Overlay text alignment (default: <code>center</code>)<br><code>--hero-overlay-text-color</code> — Overlay text colour"
TPL_MOKOONYX_CSS_VARS_HERO_VARIANTS_LABEL="Hero Variants (.hero#primary / .hero#secondary)"
TPL_MOKOONYX_CSS_VARS_HERO_VARIANTS_DESC="Two-variant hero system using <code>.hero#primary</code> and <code>.hero#secondary</code>. Each variant resolves its own CSS variable set per theme.<br><br><strong>Primary variant</strong> — homepage, main landing pages (sky blue tint, softer overlay)<br><code>--hero-primary-bg-color</code> — Fallback background colour<br><code>--hero-primary-overlay</code> — Gradient overlay tint<br><code>--hero-primary-color</code> — Text colour<br><br><strong>Secondary variant</strong> — inner pages, events, about (navy overlay, lighter text)<br><code>--hero-secondary-bg-color</code> — Fallback background colour<br><code>--hero-secondary-overlay</code> — Gradient overlay tint<br><code>--hero-secondary-color</code> — Text colour<br><br><strong>HTML usage:</strong><br><code>&lt;div class=&quot;hero&quot; id=&quot;primary&quot; style=&quot;background-image:url(...)&quot;&gt;</code>"
TPL_MOKOONYX_CSS_VARS_BLOCK_COLORS_LABEL="Block Colour System (top-a / top-b / bottom-a / bottom-b)"
TPL_MOKOONYX_CSS_VARS_BLOCK_COLORS_DESC="Automatic brand colour palette for modules in <code>top-a</code>, <code>top-b</code>, <code>bottom-a</code>, and <code>bottom-b</code> positions. Colours assigned by <code>:nth-child()</code> order — no classes needed.<br><br><strong>Slot palette</strong><br><code>--block-color-1</code> / <code>--block-text-1</code> — 1st module<br><code>--block-color-2</code> / <code>--block-text-2</code> — 2nd module<br><code>--block-color-3</code> / <code>--block-text-3</code> — 3rd module<br><code>--block-color-4</code> / <code>--block-text-4</code> — 4th module<br><br><strong>Named overrides</strong> (add an ID to the module HTML to bypass slot colour)<br><code>--block-highlight-bg</code> / <code>--block-highlight-text</code> — for <code>#block-highlight</code><br><code>--block-cta-bg</code> / <code>--block-cta-text</code> — for <code>#block-cta</code><br><code>--block-alert-bg</code> / <code>--block-alert-text</code> — for <code>#block-alert</code><br><br><strong>Priority:</strong> Named ID &gt; Slot colour. No <code>!important</code> needed — specificity handles it."
TPL_MOKOONYX_CSS_VARS_HEADER_LABEL="Header Background"
TPL_MOKOONYX_CSS_VARS_HEADER_DESC="Controls the background of the topbar/header area.<br><code>--header-background-image</code> — CSS <code>background-image</code> value (default: built-in SVG pattern)<br><code>--header-background-attachment</code> — <code>fixed</code> or <code>scroll</code><br><code>--header-background-repeat</code> — e.g. <code>repeat</code>, <code>no-repeat</code><br><code>--header-background-size</code> — e.g. <code>auto</code>, <code>cover</code>, <code>contain</code>"
TPL_MOKOONYX_CSS_VARS_CONTAINERS_LABEL="Container Backgrounds"
TPL_MOKOONYX_CSS_VARS_CONTAINERS_DESC="Each layout container has its own background variables. Replace <code>{pos}</code> with: <code>below-topbar</code>, <code>top-a</code>, <code>top-b</code>, <code>sidebar</code>, <code>bottom-a</code>, or <code>bottom-b</code>.<br><br><code>--container-{pos}-bg-image</code> — Background image (default: <code>none</code>)<br><code>--container-{pos}-bg-color</code> — Background colour (default: <code>transparent</code>)<br><code>--container-{pos}-bg-position</code> — Background position<br><code>--container-{pos}-bg-attachment</code> — <code>fixed</code> or <code>scroll</code><br><code>--container-{pos}-bg-repeat</code> — Repeat behaviour<br><code>--container-{pos}-bg-size</code> — e.g. <code>cover</code>, <code>auto</code><br><code>--container-{pos}-border</code> — Border shorthand<br><code>--container-{pos}-border-radius</code> — Border radius<br><br>Also: <code>--container-toc-bg</code> / <code>--container-toc-color</code> for the TOC sidebar."
TPL_MOKOONYX_CSS_VARS_BORDERS_LABEL="Borders"
TPL_MOKOONYX_CSS_VARS_BORDERS_DESC="<code>--border-width</code> — Default width (default: <code>1px</code>)<br><code>--border-style</code> — Default style (default: <code>solid</code>)<br><code>--border-color</code> — Default border colour (default: <code>#dfe3e7</code>)<br><code>--border-color-translucent</code> — Semi-transparent border<br><code>--border-radius</code> — Default radius (default: <code>.25rem</code>)<br><code>--border-radius-sm</code> — Small radius<br><code>--border-radius-lg</code> — Large radius<br><code>--border-radius-xl</code> — Extra large radius<br><code>--border-radius-xxl</code> — 2XL radius (default: <code>2rem</code>)<br><code>--border-radius-pill</code> — Pill radius (default: <code>50rem</code>)"
TPL_MOKOONYX_CSS_VARS_SHADOWS_LABEL="Shadows &amp; Shadow Tokens"
TPL_MOKOONYX_CSS_VARS_SHADOWS_DESC="<strong>Box shadows</strong><br><code>--box-shadow</code> — Standard shadow<br><code>--box-shadow-sm</code> — Subtle shadow<br><code>--box-shadow-lg</code> — Prominent shadow<br><code>--box-shadow-inset</code> — Inset shadow<br><br><strong>Shadow colour tokens</strong> — used as building blocks by component shadows<br><code>--shadow-color-light</code> — <code>rgba(black, 0.15)</code><br><code>--shadow-color-medium</code> — <code>rgba(black, 0.25)</code><br><code>--shadow-color-dark</code> — <code>rgba(black, 0.30)</code><br><code>--highlight-translucent</code> — <code>rgba(white, 0.15)</code>"
TPL_MOKOONYX_CSS_VARS_FORMS_LABEL="Focus &amp; Forms"
TPL_MOKOONYX_CSS_VARS_FORMS_DESC="<code>--focus-ring-width</code> — Keyboard focus ring width (default: <code>.25rem</code>)<br><code>--focus-ring-opacity</code> — Focus ring opacity<br><code>--focus-ring-color</code> — Focus ring colour<br><code>--input-color</code> — Input text colour<br><code>--input-bg</code> — Input background<br><code>--input-border-color</code> — Input border colour<br><code>--input-focus-border-color</code> — Focused border colour<br><code>--input-focus-box-shadow</code> — Focused input shadow<br><code>--input-placeholder-color</code> — Placeholder text colour<br><code>--input-disabled-bg</code> — Disabled input background<br><code>--input-disabled-border-color</code> — Disabled input border<br><code>--form-valid-color</code> / <code>--form-valid-border-color</code> — Valid state<br><code>--form-invalid-color</code> / <code>--form-invalid-border-color</code> — Invalid state"
TPL_MOKOONYX_CSS_VARS_BUTTONS_LABEL="Buttons"
TPL_MOKOONYX_CSS_VARS_BUTTONS_DESC="Applied on <code>:root</code> for global button defaults:<br><code>--btn-border-radius</code> — Button border radius<br><code>--btn-box-shadow</code> — Button box shadow<br><br>Applied on <code>.btn</code> for base button tokens (overridable per variant):<br><code>--btn-padding-x</code> / <code>--btn-padding-y</code> — Padding<br><code>--btn-font-size</code> / <code>--btn-font-weight</code> / <code>--btn-line-height</code> — Typography<br><code>--btn-color</code> / <code>--btn-bg</code> / <code>--btn-border-color</code> — Default state<br><code>--btn-hover-color</code> / <code>--btn-hover-bg</code> / <code>--btn-hover-border-color</code> — Hover state<br><code>--btn-active-color</code> / <code>--btn-active-bg</code> / <code>--btn-active-shadow</code> — Active state<br><code>--btn-disabled-opacity</code> — Disabled opacity<br><br>Each <code>.btn-{color}</code> and <code>.btn-outline-{color}</code> class inherits these tokens and sets its own values."
TPL_MOKOONYX_CSS_VARS_CARDS_LABEL="Cards"
TPL_MOKOONYX_CSS_VARS_CARDS_DESC="<code>--card-spacer-y</code> / <code>--card-spacer-x</code> — Body padding (default: <code>1rem</code>)<br><code>--card-title-spacer-y</code> — Title bottom margin (default: <code>0.5rem</code>)<br><code>--card-border-width</code> — Border width (default: <code>1px</code>)<br><code>--card-border-color</code> — Border colour<br><code>--card-border-radius</code> — Border radius<br><code>--card-box-shadow</code> — Card shadow (default: <code>none</code>)<br><code>--card-cap-padding-y</code> / <code>--card-cap-padding-x</code> — Header/footer padding<br><code>--card-cap-bg</code> — Header/footer background<br><code>--card-cap-color</code> — Header/footer text colour<br><code>--card-color</code> — Body text colour<br><code>--card-bg</code> — Card background"
TPL_MOKOONYX_CSS_VARS_ACCORDION_LABEL="Accordion"
TPL_MOKOONYX_CSS_VARS_ACCORDION_DESC="<strong>Colours</strong><br><code>--accordion-color</code> — Panel text colour<br><code>--accordion-bg</code> — Panel background<br><code>--accordion-border-color</code> — Border colour<br><code>--accordion-btn-color</code> — Button text colour<br><code>--accordion-btn-bg</code> — Button background<br><code>--accordion-btn-focus-border-color</code> — Button focus border colour<br><code>--accordion-btn-focus-box-shadow</code> — Button focus ring<br><code>--accordion-active-color</code> — Active item text colour<br><code>--accordion-active-bg</code> — Active item background<br><br><strong>Dimensions</strong><br><code>--accordion-border-width</code> — Border width<br><code>--accordion-border-radius</code> — Outer border radius<br><code>--accordion-inner-border-radius</code> — Inner border radius<br><code>--accordion-btn-padding-x</code> / <code>--accordion-btn-padding-y</code> — Button padding<br><code>--accordion-body-padding-x</code> / <code>--accordion-body-padding-y</code> — Body padding<br><br><strong>Icon &amp; Animation</strong><br><code>--accordion-btn-icon</code> — Collapse icon (collapsed state)<br><code>--accordion-btn-icon-width</code> — Icon size<br><code>--accordion-btn-icon-transform</code> — Icon rotation when expanded<br><code>--accordion-btn-icon-transition</code> — Icon rotation transition<br><code>--accordion-btn-active-icon</code> — Icon (expanded state)<br><code>--accordion-transition</code> — Panel open/close transition<br><br><strong>Stacking</strong><br><code>--accordion-zindex</code> — z-index"
TPL_MOKOONYX_CSS_VARS_ALERT_BASE_LABEL="Alert (Base)"
TPL_MOKOONYX_CSS_VARS_ALERT_BASE_DESC="<strong>Colours</strong><br><code>--alert-color</code> — Alert text colour<br><code>--alert-bg</code> — Alert background<br><code>--alert-border-color</code> — Border colour<br><code>--alert-border</code> — Full border shorthand<br><br><strong>Dimensions</strong><br><code>--alert-padding-x</code> / <code>--alert-padding-y</code> — Inner padding<br><code>--alert-margin-bottom</code> — Bottom margin<br><code>--alert-border-radius</code> — Border radius<br><br><em>Note: per-variant contextual tokens (colours, backgrounds, borders) are covered in the Bootstrap State Colours section above.</em>"
TPL_MOKOONYX_CSS_VARS_BADGE_LABEL="Badge"
TPL_MOKOONYX_CSS_VARS_BADGE_DESC="<strong>Colours</strong><br><code>--badge-color</code> — Badge text colour<br><br><strong>Typography</strong><br><code>--badge-font-size</code> — Font size<br><code>--badge-font-weight</code> — Font weight<br><br><strong>Dimensions</strong><br><code>--badge-padding-x</code> / <code>--badge-padding-y</code> — Padding<br><code>--badge-border-radius</code> — Border radius"
TPL_MOKOONYX_CSS_VARS_BACKDROP_LABEL="Backdrop"
TPL_MOKOONYX_CSS_VARS_BACKDROP_DESC="<strong>Colours</strong><br><code>--backdrop-bg</code> — Backdrop colour (default: <code>#000</code>)<br><code>--backdrop-opacity</code> — Backdrop opacity (default: <code>0.5</code>)<br><br><strong>Stacking</strong><br><code>--backdrop-zindex</code> — z-index (default: <code>1040</code>)"
TPL_MOKOONYX_CSS_VARS_BREADCRUMB_LABEL="Breadcrumb"
TPL_MOKOONYX_CSS_VARS_BREADCRUMB_DESC="<strong>Colours</strong><br><code>--breadcrumb-bg</code> — Background colour<br><code>--breadcrumb-divider-color</code> — Divider colour<br><code>--breadcrumb-item-active-color</code> — Active item colour<br><br><strong>Dimensions</strong><br><code>--breadcrumb-padding-x</code> / <code>--breadcrumb-padding-y</code> — Container padding<br><code>--breadcrumb-margin-bottom</code> — Bottom margin<br><code>--breadcrumb-item-padding-x</code> — Spacing between items<br><code>--breadcrumb-border-radius</code> — Container border radius"
TPL_MOKOONYX_CSS_VARS_DROPDOWN_MENU_LABEL="Dropdown Menu"
TPL_MOKOONYX_CSS_VARS_DROPDOWN_MENU_DESC="<strong>Colours</strong><br><code>--dropdown-color</code> — Default text colour<br><code>--dropdown-bg</code> — Menu background<br><code>--dropdown-border-color</code> — Border colour<br><code>--dropdown-divider-bg</code> — Divider colour<br><code>--dropdown-box-shadow</code> — Menu shadow<br><code>--dropdown-link-color</code> — Link text colour<br><code>--dropdown-link-active-color</code> — Active link text colour<br><code>--dropdown-link-active-bg</code> — Active link background<br><code>--dropdown-link-disabled-color</code> — Disabled link colour<br><code>--dropdown-header-color</code> — Header text colour<br><br><strong>Dimensions</strong><br><code>--dropdown-min-width</code> — Minimum width<br><code>--dropdown-padding-x</code> / <code>--dropdown-padding-y</code> — Menu padding<br><code>--dropdown-spacer</code> — Gap from toggle<br><code>--dropdown-border-width</code> — Border width<br><code>--dropdown-border-radius</code> — Outer border radius<br><code>--dropdown-inner-border-radius</code> — Inner border radius<br><code>--dropdown-divider-margin-y</code> — Divider vertical margin<br><code>--dropdown-item-padding-x</code> / <code>--dropdown-item-padding-y</code> — Item padding<br><code>--dropdown-header-padding-x</code> / <code>--dropdown-header-padding-y</code> — Header padding<br><br><strong>Typography</strong><br><code>--dropdown-font-size</code> — Menu font size<br><br><strong>Stacking</strong><br><code>--dropdown-zindex</code> — z-index"
TPL_MOKOONYX_CSS_VARS_LIST_GROUP_LABEL="List Group"
TPL_MOKOONYX_CSS_VARS_LIST_GROUP_DESC="<strong>Colours</strong><br><code>--list-group-color</code> — Default text colour<br><code>--list-group-bg</code> — Default background<br><code>--list-group-border-color</code> — Border colour<br><code>--list-group-action-color</code> — Clickable item text colour<br><code>--list-group-action-active-color</code> — Clickable item active text colour<br><code>--list-group-action-active-bg</code> — Clickable item active background<br><code>--list-group-disabled-color</code> — Disabled item text colour<br><code>--list-group-disabled-bg</code> — Disabled item background<br><code>--list-group-active-color</code> — Active item text colour<br><code>--list-group-active-bg</code> — Active item background<br><code>--list-group-active-border-color</code> — Active item border colour<br><br><strong>Dimensions</strong><br><code>--list-group-border-width</code> — Border width<br><code>--list-group-border-radius</code> — Border radius<br><code>--list-group-item-padding-x</code> / <code>--list-group-item-padding-y</code> — Item padding"
TPL_MOKOONYX_CSS_VARS_MODAL_LABEL="Modal"
TPL_MOKOONYX_CSS_VARS_MODAL_DESC="<strong>Colours</strong><br><code>--modal-color</code> — Modal text colour<br><code>--modal-bg</code> — Modal background<br><code>--modal-border-color</code> — Outer border colour<br><code>--modal-box-shadow</code> — Modal shadow<br><code>--modal-header-border-color</code> — Header border colour<br><code>--modal-footer-bg</code> — Footer background<br><code>--modal-footer-border-color</code> — Footer border colour<br><br><strong>Dimensions</strong><br><code>--modal-width</code> — Default modal width<br><code>--modal-padding</code> — Body padding<br><code>--modal-margin</code> — Outer margin<br><code>--modal-border-width</code> — Outer border width<br><code>--modal-border-radius</code> — Outer border radius<br><code>--modal-inner-border-radius</code> — Inner border radius<br><code>--modal-header-padding-x</code> / <code>--modal-header-padding-y</code> — Header padding<br><code>--modal-header-padding</code> — Header padding shorthand<br><code>--modal-header-border-width</code> — Header border width<br><code>--modal-title-line-height</code> — Title line height<br><code>--modal-footer-gap</code> — Footer button gap<br><code>--modal-footer-border-width</code> — Footer border width<br><br><strong>Stacking</strong><br><code>--modal-zindex</code> — z-index"
TPL_MOKOONYX_CSS_VARS_NAV_TABS_LABEL="Nav Tabs"
TPL_MOKOONYX_CSS_VARS_NAV_TABS_DESC="<strong>Colours</strong><br><code>--nav-tabs-border-color</code> — Tab bar border colour<br><code>--nav-tabs-link-active-color</code> — Active tab text colour<br><code>--nav-tabs-link-active-bg</code> — Active tab background<br><code>--nav-tabs-link-active-border-color</code> — Active tab border colour<br><br><strong>Dimensions</strong><br><code>--nav-tabs-border-width</code> — Border width<br><code>--nav-tabs-border-radius</code> — Tab border radius"
TPL_MOKOONYX_CSS_VARS_NAV_PILLS_LABEL="Nav Pills"
TPL_MOKOONYX_CSS_VARS_NAV_PILLS_DESC="<strong>Colours</strong><br><code>--nav-pills-link-active-color</code> — Active pill text colour<br><code>--nav-pills-link-active-bg</code> — Active pill background<br><br><strong>Dimensions</strong><br><code>--nav-pills-border-radius</code> — Pill border radius"
TPL_MOKOONYX_CSS_VARS_PAGINATION_LABEL="Pagination"
TPL_MOKOONYX_CSS_VARS_PAGINATION_DESC="<strong>Colours</strong><br><code>--pagination-color</code> — Default link colour<br><code>--pagination-bg</code> — Default background<br><code>--pagination-border-color</code> — Default border colour<br><code>--pagination-focus-color</code> — Focused link colour<br><code>--pagination-focus-bg</code> — Focused background<br><code>--pagination-focus-box-shadow</code> — Focus ring<br><code>--pagination-active-color</code> — Active page text colour<br><code>--pagination-active-bg</code> — Active page background<br><code>--pagination-active-border-color</code> — Active page border colour<br><code>--pagination-disabled-color</code> — Disabled link colour<br><code>--pagination-disabled-bg</code> — Disabled background<br><code>--pagination-disabled-border-color</code> — Disabled border colour<br><br><strong>Dimensions</strong><br><code>--pagination-padding-x</code> / <code>--pagination-padding-y</code> — Item padding<br><code>--pagination-border-width</code> — Border width<br><code>--pagination-border-radius</code> — Border radius<br><br><strong>Typography</strong><br><code>--pagination-font-size</code> — Font size"
TPL_MOKOONYX_CSS_VARS_POPOVER_LABEL="Popover"
TPL_MOKOONYX_CSS_VARS_POPOVER_DESC="<strong>Colours</strong><br><code>--popover-bg</code> — Popover background<br><code>--popover-border-color</code> — Border colour<br><code>--popover-box-shadow</code> — Popover shadow<br><code>--popover-header-color</code> — Header text colour<br><code>--popover-header-bg</code> — Header background<br><code>--popover-body-color</code> — Body text colour<br><code>--popover-arrow-border</code> — Arrow border colour<br><br><strong>Dimensions</strong><br><code>--popover-max-width</code> — Maximum width<br><code>--popover-border-width</code> — Border width<br><code>--popover-border-radius</code> — Outer border radius<br><code>--popover-inner-border-radius</code> — Inner border radius<br><code>--popover-header-padding-x</code> / <code>--popover-header-padding-y</code> — Header padding<br><code>--popover-body-padding-x</code> / <code>--popover-body-padding-y</code> — Body padding<br><code>--popover-arrow-width</code> / <code>--popover-arrow-height</code> — Arrow dimensions<br><br><strong>Typography</strong><br><code>--popover-font-size</code> — Font size<br><code>--popover-header-font-size</code> — Header font size<br><br><strong>Stacking</strong><br><code>--popover-zindex</code> — z-index"
TPL_MOKOONYX_CSS_VARS_PROGRESS_LABEL="Progress Bar"
TPL_MOKOONYX_CSS_VARS_PROGRESS_DESC="<strong>Colours</strong><br><code>--progress-bg</code> — Track background<br><code>--progress-bar-color</code> — Bar text colour<br><code>--progress-bar-bg</code> — Bar fill colour<br><code>--progress-box-shadow</code> — Track shadow<br><br><strong>Dimensions</strong><br><code>--progress-height</code> — Track height<br><code>--progress-border-radius</code> — Track border radius<br><br><strong>Typography</strong><br><code>--progress-font-size</code> — Label font size<br><br><strong>Animation</strong><br><code>--progress-bar-transition</code> — Bar width transition"
TPL_MOKOONYX_CSS_VARS_SPINNER_LABEL="Spinner"
TPL_MOKOONYX_CSS_VARS_SPINNER_DESC="<strong>Dimensions</strong><br><code>--spinner-width</code> — Spinner width<br><code>--spinner-height</code> — Spinner height<br><code>--spinner-vertical-align</code> — Inline vertical alignment<br><code>--spinner-border-width</code> — Border-style spinner track width<br><br><strong>Animation</strong><br><code>--spinner-animation-speed</code> — Rotation duration"
TPL_MOKOONYX_CSS_VARS_TABLE_LABEL="Table"
TPL_MOKOONYX_CSS_VARS_TABLE_DESC="<strong>Colours</strong><br><code>--table-color</code> — Default cell text colour<br><code>--table-bg</code> — Default cell background<br><code>--table-border-color</code> — Border colour<br><code>--table-accent-bg</code> — Accent row background (used by variants)<br><code>--table-striped-color</code> — Striped row text colour<br><code>--table-striped-bg</code> — Striped row background<br><code>--table-active-color</code> — Hovered/active row text colour<br><code>--table-active-bg</code> — Hovered/active row background"
TPL_MOKOONYX_CSS_VARS_TOAST_LABEL="Toast"
TPL_MOKOONYX_CSS_VARS_TOAST_DESC="<strong>Colours</strong><br><code>--toast-color</code> — Body text colour<br><code>--toast-bg</code> — Body background<br><code>--toast-border-color</code> — Border colour<br><code>--toast-box-shadow</code> — Toast shadow<br><code>--toast-header-color</code> — Header text colour<br><code>--toast-header-bg</code> — Header background<br><code>--toast-header-border-color</code> — Header border colour<br><br><strong>Dimensions</strong><br><code>--toast-max-width</code> — Maximum width<br><code>--toast-padding-x</code> / <code>--toast-padding-y</code> — Body padding<br><code>--toast-spacing</code> — Gap between stacked toasts<br><code>--toast-border-width</code> — Border width<br><code>--toast-border-radius</code> — Border radius<br><br><strong>Typography</strong><br><code>--toast-font-size</code> — Font size<br><br><strong>Stacking</strong><br><code>--toast-zindex</code> — z-index"
TPL_MOKOONYX_CSS_VARS_TOOLTIP_LABEL="Tooltip"
TPL_MOKOONYX_CSS_VARS_TOOLTIP_DESC="<strong>Colours</strong><br><code>--tooltip-color</code> — Text colour<br><code>--tooltip-bg</code> — Background<br><code>--tooltip-opacity</code> — Overall opacity<br><br><strong>Dimensions</strong><br><code>--tooltip-max-width</code> — Maximum width<br><code>--tooltip-padding-x</code> / <code>--tooltip-padding-y</code> — Inner padding<br><code>--tooltip-margin</code> — Offset from target<br><code>--tooltip-border-radius</code> — Border radius<br><code>--tooltip-arrow-width</code> / <code>--tooltip-arrow-height</code> — Arrow dimensions<br><br><strong>Typography</strong><br><code>--tooltip-font-size</code> — Font size<br><br><strong>Stacking</strong><br><code>--tooltip-zindex</code> — z-index"
TPL_MOKOONYX_CSS_VARS_COMPONENTS_LABEL="Component &amp; Plugin Colours"
TPL_MOKOONYX_CSS_VARS_COMPONENTS_DESC="<strong>Misc components</strong><br><code>--mod-finder-link-hover</code> — Smart Search hover background<br><code>--form-legend-color</code> — Form legend text colour<br><code>--border-gray</code> — General gray border<br><code>--subhead-color</code> — Subheading colour<br><code>--item-list-color</code> — Item list background<br><code>--notification-badge-bg</code> — Notification badge<br><br><strong>Table of Contents (TOC)</strong><br><code>--toc-link-color</code> — TOC link colour<br><code>--toc-link-active-color</code> — Active TOC link<br><br><strong>Choices.js select</strong><br><code>--choices-inner-bg</code> — Inner background<br><code>--choices-dropdown-bg</code> — Dropdown background<br><code>--choices-item-bg</code> — Tag item background<br><code>--choices-item-hover-bg</code> — Tag hover<br><code>--choices-disabled-bg</code> — Disabled state<br><code>--choices-focused-border</code> — Focused border<br><br><strong>Tab buttons (taba)</strong><br><code>--taba-btn-green</code>, <code>--taba-btn-blue</code>, <code>--taba-btn-red</code>, <code>--taba-btn-gray</code>"
TPL_MOKOONYX_CSS_VARS_OFFCANVAS_LABEL="Offcanvas Panel"
TPL_MOKOONYX_CSS_VARS_OFFCANVAS_DESC="<strong>Dimensions</strong><br><code>--offcanvas-width</code> — Panel width (default: <code>400px</code>)<br><code>--offcanvas-height</code> — Panel height for top/bottom variants (default: <code>30vh</code>)<br><code>--offcanvas-padding-x</code> / <code>--offcanvas-padding-y</code> — Inner padding<br><br><strong>Colours</strong><br><code>--offcanvas-bg</code> — Panel background (default: <code>var(--body-bg)</code>)<br><code>--offcanvas-color</code> — Panel text colour (default: <code>var(--body-color)</code>)<br><code>--offcanvas-border-width</code> / <code>--offcanvas-border-color</code> — Panel border<br><code>--offcanvas-box-shadow</code> — Drop shadow<br><br><strong>Stacking</strong><br><code>--offcanvas-zindex</code> — z-index (default: <code>1045</code>)"
TPL_MOKOONYX_CSS_VARS_VM_LABEL="VirtueMart"
TPL_MOKOONYX_CSS_VARS_VM_DESC="<strong>Surfaces &amp; text</strong><br><code>--vm-surface</code> / <code>--vm-surface-2</code> — Card/panel backgrounds<br><code>--vm-text</code> / <code>--vm-text-strong</code> / <code>--vm-text-muted</code> — Text variants<br><code>--vm-border</code> — Border colour<br><code>--vm-price-color</code> — Price text colour<br><br><strong>Layout &amp; density</strong><br><code>--vm-container-max-width</code> — Max content width (default: <code>1200px</code>)<br><code>--vm-section-gap</code> — Section spacing (default: <code>2rem</code>)<br><code>--vm-block-radius</code> / <code>--vm-block-shadow</code> — Block appearance<br><br><strong>Typography</strong><br><code>--vm-category-title-size</code> — Category heading size<br><code>--vm-product-title-size</code> — Product title size<br><code>--vm-price-size</code> — Price size<br><br><strong>Buttons</strong><br><code>--vm-btn-primary-bg</code> / <code>--vm-btn-primary-text</code> — Primary button<br><code>--vm-btn-secondary-bg</code> / <code>--vm-btn-secondary-text</code> — Secondary button<br><br><strong>Image overlay controls</strong><br><code>--vm-image-overlay-btn-bg</code> / <code>--vm-image-overlay-btn-color</code> — Overlay button appearance"
TPL_MOKOONYX_CSS_VARS_GABLE_LABEL="Gable"
TPL_MOKOONYX_CSS_VARS_GABLE_DESC="Colour tokens used by the Gable extension.<br><code>--gab-blue</code> — <code>#0066cc</code><br><code>--gab-green</code> — <code>#28a745</code><br><code>--gab-red</code> — <code>#dc3545</code><br><code>--gab-orange</code> — <code>#fd7e14</code><br><code>--gab-gray1</code> — <code>#495057</code><br><code>--gab-gray2</code> — <code>#6c757d</code><br><code>--gab-gray3</code> — <code>#adb5bd</code>"
TPL_MOKOONYX_CSS_VARS_FOOTER_LABEL="Footer"
TPL_MOKOONYX_CSS_VARS_FOOTER_DESC="<strong>Spacing</strong><br><code>--footer-padding-top</code> — Top padding (default: <code>1rem</code>)<br><code>--footer-padding-bottom</code> — Bottom padding (default: <code>80px</code>)<br><code>--footer-grid-padding-y</code> — Grid vertical padding (default: <code>2.5rem</code>)<br><code>--footer-grid-padding-x</code> — Grid horizontal padding (default: <code>0.5em</code>)"
; ===== Theme Preview tab =====
TPL_MOKOONYX_THEME_PREVIEW_FIELDSET_LABEL="Theme Preview"
TPL_MOKOONYX_THEME_PREVIEW_INTRO="<p>Live preview of all CSS variables, hero variants, block colours, and Bootstrap components rendered with your active theme. Use the <strong>Toggle Light / Dark</strong> button inside the preview to switch modes. This page is also available as a standalone file at <code>templates/mokoonyx/templates/theme-test.html</code>.</p>"
TPL_MOKOONYX_THEME_PREVIEW_FRAME="<iframe src='../templates/mokoonyx/templates/theme-test.html' style='width:100%;height:80vh;border:1px solid #dee2e6;border-radius:.375rem;' loading='lazy' title='Theme test sheet preview'></iframe>"
; ===== Misc =====
MOD_BREADCRUMBS_HERE="YOU ARE HERE:"
JGLOBAL_OFFLINE="Offline"

31
src/language/en-GB/tpl_mokoonyx.sys.ini Normal file
View File

@@ -0,0 +1,31 @@
; Copyright (C) 2025 Moko Consulting <hello@mokoconsulting.tech>
;
; This file is part of a Moko Consulting project.
;
; SPDX-License-Identifier: GPL-3.0-or-later
;
TPL_MOKOONYX="MokoOnyx Site template"
TPL_MOKOONYX_GOOGLE_FIELDSET_LABEL="Google"
TPL_MOKOONYX_DRAWERS_FIELDSET_LABEL="Drawers"
TPL_MOKOONYX_MOD_MENU_LAYOUT_COLLAPSE_METISMENU="Collapsible Dropdown"
TPL_MOKOONYX_MOD_MENU_LAYOUT_DROPDOWN_METISMENU="Dropdown"
TPL_MOKOONYX_POSITION_BANNER="Banner"
TPL_MOKOONYX_POSITION_BELOW_TOP="Below Topbar"
TPL_MOKOONYX_POSITION_BRAND_ASIDE="Brand Aside"
TPL_MOKOONYX_POSITION_BOTTOM_A="Bottom-A"
TPL_MOKOONYX_POSITION_BOTTOM_B="Bottom-B"
TPL_MOKOONYX_POSITION_BREADCRUMBS="Breadcrumbs"
TPL_MOKOONYX_POSITION_DEBUG="Debug"
TPL_MOKOONYX_POSITION_FOOTER="Footer"
TPL_MOKOONYX_POSITION_MAIN_BOTTOM="Main-bottom"
TPL_MOKOONYX_POSITION_MAIN_TOP="Main-top"
TPL_MOKOONYX_POSITION_MENU="Menu"
TPL_MOKOONYX_POSITION_SEARCH="Search"
TPL_MOKOONYX_POSITION_SIDEBAR_LEFT="Sidebar-left"
TPL_MOKOONYX_POSITION_SIDEBAR_RIGHT="Sidebar-right"
TPL_MOKOONYX_POSITION_TOP_A="Top-a"
TPL_MOKOONYX_POSITION_TOP_B="Top-b"
TPL_MOKOONYX_POSITION_TOPBAR="Top Bar"
TPL_MOKOONYX_POSITION_DRAWER_LEFT="Drawer-Left"
TPL_MOKOONYX_POSITION_DRAWER_RIGHT="Drawer-Right"
TPL_MOKOONYX_XML_DESCRIPTION="<h3>MokoOnyx Template Description</h3> <p> <strong>MokoOnyx</strong> continues Joomla’s tradition of space-themed default templates— building on the legacy of <em>Solarflare</em> (Joomla 1.0), <em>Milkyway</em> (Joomla 1.5), and <em>Protostar</em> (Joomla 3.0). </p> <p> This template is a customized fork of the <strong>Cassiopeia</strong> template introduced in Joomla 4, preserving its modern, accessible, and mobile-first foundation while introducing new stylistic enhancements and structural refinements specifically tailored for use by Moko Consulting. </p> <h4>Custom Colour Themes</h4> <p> Starter palette files are included with the template. To create a custom colour scheme, copy <code>templates/mokoonyx/templates/light.custom.css</code> to <code>media/templates/site/mokoonyx/css/theme/light.custom.css</code>, or <code>templates/mokoonyx/templates/dark.custom.css</code> to <code>media/templates/site/mokoonyx/css/theme/dark.custom.css</code>. Customise the CSS variables to match your brand, then activate your palette in <em>System → Site Templates → MokoOnyx → Theme tab</em> by selecting "Custom" for the Light or Dark Mode Palette. A full variable reference is available in the <em>CSS Variables</em> tab in template options. </p> <h4>Custom CSS &amp; JavaScript</h4> <p> For site-specific styles and scripts that should survive template updates, create the following files: </p> <ul> <li><code>media/templates/site/mokoonyx/css/user.css</code> — loaded on every page for custom CSS overrides.</li> <li><code>media/templates/site/mokoonyx/js/user.js</code> — loaded on every page for custom JavaScript.</li> </ul> <p> These files are gitignored and will not be overwritten by template updates. </p> <h4>Code Attribution</h4> <p> This template is based on the original <strong>Cassiopeia</strong> template developed by the <a href=\"https://www.joomla.org\" target=\"_blank\" rel=\"noopener\">Joomla! Project</a> and released under the GNU General Public License. </p> <p> Modifications and enhancements have been made by Moko Consulting in accordance with open-source licensing standards. </p> <p> It includes integration with <a href=\"https://afeld.github.io/bootstrap-toc/\" target=\"_blank\" rel=\"noopener\">Bootstrap TOC</a>, an open-source table of contents generator by A. Feld, licensed under the MIT License. </p> <p> All third-party libraries and assets remain the property of their respective authors and are credited within their source files where applicable. </p>"

76
src/language/en-US/index.html Normal file
View File

@@ -0,0 +1,76 @@
<!-- Copyright (C) 2025 Moko Consulting <hello@mokoconsulting.tech>
This file is part of a Moko Consulting project.
SPDX-License-Identifier: GPL-3.0-or-later
-->
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Redirecting…</title>
<!-- Search engines: do not index this placeholder redirect page -->
<meta name="robots" content="noindex, nofollow, noarchive" />
<!-- Instant redirect fallback even if JavaScript is disabled -->
<meta http-equiv="refresh" content="0; url=/" />
<!-- Canonical root reference -->
<link rel="canonical" href="/" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script>
(function redirectToRoot() {
// Configuration object with safe defaults.
var opts = {
fallbackPath: "/", // string: fallback destination if origin is unavailable
delayMs: 0, // number: delay before redirect in ms (0 = immediate)
behavior: "replace" // enum: "replace" | "assign"
};
// Determine absolute origin in all mainstream browsers.
var origin = (typeof location.origin === "string" && location.origin)
|| (location.protocol + "//" + location.host);
// Final destination: absolute root of the current site, or fallback path.
var destination = origin ? origin + "/" : opts.fallbackPath;
function go() {
if (opts.behavior === "assign") {
location.assign(destination);
} else {
location.replace(destination);
}
}
// Execute redirect, optionally after a short delay.
if (opts.delayMs > 0) {
setTimeout(go, opts.delayMs);
} else {
go();
}
})();
</script>
<!--
Secondary meta-refresh for no-JS environments is already set above.
Some very old crawlers may ignore JS; the meta refresh ensures coverage.
-->
<noscript>
<!-- Extra defense-in-depth: if JS is disabled, meta refresh (above) handles redirect. -->
<style>
html, body { height:100%; }
body { display:flex; align-items:center; justify-content:center; margin:0; font: 16px/1.4 system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
.msg { opacity: .75; text-align: center; }
</style>
</noscript>
</head>
<body>
<div class="msg">Redirecting to the site root… If you are not redirected, <a href="/">click here</a>.</div>
</body>
</html>

273
src/language/en-US/tpl_mokoonyx.ini Normal file
View File

@@ -0,0 +1,273 @@
; Copyright (C) 2025 Moko Consulting <hello@mokoconsulting.tech>
;
; This file is part of a Moko Consulting project.
;
; SPDX-License-Identifier: GPL-3.0-or-later
; ===== System / layout =====
TPL_MOKOONYX_DEVELOPMENTMODE_LABEL="Development Mode"
TPL_MOKOONYX_DEVELOPMENTMODE_DESC="When enabled, unminified CSS and JavaScript files are loaded for easier debugging. When disabled, minified assets are served for faster page loads. Google Tag Manager and Google Analytics may also be disabled in development mode."
TPL_MOKOONYX_FLUID_LABEL="Layout"
TPL_MOKOONYX_STATIC="Static"
TPL_MOKOONYX_FLUID="Fluid"
; ===== Custom Code tab =====
TPL_MOKOONYX_CUSTOM_CODE_FIELDSET="Custom Code"
TPL_MOKOONYX_CUSTOM_HEAD_START_LABEL="Custom Head: Start"
TPL_MOKOONYX_CUSTOM_HEAD_START_DESC="This content will be inserted at the beginning of the &lt;head&gt; tag"
TPL_MOKOONYX_CUSTOM_HEAD_END_LABEL="Custom Head: End"
TPL_MOKOONYX_CUSTOM_HEAD_END_DESC="This content will be inserted at the end of the &lt;head&gt; tag"
TPL_MOKOONYX_OFFLINEEMBED_LABEL="Offline Page Embed Code"
TPL_MOKOONYX_OFFLINEEMBED_DESC="In addition to the 'Offline message' defined in 'Global Configuration', this will be displayed on the offline page.<i>Use for Mailchimp code and Social Icons</i>"
; ===== Drawers =====
TPL_MOKOONYX_DRAWERS_FIELDSET_LABEL="Drawers"
TPL_MOKOONYX_DRAWER_LEFT_ICON_LABEL="Drawer Left Icon CSS"
TPL_MOKOONYX_DRAWER_LEFT_ICON_DESC="Enter the Font-Awesome class for the left drawer toggle (e.g. 'fas fa-chevron-left')."
TPL_MOKOONYX_DRAWER_RIGHT_ICON_LABEL="Drawer Right Icon CSS"
TPL_MOKOONYX_DRAWER_RIGHT_ICON_DESC="Enter the Font-Awesome class for the right drawer toggle (e.g. 'fas fa-chevron-right')."
; ===== Favicon =====
TPL_MOKOONYX_FAVICON_FIELDSET_LABEL="Favicon"
TPL_MOKOONYX_FAVICON_NOTE="<p>Upload a square <strong>PNG image</strong> (recommended 512×512 or larger). The template will automatically generate all required favicon sizes including ICO, Apple Touch Icon (180×180), and Android icons (192×192, 512×512). Generated files are cached in <code>images/favicons/</code>.</p>"
TPL_MOKOONYX_FAVICON_SOURCE_LABEL="Favicon Source Image"
TPL_MOKOONYX_FAVICON_SOURCE_DESC="Select a square PNG image to use as the site favicon. Recommended size: 512×512 pixels or larger."
; ===== Google =====
TPL_MOKOONYX_GOOGLE_FIELDSET_LABEL="Google"
TPL_MOKOONYX_GOOGLE_NOTE_TEXT="<h3>PLEASE NOTE:</h3>If fields are left blank, relative Google features will not be used"
TPL_MOKOONYX_GOOGLETAGMANAGER_LABEL="Use Google Tag Manager?"
TPL_MOKOONYX_GOOGLETAGMANAGER_DESC="Do you want to use Google Tag Manager?<br>More information on Google Tag Manager can be found <a target='_blank' href='https://support.google.com/tagmanager/answer/14842164'>here.</a>"
TPL_MOKOONYX_GOOGLETAGMANAGERID_LABEL="Google Tag Manager ID"
TPL_MOKOONYX_GOOGLETAGMANAGERID_DESC="Begins with 'GTM-'"
TPL_MOKOONYX_GOOGLEANALYTICS_LABEL="Use Google Analytics?"
TPL_MOKOONYX_GOOGLEANALYTICS_DESC="Do you want to use Google Analytics?<br>More information on Google Analytics can be found <a target='_blank' href='https://developers.google.com/analytics'>here.</a>"
TPL_MOKOONYX_GOOGLEANALYTICSID_LABEL="Google Analytics ID"
TPL_MOKOONYX_GOOGLEANALYTICSID_DESC="Begins with 'G-'"
TPL_MOKOONYX_GOOGLESITEKEY_LABEL="Google Search Console Verification"
TPL_MOKOONYX_GOOGLESITEKEY_DESC="Paste the content value from the &lt;meta name=&quot;google-site-verification&quot;&gt; tag. Find this in Google Search Console under Ownership Verification &rarr; HTML tag method."
; ===== Branding & icons (Theme tab) =====
TPL_MOKOONYX_BRAND_LABEL="Brand"
TPL_MOKOONYX_LOGO_LABEL="Logo"
TPL_MOKOONYX_TITLE="Title (alternative to logo)"
TPL_MOKOONYX_TAGLINE_LABEL="Tagline"
TPL_MOKOONYX_TAGLINE_DESC="Optional text to show as a subheading"
TPL_MOKOONYX_FA7KITCODE_LABEL="Font Awesome 7 Kit Unique Code"
TPL_MOKOONYX_FA7KITCODE_DESC="<i>If left blank, Font Awesome 7 Free will be used.</i><br>Copy the unique Kit embed code above and paste it into the &lt;head&gt; of your project's HTML file or template.<br><a href='https://fontawesome.com/' target='_blank'>More information at the Font Awesome website.</a>"
; ===== Typography (Theme tab) =====
TPL_MOKOONYX_FONT_LABEL="Fonts Scheme"
TPL_MOKOONYX_FONT_LABEL_DESC="Select a font scheme for your site. Local fonts are loaded from the template folder, while web fonts are loaded from external sources (Google Fonts). The default is Roboto (local). See the note below for important privacy and performance considerations."
TPL_MOKOONYX_FONT_GROUP_LOCAL="Fonts from Folder"
TPL_MOKOONYX_FONT_GROUP_WEB="Fonts from Web"
TPL_MOKOONYX_FONT_NOTE_TEXT="Loading fonts from external sources might be against privacy regulations in some countries.<br>Loading fonts from a local folder might have a performance impact on your site."
; ===== Header & navigation (Theme tab) =====
TPL_MOKOONYX_STICKY_LABEL="Sticky Header"
TPL_MOKOONYX_BACKTOTOP="Back to Top"
TPL_MOKOONYX_TOC_TITLE="Table of Contents"
TPL_MOKOONYX_BACKTOTOP_LABEL="Back-to-top Link"
TPL_MOKOONYX_TOC="Table of Contents"
; ===== Color palette choices (shared) =====
TPL_MOKOONYX_COLOR_NAME_STANDARD="Standard"
TPL_MOKOONYX_COLOR_NAME_CUSTOM="Custom"
; New labels for Theme tab dropdowns
TPL_MOKOONYX_COLOR_LIGHT_NAME_LABEL="Light color palette"
TPL_MOKOONYX_COLOR_LIGHT_NAME_DESC="Select a color palette for light mode. <strong>Standard</strong> uses the default blue theme with comprehensive styling for all components. <strong>Custom</strong> loads <code>media/templates/site/mokoonyx/css/theme/light.custom.css</code> — copy the starter file from <code>templates/mokoonyx/templates/light.custom.css</code> and customize the CSS variables to match your brand. This file is stored in the media folder and will not be overwritten by template updates."
TPL_MOKOONYX_COLOR_DARK_NAME_LABEL="Dark color palette"
TPL_MOKOONYX_COLOR_DARK_NAME_DESC="Select a color palette for dark mode. <strong>Standard</strong> uses the default blue theme optimized for dark backgrounds with proper contrast. <strong>Custom</strong> loads <code>media/templates/site/mokoonyx/css/theme/dark.custom.css</code> — copy the starter file from <code>templates/mokoonyx/templates/dark.custom.css</code> and customize the CSS variables to match your brand. This file is stored in the media folder and will not be overwritten by template updates."
; ===== Theme tab (core feature strings) =====
TPL_MOKO_THEME_FIELDSET="Theme"
TPL_MOKO_THEME_SECTION_GENERAL="General"
TPL_MOKO_THEME_SECTION_VARS="Variables & Palettes"
TPL_MOKO_THEME_SECTION_TYPO="Typography"
TPL_MOKO_THEME_SECTION_BRAND="Branding & Icons"
TPL_MOKO_THEME_SECTION_HEADER="Header & Navigation"
TPL_MOKO_THEME_SECTION_TOGGLE="Theme Toggle UI"
TPL_MOKO_THEME_ENABLED="Enable theme feature"
TPL_MOKO_THEME_ENABLED_DESC="Turn the entire light/dark feature on or off."
TPL_MOKO_THEME_CONTROL_TYPE="Theme Control Type"
TPL_MOKO_THEME_CONTROL_TYPE_DESC="Choose a visible toggle (Switch or Radios), or no control to follow System only."
TPL_MOKO_THEME_DEFAULT_CHOICE="Default Choice"
TPL_MOKO_THEME_DEFAULT_CHOICE_DESC="Initial theme when no user preference is stored."
TPL_MOKO_THEME_AUTO_DARK="Auto Dark Mode"
TPL_MOKO_THEME_AUTO_DARK_DESC="Force the site to switch to dark mode automatically. When enabled, the template will override the default and use dark unless the user explicitly selects otherwise."
TPL_MOKO_THEME_META_COLOR_SCHEME="Add &lt;meta name=&quot;color-scheme&quot;&gt;"
TPL_MOKO_THEME_META_COLOR_SCHEME_DESC="Advertise light/dark support for UA controls."
TPL_MOKO_THEME_META_THEME_COLOR="Add &lt;meta name=&quot;theme-color&quot;&gt;"
TPL_MOKO_THEME_META_THEME_COLOR_DESC="Update mobile address bar color."
TPL_MOKO_THEME_BASE_CSS="Base template CSS"
TPL_MOKO_THEME_BASE_CSS_DESC="Main stylesheet that consumes variables."
TPL_MOKO_THEME_BRIDGE="Sync data-bs-theme with data-aria-theme"
TPL_MOKO_THEME_BRIDGE_DESC="Keep both attributes in lockstep so Bootstrap and custom CSS stay aligned."
TPL_MOKO_THEME_FAB_ENABLED="Show floating theme switch"
TPL_MOKO_THEME_FAB_ENABLED_DESC="Display a persistent, accessible theme toggle."
TPL_MOKO_THEME_FAB_POS="Floating switch position"
TPL_MOKO_THEME_FAB_POS_DESC="Screen corner for the toggle."
; ===== Accessibility toolbar =====
TPL_MOKO_A11Y_TOOLBAR_ENABLED="Accessibility toolbar"
TPL_MOKO_A11Y_TOOLBAR_ENABLED_DESC="Show a floating accessibility toolbar with text resize and color inversion controls."
TPL_MOKO_A11Y_TEXT_RESIZE="Text resize"
TPL_MOKO_A11Y_TEXT_RESIZE_DESC="Allow visitors to increase or decrease text size."
TPL_MOKO_A11Y_COLOR_INVERSION="Color inversion"
TPL_MOKO_A11Y_COLOR_INVERSION_DESC="Allow visitors to invert page colors for improved readability."
TPL_MOKO_A11Y_TOOLBAR_POS="Toolbar position"
TPL_MOKO_A11Y_TOOLBAR_POS_DESC="Screen corner for the accessibility toolbar."
TPL_MOKO_A11Y_BTN_LABEL="Accessibility options"
TPL_MOKO_A11Y_TEXT_DECREASE="Decrease text size"
TPL_MOKO_A11Y_TEXT_RESET="Reset text size"
TPL_MOKO_A11Y_TEXT_INCREASE="Increase text size"
TPL_MOKO_A11Y_INVERT_COLORS="Invert colors"
TPL_MOKO_A11Y_HIGH_CONTRAST="High contrast"
TPL_MOKO_A11Y_HIGH_CONTRAST_DESC="Allow visitors to boost page contrast for improved readability."
TPL_MOKO_A11Y_HIGHLIGHT_LINKS="Highlight links"
TPL_MOKO_A11Y_HIGHLIGHT_LINKS_DESC="Allow visitors to outline all links so they stand out from surrounding text."
TPL_MOKO_A11Y_READABLE_FONT="Readable font"
TPL_MOKO_A11Y_READABLE_FONT_DESC="Allow visitors to switch to a clean system font optimized for readability."
TPL_MOKO_A11Y_PAUSE_ANIMATIONS="Pause animations"
TPL_MOKO_A11Y_PAUSE_ANIMATIONS_DESC="Allow visitors to stop all CSS animations and transitions."
; ===== CSS Variables tab =====
TPL_MOKOONYX_CSS_VARS_FIELDSET_LABEL="CSS Variables"
TPL_MOKOONYX_CSS_VARS_INTRO="<p>All colors, spacing and layout values are driven by CSS custom properties. To override any variable without editing the template, add your overrides to <code>media/templates/site/mokoonyx/css/user.css</code>, or create a custom palette file (see the Theme tab). Variables are scoped to <code>:root[data-bs-theme=&quot;light&quot;]</code> or <code>:root[data-bs-theme=&quot;dark&quot;]</code> so light and dark values are independent.</p>"
TPL_MOKOONYX_CSS_VARS_BRAND_LABEL="Brand &amp; Theme Colors"
TPL_MOKOONYX_CSS_VARS_BRAND_DESC="<code>--color-primary</code> — Primary brand color (default: <code>#112855</code>)<br><code>--accent-color-primary</code> — Primary accent (default: <code>#3f8ff0</code>)<br><code>--accent-color-secondary</code> — Secondary accent"
TPL_MOKOONYX_CSS_VARS_LINKS_LABEL="Links &amp; Link Utilities"
TPL_MOKOONYX_CSS_VARS_LINKS_DESC="<strong>Core link tokens</strong><br><code>--color-link</code> — Base link color<br><code>--color-hover</code> — Base hover color<br><code>--link-color</code> / <code>--link-hover-color</code> — Bootstrap link colors<br><code>--link-decoration</code> — Default text-decoration<br><code>--link-active-color</code> — Active state<br><br><strong>Semantic link utilities</strong> (replace <code>{color}</code> with <code>primary</code>, <code>secondary</code>, <code>success</code>, <code>info</code>, <code>warning</code>, <code>danger</code>, <code>light</code>, <code>dark</code>)<br><code>--link-{color}-color</code> — Color for <code>.link-{color}</code><br><code>--link-{color}-hover-color</code> — Hover color"
TPL_MOKOONYX_CSS_VARS_TYPO_LABEL="Typography &amp; Body"
TPL_MOKOONYX_CSS_VARS_TYPO_DESC="<code>--body-color</code> — Default text color (default: <code>#22262a</code>)<br><code>--body-bg</code> — Page background (default: <code>#fff</code>)<br><code>--body-font-family</code> — Font stack<br><code>--body-font-size</code> — Base size (default: <code>1rem</code>)<br><code>--body-font-weight</code> — Base weight (default: <code>400</code>)<br><code>--body-line-height</code> — Line height (default: <code>1.5</code>)<br><code>--heading-color</code> — Heading color (default: <code>inherit</code>)<br><code>--muted-color</code> — Muted/secondary text (default: <code>#6d757e</code>)<br><code>--code-color</code> — Inline code color<br><code>--emphasis-color</code> — Strong emphasis color<br><code>--secondary-color</code> / <code>--tertiary-color</code> — Stepped text opacities<br><code>--highlight-color</code> / <code>--highlight-bg</code> — <code>&lt;mark&gt;</code> colors<br><code>--font-sans-serif</code> / <code>--font-monospace</code> — Font stacks"
TPL_MOKOONYX_CSS_VARS_NAV_LABEL="Navigation, Navbar &amp; Offcanvas"
TPL_MOKOONYX_CSS_VARS_NAV_DESC="<strong>Theme nav</strong><br><code>--nav-bg-color</code> — Navbar background<br><code>--nav-text-color</code> — Navbar text<br><code>--mainmenu-nav-link-color</code> — Active nav link<br><br><strong>Navbar tokens</strong><br><code>--navbar-padding-x</code> / <code>--navbar-padding-y</code> — Navbar padding<br><code>--navbar-brand-font-size</code> — Brand font size<br><code>--navbar-toggler-border-color</code> — Mobile toggler border<br><code>--nav-link-padding-x</code> / <code>--nav-link-padding-y</code> — Link padding<br><code>--nav-link-font-weight</code> — Link weight<br><code>--nav-link-disabled-color</code> — Disabled link color<br><br><strong>Offcanvas</strong><br><code>--offcanvas-color</code> — Offcanvas text color<br><code>--offcanvas-padding-x</code> / <code>--offcanvas-padding-y</code> — Offcanvas padding"
TPL_MOKOONYX_CSS_VARS_LAYOUT_LABEL="Layout &amp; Spacing"
TPL_MOKOONYX_CSS_VARS_LAYOUT_DESC="<code>--padding-x</code> / <code>--padding-y</code> — Default component padding<br><code>--nav-toggle-size</code> — Mobile nav toggle button size (default: <code>3rem</code>)<br><code>--secondary-bg</code> — Secondary surface background (default: <code>#eaedf0</code>)<br><code>--tertiary-bg</code> — Tertiary surface background (default: <code>#f9fafb</code>)<br><code>--hr-color</code> — Horizontal rule color<br><code>--border-color-soft</code> — Soft border variant<br><code>--kbd-bg</code> / <code>--kbd-ink</code> — Keyboard element colors<br><code>--toc-bg</code> / <code>--toc-ink</code> — Table of contents colors<br><code>--selection-bg</code> / <code>--selection-ink</code> — Text selection colors<br><code>--gradient</code> — Bootstrap gradient overlay value<br><code>--bg-opacity</code> — Background opacity utility base"
TPL_MOKOONYX_CSS_VARS_BP_LABEL="Breakpoints"
TPL_MOKOONYX_CSS_VARS_BP_DESC="Read-only reference values matching Bootstrap breakpoints.<br><code>--bp-xs</code> — <code>0</code><br><code>--bp-sm</code> — <code>576px</code><br><code>--bp-md</code> — <code>768px</code><br><code>--bp-lg</code> — <code>992px</code><br><code>--bp-xl</code> — <code>1200px</code>"
TPL_MOKOONYX_CSS_VARS_BS_LABEL="Bootstrap Semantic Palette"
TPL_MOKOONYX_CSS_VARS_BS_DESC="These map to Bootstrap components (buttons, alerts, badges). Override to retheme all components at once.<br><code>--primary</code> — <code>#010156</code><br><code>--secondary</code> — <code>#6d757e</code><br><code>--success</code> — <code>#448344</code><br><code>--info</code> — <code>#30638d</code><br><code>--warning</code> — <code>#ad6200</code><br><code>--danger</code> — <code>#a51f18</code><br><code>--light</code> — <code>#f9fafb</code><br><code>--dark</code> — <code>#353b41</code><br>Each color also has an <code>--{color}-rgb</code> variant for use in <code>rgba()</code> expressions."
TPL_MOKOONYX_CSS_VARS_BS_STATES_LABEL="Bootstrap State Colors"
TPL_MOKOONYX_CSS_VARS_BS_STATES_DESC="Contextual state tokens used by alerts, badges and list groups. Replace <code>{color}</code> with <code>primary</code>, <code>secondary</code>, <code>success</code>, <code>info</code>, <code>warning</code>, <code>danger</code>, <code>light</code>, or <code>dark</code>.<br><code>--{color}-text-emphasis</code> — High-contrast text on subtle backgrounds<br><code>--{color}-bg-subtle</code> — Tinted component background<br><code>--{color}-border-subtle</code> — Tinted component border"
TPL_MOKOONYX_CSS_VARS_ALERT_LIST_LABEL="Alert &amp; List Group Colors"
TPL_MOKOONYX_CSS_VARS_ALERT_LIST_DESC="<strong>Alert link colors</strong> — override to adjust link contrast inside <code>.alert-{color}</code> components.<br><code>--alert-{color}-link-color</code> — e.g. <code>--alert-primary-link-color</code><br><br><strong>List group item colors</strong> — contextual surfaces for <code>.list-group-item-{color}</code>.<br><code>--list-group-item-{color}-color</code> — Text color<br><code>--list-group-item-{color}-bg</code> — Background<br><code>--list-group-item-{color}-active-bg</code> — Active state background"
TPL_MOKOONYX_CSS_VARS_COLORS_LABEL="Standard Colors, Grays &amp; Opacity"
TPL_MOKOONYX_CSS_VARS_COLORS_DESC="<strong>Named colors</strong><br><code>--blue</code>, <code>--indigo</code>, <code>--purple</code>, <code>--pink</code>, <code>--red</code>, <code>--orange</code>, <code>--yellow</code>, <code>--green</code>, <code>--teal</code>, <code>--cyan</code>, <code>--black</code>, <code>--white</code><br><br><strong>Gray scale</strong><br><code>--gray-100</code> through <code>--gray-900</code> plus <code>--white-rgb</code> and <code>--black-rgb</code><br><br><strong>Opacity utilities</strong><br><code>--opacity-0</code>, <code>--opacity-5</code>, <code>--opacity-10</code>, <code>--opacity-15</code>, <code>--opacity-20</code>, <code>--opacity-25</code>, <code>--opacity-30</code>, <code>--opacity-50</code>, <code>--opacity-75</code>, <code>--opacity-100</code>"
TPL_MOKOONYX_CSS_VARS_HERO_LABEL="Hero / Banner Overlay"
TPL_MOKOONYX_CSS_VARS_HERO_DESC="Applied to the <code>.custom-hero</code> / <code>.banner-overlay</code> layout. Set on <code>:root[data-bs-theme]</code> so light and dark values are independent.<br><code>--hero-height</code> — Banner height (default: <code>70vh</code>)<br><code>--hero-color</code> — Base text color<br><code>--hero-bg-repeat</code> — Background repeat (default: <code>no-repeat</code>)<br><code>--hero-bg-attachment</code> — Background attachment (default: <code>fixed</code>)<br><code>--hero-bg-position</code> — Background position (default: <code>top center</code>)<br><code>--hero-bg-size</code> — Background size (default: <code>cover</code>)<br><code>--hero-border-bottom</code> — Bottom border (default: <code>solid var(--accent-color-secondary)</code>)<br><code>--hero-overlay-bg</code> — Overlay tint color (light default: <code>hsla(0,0%,0%,0.1)</code> / dark default: <code>hsla(0,0%,0%,0.3)</code>)<br><code>--hero-overlay-padding</code> — Overlay inner padding (default: <code>1em</code>)<br><code>--hero-overlay-text-align</code> — Overlay text alignment (default: <code>center</code>)<br><code>--hero-overlay-text-color</code> — Overlay text color"
TPL_MOKOONYX_CSS_VARS_HERO_VARIANTS_LABEL="Hero Variants (.hero#primary / .hero#secondary)"
TPL_MOKOONYX_CSS_VARS_HERO_VARIANTS_DESC="Two-variant hero system using <code>.hero#primary</code> and <code>.hero#secondary</code>. Each variant resolves its own CSS variable set per theme.<br><br><strong>Primary variant</strong> — homepage, main landing pages (sky blue tint, softer overlay)<br><code>--hero-primary-bg-color</code> — Fallback background color<br><code>--hero-primary-overlay</code> — Gradient overlay tint<br><code>--hero-primary-color</code> — Text color<br><br><strong>Secondary variant</strong> — inner pages, events, about (navy overlay, lighter text)<br><code>--hero-secondary-bg-color</code> — Fallback background color<br><code>--hero-secondary-overlay</code> — Gradient overlay tint<br><code>--hero-secondary-color</code> — Text color<br><br><strong>HTML usage:</strong><br><code>&lt;div class=&quot;hero&quot; id=&quot;primary&quot; style=&quot;background-image:url(...)&quot;&gt;</code>"
TPL_MOKOONYX_CSS_VARS_BLOCK_COLORS_LABEL="Block Color System (top-a / top-b / bottom-a / bottom-b)"
TPL_MOKOONYX_CSS_VARS_BLOCK_COLORS_DESC="Automatic brand color palette for modules in <code>top-a</code>, <code>top-b</code>, <code>bottom-a</code>, and <code>bottom-b</code> positions. Colors assigned by <code>:nth-child()</code> order — no classes needed.<br><br><strong>Slot palette</strong><br><code>--block-color-1</code> / <code>--block-text-1</code> — 1st module<br><code>--block-color-2</code> / <code>--block-text-2</code> — 2nd module<br><code>--block-color-3</code> / <code>--block-text-3</code> — 3rd module<br><code>--block-color-4</code> / <code>--block-text-4</code> — 4th module<br><br><strong>Named overrides</strong> (add an ID to the module HTML to bypass slot color)<br><code>--block-highlight-bg</code> / <code>--block-highlight-text</code> — for <code>#block-highlight</code><br><code>--block-cta-bg</code> / <code>--block-cta-text</code> — for <code>#block-cta</code><br><code>--block-alert-bg</code> / <code>--block-alert-text</code> — for <code>#block-alert</code><br><br><strong>Priority:</strong> Named ID &gt; Slot color. No <code>!important</code> needed — specificity handles it."
TPL_MOKOONYX_CSS_VARS_HEADER_LABEL="Header Background"
TPL_MOKOONYX_CSS_VARS_HEADER_DESC="Controls the background of the topbar/header area.<br><code>--header-background-image</code> — CSS <code>background-image</code> value (default: built-in SVG pattern)<br><code>--header-background-attachment</code> — <code>fixed</code> or <code>scroll</code><br><code>--header-background-repeat</code> — e.g. <code>repeat</code>, <code>no-repeat</code><br><code>--header-background-size</code> — e.g. <code>auto</code>, <code>cover</code>, <code>contain</code>"
TPL_MOKOONYX_CSS_VARS_CONTAINERS_LABEL="Container Backgrounds"
TPL_MOKOONYX_CSS_VARS_CONTAINERS_DESC="Each layout container has its own background variables. Replace <code>{pos}</code> with: <code>below-topbar</code>, <code>top-a</code>, <code>top-b</code>, <code>sidebar</code>, <code>bottom-a</code>, or <code>bottom-b</code>.<br><br><code>--container-{pos}-bg-image</code> — Background image (default: <code>none</code>)<br><code>--container-{pos}-bg-color</code> — Background color (default: <code>transparent</code>)<br><code>--container-{pos}-bg-position</code> — Background position<br><code>--container-{pos}-bg-attachment</code> — <code>fixed</code> or <code>scroll</code><br><code>--container-{pos}-bg-repeat</code> — Repeat behavior<br><code>--container-{pos}-bg-size</code> — e.g. <code>cover</code>, <code>auto</code><br><code>--container-{pos}-border</code> — Border shorthand<br><code>--container-{pos}-border-radius</code> — Border radius<br><br>Also: <code>--container-toc-bg</code> / <code>--container-toc-color</code> for the TOC sidebar."
TPL_MOKOONYX_CSS_VARS_BORDERS_LABEL="Borders"
TPL_MOKOONYX_CSS_VARS_BORDERS_DESC="<code>--border-width</code> — Default width (default: <code>1px</code>)<br><code>--border-style</code> — Default style (default: <code>solid</code>)<br><code>--border-color</code> — Default border color (default: <code>#dfe3e7</code>)<br><code>--border-color-translucent</code> — Semi-transparent border<br><code>--border-radius</code> — Default radius (default: <code>.25rem</code>)<br><code>--border-radius-sm</code> — Small radius<br><code>--border-radius-lg</code> — Large radius<br><code>--border-radius-xl</code> — Extra large radius<br><code>--border-radius-xxl</code> — 2XL radius (default: <code>2rem</code>)<br><code>--border-radius-pill</code> — Pill radius (default: <code>50rem</code>)"
TPL_MOKOONYX_CSS_VARS_SHADOWS_LABEL="Shadows &amp; Shadow Tokens"
TPL_MOKOONYX_CSS_VARS_SHADOWS_DESC="<strong>Box shadows</strong><br><code>--box-shadow</code> — Standard shadow<br><code>--box-shadow-sm</code> — Subtle shadow<br><code>--box-shadow-lg</code> — Prominent shadow<br><code>--box-shadow-inset</code> — Inset shadow<br><br><strong>Shadow color tokens</strong> — used as building blocks by component shadows<br><code>--shadow-color-light</code> — <code>rgba(black, 0.15)</code><br><code>--shadow-color-medium</code> — <code>rgba(black, 0.25)</code><br><code>--shadow-color-dark</code> — <code>rgba(black, 0.30)</code><br><code>--highlight-translucent</code> — <code>rgba(white, 0.15)</code>"
TPL_MOKOONYX_CSS_VARS_FORMS_LABEL="Focus &amp; Forms"
TPL_MOKOONYX_CSS_VARS_FORMS_DESC="<code>--focus-ring-width</code> — Keyboard focus ring width (default: <code>.25rem</code>)<br><code>--focus-ring-opacity</code> — Focus ring opacity<br><code>--focus-ring-color</code> — Focus ring color<br><code>--input-color</code> — Input text color<br><code>--input-bg</code> — Input background<br><code>--input-border-color</code> — Input border color<br><code>--input-focus-border-color</code> — Focused border color<br><code>--input-focus-box-shadow</code> — Focused input shadow<br><code>--input-placeholder-color</code> — Placeholder text color<br><code>--input-disabled-bg</code> — Disabled input background<br><code>--input-disabled-border-color</code> — Disabled input border<br><code>--form-valid-color</code> / <code>--form-valid-border-color</code> — Valid state<br><code>--form-invalid-color</code> / <code>--form-invalid-border-color</code> — Invalid state"
TPL_MOKOONYX_CSS_VARS_BUTTONS_LABEL="Buttons"
TPL_MOKOONYX_CSS_VARS_BUTTONS_DESC="Applied on <code>:root</code> for global button defaults:<br><code>--btn-border-radius</code> — Button border radius<br><code>--btn-box-shadow</code> — Button box shadow<br><br>Applied on <code>.btn</code> for base button tokens (overridable per variant):<br><code>--btn-padding-x</code> / <code>--btn-padding-y</code> — Padding<br><code>--btn-font-size</code> / <code>--btn-font-weight</code> / <code>--btn-line-height</code> — Typography<br><code>--btn-color</code> / <code>--btn-bg</code> / <code>--btn-border-color</code> — Default state<br><code>--btn-hover-color</code> / <code>--btn-hover-bg</code> / <code>--btn-hover-border-color</code> — Hover state<br><code>--btn-active-color</code> / <code>--btn-active-bg</code> / <code>--btn-active-shadow</code> — Active state<br><code>--btn-disabled-opacity</code> — Disabled opacity<br><br>Each <code>.btn-{color}</code> and <code>.btn-outline-{color}</code> class inherits these tokens and sets its own values."
TPL_MOKOONYX_CSS_VARS_CARDS_LABEL="Cards"
TPL_MOKOONYX_CSS_VARS_CARDS_DESC="<code>--card-spacer-y</code> / <code>--card-spacer-x</code> — Body padding (default: <code>1rem</code>)<br><code>--card-title-spacer-y</code> — Title bottom margin (default: <code>0.5rem</code>)<br><code>--card-border-width</code> — Border width (default: <code>1px</code>)<br><code>--card-border-color</code> — Border color<br><code>--card-border-radius</code> — Border radius<br><code>--card-box-shadow</code> — Card shadow (default: <code>none</code>)<br><code>--card-cap-padding-y</code> / <code>--card-cap-padding-x</code> — Header/footer padding<br><code>--card-cap-bg</code> — Header/footer background<br><code>--card-cap-color</code> — Header/footer text color<br><code>--card-color</code> — Body text color<br><code>--card-bg</code> — Card background"
TPL_MOKOONYX_CSS_VARS_ACCORDION_LABEL="Accordion"
TPL_MOKOONYX_CSS_VARS_ACCORDION_DESC="<strong>Colors</strong><br><code>--accordion-color</code> — Panel text color<br><code>--accordion-bg</code> — Panel background<br><code>--accordion-border-color</code> — Border color<br><code>--accordion-btn-color</code> — Button text color<br><code>--accordion-btn-bg</code> — Button background<br><code>--accordion-btn-focus-border-color</code> — Button focus border color<br><code>--accordion-btn-focus-box-shadow</code> — Button focus ring<br><code>--accordion-active-color</code> — Active item text color<br><code>--accordion-active-bg</code> — Active item background<br><br><strong>Dimensions</strong><br><code>--accordion-border-width</code> — Border width<br><code>--accordion-border-radius</code> — Outer border radius<br><code>--accordion-inner-border-radius</code> — Inner border radius<br><code>--accordion-btn-padding-x</code> / <code>--accordion-btn-padding-y</code> — Button padding<br><code>--accordion-body-padding-x</code> / <code>--accordion-body-padding-y</code> — Body padding<br><br><strong>Icon &amp; Animation</strong><br><code>--accordion-btn-icon</code> — Collapse icon (collapsed state)<br><code>--accordion-btn-icon-width</code> — Icon size<br><code>--accordion-btn-icon-transform</code> — Icon rotation when expanded<br><code>--accordion-btn-icon-transition</code> — Icon rotation transition<br><code>--accordion-btn-active-icon</code> — Icon (expanded state)<br><code>--accordion-transition</code> — Panel open/close transition<br><br><strong>Stacking</strong><br><code>--accordion-zindex</code> — z-index"
TPL_MOKOONYX_CSS_VARS_ALERT_BASE_LABEL="Alert (Base)"
TPL_MOKOONYX_CSS_VARS_ALERT_BASE_DESC="<strong>Colors</strong><br><code>--alert-color</code> — Alert text color<br><code>--alert-bg</code> — Alert background<br><code>--alert-border-color</code> — Border color<br><code>--alert-border</code> — Full border shorthand<br><br><strong>Dimensions</strong><br><code>--alert-padding-x</code> / <code>--alert-padding-y</code> — Inner padding<br><code>--alert-margin-bottom</code> — Bottom margin<br><code>--alert-border-radius</code> — Border radius<br><br><em>Note: per-variant contextual tokens (colors, backgrounds, borders) are covered in the Bootstrap State Colors section above.</em>"
TPL_MOKOONYX_CSS_VARS_BADGE_LABEL="Badge"
TPL_MOKOONYX_CSS_VARS_BADGE_DESC="<strong>Colors</strong><br><code>--badge-color</code> — Badge text color<br><br><strong>Typography</strong><br><code>--badge-font-size</code> — Font size<br><code>--badge-font-weight</code> — Font weight<br><br><strong>Dimensions</strong><br><code>--badge-padding-x</code> / <code>--badge-padding-y</code> — Padding<br><code>--badge-border-radius</code> — Border radius"
TPL_MOKOONYX_CSS_VARS_BACKDROP_LABEL="Backdrop"
TPL_MOKOONYX_CSS_VARS_BACKDROP_DESC="<strong>Colors</strong><br><code>--backdrop-bg</code> — Backdrop color (default: <code>#000</code>)<br><code>--backdrop-opacity</code> — Backdrop opacity (default: <code>0.5</code>)<br><br><strong>Stacking</strong><br><code>--backdrop-zindex</code> — z-index (default: <code>1040</code>)"
TPL_MOKOONYX_CSS_VARS_BREADCRUMB_LABEL="Breadcrumb"
TPL_MOKOONYX_CSS_VARS_BREADCRUMB_DESC="<strong>Colors</strong><br><code>--breadcrumb-bg</code> — Background color<br><code>--breadcrumb-divider-color</code> — Divider color<br><code>--breadcrumb-item-active-color</code> — Active item color<br><br><strong>Dimensions</strong><br><code>--breadcrumb-padding-x</code> / <code>--breadcrumb-padding-y</code> — Container padding<br><code>--breadcrumb-margin-bottom</code> — Bottom margin<br><code>--breadcrumb-item-padding-x</code> — Spacing between items<br><code>--breadcrumb-border-radius</code> — Container border radius"
TPL_MOKOONYX_CSS_VARS_DROPDOWN_MENU_LABEL="Dropdown Menu"
TPL_MOKOONYX_CSS_VARS_DROPDOWN_MENU_DESC="<strong>Colors</strong><br><code>--dropdown-color</code> — Default text color<br><code>--dropdown-bg</code> — Menu background<br><code>--dropdown-border-color</code> — Border color<br><code>--dropdown-divider-bg</code> — Divider color<br><code>--dropdown-box-shadow</code> — Menu shadow<br><code>--dropdown-link-color</code> — Link text color<br><code>--dropdown-link-active-color</code> — Active link text color<br><code>--dropdown-link-active-bg</code> — Active link background<br><code>--dropdown-link-disabled-color</code> — Disabled link color<br><code>--dropdown-header-color</code> — Header text color<br><br><strong>Dimensions</strong><br><code>--dropdown-min-width</code> — Minimum width<br><code>--dropdown-padding-x</code> / <code>--dropdown-padding-y</code> — Menu padding<br><code>--dropdown-spacer</code> — Gap from toggle<br><code>--dropdown-border-width</code> — Border width<br><code>--dropdown-border-radius</code> — Outer border radius<br><code>--dropdown-inner-border-radius</code> — Inner border radius<br><code>--dropdown-divider-margin-y</code> — Divider vertical margin<br><code>--dropdown-item-padding-x</code> / <code>--dropdown-item-padding-y</code> — Item padding<br><code>--dropdown-header-padding-x</code> / <code>--dropdown-header-padding-y</code> — Header padding<br><br><strong>Typography</strong><br><code>--dropdown-font-size</code> — Menu font size<br><br><strong>Stacking</strong><br><code>--dropdown-zindex</code> — z-index"
TPL_MOKOONYX_CSS_VARS_LIST_GROUP_LABEL="List Group"
TPL_MOKOONYX_CSS_VARS_LIST_GROUP_DESC="<strong>Colors</strong><br><code>--list-group-color</code> — Default text color<br><code>--list-group-bg</code> — Default background<br><code>--list-group-border-color</code> — Border color<br><code>--list-group-action-color</code> — Clickable item text color<br><code>--list-group-action-active-color</code> — Clickable item active text color<br><code>--list-group-action-active-bg</code> — Clickable item active background<br><code>--list-group-disabled-color</code> — Disabled item text color<br><code>--list-group-disabled-bg</code> — Disabled item background<br><code>--list-group-active-color</code> — Active item text color<br><code>--list-group-active-bg</code> — Active item background<br><code>--list-group-active-border-color</code> — Active item border color<br><br><strong>Dimensions</strong><br><code>--list-group-border-width</code> — Border width<br><code>--list-group-border-radius</code> — Border radius<br><code>--list-group-item-padding-x</code> / <code>--list-group-item-padding-y</code> — Item padding"
TPL_MOKOONYX_CSS_VARS_MODAL_LABEL="Modal"
TPL_MOKOONYX_CSS_VARS_MODAL_DESC="<strong>Colors</strong><br><code>--modal-color</code> — Modal text color<br><code>--modal-bg</code> — Modal background<br><code>--modal-border-color</code> — Outer border color<br><code>--modal-box-shadow</code> — Modal shadow<br><code>--modal-header-border-color</code> — Header border color<br><code>--modal-footer-bg</code> — Footer background<br><code>--modal-footer-border-color</code> — Footer border color<br><br><strong>Dimensions</strong><br><code>--modal-width</code> — Default modal width<br><code>--modal-padding</code> — Body padding<br><code>--modal-margin</code> — Outer margin<br><code>--modal-border-width</code> — Outer border width<br><code>--modal-border-radius</code> — Outer border radius<br><code>--modal-inner-border-radius</code> — Inner border radius<br><code>--modal-header-padding-x</code> / <code>--modal-header-padding-y</code> — Header padding<br><code>--modal-header-padding</code> — Header padding shorthand<br><code>--modal-header-border-width</code> — Header border width<br><code>--modal-title-line-height</code> — Title line height<br><code>--modal-footer-gap</code> — Footer button gap<br><code>--modal-footer-border-width</code> — Footer border width<br><br><strong>Stacking</strong><br><code>--modal-zindex</code> — z-index"
TPL_MOKOONYX_CSS_VARS_NAV_TABS_LABEL="Nav Tabs"
TPL_MOKOONYX_CSS_VARS_NAV_TABS_DESC="<strong>Colors</strong><br><code>--nav-tabs-border-color</code> — Tab bar border color<br><code>--nav-tabs-link-active-color</code> — Active tab text color<br><code>--nav-tabs-link-active-bg</code> — Active tab background<br><code>--nav-tabs-link-active-border-color</code> — Active tab border color<br><br><strong>Dimensions</strong><br><code>--nav-tabs-border-width</code> — Border width<br><code>--nav-tabs-border-radius</code> — Tab border radius"
TPL_MOKOONYX_CSS_VARS_NAV_PILLS_LABEL="Nav Pills"
TPL_MOKOONYX_CSS_VARS_NAV_PILLS_DESC="<strong>Colors</strong><br><code>--nav-pills-link-active-color</code> — Active pill text color<br><code>--nav-pills-link-active-bg</code> — Active pill background<br><br><strong>Dimensions</strong><br><code>--nav-pills-border-radius</code> — Pill border radius"
TPL_MOKOONYX_CSS_VARS_PAGINATION_LABEL="Pagination"
TPL_MOKOONYX_CSS_VARS_PAGINATION_DESC="<strong>Colors</strong><br><code>--pagination-color</code> — Default link color<br><code>--pagination-bg</code> — Default background<br><code>--pagination-border-color</code> — Default border color<br><code>--pagination-focus-color</code> — Focused link color<br><code>--pagination-focus-bg</code> — Focused background<br><code>--pagination-focus-box-shadow</code> — Focus ring<br><code>--pagination-active-color</code> — Active page text color<br><code>--pagination-active-bg</code> — Active page background<br><code>--pagination-active-border-color</code> — Active page border color<br><code>--pagination-disabled-color</code> — Disabled link color<br><code>--pagination-disabled-bg</code> — Disabled background<br><code>--pagination-disabled-border-color</code> — Disabled border color<br><br><strong>Dimensions</strong><br><code>--pagination-padding-x</code> / <code>--pagination-padding-y</code> — Item padding<br><code>--pagination-border-width</code> — Border width<br><code>--pagination-border-radius</code> — Border radius<br><br><strong>Typography</strong><br><code>--pagination-font-size</code> — Font size"
TPL_MOKOONYX_CSS_VARS_POPOVER_LABEL="Popover"
TPL_MOKOONYX_CSS_VARS_POPOVER_DESC="<strong>Colors</strong><br><code>--popover-bg</code> — Popover background<br><code>--popover-border-color</code> — Border color<br><code>--popover-box-shadow</code> — Popover shadow<br><code>--popover-header-color</code> — Header text color<br><code>--popover-header-bg</code> — Header background<br><code>--popover-body-color</code> — Body text color<br><code>--popover-arrow-border</code> — Arrow border color<br><br><strong>Dimensions</strong><br><code>--popover-max-width</code> — Maximum width<br><code>--popover-border-width</code> — Border width<br><code>--popover-border-radius</code> — Outer border radius<br><code>--popover-inner-border-radius</code> — Inner border radius<br><code>--popover-header-padding-x</code> / <code>--popover-header-padding-y</code> — Header padding<br><code>--popover-body-padding-x</code> / <code>--popover-body-padding-y</code> — Body padding<br><code>--popover-arrow-width</code> / <code>--popover-arrow-height</code> — Arrow dimensions<br><br><strong>Typography</strong><br><code>--popover-font-size</code> — Font size<br><code>--popover-header-font-size</code> — Header font size<br><br><strong>Stacking</strong><br><code>--popover-zindex</code> — z-index"
TPL_MOKOONYX_CSS_VARS_PROGRESS_LABEL="Progress Bar"
TPL_MOKOONYX_CSS_VARS_PROGRESS_DESC="<strong>Colors</strong><br><code>--progress-bg</code> — Track background<br><code>--progress-bar-color</code> — Bar text color<br><code>--progress-bar-bg</code> — Bar fill color<br><code>--progress-box-shadow</code> — Track shadow<br><br><strong>Dimensions</strong><br><code>--progress-height</code> — Track height<br><code>--progress-border-radius</code> — Track border radius<br><br><strong>Typography</strong><br><code>--progress-font-size</code> — Label font size<br><br><strong>Animation</strong><br><code>--progress-bar-transition</code> — Bar width transition"
TPL_MOKOONYX_CSS_VARS_SPINNER_LABEL="Spinner"
TPL_MOKOONYX_CSS_VARS_SPINNER_DESC="<strong>Dimensions</strong><br><code>--spinner-width</code> — Spinner width<br><code>--spinner-height</code> — Spinner height<br><code>--spinner-vertical-align</code> — Inline vertical alignment<br><code>--spinner-border-width</code> — Border-style spinner track width<br><br><strong>Animation</strong><br><code>--spinner-animation-speed</code> — Rotation duration"
TPL_MOKOONYX_CSS_VARS_TABLE_LABEL="Table"
TPL_MOKOONYX_CSS_VARS_TABLE_DESC="<strong>Colors</strong><br><code>--table-color</code> — Default cell text color<br><code>--table-bg</code> — Default cell background<br><code>--table-border-color</code> — Border color<br><code>--table-accent-bg</code> — Accent row background (used by variants)<br><code>--table-striped-color</code> — Striped row text color<br><code>--table-striped-bg</code> — Striped row background<br><code>--table-active-color</code> — Hovered/active row text color<br><code>--table-active-bg</code> — Hovered/active row background"
TPL_MOKOONYX_CSS_VARS_TOAST_LABEL="Toast"
TPL_MOKOONYX_CSS_VARS_TOAST_DESC="<strong>Colors</strong><br><code>--toast-color</code> — Body text color<br><code>--toast-bg</code> — Body background<br><code>--toast-border-color</code> — Border color<br><code>--toast-box-shadow</code> — Toast shadow<br><code>--toast-header-color</code> — Header text color<br><code>--toast-header-bg</code> — Header background<br><code>--toast-header-border-color</code> — Header border color<br><br><strong>Dimensions</strong><br><code>--toast-max-width</code> — Maximum width<br><code>--toast-padding-x</code> / <code>--toast-padding-y</code> — Body padding<br><code>--toast-spacing</code> — Gap between stacked toasts<br><code>--toast-border-width</code> — Border width<br><code>--toast-border-radius</code> — Border radius<br><br><strong>Typography</strong><br><code>--toast-font-size</code> — Font size<br><br><strong>Stacking</strong><br><code>--toast-zindex</code> — z-index"
TPL_MOKOONYX_CSS_VARS_TOOLTIP_LABEL="Tooltip"
TPL_MOKOONYX_CSS_VARS_TOOLTIP_DESC="<strong>Colors</strong><br><code>--tooltip-color</code> — Text color<br><code>--tooltip-bg</code> — Background<br><code>--tooltip-opacity</code> — Overall opacity<br><br><strong>Dimensions</strong><br><code>--tooltip-max-width</code> — Maximum width<br><code>--tooltip-padding-x</code> / <code>--tooltip-padding-y</code> — Inner padding<br><code>--tooltip-margin</code> — Offset from target<br><code>--tooltip-border-radius</code> — Border radius<br><code>--tooltip-arrow-width</code> / <code>--tooltip-arrow-height</code> — Arrow dimensions<br><br><strong>Typography</strong><br><code>--tooltip-font-size</code> — Font size<br><br><strong>Stacking</strong><br><code>--tooltip-zindex</code> — z-index"
TPL_MOKOONYX_CSS_VARS_COMPONENTS_LABEL="Component &amp; Plugin Colors"
TPL_MOKOONYX_CSS_VARS_COMPONENTS_DESC="<strong>Misc components</strong><br><code>--mod-finder-link-hover</code> — Smart Search hover background<br><code>--form-legend-color</code> — Form legend text color<br><code>--border-gray</code> — General gray border<br><code>--subhead-color</code> — Subheading color<br><code>--item-list-color</code> — Item list background<br><code>--notification-badge-bg</code> — Notification badge<br><br><strong>Table of Contents (TOC)</strong><br><code>--toc-link-color</code> — TOC link color<br><code>--toc-link-active-color</code> — Active TOC link<br><br><strong>Choices.js select</strong><br><code>--choices-inner-bg</code> — Inner background<br><code>--choices-dropdown-bg</code> — Dropdown background<br><code>--choices-item-bg</code> — Tag item background<br><code>--choices-item-hover-bg</code> — Tag hover<br><code>--choices-disabled-bg</code> — Disabled state<br><code>--choices-focused-border</code> — Focused border<br><br><strong>Tab buttons (taba)</strong><br><code>--taba-btn-green</code>, <code>--taba-btn-blue</code>, <code>--taba-btn-red</code>, <code>--taba-btn-gray</code>"
TPL_MOKOONYX_CSS_VARS_OFFCANVAS_LABEL="Offcanvas Panel"
TPL_MOKOONYX_CSS_VARS_OFFCANVAS_DESC="<strong>Dimensions</strong><br><code>--offcanvas-width</code> — Panel width (default: <code>400px</code>)<br><code>--offcanvas-height</code> — Panel height for top/bottom variants (default: <code>30vh</code>)<br><code>--offcanvas-padding-x</code> / <code>--offcanvas-padding-y</code> — Inner padding<br><br><strong>Colors</strong><br><code>--offcanvas-bg</code> — Panel background (default: <code>var(--body-bg)</code>)<br><code>--offcanvas-color</code> — Panel text color (default: <code>var(--body-color)</code>)<br><code>--offcanvas-border-width</code> / <code>--offcanvas-border-color</code> — Panel border<br><code>--offcanvas-box-shadow</code> — Drop shadow<br><br><strong>Stacking</strong><br><code>--offcanvas-zindex</code> — z-index (default: <code>1045</code>)"
TPL_MOKOONYX_CSS_VARS_VM_LABEL="VirtueMart"
TPL_MOKOONYX_CSS_VARS_VM_DESC="<strong>Surfaces &amp; text</strong><br><code>--vm-surface</code> / <code>--vm-surface-2</code> — Card/panel backgrounds<br><code>--vm-text</code> / <code>--vm-text-strong</code> / <code>--vm-text-muted</code> — Text variants<br><code>--vm-border</code> — Border color<br><code>--vm-price-color</code> — Price text color<br><br><strong>Layout &amp; density</strong><br><code>--vm-container-max-width</code> — Max content width (default: <code>1200px</code>)<br><code>--vm-section-gap</code> — Section spacing (default: <code>2rem</code>)<br><code>--vm-block-radius</code> / <code>--vm-block-shadow</code> — Block appearance<br><br><strong>Typography</strong><br><code>--vm-category-title-size</code> — Category heading size<br><code>--vm-product-title-size</code> — Product title size<br><code>--vm-price-size</code> — Price size<br><br><strong>Buttons</strong><br><code>--vm-btn-primary-bg</code> / <code>--vm-btn-primary-text</code> — Primary button<br><code>--vm-btn-secondary-bg</code> / <code>--vm-btn-secondary-text</code> — Secondary button<br><br><strong>Image overlay controls</strong><br><code>--vm-image-overlay-btn-bg</code> / <code>--vm-image-overlay-btn-color</code> — Overlay button appearance"
TPL_MOKOONYX_CSS_VARS_GABLE_LABEL="Gable"
TPL_MOKOONYX_CSS_VARS_GABLE_DESC="Color tokens used by the Gable extension.<br><code>--gab-blue</code> — <code>#0066cc</code><br><code>--gab-green</code> — <code>#28a745</code><br><code>--gab-red</code> — <code>#dc3545</code><br><code>--gab-orange</code> — <code>#fd7e14</code><br><code>--gab-gray1</code> — <code>#495057</code><br><code>--gab-gray2</code> — <code>#6c757d</code><br><code>--gab-gray3</code> — <code>#adb5bd</code>"
TPL_MOKOONYX_CSS_VARS_FOOTER_LABEL="Footer"
TPL_MOKOONYX_CSS_VARS_FOOTER_DESC="<strong>Spacing</strong><br><code>--footer-padding-top</code> — Top padding (default: <code>1rem</code>)<br><code>--footer-padding-bottom</code> — Bottom padding (default: <code>80px</code>)<br><code>--footer-grid-padding-y</code> — Grid vertical padding (default: <code>2.5rem</code>)<br><code>--footer-grid-padding-x</code> — Grid horizontal padding (default: <code>0.5em</code>)"
; ===== Theme Preview tab =====
TPL_MOKOONYX_THEME_PREVIEW_FIELDSET_LABEL="Theme Preview"
TPL_MOKOONYX_THEME_PREVIEW_INTRO="<p>Live preview of all CSS variables, hero variants, block colors, and Bootstrap components rendered with your active theme. Use the <strong>Toggle Light / Dark</strong> button inside the preview to switch modes. This page is also available as a standalone file at <code>templates/mokoonyx/templates/theme-test.html</code>.</p>"
TPL_MOKOONYX_THEME_PREVIEW_FRAME="<iframe src='../templates/mokoonyx/templates/theme-test.html' style='width:100%;height:80vh;border:1px solid #dee2e6;border-radius:.375rem;' loading='lazy' title='Theme test sheet preview'></iframe>"
; ===== Misc =====
MOD_BREADCRUMBS_HERE="YOU ARE HERE:"
JGLOBAL_OFFLINE="Offline"

31
src/language/en-US/tpl_mokoonyx.sys.ini Normal file
View File

@@ -0,0 +1,31 @@
; Copyright (C) 2025 Moko Consulting <hello@mokoconsulting.tech>
;
; This file is part of a Moko Consulting project.
;
; SPDX-License-Identifier: GPL-3.0-or-later
;
TPL_MOKOONYX="MokoOnyx Site template"
TPL_MOKOONYX_GOOGLE_FIELDSET_LABEL="Google"
TPL_MOKOONYX_DRAWERS_FIELDSET_LABEL="Drawers"
TPL_MOKOONYX_MOD_MENU_LAYOUT_COLLAPSE_METISMENU="Collapsible Dropdown"
TPL_MOKOONYX_MOD_MENU_LAYOUT_DROPDOWN_METISMENU="Dropdown"
TPL_MOKOONYX_POSITION_BANNER="Banner"
TPL_MOKOONYX_POSITION_BELOW_TOPBAR="Below Topbar"
TPL_MOKOONYX_POSITION_BRAND_ASIDE="Brand Aside"
TPL_MOKOONYX_POSITION_BOTTOM_A="Bottom-A"
TPL_MOKOONYX_POSITION_BOTTOM_B="Bottom-B"
TPL_MOKOONYX_POSITION_BREADCRUMBS="Breadcrumbs"
TPL_MOKOONYX_POSITION_DEBUG="Debug"
TPL_MOKOONYX_POSITION_FOOTER="Footer"
TPL_MOKOONYX_POSITION_MAIN_BOTTOM="Main-bottom"
TPL_MOKOONYX_POSITION_MAIN_TOP="Main-top"
TPL_MOKOONYX_POSITION_MENU="Menu"
TPL_MOKOONYX_POSITION_SEARCH="Search"
TPL_MOKOONYX_POSITION_SIDEBAR_LEFT="Sidebar-left"
TPL_MOKOONYX_POSITION_SIDEBAR_RIGHT="Sidebar-right"
TPL_MOKOONYX_POSITION_TOP_A="Top-a"
TPL_MOKOONYX_POSITION_TOP_B="Top-b"
TPL_MOKOONYX_POSITION_TOPBAR="Top Bar"
TPL_MOKOONYX_POSITION_DRAWER_LEFT="Drawer-Left"
TPL_MOKOONYX_POSITION_DRAWER_RIGHT="Drawer-Right"
TPL_MOKOONYX_XML_DESCRIPTION="<h3>MokoOnyx Template Description</h3> <p> <strong>MokoOnyx</strong> continues Joomla’s tradition of space-themed default templates— building on the legacy of <em>Solarflare</em> (Joomla 1.0), <em>Milkyway</em> (Joomla 1.5), and <em>Protostar</em> (Joomla 3.0). </p> <p> This template is a customized fork of the <strong>Cassiopeia</strong> template introduced in Joomla 4, preserving its modern, accessible, and mobile-first foundation while introducing new stylistic enhancements and structural refinements specifically tailored for use by Moko Consulting. </p> <h4>Custom Color Themes</h4> <p> Starter palette files are included with the template. To create a custom color scheme, copy <code>templates/mokoonyx/templates/light.custom.css</code> to <code>media/templates/site/mokoonyx/css/theme/light.custom.css</code>, or <code>templates/mokoonyx/templates/dark.custom.css</code> to <code>media/templates/site/mokoonyx/css/theme/dark.custom.css</code>. Customize the CSS variables to match your brand, then activate your palette in <em>System → Site Templates → MokoOnyx → Theme tab</em> by selecting "Custom" for the Light or Dark Mode Palette. A full variable reference is available in the <em>CSS Variables</em> tab in template options. </p> <h4>Custom CSS &amp; JavaScript</h4> <p> For site-specific styles and scripts that should survive template updates, create the following files: </p> <ul> <li><code>media/templates/site/mokoonyx/css/user.css</code> — loaded on every page for custom CSS overrides.</li> <li><code>media/templates/site/mokoonyx/js/user.js</code> — loaded on every page for custom JavaScript.</li> </ul> <p> These files are gitignored and will not be overwritten by template updates. </p> <h4>Code Attribution</h4> <p> This template is based on the original <strong>Cassiopeia</strong> template developed by the <a href=\"https://www.joomla.org\" target=\"_blank\" rel=\"noopener\">Joomla! Project</a> and released under the GNU General Public License. </p> <p> Modifications and enhancements have been made by Moko Consulting in accordance with open-source licensing standards. </p> <p> It includes integration with <a href=\"https://afeld.github.io/bootstrap-toc/\" target=\"_blank\" rel=\"noopener\">Bootstrap TOC</a>, an open-source table of contents generator by A. Feld, licensed under the MIT License. </p> <p> All third-party libraries and assets remain the property of their respective authors and are credited within their source files where applicable. </p>"

76
src/language/index.html Normal file
View File

@@ -0,0 +1,76 @@
<!-- Copyright (C) 2025 Moko Consulting <hello@mokoconsulting.tech>
This file is part of a Moko Consulting project.
SPDX-License-Identifier: GPL-3.0-or-later
-->
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Redirecting…</title>
<!-- Search engines: do not index this placeholder redirect page -->
<meta name="robots" content="noindex, nofollow, noarchive" />
<!-- Instant redirect fallback even if JavaScript is disabled -->
<meta http-equiv="refresh" content="0; url=/" />
<!-- Canonical root reference -->
<link rel="canonical" href="/" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script>
(function redirectToRoot() {
// Configuration object with safe defaults.
var opts = {
fallbackPath: "/", // string: fallback destination if origin is unavailable
delayMs: 0, // number: delay before redirect in ms (0 = immediate)
behavior: "replace" // enum: "replace" | "assign"
};
// Determine absolute origin in all mainstream browsers.
var origin = (typeof location.origin === "string" && location.origin)
|| (location.protocol + "//" + location.host);
// Final destination: absolute root of the current site, or fallback path.
var destination = origin ? origin + "/" : opts.fallbackPath;
function go() {
if (opts.behavior === "assign") {
location.assign(destination);
} else {
location.replace(destination);
}
}
// Execute redirect, optionally after a short delay.
if (opts.delayMs > 0) {
setTimeout(go, opts.delayMs);
} else {
go();
}
})();
</script>
<!--
Secondary meta-refresh for no-JS environments is already set above.
Some very old crawlers may ignore JS; the meta refresh ensures coverage.
-->
<noscript>
<!-- Extra defense-in-depth: if JS is disabled, meta refresh (above) handles redirect. -->
<style>
html, body { height:100%; }
body { display:flex; align-items:center; justify-content:center; margin:0; font: 16px/1.4 system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
.msg { opacity: .75; text-align: center; }
</style>
</noscript>
</head>
<body>
<div class="msg">Redirecting to the site root… If you are not redirected, <a href="/">click here</a>.</div>
</body>
</html>