v1.13
- Fixed CSS - Cleaned up Table of Contents - Deleted conflicting default.php in com_content
This commit is contained in:
1
.gitignore
vendored
1
.gitignore
vendored
@@ -69,3 +69,4 @@ sync.ffs_db
|
||||
|
||||
#Custom CSS Brands
|
||||
/media/templates/site/moko-cassiopeia/css/global/colors_custom_*.css
|
||||
/updates/*
|
||||
@@ -6,6 +6,8 @@
|
||||
MOKO-CASSIOPEIA="MOKO-CASSIOPEIA Site template"
|
||||
TPL_MOKO-CASSIOPEIA_BACKTOTOP="Back to Top"
|
||||
TPL_MOKO-CASSIOPEIA_BACKTOTOP_LABEL="Back-to-top Link"
|
||||
TPL_MOKO-CASSIOPEIA_DEVELOPMENTMODE_LABEL="Development Mode"
|
||||
TPL_MOKO-CASSIOPEIA_DEVELOPMENTMODE_DESC="If 'Development Mode' is active, certain featurea may be disabled, such as Google Tag Manager and Google Analytics."
|
||||
TPL_MOKO-CASSIOPEIA_BRAND_LABEL="Brand"
|
||||
TPL_MOKO-CASSIOPEIA_COLOR_NAME_ALTERNATIVE="Alternative"
|
||||
TPL_MOKO-CASSIOPEIA_COLOR_NAME_LABEL="Color Theme"
|
||||
@@ -36,6 +38,10 @@ TPL_MOKO-CASSIOPEIA_GOOGLETAGMANAGER_LABEL="Use Google Tag Manager?"
|
||||
TPL_MOKO-CASSIOPEIA_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_MOKO-CASSIOPEIA_GOOGLETAGMANAGERID_LABEL="Google Tag Manager ID"
|
||||
TPL_MOKO-CASSIOPEIA_GOOGLETAGMANAGERID_DESC="Begins with 'GTM-'"
|
||||
TPL_MOKO-CASSIOPEIA_GOOGLEANALYTICS_LABEL="Use Google Analytics?"
|
||||
TPL_MOKO-CASSIOPEIA_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_MOKO-CASSIOPEIA_GOOGLEANALYTICSID_LABEL="Google Analytics ID"
|
||||
TPL_MOKO-CASSIOPEIA_GOOGLEANALYTICSID_DESC="Begins with 'G-'"
|
||||
COM_TEMPLATES_CUSTOM_HEAD_FIELDSET_LABEL="Custom Head"
|
||||
TPL_MOKO-CASSIOPEIA_CUSTOM_HEAD_START_LABEL="Custom Head: Start"
|
||||
TPL_MOKO-CASSIOPEIA_CUSTOM_HEAD_START_DESC="This content will be inserted at the beginning of the <HEAD> tag"
|
||||
@@ -46,3 +52,4 @@ TPL_MOKO-CASSIOPEIA_DRAWER_LEFT_ICON_LABEL="Drawer Left Icon CSS"
|
||||
TPL_MOKO-CASSIOPEIA_DRAWER_LEFT_ICON_DESC="Enter the Font-Awesome class for the left drawer toggle (e.g. 'fas fa-chevron-left')."
|
||||
TPL_MOKO-CASSIOPEIA_DRAWER_RIGHT_ICON_LABEL="Drawer Right Icon CSS"
|
||||
TPL_MOKO-CASSIOPEIA_DRAWER_RIGHT_ICON_DESC="Enter the Font-Awesome class for the right drawer toggle (e.g. 'fas fa-chevron-right')."
|
||||
TPL_MOKO-CASSIOPEIA_TOC="Table of Contents"
|
||||
@@ -63,7 +63,7 @@ TPL_MOKO-CASSIOPEIA_XML_DESCRIPTION="<h3>MOKO-CASSIOPEIA Template Description</h
|
||||
</p>
|
||||
<p>
|
||||
Modifications and enhancements have been made by Moko Consulting in accordance with open-source licensing standards.
|
||||
</p>
|
||||
</p>a
|
||||
<p>
|
||||
It includes integration with
|
||||
<a href="https://afeld.github.io/bootstrap-toc/" target="_blank" rel="noopener">Bootstrap TOC</a>,
|
||||
|
||||
@@ -6,6 +6,8 @@
|
||||
MOKO-CASSIOPEIA="MOKO-CASSIOPEIA Site template"
|
||||
TPL_MOKO-CASSIOPEIA_BACKTOTOP="Back to Top"
|
||||
TPL_MOKO-CASSIOPEIA_BACKTOTOP_LABEL="Back-to-top Link"
|
||||
TPL_MOKO-CASSIOPEIA_DEVELOPMENTMODE_LABEL="Development Mode"
|
||||
TPL_MOKO-CASSIOPEIA_DEVELOPMENTMODE_DESC="If 'Development Mode' is active, certain featurea may be disabled, such as Google Tag Manager and Google Analytics."
|
||||
TPL_MOKO-CASSIOPEIA_BRAND_LABEL="Brand"
|
||||
TPL_MOKO-CASSIOPEIA_COLOR_NAME_ALTERNATIVE="Alternative"
|
||||
TPL_MOKO-CASSIOPEIA_COLOR_NAME_LABEL="Color Theme"
|
||||
@@ -36,6 +38,10 @@ TPL_MOKO-CASSIOPEIA_GOOGLETAGMANAGER_LABEL="Use Google Tag Manager?"
|
||||
TPL_MOKO-CASSIOPEIA_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_MOKO-CASSIOPEIA_GOOGLETAGMANAGERID_LABEL="Google Tag Manager ID"
|
||||
TPL_MOKO-CASSIOPEIA_GOOGLETAGMANAGERID_DESC="Begins with 'GTM-'"
|
||||
TPL_MOKO-CASSIOPEIA_GOOGLEANALYTICS_LABEL="Use Google Analytics?"
|
||||
TPL_MOKO-CASSIOPEIA_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_MOKO-CASSIOPEIA_GOOGLEANALYTICSID_LABEL="Google Analytics ID"
|
||||
TPL_MOKO-CASSIOPEIA_GOOGLEANALYTICSID_DESC="Begins with 'G-'"
|
||||
COM_TEMPLATES_CUSTOM_HEAD_FIELDSET_LABEL="Custom Head"
|
||||
TPL_MOKO-CASSIOPEIA_CUSTOM_HEAD_START_LABEL="Custom Head: Start"
|
||||
TPL_MOKO-CASSIOPEIA_CUSTOM_HEAD_START_DESC="This content will be inserted at the beginning of the <HEAD> tag"
|
||||
@@ -46,3 +52,4 @@ TPL_MOKO-CASSIOPEIA_DRAWER_LEFT_ICON_LABEL="Drawer Left Icon CSS"
|
||||
TPL_MOKO-CASSIOPEIA_DRAWER_LEFT_ICON_DESC="Enter the Font-Awesome class for the left drawer toggle (e.g. 'fas fa-chevron-left')."
|
||||
TPL_MOKO-CASSIOPEIA_DRAWER_RIGHT_ICON_LABEL="Drawer Right Icon CSS"
|
||||
TPL_MOKO-CASSIOPEIA_DRAWER_RIGHT_ICON_DESC="Enter the Font-Awesome class for the right drawer toggle (e.g. 'fas fa-chevron-right')."
|
||||
TPL_MOKO-CASSIOPEIA_TOC="Table of Contents"
|
||||
@@ -1,13 +1,26 @@
|
||||
:root, [data-bs-theme="light"] {
|
||||
--moko-cassiopeia-color-primary: #112855;
|
||||
--moko-cassiopeia-color-link: #224FAA;
|
||||
--moko-cassiopeia-color-hover: #224FAA;
|
||||
/*!
|
||||
* @package Joomla.Site
|
||||
* @subpackage Templates.moko-cassiopeia
|
||||
* @file /media/templates/sote/moko-cassiopeia/css/global/colors_alternative.css
|
||||
*
|
||||
* © 2025 Moko Consulting — All Rights Reserved
|
||||
* @license GNU General Public License version 2 or later; see LICENSE.txt
|
||||
*
|
||||
* Website: https://mokoconsulting.tech
|
||||
* Email: hello@mokoconsulting.tech
|
||||
* Phone: +1 (931) 279-6313
|
||||
*/
|
||||
|
||||
--moko-cassiopeia-header-background-image: url('../../../../../media/templates/site/moko-cassiopeia/images/bg.svg');
|
||||
--moko-cassiopeia-header-background-position: auto;
|
||||
--moko-cassiopeia-header-background-attachment: fixed;
|
||||
--moko-cassiopeia-header-background-repeat: repeat;
|
||||
--moko-cassiopeia-header-background-size: auto;
|
||||
:root, [data-bs-theme="light"] {
|
||||
--color-primary: #112855;
|
||||
--color-link: #224FAA;
|
||||
--color-hover: #224FAA;
|
||||
|
||||
--header-background-image: url('../../../../../media/templates/site/moko-cassiopeia/images/bg.svg');
|
||||
--header-background-position: auto;
|
||||
--header-background-attachment: fixed;
|
||||
--header-background-repeat: repeat;
|
||||
--header-background-size: auto;
|
||||
|
||||
--nav-text-color: white;
|
||||
--nav-bg-color: #224FAA;
|
||||
|
||||
@@ -1,422 +0,0 @@
|
||||
:root, [data-bs-theme="light"] {
|
||||
--moko-cassiopeia-color-primary: #112855;
|
||||
--moko-cassiopeia-color-link: #224FAA;
|
||||
--moko-cassiopeia-color-hover: #224FAA;
|
||||
|
||||
--moko-cassiopeia-header-background-image: url('../../../../../media/templates/site/moko-cassiopeia/images/bg.svg');
|
||||
--moko-cassiopeia-header-background-position: auto;
|
||||
--moko-cassiopeia-header-background-attachment: fixed;
|
||||
--moko-cassiopeia-header-background-repeat: repeat;
|
||||
--moko-cassiopeia-header-background-size: auto;
|
||||
|
||||
--nav-text-color: white;
|
||||
--nav-bg-color: #224FAA;
|
||||
--accent-color-primary: #3f8ff0;
|
||||
--accent-color-secondary: #3f8ff0;
|
||||
--border: 5px;
|
||||
--mainmenu-nav-link-color: white;
|
||||
|
||||
--blue: #010156;
|
||||
--black: #000;
|
||||
--indigo: #6812f3;
|
||||
--purple: #6f42c2;
|
||||
--pink: #e93f8e;
|
||||
--red: #a51f18;
|
||||
--orange: #fd7e17;
|
||||
--yellow: #ad6200;
|
||||
--green: #448344;
|
||||
--teal: #5abfdd;
|
||||
--cyan: #30638d;
|
||||
--white: #fff;
|
||||
--gray-100: #f9fafb;
|
||||
--gray-200: #eaedf0;
|
||||
--gray-300: #dfe3e7;
|
||||
--gray-400: #ced4da;
|
||||
--gray-500: #adb5bd;
|
||||
--gray-600: #6d757e;
|
||||
--gray-700: #484f56;
|
||||
--gray-800: #353b41;
|
||||
--gray-900: #22262a;
|
||||
--primary: #010156;
|
||||
--secondary: #6d757e;
|
||||
--success: #448344;
|
||||
--info: #30638d;
|
||||
--warning: #ad6200;
|
||||
--danger: #a51f18;
|
||||
--light: #f9fafb;
|
||||
--dark: #353b41;
|
||||
--primary-rgb: 1, 1, 86;
|
||||
--secondary-rgb: 109, 117, 126;
|
||||
--success-rgb: 68, 131, 68;
|
||||
--info-rgb: 48, 99, 141;
|
||||
--warning-rgb: 173, 98, 0;
|
||||
--danger-rgb: 165, 31, 24;
|
||||
--light-rgb: 249, 250, 251;
|
||||
--dark-rgb: 53, 59, 65;
|
||||
--primary-text-emphasis: #002;
|
||||
--secondary-text-emphasis: #2c2f32;
|
||||
--success-text-emphasis: #1b351b;
|
||||
--info-text-emphasis: #132838;
|
||||
--warning-text-emphasis: #452700;
|
||||
--danger-text-emphasis: #420c09;
|
||||
--light-text-emphasis: #484f56;
|
||||
--dark-text-emphasis: #484f56;
|
||||
--primary-bg-subtle: #ccd;
|
||||
--secondary-bg-subtle: #e2e3e5;
|
||||
--success-bg-subtle: #dae6da;
|
||||
--info-bg-subtle: #d6e0e8;
|
||||
--warning-bg-subtle: #efe0cc;
|
||||
--danger-bg-subtle: #edd2d1;
|
||||
--light-bg-subtle: #fcfcfd;
|
||||
--dark-bg-subtle: #ced4da;
|
||||
--primary-border-subtle: #99b;
|
||||
--secondary-border-subtle: #c5c8cb;
|
||||
--success-border-subtle: #b4ceb4;
|
||||
--info-border-subtle: #acc1d1;
|
||||
--warning-border-subtle: #dec099;
|
||||
--danger-border-subtle: #dba5a2;
|
||||
--light-border-subtle: #eaedf0;
|
||||
--dark-border-subtle: #adb5bd;
|
||||
--white-rgb: 255, 255, 255;
|
||||
--black-rgb: 0, 0, 0;
|
||||
--font-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
||||
--font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
||||
--gradient: linear-gradient(180deg, #ffffff26, #fff0);
|
||||
--body-font-family: var(--optain-cassiopeia-font-family-body, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
|
||||
--body-font-size: 1rem;
|
||||
--body-font-weight: 400;
|
||||
--body-line-height: 1.5;
|
||||
--body-color: #22262a;
|
||||
--body-color-rgb: 34, 38, 42;
|
||||
--body-bg: #fff;
|
||||
--body-bg-rgb: 255, 255, 255;
|
||||
--emphasis-color: #000;
|
||||
--emphasis-color-rgb: 0, 0, 0;
|
||||
--secondary-color: #22262abf;
|
||||
--secondary-color-rgb: 34, 38, 42;
|
||||
--secondary-bg: #eaedf0;
|
||||
--secondary-bg-rgb: 234, 237, 240;
|
||||
--tertiary-color: #22262a80;
|
||||
--tertiary-color-rgb: 34, 38, 42;
|
||||
--tertiary-bg: #f9fafb;
|
||||
--tertiary-bg-rgb: 249, 250, 251;
|
||||
--heading-color: inherit;
|
||||
--link-color: #224faa;
|
||||
--link-color-rgb: 34, 79, 170;
|
||||
--link-decoration: underline;
|
||||
--link-hover-color: #424077;
|
||||
--link-hover-color-rgb: 66, 64, 119;
|
||||
--code-color: #e93f8e;
|
||||
--highlight-color: #22262a;
|
||||
--highlight-bg: #fbeea8;
|
||||
--border-width: 1px;
|
||||
--border-style: solid;
|
||||
--border-color: #dfe3e7;
|
||||
--border-color-translucent: #0000002d;
|
||||
--border-radius: .25rem;
|
||||
--border-radius-sm: .2rem;
|
||||
--border-radius-lg: .3rem;
|
||||
--border-radius-xl: .3rem;
|
||||
--border-radius-xxl: 2rem;
|
||||
--border-radius-2xl: var(--border-radius-xxl);
|
||||
--border-radius-pill: 50rem;
|
||||
--box-shadow: 0 .5rem 1rem #00000026;
|
||||
--box-shadow-sm: 0 .125rem .25rem #00000013;
|
||||
--box-shadow-lg: 0 1rem 3rem #0000002d;
|
||||
--box-shadow-inset: inset 0 1px 2px #00000013;
|
||||
--focus-ring-width: .25rem;
|
||||
--focus-ring-opacity: .25;
|
||||
--focus-ring-color: #01015640;
|
||||
--form-valid-color: #448344;
|
||||
--form-valid-border-color: #448344;
|
||||
--form-invalid-color: #a51f18;
|
||||
--form-invalid-border-color: #a51f18;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
--btn-color: hsl(0, 0%, 100%);
|
||||
--btn-bg: hsl(240, 98%, 17%);
|
||||
--btn-border-color: hsl(240, 98%, 17%);
|
||||
--btn-hover-color: hsl(0, 0%, 100%);
|
||||
--btn-hover-bg: #010149;
|
||||
--btn-hover-border-color: #010145;
|
||||
--btn-focus-shadow-rgb: 39, 39, 111;
|
||||
--btn-active-color: hsl(0, 0%, 100%);
|
||||
--btn-active-bg: #010145;
|
||||
--btn-active-border-color: #010141;
|
||||
--btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
|
||||
--btn-disabled-color: hsl(0, 0%, 100%);
|
||||
--btn-disabled-bg: hsl(240, 98%, 17%);
|
||||
--btn-disabled-border-color: hsl(240, 98%, 17%);
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
--btn-color: --nav-text-color;
|
||||
--btn-bg: --nav-bg-color;
|
||||
--btn-border-color: hsl(210, 7%, 46%);
|
||||
--btn-hover-color: hsl(0, 0%, 100%);
|
||||
--btn-hover-bg: #5d636b;
|
||||
--btn-hover-border-color: #575e65;
|
||||
--btn-focus-shadow-rgb: gray;
|
||||
--btn-active-color: hsl(0, 0%, 100%);
|
||||
--btn-active-bg: #575e65;
|
||||
--btn-active-border-color: #52585f;
|
||||
--btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
|
||||
--btn-disabled-color: hsl(0, 0%, 100%);
|
||||
--btn-disabled-bg: hsl(210, 7%, 46%);
|
||||
--btn-disabled-border-color: hsl(210, 7%, 46%);
|
||||
}
|
||||
|
||||
.btn-success {
|
||||
--btn-color: hsl(0, 0%, 100%);
|
||||
--btn-bg: hsl(120, 32%, 39%);
|
||||
--btn-border-color: hsl(120, 32%, 39%);
|
||||
--btn-hover-color: hsl(0, 0%, 100%);
|
||||
--btn-hover-bg: #3a6f3a;
|
||||
--btn-hover-border-color: #366936;
|
||||
--btn-focus-shadow-rgb: 96, 150, 96;
|
||||
--btn-active-color: hsl(0, 0%, 100%);
|
||||
--btn-active-bg: #366936;
|
||||
--btn-active-border-color: #336233;
|
||||
--btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
|
||||
--btn-disabled-color: hsl(0, 0%, 100%);
|
||||
--btn-disabled-bg: hsl(120, 32%, 39%);
|
||||
--btn-disabled-border-color: hsl(120, 32%, 39%);
|
||||
}
|
||||
|
||||
.btn-info {
|
||||
--btn-color: hsl(0, 0%, 100%);
|
||||
--btn-bg: hsl(207, 49%, 37%);
|
||||
--btn-border-color: hsl(207, 49%, 37%);
|
||||
--btn-hover-color: hsl(0, 0%, 100%);
|
||||
--btn-hover-bg: #295478;
|
||||
--btn-hover-border-color: #264f71;
|
||||
--btn-focus-shadow-rgb: 79, 122, 158;
|
||||
--btn-active-color: hsl(0, 0%, 100%);
|
||||
--btn-active-bg: #264f71;
|
||||
--btn-active-border-color: #244a6a;
|
||||
--btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
|
||||
--btn-disabled-color: hsl(0, 0%, 100%);
|
||||
--btn-disabled-bg: hsl(207, 49%, 37%);
|
||||
--btn-disabled-border-color: hsl(207, 49%, 37%);
|
||||
}
|
||||
|
||||
.btn-warning {
|
||||
--btn-color: hsl(0, 0%, 100%);
|
||||
--btn-bg: hsl(34, 100%, 34%);
|
||||
--btn-border-color: hsl(34, 100%, 34%);
|
||||
--btn-hover-color: hsl(0, 0%, 100%);
|
||||
--btn-hover-bg: #935300;
|
||||
--btn-hover-border-color: #8a4e00;
|
||||
--btn-focus-shadow-rgb: 185, 122, 38;
|
||||
--btn-active-color: hsl(0, 0%, 100%);
|
||||
--btn-active-bg: #8a4e00;
|
||||
--btn-active-border-color: #824a00;
|
||||
--btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
|
||||
--btn-disabled-color: hsl(0, 0%, 100%);
|
||||
--btn-disabled-bg: hsl(34, 100%, 34%);
|
||||
--btn-disabled-border-color: hsl(34, 100%, 34%);
|
||||
}
|
||||
|
||||
.btn-danger {
|
||||
--btn-color: hsl(0, 0%, 100%);
|
||||
--btn-bg: hsl(3, 75%, 37%);
|
||||
--btn-border-color: hsl(3, 75%, 37%);
|
||||
--btn-hover-color: hsl(0, 0%, 100%);
|
||||
--btn-hover-bg: #8c1a14;
|
||||
--btn-hover-border-color: #841913;
|
||||
--btn-focus-shadow-rgb: 179, 65, 59;
|
||||
--btn-active-color: hsl(0, 0%, 100%);
|
||||
--btn-active-bg: #841913;
|
||||
--btn-active-border-color: #7c1712;
|
||||
--btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
|
||||
--btn-disabled-color: hsl(0, 0%, 100%);
|
||||
--btn-disabled-bg: hsl(3, 75%, 37%);
|
||||
--btn-disabled-border-color: hsl(3, 75%, 37%);
|
||||
}
|
||||
|
||||
.btn-light {
|
||||
--btn-color: hsl(0, 0%, 0%);
|
||||
--btn-bg: hsl(210, 17%, 98%);
|
||||
--btn-border-color: hsl(210, 17%, 98%);
|
||||
--btn-hover-color: hsl(0, 0%, 0%);
|
||||
--btn-hover-bg: #d4d5d5;
|
||||
--btn-hover-border-color: #c7c8c9;
|
||||
--btn-focus-shadow-rgb: 212, 213, 213;
|
||||
--btn-active-color: hsl(0, 0%, 0%);
|
||||
--btn-active-bg: #c7c8c9;
|
||||
--btn-active-border-color: #bbbcbc;
|
||||
--btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
|
||||
--btn-disabled-color: hsl(0, 0%, 0%);
|
||||
--btn-disabled-bg: hsl(210, 17%, 98%);
|
||||
--btn-disabled-border-color: hsl(210, 17%, 98%);
|
||||
}
|
||||
|
||||
.btn-dark {
|
||||
--btn-color: hsl(0, 0%, 100%);
|
||||
--btn-bg: hsl(210, 10%, 23%);
|
||||
--btn-border-color: hsl(210, 10%, 23%);
|
||||
--btn-hover-color: hsl(0, 0%, 100%);
|
||||
--btn-hover-bg: #53585e;
|
||||
--btn-hover-border-color: #494f54;
|
||||
--btn-focus-shadow-rgb: 83, 88, 94;
|
||||
--btn-active-color: hsl(0, 0%, 100%);
|
||||
--btn-active-bg: #5d6267;
|
||||
--btn-active-border-color: #494f54;
|
||||
--btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
|
||||
--btn-disabled-color: hsl(0, 0%, 100%);
|
||||
--btn-disabled-bg: hsl(210, 10%, 23%);
|
||||
--btn-disabled-border-color: hsl(210, 10%, 23%);
|
||||
}
|
||||
|
||||
.btn-outline-primary {
|
||||
--btn-color: hsl(240, 98%, 17%);
|
||||
--btn-border-color: hsl(240, 98%, 17%);
|
||||
--btn-hover-color: hsl(0, 0%, 100%);
|
||||
--btn-hover-bg: hsl(240, 98%, 17%);
|
||||
--btn-hover-border-color: hsl(240, 98%, 17%);
|
||||
--btn-focus-shadow-rgb: 1, 1, 86;
|
||||
--btn-active-color: hsl(0, 0%, 100%);
|
||||
--btn-active-bg: hsl(240, 98%, 17%);
|
||||
--btn-active-border-color: hsl(240, 98%, 17%);
|
||||
--btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
|
||||
--btn-disabled-color: hsl(240, 98%, 17%);
|
||||
--btn-disabled-bg: transparent;
|
||||
--btn-disabled-border-color: hsl(240, 98%, 17%);
|
||||
--gradient: none;
|
||||
}
|
||||
|
||||
.btn-outline-secondary {
|
||||
--btn-color: hsl(210, 7%, 46%);
|
||||
--btn-border-color: hsl(210, 7%, 46%);
|
||||
--btn-hover-color: hsl(0, 0%, 100%);
|
||||
--btn-hover-bg: hsl(210, 7%, 46%);
|
||||
--btn-hover-border-color: hsl(210, 7%, 46%);
|
||||
--btn-focus-shadow-rgb: 109, 117, 126;
|
||||
--btn-active-color: hsl(0, 0%, 100%);
|
||||
--btn-active-bg: hsl(210, 7%, 46%);
|
||||
--btn-active-border-color: hsl(210, 7%, 46%);
|
||||
--btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
|
||||
--btn-disabled-color: hsl(210, 7%, 46%);
|
||||
--btn-disabled-bg: transparent;
|
||||
--btn-disabled-border-color: hsl(210, 7%, 46%);
|
||||
--gradient: none;
|
||||
}
|
||||
|
||||
.btn-outline-success {
|
||||
--btn-color: hsl(120, 32%, 39%);
|
||||
--btn-border-color: hsl(120, 32%, 39%);
|
||||
--btn-hover-color: hsl(0, 0%, 100%);
|
||||
--btn-hover-bg: hsl(120, 32%, 39%);
|
||||
--btn-hover-border-color: hsl(120, 32%, 39%);
|
||||
--btn-focus-shadow-rgb: 68, 131, 68;
|
||||
--btn-active-color: hsl(0, 0%, 100%);
|
||||
--btn-active-bg: hsl(120, 32%, 39%);
|
||||
--btn-active-border-color: hsl(120, 32%, 39%);
|
||||
--btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
|
||||
--btn-disabled-color: hsl(120, 32%, 39%);
|
||||
--btn-disabled-bg: transparent;
|
||||
--btn-disabled-border-color: hsl(120, 32%, 39%);
|
||||
--gradient: none;
|
||||
}
|
||||
|
||||
.btn-outline-info {
|
||||
--btn-color: hsl(207, 49%, 37%);
|
||||
--btn-border-color: hsl(207, 49%, 37%);
|
||||
--btn-hover-color: hsl(0, 0%, 100%);
|
||||
--btn-hover-bg: hsl(207, 49%, 37%);
|
||||
--btn-hover-border-color: hsl(207, 49%, 37%);
|
||||
--btn-focus-shadow-rgb: 48, 99, 141;
|
||||
--btn-active-color: hsl(0, 0%, 100%);
|
||||
--btn-active-bg: hsl(207, 49%, 37%);
|
||||
--btn-active-border-color: hsl(207, 49%, 37%);
|
||||
--btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
|
||||
--btn-disabled-color: hsl(207, 49%, 37%);
|
||||
--btn-disabled-bg: transparent;
|
||||
--btn-disabled-border-color: hsl(207, 49%, 37%);
|
||||
--gradient: none;
|
||||
}
|
||||
|
||||
.btn-outline-warning {
|
||||
--btn-color: hsl(34, 100%, 34%);
|
||||
--btn-border-color: hsl(34, 100%, 34%);
|
||||
--btn-hover-color: hsl(0, 0%, 100%);
|
||||
--btn-hover-bg: hsl(34, 100%, 34%);
|
||||
--btn-hover-border-color: hsl(34, 100%, 34%);
|
||||
--btn-focus-shadow-rgb: 173, 98, 0;
|
||||
--btn-active-color: hsl(0, 0%, 100%);
|
||||
--btn-active-bg: hsl(34, 100%, 34%);
|
||||
--btn-active-border-color: hsl(34, 100%, 34%);
|
||||
--btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
|
||||
--btn-disabled-color: hsl(34, 100%, 34%);
|
||||
--btn-disabled-bg: transparent;
|
||||
--btn-disabled-border-color: hsl(34, 100%, 34%);
|
||||
--gradient: none;
|
||||
}
|
||||
|
||||
.btn-outline-danger {
|
||||
--btn-color: hsl(3, 75%, 37%);
|
||||
--btn-border-color: hsl(3, 75%, 37%);
|
||||
--btn-hover-color: hsl(0, 0%, 100%);
|
||||
--btn-hover-bg: hsl(3, 75%, 37%);
|
||||
--btn-hover-border-color: hsl(3, 75%, 37%);
|
||||
--btn-focus-shadow-rgb: 165, 31, 24;
|
||||
--btn-active-color: hsl(0, 0%, 100%);
|
||||
--btn-active-bg: hsl(3, 75%, 37%);
|
||||
--btn-active-border-color: hsl(3, 75%, 37%);
|
||||
--btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
|
||||
--btn-disabled-color: hsl(3, 75%, 37%);
|
||||
--btn-disabled-bg: transparent;
|
||||
--btn-disabled-border-color: hsl(3, 75%, 37%);
|
||||
--gradient: none;
|
||||
}
|
||||
|
||||
.btn-outline-light {
|
||||
--btn-color: hsl(210, 17%, 98%);
|
||||
--btn-border-color: hsl(210, 17%, 98%);
|
||||
--btn-hover-color: hsl(0, 0%, 0%);
|
||||
--btn-hover-bg: hsl(210, 17%, 98%);
|
||||
--btn-hover-border-color: hsl(210, 17%, 98%);
|
||||
--btn-focus-shadow-rgb: 249, 250, 251;
|
||||
--btn-active-color: hsl(0, 0%, 0%);
|
||||
--btn-active-bg: hsl(210, 17%, 98%);
|
||||
--btn-active-border-color: hsl(210, 17%, 98%);
|
||||
--btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
|
||||
--btn-disabled-color: hsl(210, 17%, 98%);
|
||||
--btn-disabled-bg: transparent;
|
||||
--btn-disabled-border-color: hsl(210, 17%, 98%);
|
||||
--gradient: none;
|
||||
}
|
||||
|
||||
.btn-outline-dark {
|
||||
--btn-color: hsl(210, 10%, 23%);
|
||||
--btn-border-color: hsl(210, 10%, 23%);
|
||||
--btn-hover-color: hsl(0, 0%, 100%);
|
||||
--btn-hover-bg: hsl(210, 10%, 23%);
|
||||
--btn-hover-border-color: hsl(210, 10%, 23%);
|
||||
--btn-focus-shadow-rgb: 53, 59, 65;
|
||||
--btn-active-color: hsl(0, 0%, 100%);
|
||||
--btn-active-bg: hsl(210, 10%, 23%);
|
||||
--btn-active-border-color: hsl(210, 10%, 23%);
|
||||
--btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
|
||||
--btn-disabled-color: hsl(210, 10%, 23%);
|
||||
--btn-disabled-bg: transparent;
|
||||
--btn-disabled-border-color: hsl(210, 10%, 23%);
|
||||
--gradient: none;
|
||||
}
|
||||
|
||||
.btn-link {
|
||||
--btn-font-weight: 400;
|
||||
--btn-color: var(--link-color);
|
||||
--btn-bg: transparent;
|
||||
--btn-border-color: transparent;
|
||||
--btn-hover-color: var(--link-hover-color);
|
||||
--btn-hover-border-color: transparent;
|
||||
--btn-active-color: var(--link-hover-color);
|
||||
--btn-active-border-color: transparent;
|
||||
--btn-disabled-color: hsl(210, 7%, 46%);
|
||||
--btn-disabled-border-color: transparent;
|
||||
--btn-box-shadow: none;
|
||||
--btn-focus-shadow-rgb: 39, 39, 111;
|
||||
text-decoration: underline;
|
||||
}
|
||||
@@ -1,13 +1,82 @@
|
||||
:root, [data-bs-theme="light"] {
|
||||
--moko-cassiopeia-color-primary: #112855;
|
||||
--moko-cassiopeia-color-link: #224FAA;
|
||||
--moko-cassiopeia-color-hover: #224FAA;
|
||||
/*!
|
||||
* @package Joomla.Site
|
||||
* @subpackage Templates.moko-cassiopeia
|
||||
* @file /media/templates/sote/moko-cassiopeia/css/global/colors_standard.css
|
||||
*
|
||||
* © 2025 Moko Consulting — All Rights Reserved
|
||||
* @license GNU General Public License version 2 or later; see LICENSE.txt
|
||||
*
|
||||
* Website: https://mokoconsulting.tech
|
||||
* Email: hello@mokoconsulting.tech
|
||||
* Phone: +1 (931) 279-6313
|
||||
*/
|
||||
|
||||
--moko-cassiopeia-header-background-image: url('../../../../../media/templates/site/moko-cassiopeia/images/bg.svg');
|
||||
--moko-cassiopeia-header-background-position: auto;
|
||||
--moko-cassiopeia-header-background-attachment: fixed;
|
||||
--moko-cassiopeia-header-background-repeat: repeat;
|
||||
--moko-cassiopeia-header-background-size: auto;
|
||||
:root, [data-bs-theme="light"] {
|
||||
--color-primary: #112855;
|
||||
--color-link: #224FAA;
|
||||
--color-hover: #224FAA;
|
||||
|
||||
--header-background-image: url('../../../../../media/templates/site/moko-cassiopeia/images/bg.svg');
|
||||
--header-background-attachment: fixed;
|
||||
--header-background-repeat: repeat;
|
||||
--header-background-size: auto;
|
||||
|
||||
--container-below-topbar-bg-image: url('../../../../../media/templates/site/moko-cassiopeia/images/bg.svg');
|
||||
--container-below-topbar-bg-color: gray;
|
||||
--container-below-topbar-bg-position: auto;
|
||||
--container-below-topbar-bg-attachment: fixed;
|
||||
--container-below-topbar-bg-repeat: repeat;
|
||||
--container-below-topbar-bg-size: auto;
|
||||
--container-below-topbar-border: 0px solid black;
|
||||
--container-below-topbar-border-radius: 5px;
|
||||
|
||||
--container-top-a-bg-image: url('../../../../../media/templates/site/moko-cassiopeia/images/bg.svg');
|
||||
--container-top-a-bg-color: gray;
|
||||
--container-top-a-bg-position: auto;
|
||||
--container-top-a-bg-attachment: fixed;
|
||||
--container-top-a-bg-repeat: repeat;
|
||||
--container-top-a-bg-size: auto;
|
||||
--container-top-a-border: 1px solid black;
|
||||
--container-top-a-border-radius: 5px;
|
||||
|
||||
--container-top-b-bg-image: url('../../../../../media/templates/site/moko-cassiopeia/images/bg.svg');
|
||||
--container-top-b-bg-color: gray;
|
||||
--container-top-b-bg-position: auto;
|
||||
--container-top-b-bg-attachment: fixed;
|
||||
--container-top-b-bg-repeat: repeat;
|
||||
--container-top-b-bg-size: auto;
|
||||
--container-top-b-border: 1px solid black;
|
||||
--container-top-b-border-radius: 5px;
|
||||
|
||||
--container-toc-bg: white;
|
||||
--container-toc-color: var(--color-primary);
|
||||
|
||||
--container-sidebar-bg-image: url('../../../../../media/templates/site/moko-cassiopeia/images/bg.svg');
|
||||
--container-sidebar-bg-color: gray;
|
||||
--container-sidebar-bg-position: auto;
|
||||
--container-sidebar-bg-attachment: scroll;
|
||||
--container-sidebar-bg-repeat: repeat;
|
||||
--container-sidebar-bg-size: auto;
|
||||
--container-sidebar-border: 1px solid black;
|
||||
--container-sidebar-border-radius: 5px;
|
||||
|
||||
--container-bottom-a-bg-image: url('../../../../../media/templates/site/moko-cassiopeia/images/bg.svg');
|
||||
--container-bottom-a-bg-color: gray;
|
||||
--container-bottom-a-bg-position: auto;
|
||||
--container-bottom-a-bg-attachment: fixed;
|
||||
--container-bottom-a-bg-repeat: repeat;
|
||||
--container-bottom-a-bg-size: auto;
|
||||
--container-bottom-a-border: 1px solid black;
|
||||
--container-bottom-a-border-radius: 5px;
|
||||
|
||||
--container-bottom-b-bg-image: url('../../../../../media/templates/site/moko-cassiopeia/images/bg.svg');
|
||||
--container-bottom-b-bg-color: gray;
|
||||
--container-bottom-b-bg-position: auto;
|
||||
--container-bottom-b-bg-attachment: fixed;
|
||||
--container-bottom-b-bg-repeat: repeat;
|
||||
--container-bottom-b-bg-size: auto;
|
||||
--container-bottom-b-border: 1px solid black;
|
||||
--container-bottom-b-border-radius: 5px;
|
||||
|
||||
--nav-text-color: white;
|
||||
--nav-bg-color: #224FAA;
|
||||
|
||||
@@ -119,8 +119,8 @@
|
||||
src: url("../../../../../vendor/roboto-fontface/fonts/roboto/Roboto-BlackItalic.woff2") format("woff2"), url("../../../../../vendor/roboto-fontface/fonts/roboto/Roboto-BlackItalic.woff") format("woff");
|
||||
}
|
||||
:root {
|
||||
--moko-cassiopeia-font-family-body: "Roboto", sans-serif;
|
||||
--moko-cassiopeia-font-family-headings: "Roboto", sans-serif;
|
||||
--moko-cassiopeia-font-weight-headings: 700;
|
||||
--moko-cassiopeia-font-weight-normal: 400;
|
||||
--font-family-body: "Roboto", sans-serif;
|
||||
--font-family-headings: "Roboto", sans-serif;
|
||||
--font-weight-headings: 700;
|
||||
--font-weight-normal: 400;
|
||||
}
|
||||
@@ -43,9 +43,9 @@ body {
|
||||
footer {
|
||||
padding: 0 6em;
|
||||
color: hsl(0, 0%, 100%);
|
||||
background-color: var(--moko-cassiopeia-color-primary);
|
||||
background-image: -o-linear-gradient(315deg, var(--moko-cassiopeia-color-primary) 0%, var(--moko-cassiopeia-color-hover) 100%);
|
||||
background-image: linear-gradient(135deg, var(--moko-cassiopeia-color-primary) 0%, var(--moko-cassiopeia-color-hover) 100%);
|
||||
background-color: var(--color-primary);
|
||||
background-image: -o-linear-gradient(315deg, var(--color-primary) 0%, var(--color-hover) 100%);
|
||||
background-image: linear-gradient(135deg, var(--color-primary) 0%, var(--color-hover) 100%);
|
||||
border-radius: 5px 5px 0 0;
|
||||
}
|
||||
.footer{
|
||||
@@ -71,14 +71,14 @@ footer {
|
||||
margin: 0;
|
||||
color: hsl(0, 0%, 100%);
|
||||
text-align: center;
|
||||
background-color: var(--moko-cassiopeia-color-primary);
|
||||
background-image: -o-linear-gradient(315deg, var(--moko-cassiopeia-color-primary) 0%, var(--moko-cassiopeia-color-hover) 100%);
|
||||
background-image: linear-gradient(135deg, var(--moko-cassiopeia-color-primary) 0%, var(--moko-cassiopeia-color-hover) 100%);
|
||||
background-color: var(--color-primary);
|
||||
background-image: -o-linear-gradient(315deg, var(--color-primary) 0%, var(--color-hover) 100%);
|
||||
background-image: linear-gradient(135deg, var(--color-primary) 0%, var(--color-hover) 100%);
|
||||
border-radius: 5px 5px 0 0;
|
||||
}
|
||||
[dir=rtl] .header {
|
||||
background-image: -o-linear-gradient(315deg, var(--moko-cassiopeia-color-hover) 0%, var(--moko-cassiopeia-color-primary) 100%);
|
||||
background-image: linear-gradient(135deg, var(--moko-cassiopeia-color-hover) 0%, var(--moko-cassiopeia-color-primary) 100%);
|
||||
background-image: -o-linear-gradient(315deg, var(--color-hover) 0%, var(--color-primary) 100%);
|
||||
background-image: linear-gradient(135deg, var(--color-hover) 0%, var(--color-primary) 100%);
|
||||
}
|
||||
|
||||
.login {
|
||||
|
||||
@@ -49,7 +49,7 @@
|
||||
--font-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
||||
--font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
||||
--gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
|
||||
--body-font-family: var(--moko-cassiopeia-font-family-body, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
|
||||
--body-font-family: var(--font-family-body, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
|
||||
--body-font-size: 1rem;
|
||||
--body-font-weight: 400;
|
||||
--body-line-height: 1.5;
|
||||
@@ -65,8 +65,8 @@
|
||||
--border-radius-xl: 0.3rem;
|
||||
--border-radius-2xl: 0.3rem;
|
||||
--border-radius-pill: 50rem;
|
||||
--link-color: var(--moko-cassiopeia-color-link);
|
||||
--link-hover-color: var(--moko-cassiopeia-color-hover);
|
||||
--link-color: var(--color-link);
|
||||
--link-hover-color: var(--color-hover);
|
||||
--code-color: hsl(332, 79%, 58%);
|
||||
--highlight-bg: #fbeea8;
|
||||
}
|
||||
@@ -6251,7 +6251,7 @@ textarea.form-control-lg {
|
||||
display: block;
|
||||
padding: var(--tooltip-arrow-height);
|
||||
margin: var(--tooltip-margin);
|
||||
font-family: var(--moko-cassiopeia-font-family-body, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
|
||||
font-family: var(--font-family-body, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 1.5;
|
||||
@@ -6353,7 +6353,7 @@ textarea.form-control-lg {
|
||||
z-index: var(--popover-zindex);
|
||||
display: block;
|
||||
max-width: var(--popover-max-width);
|
||||
font-family: var(--moko-cassiopeia-font-family-body, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
|
||||
font-family: var(--font-family-body, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 1.5;
|
||||
@@ -12238,8 +12238,8 @@ h5,
|
||||
.h5,
|
||||
h6,
|
||||
.h6 {
|
||||
font-family: var(--moko-cassiopeia-font-family-headings, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
|
||||
font-weight: var(--moko-cassiopeia-font-weight-headings, 700);
|
||||
font-family: var(--font-family-headings, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
|
||||
font-weight: var(--font-weight-headings, 700);
|
||||
}
|
||||
|
||||
.display-1 {
|
||||
@@ -12263,25 +12263,25 @@ h6,
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--moko-cassiopeia-color-link);
|
||||
color: var(--color-link);
|
||||
}
|
||||
a:not([class]) {
|
||||
text-decoration: underline;
|
||||
}
|
||||
a:hover, a:focus {
|
||||
color: var(--moko-cassiopeia-color-hover);
|
||||
color: var(--color-hover);
|
||||
}
|
||||
a.navbar-brand {
|
||||
color: var(--moko-cassiopeia-color-brand);
|
||||
color: var(--color-brand);
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background-color: var(--moko-cassiopeia-color-primary);
|
||||
border-color: var(--moko-cassiopeia-color-primary);
|
||||
background-color: var(--color-primary);
|
||||
border-color: var(--color-primary);
|
||||
}
|
||||
.btn-primary:hover, .btn-primary:focus {
|
||||
background-color: var(--moko-cassiopeia-color-hover);
|
||||
border-color: var(--moko-cassiopeia-color-hover);
|
||||
background-color: var(--color-hover);
|
||||
border-color: var(--color-hover);
|
||||
}
|
||||
|
||||
.btn-group {
|
||||
@@ -12319,7 +12319,7 @@ dd {
|
||||
}
|
||||
|
||||
th dd {
|
||||
font-weight: var(--moko-cassiopeia-font-weight-normal, 400);
|
||||
font-weight: var(--font-weight-normal, 400);
|
||||
}
|
||||
|
||||
.com-contact__thumbnail {
|
||||
@@ -12413,10 +12413,10 @@ meter {
|
||||
}
|
||||
|
||||
.page-link {
|
||||
color: var(--moko-cassiopeia-color-link);
|
||||
color: var(--color-link);
|
||||
}
|
||||
.page-link:hover {
|
||||
color: var(--moko-cassiopeia-color-link);
|
||||
color: var(--color-link);
|
||||
}
|
||||
|
||||
.pager .pagination {
|
||||
@@ -12485,10 +12485,10 @@ meter {
|
||||
bottom: 1rem;
|
||||
z-index: 10000;
|
||||
padding: 0.5em;
|
||||
color: var(--moko-cassiopeia-color-primary, hsl(220, 67%, 20%));
|
||||
color: var(--color-primary, hsl(220, 67%, 20%));
|
||||
pointer-events: all;
|
||||
background-color: var(--white, hsl(0, 0%, 100%));
|
||||
border: 1px solid var(--moko-cassiopeia-color-primary, hsl(220, 67%, 20%));
|
||||
border: 1px solid var(--color-primary, hsl(220, 67%, 20%));
|
||||
border-radius: 0.25rem;
|
||||
opacity: 0;
|
||||
-webkit-transition: opacity 200ms ease-in;
|
||||
@@ -12500,7 +12500,7 @@ meter {
|
||||
}
|
||||
.back-to-top-link:hover, .back-to-top-link:focus {
|
||||
color: var(--white, hsl(0, 0%, 100%));
|
||||
background-color: var(--moko-cassiopeia-color-hover);
|
||||
background-color: var(--color-hover);
|
||||
border-color: var(--white, hsl(0, 0%, 100%));
|
||||
}
|
||||
|
||||
@@ -12558,9 +12558,9 @@ meter {
|
||||
.footer {
|
||||
margin-top: 1em;
|
||||
color: hsl(0, 0%, 100%);
|
||||
background-color: var(--moko-cassiopeia-color-primary);
|
||||
background-image: -o-linear-gradient(315deg, var(--moko-cassiopeia-color-hover) 0%, var(--moko-cassiopeia-color-primary) 100%) ;
|
||||
background-image: linear-gradient(135deg, var(--moko-cassiopeia-color-hover) 0%, var(--moko-cassiopeia-color-primary) 100%) ;
|
||||
background-color: var(--color-primary);
|
||||
background-image: -o-linear-gradient(315deg, var(--color-hover) 0%, var(--color-primary) 100%) ;
|
||||
background-image: linear-gradient(135deg, var(--color-hover) 0%, var(--color-primary) 100%) ;
|
||||
}
|
||||
.footer .grid-child {
|
||||
-webkit-box-align: center;
|
||||
@@ -12578,7 +12578,7 @@ meter {
|
||||
position: relative;
|
||||
}
|
||||
.footer .metismenu.mod-menu .mm-collapse {
|
||||
background: var(--moko-cassiopeia-color-primary);
|
||||
background: var(--color-primary);
|
||||
}
|
||||
@media (max-width: 991.98px) {
|
||||
.footer .grid-child {
|
||||
@@ -12737,7 +12737,7 @@ fieldset > * {
|
||||
left: 0;
|
||||
right: auto;
|
||||
z-index: 900;
|
||||
color: var(--moko-cassiopeia-color-link);
|
||||
color: var(--color-link);
|
||||
background-color: rgba(255, 255, 255, 0.5);
|
||||
border: 1px solid #58595a;
|
||||
border-radius: 0.25rem;
|
||||
@@ -12746,9 +12746,9 @@ fieldset > * {
|
||||
.container-header {
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
background-color: var(--moko-cassiopeia-color-primary);
|
||||
background-image: -o-linear-gradient(225deg, var(--moko-cassiopeia-color-primary) 0%, var(--moko-cassiopeia-color-hover) 100%);
|
||||
background-image: linear-gradient(-135deg, var(--moko-cassiopeia-color-primary) 0%, var(--moko-cassiopeia-color-hover) 100%);
|
||||
background-color: var(--color-primary);
|
||||
background-image: -o-linear-gradient(225deg, var(--color-primary) 0%, var(--color-hover) 100%);
|
||||
background-image: linear-gradient(-135deg, var(--color-primary) 0%, var(--color-hover) 100%);
|
||||
-webkit-box-shadow: 0 5px 5px hsla(0, 0%, 0%, 0.03) inset;
|
||||
box-shadow: 0 5px 5px hsla(0, 0%, 0%, 0.03) inset;
|
||||
}
|
||||
@@ -13192,7 +13192,7 @@ iframe {
|
||||
}
|
||||
|
||||
.modal-title {
|
||||
font-weight: var(--moko-cassiopeia-font-weight-normal, 400);
|
||||
font-weight: var(--font-weight-normal, 400);
|
||||
line-height: 3rem;
|
||||
}
|
||||
|
||||
@@ -13310,8 +13310,8 @@ iframe {
|
||||
}
|
||||
.boxed .blog-item {
|
||||
background-color: hsl(0, 0%, 100%);
|
||||
-webkit-box-shadow: 0 0 2px hsla(216, 13%, 23%, 0.1), 0 2px 5px hsla(216, 13%, 23%, 0.08), 0 5px 15px hsla(216, 13%, 23%, 0.08), inset 0 3px 0 var(--moko-cassiopeia-color-primary);
|
||||
box-shadow: 0 0 2px hsla(216, 13%, 23%, 0.1), 0 2px 5px hsla(216, 13%, 23%, 0.08), 0 5px 15px hsla(216, 13%, 23%, 0.08), inset 0 3px 0 var(--moko-cassiopeia-color-primary);
|
||||
-webkit-box-shadow: 0 0 2px hsla(216, 13%, 23%, 0.1), 0 2px 5px hsla(216, 13%, 23%, 0.08), 0 5px 15px hsla(216, 13%, 23%, 0.08), inset 0 3px 0 var(--color-primary);
|
||||
box-shadow: 0 0 2px hsla(216, 13%, 23%, 0.1), 0 2px 5px hsla(216, 13%, 23%, 0.08), 0 5px 15px hsla(216, 13%, 23%, 0.08), inset 0 3px 0 var(--color-primary);
|
||||
}
|
||||
.boxed .blog-item .item-content {
|
||||
padding: 25px;
|
||||
@@ -13909,7 +13909,7 @@ body:not(.has-sidebar-left) .site-grid .container-component {
|
||||
}
|
||||
.form-select[multiple] option:checked, [multiple].custom-select option:checked {
|
||||
color: hsl(0, 0%, 100%);
|
||||
background-color: var(--moko-cassiopeia-color-primary) !important;
|
||||
background-color: var(--color-primary) !important;
|
||||
}
|
||||
.form-select.form-select-success, .form-select-success.custom-select, .form-select.custom-select-success, .custom-select-success.custom-select {
|
||||
color: hsl(120, 32%, 39%);
|
||||
@@ -13937,11 +13937,11 @@ body:not(.has-sidebar-left) .site-grid .container-component {
|
||||
.accordion .card-header {
|
||||
display: block;
|
||||
font-size: 1.25rem;
|
||||
font-weight: var(--moko-cassiopeia-font-weight-headings, 700);
|
||||
font-weight: var(--font-weight-headings, 700);
|
||||
line-height: 1.2;
|
||||
}
|
||||
.accordion .list-group-item {
|
||||
color: var(--moko-cassiopeia-color-link);
|
||||
color: var(--color-link);
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
@@ -14085,7 +14085,7 @@ body:not(.has-sidebar-left) .site-grid .container-component {
|
||||
.nav.nav-tabs .nav-link {
|
||||
position: relative;
|
||||
padding: 0.75em 1em;
|
||||
color: var(--moko-cassiopeia-color-primary);
|
||||
color: var(--color-primary);
|
||||
border: 0;
|
||||
border-top-right-radius: 0;
|
||||
border-top-left-radius: 0;
|
||||
@@ -14111,7 +14111,7 @@ body:not(.has-sidebar-left) .site-grid .container-component {
|
||||
right: 0;
|
||||
height: 5px;
|
||||
content: "";
|
||||
background-color: var(--moko-cassiopeia-color-primary);
|
||||
background-color: var(--color-primary);
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1,4 +0,0 @@
|
||||
/*!
|
||||
* Bootstrap Table of Contents v1.0.1 (http://afeld.github.io/bootstrap-toc/)
|
||||
* Copyright 2015 Aidan Feldman
|
||||
* Licensed under MIT (https://github.com/afeld/bootstrap-toc/blob/gh-pages/LICENSE.md) */nav[data-toggle=toc] .nav>li>a{display:block;padding:4px 20px;font-size:13px;font-weight:500;color:#767676}nav[data-toggle=toc] .nav>li>a:focus,nav[data-toggle=toc] .nav>li>a:hover{padding-left:19px;color:#563d7c;text-decoration:none;background-color:transparent;border-left:1px solid #563d7c}nav[data-toggle=toc] .nav-link.active,nav[data-toggle=toc] .nav-link.active:focus,nav[data-toggle=toc] .nav-link.active:hover{padding-left:18px;font-weight:700;color:#563d7c;background-color:transparent;border-left:2px solid #563d7c}nav[data-toggle=toc] .nav-link+ul{display:none;padding-bottom:10px}nav[data-toggle=toc] .nav .nav>li>a{padding-top:1px;padding-bottom:1px;padding-left:30px;font-size:12px;font-weight:400}nav[data-toggle=toc] .nav .nav>li>a:focus,nav[data-toggle=toc] .nav .nav>li>a:hover{padding-left:29px}nav[data-toggle=toc] .nav .nav>li>.active,nav[data-toggle=toc] .nav .nav>li>.active:focus,nav[data-toggle=toc] .nav .nav>li>.active:hover{padding-left:28px;font-weight:500}nav[data-toggle=toc] .nav-link.active+ul{display:block}
|
||||
@@ -392,14 +392,14 @@
|
||||
.choices__list--multiple .choices__item {
|
||||
position: relative;
|
||||
margin: 2px;
|
||||
background-color: var(--moko-cassiopeia-color-primary);
|
||||
background-color: var(--color-primary);
|
||||
-webkit-margin-end: 2px;
|
||||
margin-inline-end: 2px;
|
||||
border: 0;
|
||||
border-radius: 0.25rem;
|
||||
}
|
||||
.choices__list--multiple .choices__item.is-highlighted {
|
||||
background-color: var(--moko-cassiopeia-color-primary);
|
||||
background-color: var(--color-primary);
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
|
||||
@@ -1,7 +0,0 @@
|
||||
/**
|
||||
* @package Joomla.Site
|
||||
* @subpackage Templates.Cassiopeia
|
||||
* @copyright (C) 2017 Open Source Matters, Inc. <https://www.joomla.org>
|
||||
* @license GNU General Public License version 2 or later; see LICENSE.txt
|
||||
* @since 4.0.0
|
||||
*/Joomla=window.Joomla||{},((s,e)=>{function r(l){(l&&l.target?l.target:e).querySelectorAll("fieldset.btn-group").forEach(t=>{t.getAttribute("disabled")===!0&&(t.style.pointerEvents="none",t.querySelectorAll(".btn").forEach(a=>a.classList.add("disabled")))})}e.addEventListener("DOMContentLoaded",l=>{r(l);const o=e.getElementById("back-top");function t(){e.body.scrollTop>20||e.documentElement.scrollTop>20?o.classList.add("visible"):o.classList.remove("visible")}o&&(t(),window.addEventListener("scroll",t),o.addEventListener("click",a=>{a.preventDefault(),window.scrollTo(0,0)})),e.head.querySelectorAll('link[rel="lazy-stylesheet"]').forEach(a=>{a.rel="stylesheet"})}),e.addEventListener("joomla:updated",r)})(Joomla,document);
|
||||
253
readme.md
Normal file
253
readme.md
Normal file
@@ -0,0 +1,253 @@
|
||||
# Moko-Cassiopeia
|
||||
|
||||
A modern, lightweight enhancement layer for Joomla’s Cassiopeia template. Moko-Cassiopeia adds **Font Awesome 6**, **Bootstrap 5** helpers, an automatic **Table of Contents (TOC)** utility, and optional **Moko Expansions** including **Google Tag Manager** and **Google Analytics (GA4)** hooks—all while keeping core template overrides minimal and upgrade‑friendly.
|
||||
|
||||
---
|
||||
|
||||
## Table of Contents
|
||||
|
||||
- [Features](#features)
|
||||
- [Requirements](#requirements)
|
||||
- [Quick Start](#quick-start)
|
||||
- [Installation](#installation)
|
||||
- [Configuration](#configuration)
|
||||
- [Global Params](#global-params)
|
||||
- [Font Awesome 6](#font-awesome-6)
|
||||
- [Bootstrap 5 Helpers](#bootstrap-5-helpers)
|
||||
- [TOC Function](#toc-function)
|
||||
- [Moko Expansions](#moko-expansions)
|
||||
- [Google Tag Manager](#google-tag-manager)
|
||||
- [Google Analytics (GA4)](#google-analytics-ga4)
|
||||
- [CSS Variables](#css-variables)
|
||||
- [Usage Examples](#usage-examples)
|
||||
- [Best Practices](#best-practices)
|
||||
- [Development](#development)
|
||||
- [Changelog](#changelog)
|
||||
- [License](#license)
|
||||
|
||||
---
|
||||
|
||||
## Features
|
||||
|
||||
- **Font Awesome 6**: Solid, Regular, Brands (locally enqueued or CDN with Subresource Integrity).
|
||||
- **Bootstrap 5**: Utility classes, grid, and components available to your layouts and modules.
|
||||
- **Auto TOC**: Generate an in‑page Table of Contents from headings with a single data attribute.
|
||||
- **Moko Expansions**:
|
||||
- **GTM**: Drop‑in dataLayer and container injection with a template param.
|
||||
- **GA4**: Native GA4 Measurement ID support (with or without GTM).
|
||||
- **Production‑safe**: Assets loaded conditionally; no duplicate library loads if another extension already enqueues them.
|
||||
- **Accessible by default**: TOC anchors and focus styles follow a11y guidelines.
|
||||
|
||||
## Requirements
|
||||
|
||||
- Joomla 4.4+ or Joomla 5+
|
||||
- PHP 8.1+
|
||||
- Cassiopeia as the active base template (Moko-Cassiopeia may be installed as a child/override set)
|
||||
|
||||
## Quick Start
|
||||
|
||||
1. Install the template package via Joomla Extension Manager.
|
||||
2. In the Template Style settings, enable the features you want (FA6, BS5, TOC, GTM/GA).
|
||||
3. (Optional) Add a TOC container to any article or module using the data attribute shown below.
|
||||
|
||||
## Installation
|
||||
|
||||
1. Go to 'System' → 'Install' → 'Extensions'.
|
||||
2. Upload 'Moko-Cassiopeia.zip'.
|
||||
3. After installation, go to 'System' → 'Site Templates' → 'Styles' and open 'Moko-Cassiopeia'.
|
||||
4. Choose 'Default' to make it your active style (or assign per menu item).
|
||||
|
||||
## Configuration
|
||||
|
||||
Configuration lives in the Template Style parameters. Common params are listed below. Names may vary slightly depending on release.
|
||||
|
||||
### Global Params
|
||||
|
||||
- 'load\_bootstrap5' (bool): Enqueue Bootstrap 5 core CSS/JS if not provided by Joomla context.
|
||||
- 'load\_fontawesome6' (bool): Enqueue Font Awesome 6 (solid, regular, brands).
|
||||
- 'use\_cdn' (bool): Use CDN with SRI instead of local assets.
|
||||
- 'minified' (bool): Prefer '.min' assets.
|
||||
- 'defer\_js' (bool): Add 'defer' to template‑injected scripts where safe.
|
||||
|
||||
### Font Awesome 6
|
||||
|
||||
When enabled, the template registers FA6 and exposes the standard icon syntax:
|
||||
|
||||
```html
|
||||
<i class='fa-solid fa-circle-check' aria-hidden='true'></i>
|
||||
<span class='visually-hidden'>Success</span>
|
||||
```
|
||||
|
||||
**Notes**
|
||||
|
||||
- Icons are decorative unless paired with text or 'aria-label'.
|
||||
- Prefer the 'fa-solid', 'fa-regular', or 'fa-brands' families explicitly.
|
||||
|
||||
### Bootstrap 5 Helpers
|
||||
|
||||
If 'load\_bootstrap5' is enabled, grid and utilities are available:
|
||||
|
||||
```html
|
||||
<div class='container'>
|
||||
<div class='row g-3'>
|
||||
<div class='col-12 col-md-6'>Left</div>
|
||||
<div class='col-12 col-md-6'>Right</div>
|
||||
</div>
|
||||
</div>
|
||||
```
|
||||
|
||||
You can also use helpers like 'ratio', 'visually-hidden', 'd-flex', and spacing utilities (e.g., 'mt-3', 'px-4').
|
||||
|
||||
### TOC Function
|
||||
|
||||
Moko-Cassiopeia ships a tiny script that scans within a container for headings (h2–h6) and builds a nested TOC with anchor links.
|
||||
|
||||
**Enable**: Turn on 'auto\_toc' in Template Style.
|
||||
|
||||
**Place a TOC container**:
|
||||
|
||||
```html
|
||||
<nav class='toc' data-moko-toc='true' data-moko-toc-target='#article-body' aria-label='Table of contents'></nav>
|
||||
```
|
||||
|
||||
**Mark your content region**:
|
||||
|
||||
```html
|
||||
<article id='article-body'>
|
||||
<h2>Section A</h2>
|
||||
<p>...</p>
|
||||
<h3>Subsection A.1</h3>
|
||||
<p>...</p>
|
||||
</article>
|
||||
```
|
||||
|
||||
**Options via data attributes**
|
||||
|
||||
- 'data-moko-toc-target': CSS selector for the content area (default: 'main').
|
||||
- 'data-moko-toc-levels': CSV or range string like '2-4' (default: '2-4').
|
||||
- 'data-moko-toc-collapsible': 'true'|'false' to make nested lists collapsible.
|
||||
|
||||
**Styling**
|
||||
|
||||
A minimal stylesheet is included. Customize using the CSS variables below or add your own overrides.
|
||||
|
||||
### Moko Expansions
|
||||
|
||||
#### Google Tag Manager
|
||||
|
||||
Enable GTM by entering your container ID (e.g., 'GTM-XXXXXXX') in Template Style under 'Moko Expansions'. The template will inject the standard script and 'noscript' iframe per Google guidance.
|
||||
|
||||
**Data Layer**
|
||||
|
||||
You can push events from modules or overrides like so:
|
||||
|
||||
```html
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
window.dataLayer.push({
|
||||
'event': 'moko_event',
|
||||
'moko_category': 'ui',
|
||||
'moko_action': 'toc_opened',
|
||||
'moko_label': 'sidebar'
|
||||
});
|
||||
</script>
|
||||
```
|
||||
|
||||
#### Google Analytics (GA4)
|
||||
|
||||
Two options:
|
||||
|
||||
1. **Direct GA4**: Provide 'G-' Measurement ID (e.g., 'G-ABC123XYZ'). The template injects the GA4 base script.
|
||||
|
||||
2. **Via GTM**: Leave GA4 field empty and configure GA4 inside your GTM container.
|
||||
|
||||
```html
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
window.dataLayer.push({ 'event': 'page_view' });
|
||||
</script>
|
||||
```
|
||||
|
||||
> Tip: When both GTM and direct GA4 are set, the template prefers GTM to avoid duplicate pageviews.
|
||||
|
||||
## CSS Variables
|
||||
|
||||
Moko-Cassiopeia exposes custom properties for theme tuning. Example set:
|
||||
|
||||
```css
|
||||
:root {
|
||||
--moko-cassiopeia-color-primary: #0b4008;
|
||||
--moko-cassiopeia-color-link: #0b4008;
|
||||
--moko-cassiopeia-color-hover: #000000;
|
||||
|
||||
--moko-cassiopeia-header-background-image: linear-gradient(30deg, #fefcf9, var(--accent-color-primary));
|
||||
--moko-cassiopeia-header-background-position: auto;
|
||||
--moko-cassiopeia-header-background-attachment: fixed;
|
||||
--moko-cassiopeia-header-background-repeat: repeat;
|
||||
--moko-cassiopeia-header-background-size: auto;
|
||||
}
|
||||
```
|
||||
|
||||
> Apply these in a custom stylesheet or template options if provided. Use semantic variables where possible to maintain consistency.
|
||||
|
||||
## Usage Examples
|
||||
|
||||
### 1) FA6 Icon Buttons
|
||||
|
||||
```html
|
||||
<a class='btn btn-primary d-inline-flex align-items-center' href='#'>
|
||||
<i class='fa-solid fa-bolt me-2' aria-hidden='true'></i>
|
||||
<span>Action</span>
|
||||
</a>
|
||||
```
|
||||
|
||||
### 2) Sticky Sidebar TOC
|
||||
|
||||
```html
|
||||
<aside class='position-sticky top-0 pt-3'>
|
||||
<nav class='toc' data-moko-toc='true' data-moko-toc-target='#content'></nav>
|
||||
</aside>
|
||||
```
|
||||
|
||||
### 3) Module‑driven GA Event
|
||||
|
||||
```php
|
||||
<?php
|
||||
// In a custom module layout
|
||||
$label = 'cta_hero';
|
||||
?>
|
||||
<button class='btn btn-outline-primary' onclick='window.dataLayer && window.dataLayer.push({"event": "cta_click", "label": "<?php echo $label; ?>"})'>
|
||||
Click me
|
||||
</button>
|
||||
```
|
||||
|
||||
> Note: We use single quotes in HTML where possible to keep consistency with PHP string style preferences.
|
||||
|
||||
## Best Practices
|
||||
|
||||
- **One source of truth** for analytics injection (prefer GTM, or direct GA4—not both).
|
||||
- **Defer non‑critical JS** using the 'defer\_js' param when feasible.
|
||||
- **Avoid duplicate libraries** if another extension already loads FA6/BS5.
|
||||
- **Respect a11y**: Provide visible focus, 'visually-hidden' labels, and heading order for the TOC.
|
||||
- **Cache smartly**: After enabling new features, clear Joomla cache and any CDN cache to propagate assets.
|
||||
|
||||
## Development
|
||||
|
||||
- Source structure follows Joomla template conventions:
|
||||
- '/css', '/js', '/images', '/html' (overrides), 'templateDetails.xml'
|
||||
- Scripts are enqueued via the template's 'index.php' with conditional params.
|
||||
- Build/compile steps (if using bundlers) are noted in 'package.json' (when applicable).
|
||||
|
||||
**Local overrides**
|
||||
|
||||
- Place site‑specific CSS in '/css/custom.css'.
|
||||
- Use '/html' for component/module layout overrides as needed.
|
||||
|
||||
## Changelog
|
||||
|
||||
- 1.0.0: Initial public release with FA6, BS5, TOC, GTM/GA hooks.
|
||||
|
||||
## License
|
||||
|
||||
Distributed under the GNU General Public License v3. See 'LICENSE' for details.
|
||||
|
||||
@@ -35,10 +35,10 @@ if ($paramsFontScheme) {
|
||||
$wa->registerAndUseStyle('fontscheme.current', $paramsFontScheme, [], ['media' => 'print', 'rel' => 'lazy-stylesheet', 'onload' => 'this.media=\'all\'', 'crossorigin' => 'anonymous']);
|
||||
|
||||
if (preg_match_all('/family=([^?:]*):/i', $paramsFontScheme, $matches) > 0) {
|
||||
$fontStyles = '--moko-cassiopeia-font-family-body: "' . str_replace('+', ' ', $matches[1][0]) . '", sans-serif;
|
||||
--moko-cassiopeia-font-family-headings: "' . str_replace('+', ' ', isset($matches[1][1]) ? $matches[1][1] : $matches[1][0]) . '", sans-serif;
|
||||
--moko-cassiopeia-font-weight-normal: 400;
|
||||
--moko-cassiopeia-font-weight-headings: 700;';
|
||||
$fontStyles = '--font-family-body: "' . str_replace('+', ' ', $matches[1][0]) . '", sans-serif;
|
||||
--font-family-headings: "' . str_replace('+', ' ', isset($matches[1][1]) ? $matches[1][1] : $matches[1][0]) . '", sans-serif;
|
||||
--font-weight-normal: 400;
|
||||
--font-weight-headings: 700;';
|
||||
}
|
||||
} else {
|
||||
$wa->registerAndUseStyle('fontscheme.current', $paramsFontScheme, ['version' => 'auto'], ['media' => 'print', 'rel' => 'lazy-stylesheet', 'onload' => 'this.media=\'all\'']);
|
||||
|
||||
@@ -1,4 +1,16 @@
|
||||
<?php
|
||||
/**
|
||||
* @package Joomla.Site
|
||||
* @subpackage Templates.moko-cassiopeia
|
||||
* @file /templates/moko-cassiopeia/custom.php
|
||||
*
|
||||
* @copyright © 2025 Moko Consulting — All Rights Reserved
|
||||
* @license GNU General Public License version 2 or later; see LICENSE.txt
|
||||
*
|
||||
* Website: https://mokoconsulting.tech
|
||||
* Email: hello@mokoconsulting.tech
|
||||
* Phone: +1 (931) 279-6313
|
||||
*/
|
||||
function console_log($output, $with_script_tags = true) {
|
||||
$js_code = 'console.log(' . json_encode($output, JSON_HEX_TAG) .
|
||||
');';
|
||||
|
||||
@@ -1,11 +1,15 @@
|
||||
<?php
|
||||
|
||||
/**
|
||||
* @package Joomla.Site
|
||||
* @subpackage Templates.Moko-Cassiopeia
|
||||
* @subpackage Templates.moko-cassiopeia
|
||||
* @file /templates/moko-cassiopeia/error.php
|
||||
*
|
||||
* @copyright (C) 2017 Open Source Matters, Inc. <https://www.joomla.org>
|
||||
* @copyright © 2025 Moko Consulting — All Rights Reserved
|
||||
* @license GNU General Public License version 2 or later; see LICENSE.txt
|
||||
*
|
||||
* Website: https://mokoconsulting.tech
|
||||
* Email: hello@mokoconsulting.tech
|
||||
* Phone: +1 (931) 279-6313
|
||||
*/
|
||||
|
||||
defined('_JEXEC') or die;
|
||||
@@ -72,10 +76,10 @@ if ($paramsFontScheme) {
|
||||
$wa->registerAndUseStyle('fontscheme.current', $paramsFontScheme, [], ['media' => 'print', 'rel' => 'lazy-stylesheet', 'onload' => 'this.media=\'all\'', 'crossorigin' => 'anonymous']);
|
||||
|
||||
if (preg_match_all('/family=([^?:]*):/i', $paramsFontScheme, $matches) > 0) {
|
||||
$fontStyles = '--moko-cassiopeia-font-family-body: "' . str_replace('+', ' ', $matches[1][0]) . '", sans-serif;
|
||||
--moko-cassiopeia-font-family-headings: "' . str_replace('+', ' ', isset($matches[1][1]) ? $matches[1][1] : $matches[1][0]) . '", sans-serif;
|
||||
--moko-cassiopeia-font-weight-normal: 400;
|
||||
--moko-cassiopeia-font-weight-headings: 700;';
|
||||
$fontStyles = '--font-family-body: "' . str_replace('+', ' ', $matches[1][0]) . '", sans-serif;
|
||||
--font-family-headings: "' . str_replace('+', ' ', isset($matches[1][1]) ? $matches[1][1] : $matches[1][0]) . '", sans-serif;
|
||||
--font-weight-normal: 400;
|
||||
--font-weight-headings: 700;';
|
||||
}
|
||||
} else {
|
||||
$wa->registerAndUseStyle('fontscheme.current', $paramsFontScheme, ['version' => 'auto'], ['media' => 'print', 'rel' => 'lazy-stylesheet', 'onload' => 'this.media=\'all\'']);
|
||||
|
||||
@@ -1,94 +0,0 @@
|
||||
<?php
|
||||
|
||||
/**
|
||||
* @package Joomla.Site
|
||||
* @subpackage com_content
|
||||
*
|
||||
* @copyright (C) 2020 Open Source Matters, Inc. <https://www.joomla.org>
|
||||
* @copyright (C) 2025 Jonathan Miler || Moko Consulting <https://mokoconsulting.tech>
|
||||
* @license GNU General Public License version 2 or later; see LICENSE.txt
|
||||
*/
|
||||
|
||||
defined('_JEXEC') or die;
|
||||
|
||||
use Joomla\CMS\HTML\HTMLHelper;
|
||||
|
||||
// Create shortcut
|
||||
$urls = json_decode($this->item->urls);
|
||||
|
||||
// Create shortcuts to some parameters.
|
||||
$params = $this->item->params;
|
||||
if ($urls && (!empty($urls->urla) || !empty($urls->urlb) || !empty($urls->urlc))) :
|
||||
?>
|
||||
<div class="com-content-article__links content-links">
|
||||
<ul class="com-content-article__links content-list">
|
||||
<?php
|
||||
$urlarray = [
|
||||
[$urls->urla, $urls->urlatext, $urls->targeta, 'a'],
|
||||
[$urls->urlb, $urls->urlbtext, $urls->targetb, 'b'],
|
||||
[$urls->urlc, $urls->urlctext, $urls->targetc, 'c']
|
||||
];
|
||||
foreach ($urlarray as $url) :
|
||||
$link = $url[0];
|
||||
$label = $url[1];
|
||||
$target = $url[2];
|
||||
$id = $url[3];
|
||||
|
||||
if (! $link) :
|
||||
continue;
|
||||
endif;
|
||||
|
||||
// If no label is present, take the link
|
||||
$label = $label ?: $link;
|
||||
|
||||
// If no target is present, use the default
|
||||
$target = $target ?: $params->get('target' . $id);
|
||||
?>
|
||||
<li class="com-content-article__link content-links-<?php echo $id; ?>">
|
||||
<?php
|
||||
// Compute the correct link
|
||||
|
||||
switch ($target) {
|
||||
case 1:
|
||||
// Open in a new window
|
||||
echo '<a href="' . htmlspecialchars($link, ENT_COMPAT, 'UTF-8') . '" target="_blank" rel="nofollow noopener noreferrer">' .
|
||||
htmlspecialchars($label, ENT_COMPAT, 'UTF-8') . '</a>';
|
||||
break;
|
||||
|
||||
case 2:
|
||||
// Open in a popup window
|
||||
$attribs = 'toolbar=no,location=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=600,height=600';
|
||||
echo "<a href=\"" . htmlspecialchars($link, ENT_COMPAT, 'UTF-8') . "\" onclick=\"window.open(this.href, 'targetWindow', '" . $attribs . "'); return false;\" rel=\"noopener noreferrer\">" .
|
||||
htmlspecialchars($label, ENT_COMPAT, 'UTF-8') . '</a>';
|
||||
break;
|
||||
case 3:
|
||||
echo '<a href="' . htmlspecialchars($link, ENT_COMPAT, 'UTF-8') . '" rel="noopener noreferrer" data-bs-toggle="modal" data-bs-target="#linkModal">' .
|
||||
htmlspecialchars($label, ENT_COMPAT, 'UTF-8') . ' </a>';
|
||||
echo HTMLHelper::_(
|
||||
'bootstrap.renderModal',
|
||||
'linkModal',
|
||||
[
|
||||
'url' => $link,
|
||||
'title' => $label,
|
||||
'height' => '100%',
|
||||
'width' => '100%',
|
||||
'modalWidth' => '500',
|
||||
'bodyHeight' => '500',
|
||||
'footer' => '<button type="button" class="btn btn-secondary" data-bs-dismiss="modal" aria-hidden="true">'
|
||||
. \Joomla\CMS\Language\Text::_('JLIB_HTML_BEHAVIOR_CLOSE') . '</button>'
|
||||
]
|
||||
);
|
||||
break;
|
||||
|
||||
default:
|
||||
// Open in parent window
|
||||
echo '<a href="' . htmlspecialchars($link, ENT_COMPAT, 'UTF-8') . '" rel="nofollow">' .
|
||||
htmlspecialchars($label, ENT_COMPAT, 'UTF-8') . ' </a>';
|
||||
break;
|
||||
}
|
||||
?>
|
||||
</li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
@@ -1,11 +1,15 @@
|
||||
<?php
|
||||
|
||||
/**
|
||||
* @package Joomla.Site
|
||||
* @subpackage com_content
|
||||
* @subpackage Templates.moko-cassiopeia
|
||||
* @file \templates\moko-cassiopeia\html\com_content\article\toc-left.php
|
||||
*
|
||||
* @copyright (C) 2006 Open Source Matters, Inc. <https://www.joomla.org>
|
||||
* © 2025 Moko Consulting — All Rights Reserved
|
||||
* @license GNU General Public License version 2 or later; see LICENSE.txt
|
||||
*
|
||||
* Website: https://mokoconsulting.tech
|
||||
* Email: hello@mokoconsulting.tech
|
||||
* Phone: +1 (931) 279-6313
|
||||
*/
|
||||
|
||||
defined('_JEXEC') or die;
|
||||
@@ -95,14 +99,20 @@ $isExpired = !is_null($this->item->publish_down) && $this->item->publish
|
||||
echo $this->item->pagination;
|
||||
endif;
|
||||
?>
|
||||
<?php if (isset($this->item->toc)) :
|
||||
echo $this->item->toc;
|
||||
endif; ?>
|
||||
<div itemprop="articleBody" class="com-content-article__body">
|
||||
<nav id="toc" data-toggle="toc"></nav>
|
||||
<div class="container-toc-left">
|
||||
<?php
|
||||
echo $this->item->text; ?>
|
||||
// Table of Contents header using template language string
|
||||
echo '<h2>' . Text::_('TPL_MOKO-CASSIOPEIA_TOC') . '</h2>';
|
||||
?>
|
||||
<nav id="toc" data-toggle="toc"></nav>
|
||||
</div>
|
||||
<?php
|
||||
echo $this->item->text;
|
||||
?>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<?php if ($info == 1 || $info == 2) : ?>
|
||||
<?php if ($useDefList) : ?>
|
||||
@@ -1,11 +1,15 @@
|
||||
<?php
|
||||
|
||||
/**
|
||||
* @package Joomla.Site
|
||||
* @subpackage com_content
|
||||
* @subpackage Templates.moko-cassiopeia
|
||||
* @file \templates\moko-cassiopeia\html\com_content\article\toc-right.php
|
||||
*
|
||||
* @copyright (C) 2006 Open Source Matters, Inc. <https://www.joomla.org>
|
||||
* © 2025 Moko Consulting — All Rights Reserved
|
||||
* @license GNU General Public License version 2 or later; see LICENSE.txt
|
||||
*
|
||||
* Website: https://mokoconsulting.tech
|
||||
* Email: hello@mokoconsulting.tech
|
||||
* Phone: +1 (931) 279-6313
|
||||
*/
|
||||
|
||||
defined('_JEXEC') or die;
|
||||
@@ -95,13 +99,22 @@ $isExpired = !is_null($this->item->publish_down) && $this->item->publish
|
||||
echo $this->item->pagination;
|
||||
endif;
|
||||
?>
|
||||
<?php if (isset($this->item->toc)) :
|
||||
echo $this->item->toc;
|
||||
endif; ?>
|
||||
<div itemprop="articleBody" class="com-content-article__body">
|
||||
<div class="container-toc-right">
|
||||
<?php
|
||||
// Table of Contents header using template language string
|
||||
|
||||
<?php echo $this->item->text; ?>
|
||||
echo '<h2>' . Text::_('TPL_MOKO-CASSIOPEIA_TOC') . '</h2>';
|
||||
?>
|
||||
|
||||
<nav id="toc" data-toggle="toc"></nav>
|
||||
</div>
|
||||
<?php
|
||||
echo $this->item->text;
|
||||
?>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<?php if ($info == 1 || $info == 2) : ?>
|
||||
<?php if ($useDefList) : ?>
|
||||
@@ -1,11 +1,14 @@
|
||||
<?php
|
||||
|
||||
/**
|
||||
* @package Joomla.Site
|
||||
* @subpackage Templates.Moko-Cassiopeia
|
||||
* @subpackage Templates.moko-cassiopeia
|
||||
*
|
||||
* @copyright (C) 2017 Open Source Matters, Inc. <https://www.joomla.org>
|
||||
* @copyright © 2025 Moko Consulting — All Rights Reserved
|
||||
* @license GNU General Public License version 2 or later; see LICENSE.txt
|
||||
*
|
||||
* Website: https://mokoconsulting.tech
|
||||
* Email: hello@mokoconsulting.tech
|
||||
* Phone: +1 (931) 279-6313
|
||||
*/
|
||||
|
||||
defined('_JEXEC') or die;
|
||||
@@ -20,9 +23,20 @@ use Joomla\CMS\Uri\Uri;
|
||||
$app = Factory::getApplication();
|
||||
$input = $app->getInput();
|
||||
$wa = $this->getWebAssetManager();
|
||||
$params_developmentmode = $this->params->get('developmentmode', false);
|
||||
$params_ColorName = $this->params->get('colorName', 'colors_standard');
|
||||
$params_GoogleTagManager = $this->params->get('googletagmanager', false);
|
||||
$params_GoogleTagManagerID = $this->params->get('googletagmanagerid', null);
|
||||
if ($params_developmentmode) {
|
||||
$params_googletagmanager = true;
|
||||
$params_googletagmanagerid = "GTM-WX6W2ZVB
|
||||
";
|
||||
$params_googleanalytics = true;
|
||||
$params_googleanalyticsid = "G-NJ6Z5NWZST";
|
||||
} else {
|
||||
$params_googletagmanager = $this->params->get('googletagmanager', false);
|
||||
$params_googletagmanagerid = $this->params->get('googletagmanagerid', null);
|
||||
$params_googleanalytics = $this->params->get('googleanalytics', false);
|
||||
$params_googleanalyticsid = $this->params->get('googleanalyticsid', null);
|
||||
}
|
||||
$params_custom_head_start = $this->params->get('custom_head_start', null);
|
||||
$params_custom_head_end = $this->params->get('custom_head_end', null);
|
||||
$params_leftIcon = htmlspecialchars(
|
||||
@@ -34,18 +48,6 @@ $params_rightIcon = htmlspecialchars(
|
||||
ENT_COMPAT, 'UTF-8'
|
||||
);
|
||||
|
||||
if ($params_GoogleTagManager && $params_GoogleTagManagerID) {
|
||||
?>
|
||||
<!-- Google Tag Manager -->
|
||||
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
|
||||
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
|
||||
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
|
||||
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
|
||||
})(window,document,'script','dataLayer','<?php echo $params_GoogleTagManagerID;?>');</script>
|
||||
<!-- End Google Tag Manager -->
|
||||
<?php
|
||||
}
|
||||
|
||||
// Add Bootstrap 5 Support
|
||||
HTMLHelper::_('bootstrap.framework');
|
||||
HTMLHelper::_('bootstrap.loadCss', true);
|
||||
@@ -91,10 +93,10 @@ if ($params_FontScheme) {
|
||||
$wa->registerAndUseStyle('fontscheme.current', $params_FontScheme, [], ['media' => 'print', 'rel' => 'lazy-stylesheet', 'onload' => 'this.media=\'all\'', 'crossorigin' => 'anonymous']);
|
||||
|
||||
if (preg_match_all('/family=([^?:]*):/i', $params_FontScheme, $matches) > 0) {
|
||||
$fontStyles = '--moko-cassiopeia-font-family-body: "' . str_replace('+', ' ', $matches[1][0]) . '", sans-serif;\n';
|
||||
$fontStyles .= '--moko-cassiopeia-font-family-headings: "' . str_replace('+', ' ', isset($matches[1][1]) ? $matches[1][1] : $matches[1][0]) . '", sans-serif;\n';
|
||||
$fontStyles .= '--moko-cassiopeia-font-weight-normal: 400;\n';
|
||||
$fontStyles .= '--moko-cassiopeia-font-weight-headings: 700;';
|
||||
$fontStyles = '--font-family-body: "' . str_replace('+', ' ', $matches[1][0]) . '", sans-serif;\n';
|
||||
$fontStyles .= '--font-family-headings: "' . str_replace('+', ' ', isset($matches[1][1]) ? $matches[1][1] : $matches[1][0]) . '", sans-serif;\n';
|
||||
$fontStyles .= '--font-weight-normal: 400;\n';
|
||||
$fontStyles .= '--font-weight-headings: 700;';
|
||||
}
|
||||
} else {
|
||||
$wa->registerAndUseStyle('fontscheme.current', $params_FontScheme, ['version' => 'auto'], ['media' => 'print', 'rel' => 'lazy-stylesheet', 'onload' => 'this.media=\'all\'']);
|
||||
@@ -182,12 +184,74 @@ $this->addScript($templatePath . '/js/vendor/afeld/bootstrap-toc.min.js');
|
||||
<?php if (trim($params_custom_head_end)) : ?><?php echo $params_custom_head_end; ?><?php endif; ?>
|
||||
</head>
|
||||
<body data-bs-spy="scroll" data-bs-target="#toc" class="site <?php echo $option . ' ' . $wrapper . ' view-' . $view . ($layout ? ' layout-' . $layout : ' no-layout') . ($task ? ' task-' . $task : ' no-task') . ($itemid ? ' itemid-' . $itemid : '') . ($pageclass ? ' ' . $pageclass : '') . $hasClass . ($this->direction == 'rtl' ? ' rtl' : ''); ?>">
|
||||
<?php if ($params_GoogleTagManager && $params_GoogleTagManagerID) : ?>
|
||||
<?php
|
||||
if (!empty($params_googletagmanager) && !empty($params_googletagmanagerid)) :
|
||||
$gtmID = htmlspecialchars($params_googletagmanagerid, ENT_QUOTES, 'UTF-8');
|
||||
?>
|
||||
<!-- Google Tag Manager -->
|
||||
<script>
|
||||
(function(w,d,s,l,i){
|
||||
w[l]=w[l]||[];
|
||||
w[l].push({'gtm.start': new Date().getTime(), event:'gtm.js'});
|
||||
var f=d.getElementsByTagName(s)[0],
|
||||
j=d.createElement(s),
|
||||
dl=l!='dataLayer'?'&l='+l:'';
|
||||
j.async=true;
|
||||
j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl;
|
||||
f.parentNode.insertBefore(j,f);
|
||||
})(window,document,'script','dataLayer','<?php echo $gtmID; ?>');
|
||||
</script>
|
||||
<!-- End Google Tag Manager -->
|
||||
|
||||
<!-- Google Tag Manager (noscript) -->
|
||||
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=<?php echo $params_GoogleTagManagerID; ?>" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
|
||||
<noscript>
|
||||
<iframe src="https://www.googletagmanager.com/ns.html?id=<?php echo $gtmID; ?>"
|
||||
height="0" width="0" style="display:none;visibility:hidden"></iframe>
|
||||
</noscript>
|
||||
<!-- End Google Tag Manager (noscript) -->
|
||||
<?php
|
||||
endif;
|
||||
if (!empty($params_googleanalytics) && !empty($params_googleanalyticsid)) :
|
||||
$gaId = htmlspecialchars($params_googleanalyticsid, ENT_QUOTES, 'UTF-8');
|
||||
?>
|
||||
<!-- Google Analytics (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=<?php echo $gaId; ?>"></script>
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
|
||||
gtag('js', new Date());
|
||||
|
||||
// Optional: Consent Mode defaults (adjust to your needs or remove)
|
||||
gtag('consent', 'default', {
|
||||
'ad_storage': 'denied',
|
||||
'analytics_storage': 'granted',
|
||||
'ad_user_data': 'denied',
|
||||
'ad_personalization': 'denied'
|
||||
});
|
||||
|
||||
// GA4 vs UA fallback
|
||||
(function(id){
|
||||
if (/^G-/.test(id)) {
|
||||
// GA4
|
||||
gtag('config', id, {
|
||||
'anonymize_ip': true
|
||||
});
|
||||
} else if (/^UA-/.test(id)) {
|
||||
// Legacy Universal Analytics (sunset by Google, kept for backward compat)
|
||||
gtag('config', id, {
|
||||
'anonymize_ip': true
|
||||
});
|
||||
console.warn('Using a UA- ID. Universal Analytics is sunset; consider migrating to GA4.');
|
||||
} else {
|
||||
console.warn('Unrecognized Google Analytics ID format:', id);
|
||||
}
|
||||
})('<?php echo $gaId; ?>');
|
||||
</script>
|
||||
<!-- End Google Analytics -->
|
||||
<?php endif; ?>
|
||||
|
||||
|
||||
<header class="header container-header full-width<?php echo $stickyHeader ? ' ' . $stickyHeader : ''; ?>">
|
||||
|
||||
<?php if ($this->countModules('topbar')) : ?>
|
||||
@@ -197,9 +261,9 @@ $this->addScript($templatePath . '/js/vendor/afeld/bootstrap-toc.min.js');
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="header-top">
|
||||
<?php if ($this->countModules('below-top')) : ?>
|
||||
<div class="grid-child container-below-top">
|
||||
<jdoc:include type="modules" name="below-top" style="none" />
|
||||
<?php if ($this->countModules('below-topbar')) : ?>
|
||||
<div class="grid-child container-below-topbar">
|
||||
<jdoc:include type="modules" name="below-topbar" style="none" />
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
|
||||
@@ -1,11 +1,15 @@
|
||||
<?php
|
||||
|
||||
/**
|
||||
* @package Joomla.Site
|
||||
* @subpackage Templates.Moko-Cassiopeia
|
||||
* @subpackage Templates.moko-cassiopeia
|
||||
* @file /templates/moko-cassiopeia/offline.php
|
||||
*
|
||||
* @copyright (C) 2017 Open Source Matters, Inc. <https://www.joomla.org>
|
||||
* @copyright © 2025 Moko Consulting — All Rights Reserved
|
||||
* @license GNU General Public License version 2 or later; see LICENSE.txt
|
||||
*
|
||||
* Website: https://mokoconsulting.tech
|
||||
* Email: hello@mokoconsulting.tech
|
||||
* Phone: +1 (931) 279-6313
|
||||
*/
|
||||
|
||||
defined('_JEXEC') or die;
|
||||
@@ -50,10 +54,10 @@ if ($paramsFontScheme) {
|
||||
$wa->registerAndUseStyle('fontscheme.current', $paramsFontScheme, [], ['media' => 'print', 'rel' => 'lazy-stylesheet', 'onload' => 'this.media=\'all\'', 'crossorigin' => 'anonymous']);
|
||||
|
||||
if (preg_match_all('/family=([^?:]*):/i', $paramsFontScheme, $matches) > 0) {
|
||||
$fontStyles = '--moko-cassiopeia-font-family-body: "' . str_replace('+', ' ', $matches[1][0]) . '", sans-serif;
|
||||
--moko-cassiopeia-font-family-headings: "' . str_replace('+', ' ', isset($matches[1][1]) ? $matches[1][1] : $matches[1][0]) . '", sans-serif;
|
||||
--moko-cassiopeia-font-weight-normal: 400;
|
||||
--moko-cassiopeia-font-weight-headings: 700;';
|
||||
$fontStyles = '--font-family-body: "' . str_replace('+', ' ', $matches[1][0]) . '", sans-serif;
|
||||
--font-family-headings: "' . str_replace('+', ' ', isset($matches[1][1]) ? $matches[1][1] : $matches[1][0]) . '", sans-serif;
|
||||
--font-weight-normal: 400;
|
||||
--font-weight-headings: 700;';
|
||||
}
|
||||
} else {
|
||||
$wa->registerAndUseStyle('fontscheme.current', $paramsFontScheme, ['version' => 'auto'], ['media' => 'print', 'rel' => 'lazy-stylesheet', 'onload' => 'this.media=\'all\'']);
|
||||
|
||||
@@ -1,11 +1,23 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<!--
|
||||
@package Joomla.Site
|
||||
@subpackage Templates.moko-cassiopeia
|
||||
@file /templates/moko-cassiopeia/templateDetails.xml
|
||||
|
||||
© 2025 Moko Consulting — All Rights Reserved
|
||||
@license GNU General Public License version 2 or later; see LICENSE.txt
|
||||
|
||||
Website: https://mokoconsulting.tech
|
||||
Email: hello@mokoconsulting.tech
|
||||
Phone: +1 (931) 279-6313
|
||||
-->
|
||||
<extension type="template" client="site" method="upgrade">
|
||||
<updateservers>
|
||||
<server type="extension" name="Moko Consulting">https://mokoconsulting.tech/updates/updates.xml</server>
|
||||
</updateservers>
|
||||
<name>moko-cassiopeia</name>
|
||||
<version>1.12</version>
|
||||
<creationDate>2023-05</creationDate>
|
||||
<version>1.13</version>
|
||||
<creationDate>2025-08-09</creationDate>
|
||||
<author>Jonathan Miller || Moko Consulting</author>
|
||||
<authorEmail>jmiller@mokoconsulting.tech</authorEmail>
|
||||
<copyright>(C)GNU General Public License Version 2 - 2025 Moko Consulting</copyright>
|
||||
@@ -28,7 +40,7 @@
|
||||
</media>
|
||||
<positions>
|
||||
<position>topbar</position>
|
||||
<position>below-top</position>
|
||||
<position>below-topbar</position>
|
||||
<position>below-logo</position>
|
||||
<position>menu</position>
|
||||
<position>search</position>
|
||||
@@ -60,193 +72,98 @@
|
||||
<config>
|
||||
<fields name="params">
|
||||
<fieldset name="advanced">
|
||||
<field
|
||||
name="brand"
|
||||
type="radio"
|
||||
label="TPL_MOKO-CASSIOPEIA_BRAND_LABEL"
|
||||
default="1"
|
||||
layout="joomla.form.field.radio.switcher"
|
||||
filter="boolean"
|
||||
>
|
||||
<field name="developmentmode" type="radio" label="TPL_MOKO-CASSIOPEIA_DEVELOPMENTMODE_LABEL"
|
||||
description="TPL_MOKO-CASSIOPEIA_DEVELOPMENTMODE_DESC" default="1" layout="joomla.form.field.radio.switcher"
|
||||
filter="boolean">
|
||||
<option value="0">JNO</option>
|
||||
<option value="1">JYES</option>
|
||||
</field>
|
||||
|
||||
<field
|
||||
name="logoFile"
|
||||
type="media"
|
||||
default="media/templates/site/moko-cassiopeia/images/logo.svg"
|
||||
label="TPL_MOKO-CASSIOPEIA_LOGO_LABEL"
|
||||
showon="brand:1"
|
||||
/>
|
||||
|
||||
<field
|
||||
name="siteTitle"
|
||||
type="text"
|
||||
default=""
|
||||
label="TPL_MOKO-CASSIOPEIA_TITLE"
|
||||
filter="string"
|
||||
showon="brand:1"
|
||||
/>
|
||||
|
||||
<field
|
||||
name="siteDescription"
|
||||
type="text"
|
||||
default=""
|
||||
label="TPL_MOKO-CASSIOPEIA_TAGLINE_LABEL"
|
||||
description="TPL_MOKO-CASSIOPEIA_TAGLINE_DESC"
|
||||
filter="string"
|
||||
showon="brand:1"
|
||||
/>
|
||||
<field
|
||||
name="fA6KitCode"
|
||||
type="text"
|
||||
default=""
|
||||
label="TPL_MOKO-CASSIOPEIA_FA6KITCODE_LABEL"
|
||||
description="TPL_MOKO-CASSIOPEIA_FA6KITCODE_DESC"
|
||||
filter="string"
|
||||
/>
|
||||
<field
|
||||
name="offlineEmbed"
|
||||
type="text"
|
||||
default=""
|
||||
label="TPL_MOKO-CASSIOPEIA_OFFLINEEMBED_LABEL"
|
||||
description="TPL_MOKO-CASSIOPEIA_OFFLINEEMBED_DESC"
|
||||
filter="raw"
|
||||
/>
|
||||
<field
|
||||
name="useFontScheme"
|
||||
type="groupedlist"
|
||||
label="TPL_MOKO-CASSIOPEIA_FONT_LABEL"
|
||||
default="0"
|
||||
>
|
||||
<field name="brand" type="radio" label="TPL_MOKO-CASSIOPEIA_BRAND_LABEL"
|
||||
default="1" layout="joomla.form.field.radio.switcher" filter="boolean">
|
||||
<option value="0">JNO</option>
|
||||
<option value="1">JYES</option>
|
||||
</field>
|
||||
<field name="logoFile" type="media" default="media/templates/site/moko-cassiopeia/images/logo.svg"
|
||||
label="TPL_MOKO-CASSIOPEIA_LOGO_LABEL" showon="brand:1" />
|
||||
<field name="siteTitle" type="text" default="" label="TPL_MOKO-CASSIOPEIA_TITLE"
|
||||
filter="string" showon="brand:1" />
|
||||
<field name="siteDescription" type="text" default="" label="TPL_MOKO-CASSIOPEIA_TAGLINE_LABEL"
|
||||
description="TPL_MOKO-CASSIOPEIA_TAGLINE_DESC" filter="string" showon="brand:1" />
|
||||
<field name="fA6KitCode" type="text" default="" label="TPL_MOKO-CASSIOPEIA_FA6KITCODE_LABEL"
|
||||
description="TPL_MOKO-CASSIOPEIA_FA6KITCODE_DESC" filter="string" />
|
||||
<field name="offlineEmbed" type="text" default="" label="TPL_MOKO-CASSIOPEIA_OFFLINEEMBED_LABEL"
|
||||
description="TPL_MOKO-CASSIOPEIA_OFFLINEEMBED_DESC" filter="raw" />
|
||||
<field name="useFontScheme" type="groupedlist" label="TPL_MOKO-CASSIOPEIA_FONT_LABEL"
|
||||
default="0">
|
||||
<option value="0">JNONE</option>
|
||||
<group label="TPL_MOKO-CASSIOPEIA_FONT_GROUP_LOCAL">
|
||||
<option value="media/templates/site/moko-cassiopeia/css/global/fonts-local_roboto.css">Roboto (local)</option>
|
||||
<option value="media/templates/site/moko-cassiopeia/css/global/fonts-local_roboto.css">Roboto
|
||||
(local)</option>
|
||||
</group>
|
||||
<group label="TPL_MOKO-CASSIOPEIA_FONT_GROUP_WEB">
|
||||
<option value="https://fonts.googleapis.com/css2?family=Fira+Sans:wght@100;300;400;700&display=swap">Fira Sans (web)</option>
|
||||
<option value="https://fonts.googleapis.com/css2?family=Noto+Sans:wght@100;300;400;700&family=Roboto:wght@100;300;400;700&display=swap">Roboto + Noto Sans (web)</option>
|
||||
<option value="https://fonts.googleapis.com/css2?family=Fira+Sans:wght@100;300;400;700&display=swap">Fira
|
||||
Sans (web)</option>
|
||||
<option value="https://fonts.googleapis.com/css2?family=Noto+Sans:wght@100;300;400;700&family=Roboto:wght@100;300;400;700&display=swap">Roboto
|
||||
+ Noto Sans (web)</option>
|
||||
</group>
|
||||
</field>
|
||||
|
||||
<field
|
||||
name="noteFontScheme"
|
||||
type="note"
|
||||
description="TPL_MOKO-CASSIOPEIA_FONT_NOTE_TEXT"
|
||||
class="alert alert-warning"
|
||||
/>
|
||||
|
||||
<field
|
||||
name="colorName"
|
||||
type="filelist"
|
||||
label="TPL_MOKO-CASSIOPEIA_COLOR_NAME_LABEL"
|
||||
default="colors_standard"
|
||||
fileFilter="^custom.+[^min]\.css$"
|
||||
exclude="^colors.+"
|
||||
stripext="true"
|
||||
hide_none="true"
|
||||
hide_default="true"
|
||||
directory="media/templates/site/moko-cassiopeia/css/global/"
|
||||
validate="options"
|
||||
>
|
||||
<field name="noteFontScheme" type="note" description="TPL_MOKO-CASSIOPEIA_FONT_NOTE_TEXT"
|
||||
class="alert alert-warning" />
|
||||
<field name="colorName" type="list" label="TPL_MOKO-CASSIOPEIA_COLOR_NAME_LABEL"
|
||||
default="colors_standard">
|
||||
<option value="colors_standard">TPL_MOKO-CASSIOPEIA_COLOR_NAME_STANDARD</option>
|
||||
<option value="colors_alternative">TPL_MOKO-CASSIOPEIA_COLOR_NAME_ALTERNATIVE</option>
|
||||
<option value="colors_custom">TPL_MOKO-CASSIOPEIA_COLOR_NAME_CUSTOM</option>
|
||||
</field>
|
||||
|
||||
<field
|
||||
name="fluidContainer"
|
||||
type="radio"
|
||||
layout="joomla.form.field.radio.switcher"
|
||||
default="0"
|
||||
label="TPL_MOKO-CASSIOPEIA_FLUID_LABEL"
|
||||
>
|
||||
<field name="fluidContainer" type="radio" layout="joomla.form.field.radio.switcher"
|
||||
default="0" label="TPL_MOKO-CASSIOPEIA_FLUID_LABEL">
|
||||
<option value="0">TPL_MOKO-CASSIOPEIA_STATIC</option>
|
||||
<option value="1">TPL_MOKO-CASSIOPEIA_FLUID</option>
|
||||
</field>
|
||||
|
||||
<field
|
||||
name="stickyHeader"
|
||||
type="radio"
|
||||
label="TPL_MOKO-CASSIOPEIA_STICKY_LABEL"
|
||||
layout="joomla.form.field.radio.switcher"
|
||||
default="0"
|
||||
filter="integer"
|
||||
>
|
||||
<field name="stickyHeader" type="radio" label="TPL_MOKO-CASSIOPEIA_STICKY_LABEL"
|
||||
layout="joomla.form.field.radio.switcher" default="0" filter="integer">
|
||||
<option value="0">JNO</option>
|
||||
<option value="1">JYES</option>
|
||||
</field>
|
||||
|
||||
<field
|
||||
name="backTop"
|
||||
type="radio"
|
||||
label="TPL_MOKO-CASSIOPEIA_BACKTOTOP_LABEL"
|
||||
layout="joomla.form.field.radio.switcher"
|
||||
default="0"
|
||||
filter="integer"
|
||||
>
|
||||
<field name="backTop" type="radio" label="TPL_MOKO-CASSIOPEIA_BACKTOTOP_LABEL"
|
||||
layout="joomla.form.field.radio.switcher" default="0" filter="integer">
|
||||
<option value="0">JNO</option>
|
||||
<option value="1">JYES</option>
|
||||
</field>
|
||||
</fieldset>
|
||||
<fieldset name="google">
|
||||
<field
|
||||
name="googletagmanager"
|
||||
type="radio"
|
||||
label="TPL_MOKO-CASSIOPEIA_GOOGLETAGMANAGER_LABEL"
|
||||
description="TPL_MOKO-CASSIOPEIA_GOOGLETAGMANAGER_DESC"
|
||||
layout="joomla.form.field.radio.switcher"
|
||||
filter="boolean"
|
||||
>
|
||||
<field name="googletagmanager" type="radio" label="TPL_MOKO-CASSIOPEIA_GOOGLETAGMANAGER_LABEL"
|
||||
description="TPL_MOKO-CASSIOPEIA_GOOGLETAGMANAGER_DESC" layout="joomla.form.field.radio.switcher"
|
||||
filter="boolean">
|
||||
<option value="0">JNO</option>
|
||||
<option value="1">JYES</option>
|
||||
</field>
|
||||
<field
|
||||
name="googletagmanagerid"
|
||||
type="text"
|
||||
default=""
|
||||
label="TPL_MOKO-CASSIOPEIA_GOOGLETAGMANAGERID_LABEL"
|
||||
description="TPL_MOKO-CASSIOPEIA_GOOGLETAGMANAGERID_DESC"
|
||||
filter="string"
|
||||
showon="googletagmanager:1"
|
||||
/>
|
||||
<field name="googletagmanagerid" type="text" default="" label="TPL_MOKO-CASSIOPEIA_GOOGLETAGMANAGERID_LABEL"
|
||||
description="TPL_MOKO-CASSIOPEIA_GOOGLETAGMANAGERID_DESC" filter="string"
|
||||
showon="googletagmanager:1" />
|
||||
<field name="googleanalytics" type="radio" label="TPL_MOKO-CASSIOPEIA_GOOGLEANALYTICS_LABEL"
|
||||
description="TPL_MOKO-CASSIOPEIA_GOOGLEANALYTICS_DESC" layout="joomla.form.field.radio.switcher"
|
||||
filter="boolean">
|
||||
<option value="0">JNO</option>
|
||||
<option value="1">JYES</option>
|
||||
</field>
|
||||
<field name="googleanalyticsid" type="text" default="" label="TPL_MOKO-CASSIOPEIA_GOOGLEANALYTICSID_LABEL"
|
||||
description="TPL_MOKO-CASSIOPEIA_GOOGLEANALYTICSID_DESC" filter="string"
|
||||
showon="googleanalytics:1" />
|
||||
</fieldset>
|
||||
<fieldset name="custom_head">
|
||||
<field
|
||||
name="custom_head_start"
|
||||
type="textarea"
|
||||
default=""
|
||||
label="TPL_MOKO-CASSIOPEIA_CUSTOM_HEAD_START_LABEL"
|
||||
description="TPL_MOKO-CASSIOPEIA_CUSTOM_HEAD_START_DESC"
|
||||
filter="raw"/>
|
||||
<field
|
||||
name="custom_head_end"
|
||||
type="textarea"
|
||||
default=""
|
||||
label="TPL_MOKO-CASSIOPEIA_CUSTOM_HEAD_END_LABEL"
|
||||
description="TPL_MOKO-CASSIOPEIA_CUSTOM_HEAD_END_DESC"
|
||||
filter="raw"/>
|
||||
<field name="custom_head_start" type="textarea" default="" label="TPL_MOKO-CASSIOPEIA_CUSTOM_HEAD_START_LABEL"
|
||||
description="TPL_MOKO-CASSIOPEIA_CUSTOM_HEAD_START_DESC" filter="raw" />
|
||||
<field name="custom_head_end" type="textarea" default="" label="TPL_MOKO-CASSIOPEIA_CUSTOM_HEAD_END_LABEL"
|
||||
description="TPL_MOKO-CASSIOPEIA_CUSTOM_HEAD_END_DESC" filter="raw" />
|
||||
</fieldset>
|
||||
<fieldset name="drawers">
|
||||
<field
|
||||
name="drawerLeftIcon"
|
||||
type="text"
|
||||
default="fa-solid fa-chevron-right"
|
||||
label="TPL_MOKO-CASSIOPEIA_DRAWER_LEFT_ICON_LABEL"
|
||||
description="TPL_MOKO-CASSIOPEIA_DRAWER_LEFT_ICON_DESC"
|
||||
filter="string"
|
||||
/>
|
||||
|
||||
<field
|
||||
name="drawerRightIcon"
|
||||
type="text"
|
||||
default="fa-solid fa-chevron-left"
|
||||
label="TPL_MOKO-CASSIOPEIA_DRAWER_RIGHT_ICON_LABEL"
|
||||
description="TPL_MOKO-CASSIOPEIA_DRAWER_RIGHT_ICON_DESC"
|
||||
filter="string"
|
||||
/>
|
||||
|
||||
<field name="drawerLeftIcon" type="text" default="fa-solid fa-chevron-right"
|
||||
label="TPL_MOKO-CASSIOPEIA_DRAWER_LEFT_ICON_LABEL" description="TPL_MOKO-CASSIOPEIA_DRAWER_LEFT_ICON_DESC"
|
||||
filter="string" />
|
||||
<field name="drawerRightIcon" type="text" default="fa-solid fa-chevron-left"
|
||||
label="TPL_MOKO-CASSIOPEIA_DRAWER_RIGHT_ICON_LABEL" description="TPL_MOKO-CASSIOPEIA_DRAWER_RIGHT_ICON_DESC"
|
||||
filter="string" />
|
||||
</fieldset>
|
||||
</fields>
|
||||
</config>
|
||||
|
||||
Reference in New Issue
Block a user