ZwiiCMS-Team/ZwiiCMS
ZwiiCMS-Team
/
ZwiiCMS
3
3
Fork 2
Code Releases 143 Activity

093 thème menu couleur de la page sélectionnée

This commit is contained in:
Fred Tempez 2020-05-15 18:31:01 +02:00
parent 8cf09137fb
commit 5e77c51f51
5 changed files with 35 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
core/core.php
View File

@ -1417,12 +1417,13 @@ class core extends common {
$css .= 'nav,nav a{background-color:' . $colors['normal'] . '}'; $css .= 'nav,nav a{background-color:' . $colors['normal'] . '}';
$css .= 'nav a,#toggle span,nav a:hover{color:' . $this->getData(['theme', 'menu', 'textColor']) . '}'; $css .= 'nav a,#toggle span,nav a:hover{color:' . $this->getData(['theme', 'menu', 'textColor']) . '}';
$css .= 'nav a:hover{background-color:' . $colors['darken'] . '}'; $css .= 'nav a:hover{background-color:' . $colors['darken'] . '}';
$css .= 'nav a.active{color:' . $this->getData(['theme','menu','activeTextColor']) . ';}';
if ($this->getData(['theme','menu','activeColorAuto']) === true) { if ($this->getData(['theme','menu','activeColorAuto']) === true) {
$css .= 'nav a.active{background-color:' . $colors['veryDarken'] . '}'; $css .= 'nav a.active{background-color:' . $colors['veryDarken'] . '}';
} else { } else {
$css .= 'nav a.active{background-color:' . $this->getData(['theme','menu','activeColor']) . '}'; $css .= 'nav a.active{background-color:' . $this->getData(['theme','menu','activeColor']) . '}';
$color2 = helper::colorVariants($this->getData(['theme', 'menu', 'textColor'])); /*$color2 = helper::colorVariants($this->getData(['theme', 'menu', 'textColor']));
$css .= 'nav a.active{color:' . $color2['text'] . '}'; $css .= 'nav a.active{color:' . $color2['text'] . '}';*/
} }
$css .= 'nav #burgerText{color:' . $colors['text'] . '}'; $css .= 'nav #burgerText{color:' . $colors['text'] . '}';
$css .= 'nav .navLevel1 a.active {border-radius:' . $this->getData(['theme', 'menu', 'radius']) . '}'; $css .= 'nav .navLevel1 a.active {border-radius:' . $this->getData(['theme', 'menu', 'radius']) . '}';

3
core/module/install/ressource/defaultdata.php
View File

@ -135,7 +135,8 @@ class init extends common {
'textTransform' => 'none', 'textTransform' => 'none',
'fixed' => false, 'fixed' => false,
'activeColorAuto' => true, 'activeColorAuto' => true,
'activeColor' => 'rgba(255, 255, 255, 1)' 'activeColor' => 'rgba(255, 255, 255, 1)',
'activeTextColor' => 'rgba(255, 255, 255, 1)'
], ],
'site' => [ 'site' => [
'backgroundColor' => 'rgba(255, 255, 255, 1)', 'backgroundColor' => 'rgba(255, 255, 255, 1)',

1
core/module/theme/theme.php
View File

@ -462,6 +462,7 @@ class theme extends common {
'fixed' => $this->getInput('themeMenuFixed', helper::FILTER_BOOLEAN), 'fixed' => $this->getInput('themeMenuFixed', helper::FILTER_BOOLEAN),
'activeColorAuto' => $this->getInput('themeMenuActiveColorAuto', helper::FILTER_BOOLEAN), 'activeColorAuto' => $this->getInput('themeMenuActiveColorAuto', helper::FILTER_BOOLEAN),
'activeColor' => $this->getInput('themeMenuActiveColor'), 'activeColor' => $this->getInput('themeMenuActiveColor'),
'activeTextColor' => $this->getInput('themeMenuActiveTextColor'),
'radius' => $this->getInput('themeMenuRadius'), 'radius' => $this->getInput('themeMenuRadius'),
'burgerTitle' => $this->getInput('themeMenuBurgerTitle', helper::FILTER_BOOLEAN) 'burgerTitle' => $this->getInput('themeMenuBurgerTitle', helper::FILTER_BOOLEAN)
]]); ]]);

8
core/module/theme/view/menu/menu.js.php
View File

@ -42,15 +42,16 @@ $("input, select").on("change", function() {
var menuFont = $("#themeMenuFont").val(); var menuFont = $("#themeMenuFont").val();
var css = "@import url('https://fonts.googleapis.com/css?family=" + menuFont + "');"; var css = "@import url('https://fonts.googleapis.com/css?family=" + menuFont + "');";
var colors = core.colorVariants($("#themeMenuBackgroundColor").val()); var colors = core.colorVariants($("#themeMenuBackgroundColor").val());
// Couleurs du menu // Couleurs du menu
css += "nav,nav a{background-color:" + colors.normal + "}"; css += "nav,nav a{background-color:" + colors.normal + "}";
css += "nav a,#toggle span,nav a:hover{color:" + $("#themeMenuTextColor").val() + "}"; css += "nav a,#toggle span,nav a:hover{color:" + $("#themeMenuTextColor").val() + "}";
css += "nav a:hover{background-color:" + colors.darken + "}"; css += "nav a:hover{background-color:" + colors.darken + "}";
if ($("#themeMenuActiveColorAuto").is(':checked')) { if ($("#themeMenuActiveColorAuto").is(':checked')) {
css += "nav a.active{background-color:" + colors.veryDarken + "}"; css += "nav a:hover{background-color:" + colors.veryDarken + ";color:" + $('#themeMenuActiveTextColor').val() + ";}";
} else { } else {
css += "nav a.active{background-color:" + $("#themeMenuActiveColor").val() + "}"; css += "nav a:hover{background-color:" + $("#themeMenuActiveColor").val() + ";color:" + $('#themeMenuActiveTextColor').val() + ";}";
} }
console.log(css);
// Taille, hauteur, épaisseur et capitalisation de caractères du menu // Taille, hauteur, épaisseur et capitalisation de caractères du menu
css += "#toggle span,#menu a{padding:" + $("#themeMenuHeight").val() + ";font-family:'" + menuFont.replace(/\+/g, " ") + "',sans-serif;font-weight:" + $("#themeMenuFontWeight").val() + ";font-size:" + $("#themeMenuFontSize").val() + ";text-transform:" + $("#themeMenuTextTransform").val() + "}"; css += "#toggle span,#menu a{padding:" + $("#themeMenuHeight").val() + ";font-family:'" + menuFont.replace(/\+/g, " ") + "',sans-serif;font-weight:" + $("#themeMenuFontWeight").val() + ";font-size:" + $("#themeMenuFontSize").val() + ";text-transform:" + $("#themeMenuTextTransform").val() + "}";
// Alignement du menu // Alignement du menu
@ -139,7 +140,6 @@ $("#themeMenuLoginLink").on("change", function() {
// Affiche / Cache les options de la position // Affiche / Cache les options de la position
$("#themeMenuPosition").on("change", function() { $("#themeMenuPosition").on("change", function() {
console.log($("#themeMenuPosition").val());
if($(this).val() === 'site-first' || $(this).val() === 'site-second') { if($(this).val() === 'site-first' || $(this).val() === 'site-second') {
$("#themeMenuPositionOptions").slideDown(); $("#themeMenuPositionOptions").slideDown();
} }

42
core/module/theme/view/menu/menu.php
View File

@ -15,38 +15,46 @@
<div class="row"> <div class="row">
<div class="col12"> <div class="col12">
<div class="block"> <div class="block">
<h4>Couleur</h4> <h4>Couleurs</h4>
<div class="row"> <div class="row">
<div class="col6"> <div class="col3">
<?php echo template::text('themeMenuBackgroundColor', [
'class' => 'colorPicker',
'help' => 'Le curseur horizontal règle le niveau de transparence.',
'label' => 'Fond',
'value' => $this->getData(['theme', 'menu', 'backgroundColor'])
]); ?>
</div>
<div class="col6">
<?php echo template::text('themeMenuTextColor', [ <?php echo template::text('themeMenuTextColor', [
'class' => 'colorPicker', 'class' => 'colorPicker',
'help' => 'Le curseur horizontal règle le niveau de transparence.', 'help' => 'Le curseur horizontal règle le niveau de transparence.',
'label' => 'Texte', 'label' => 'Texte',
'value' => $this->getData(['theme', 'menu', 'textColor']) 'value' => $this->getData(['theme', 'menu', 'textColor'])
]); ?> ]); ?>
</div> </div>
</div> <div class="col3">
<div class="row"> <?php echo template::text('themeMenuBackgroundColor', [
<div class="col6"> 'class' => 'colorPicker',
'help' => 'Le curseur horizontal règle le niveau de transparence.',
'label' => 'Fond',
'value' => $this->getData(['theme', 'menu', 'backgroundColor'])
]); ?>
</div>
<div class="col3">
<?php echo template::text('themeMenuActiveTextColor', [
'class' => 'colorPicker',
'help' => 'Le curseur horizontal règle le niveau de transparence.',
'label' => 'Texte page active',
'value' => $this->getData(['theme', 'menu', 'activeTextColor'])
]); ?>
</div>
<div class="col3 verticalAlignBottom">
<?php <?php
echo template::checkbox('themeMenuActiveColorAuto', true, 'Page sélectionnée, couleur de fond automatique ', [ echo template::checkbox('themeMenuActiveColorAuto', true, 'Fond automatique.', [
'checked' => $this->getData(['theme', 'menu', 'activeColorAuto']), 'checked' => $this->getData(['theme', 'menu', 'activeColorAuto']),
'help' => 'La couleur de fond de la page active peut être définie automatique ou selon une couleur définie, comme par exemple celle de fond des pages.' 'help' => 'La couleur de fond de la page active peut être définie automatique ou selon une couleur définie, comme par exemple celle de fond des pages.'
]); ?> ]); ?>
</div> </div>
<div class="col6"> </div>
<div class="row">
<div class="col3 offset9">
<?php echo template::text('themeMenuActiveColor', [ <?php echo template::text('themeMenuActiveColor', [
'class' => 'colorPicker', 'class' => 'colorPicker',
'help' => 'Couleur de fond de la page sélectionnée dans le menu.<br>Le curseur horizontal règle le niveau de transparence.', 'help' => 'Couleur de fond de la page sélectionnée dans le menu.<br>Le curseur horizontal règle le niveau de transparence.',
'label' => 'Fond', 'label' => 'Fond active',
'value' => $this->getData(['theme', 'menu', 'activeColor']) 'value' => $this->getData(['theme', 'menu', 'activeColor'])
]); ?> ]); ?>
</div> </div>