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

02.00

Browse Source 
**Major Release** — introduces the long-awaited **Dark Mode Toggle**, streamlining accessibility and usability enhancements.

##Added

* **Dark Mode Toggle**

	* Frontend toggle switch included in template.
	* JavaScript handles switching between light/dark modes.
	* Dark mode CSS rules applied across template styles.
	* Automatic persistence of user choice (via localStorage).

* **Header Parameters Update**

	* Added **logo parameter support** in template settings.
	* Updated metadata & copyright header.

* **Expanded TOC (Table of Contents)**

	* Automatic TOC injection when enabled.
	* User selects placement via article > options > layout (`toc-left` or `toc-right`).

##Improved

* Cleaned up `index.php` by removing **skip-to-content** duplicate calls.
* Consolidated JavaScript asset loading (ensuring dark-mode script is loaded correctly from external JS file).
* Streamlined CSS for **toggle switch**, ensuring it inherits Bootstrap/Cassiopeia defaults.
* General accessibility refinements in typography and color contrast.

##Fixed

* Fixed missing **logo param** in header output.
* Corrected stylesheet inconsistencies between Bootstrap 5 helpers and template overrides.
* Patched redundant calls in script includes.
This commit is contained in:
Jonathan Miller
2025-08-30 18:41:15 -05:00
parent d6f84ebb46
commit bee7796645
47 changed files with 2915 additions and 3124 deletions
Download Patch File Download Diff File Expand all files Collapse all files

84
media/templates/site/moko-cassiopeia/css/system/searchtools/searchtools.css
View File

@@ -1,49 +1,79 @@
@charset "UTF-8";
/* =========================================================================
* 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
*
* This program is free software; you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation; either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program. If not, see https://www.gnu.org/licenses/ .
* =========================================================================
* FILE INFORMATION
* DEFGROUP: Joomla
* INGROUP: Moko-Cassiopeia
* PATH: media/templates/site/moko-cassiopeia/css/system/searchtools/searchtools.css
* VERSION: 02.00
* BRIEF: Stylesheet for Joomla search tools integration in Moko-Cassiopeia template
* =========================================================================
*/
.js-stools-container-bar {
padding: 10px 20px;
padding: 10px 20px;
}
.js-stools-container-bar .btn-toolbar {
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
}
.js-stools-container-bar .btn-toolbar > * {
margin: 4px 0;
-webkit-margin-end: 8px;
margin-inline-end: 8px;
margin: 4px 0;
-webkit-margin-end: 8px;
margin-inline-end: 8px;
}
.js-stools-container-bar .btn-toolbar .js-stools-btn-clear {
background-color: hsl(207, 49%, 37%);
border: 0;
background-color: hsl(207, 49%, 37%);
border: 0;
}
.js-stools-container-bar .ordering-select {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.js-stools-container-filters {
display: none;
padding: 0 20px;
margin-bottom: 20px;
display: none;
padding: 0 20px;
margin-bottom: 20px;
}
.js-stools-container-filters-visible {
display: grid;
grid-gap: 8px;
grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
padding: 10px;
background-color: hsl(0, 0%, 100%);
display: grid;
grid-gap: 8px;
grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
padding: 10px;
background-color: hsl(0, 0%, 100%);
}
.js-stools-container-filters > * {
margin: 4px 0;
-webkit-margin-end: 8px;
margin-inline-end: 8px;
margin: 4px 0;
-webkit-margin-end: 8px;
margin-inline-end: 8px;
}
.js-stools-field-list + .js-stools-field-list {
-webkit-margin-start: 8px;
margin-inline-start: 8px;
-webkit-margin-start: 8px;
margin-inline-start: 8px;
}
.js-stools-field-selector .form-select {
width: auto;
}
width: auto;
}