[9.2.12] Thème - menu - couleur fond page sélectionnée

This commit is contained in:
fredtempez 2019-11-29 15:31:37 +01:00
parent d075fc14c2
commit 66891e6389
5 changed files with 56 additions and 6 deletions

View File

@ -1015,6 +1015,13 @@ class common {
$this->setData(['core', 'dataVersion', 9211]); $this->setData(['core', 'dataVersion', 9211]);
$this->saveData(); $this->saveData();
} }
// Version 9.2.12
if($this->getData(['core', 'dataVersion']) < 9212) {
$this->setData(['theme','menu', 'activeColorAuto',true]);
$this->setData(['theme','menu', 'activeColor','rgba(255, 255, 255, 1)']);
$this->setData(['core', 'dataVersion', 9212]);
$this->saveData();
}
} }
} }
@ -1144,7 +1151,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'] . '}';
if ($this->getData(['theme','menu','activeColorAuto']) === true) {
$css .= 'nav a.active{background-color:' . $colors['veryDarken'] . '}'; $css .= 'nav a.active{background-color:' . $colors['veryDarken'] . '}';
} else {
$css .= 'nav a.active{background-color:' . $this->getData(['theme','menu','activeColor']) . '}';
$color2 = helper::colorVariants($this->getData(['theme', 'menu', 'textColor']));
$css .= 'nav a.active{color:' . $color2['text'] . '}';
}
$css .= '#menu{text-align:' . $this->getData(['theme', 'menu', 'textAlign']) . '}'; $css .= '#menu{text-align:' . $this->getData(['theme', 'menu', 'textAlign']) . '}';
if($this->getData(['theme', 'menu', 'margin'])) { if($this->getData(['theme', 'menu', 'margin'])) {
if( if(

View File

@ -478,7 +478,9 @@ class install extends common {
'textAlign' => 'left', 'textAlign' => 'left',
'textColor' => 'rgba(255, 255, 255, 1)', 'textColor' => 'rgba(255, 255, 255, 1)',
'textTransform' => 'none', 'textTransform' => 'none',
'fixed' => false 'fixed' => false,
'activeColor' => 'rgba(255, 255, 255, 1)',
'activeColorAuto' => true
], ],
'site' => [ 'site' => [
'backgroundColor' => 'rgba(255, 255, 255, 1)', 'backgroundColor' => 'rgba(255, 255, 255, 1)',

View File

@ -442,7 +442,9 @@ class theme extends common {
'textAlign' => $this->getInput('themeMenuTextAlign'), 'textAlign' => $this->getInput('themeMenuTextAlign'),
'textColor' => $this->getInput('themeMenuTextColor'), 'textColor' => $this->getInput('themeMenuTextColor'),
'textTransform' => $this->getInput('themeMenuTextTransform'), 'textTransform' => $this->getInput('themeMenuTextTransform'),
'fixed' => $this->getInput('themeMenuFixed', helper::FILTER_BOOLEAN) 'fixed' => $this->getInput('themeMenuFixed', helper::FILTER_BOOLEAN),
'activeColorAuto' => $this->getInput('themeMenuActiveColorAuto', helper::FILTER_BOOLEAN),
'activeColor' => $this->getInput('themeMenuActiveColor')
]]); ]]);
// Valeurs en sortie // Valeurs en sortie
$this->addOutput([ $this->addOutput([

View File

@ -22,7 +22,11 @@ $("input, select").on("change", function() {
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')) {
css += "nav a.active{background-color:" + colors.veryDarken + "}"; css += "nav a.active{background-color:" + colors.veryDarken + "}";
} else {
css += "nav a.active{background-color:" + $("#themeMenuActiveColor").val() + "}";
}
// 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
@ -92,6 +96,7 @@ $("input, select").on("change", function() {
break; break;
} }
}); });
//
// Lien de connexion (addClass() et removeClass() au lieu de hide() et show() car ils ne conservent pas le display-inline: block; de #themeMenuLoginLink) // Lien de connexion (addClass() et removeClass() au lieu de hide() et show() car ils ne conservent pas le display-inline: block; de #themeMenuLoginLink)
$("#themeMenuLoginLink").on("change", function() { $("#themeMenuLoginLink").on("change", function() {
if($(this).is(":checked")) { if($(this).is(":checked")) {
@ -101,6 +106,7 @@ $("#themeMenuLoginLink").on("change", function() {
$("#menuLoginLink").addClass('displayNone'); $("#menuLoginLink").addClass('displayNone');
} }
}).trigger("change"); }).trigger("change");
// Affiche / Cache les options de la position // Affiche / Cache les options de la position
$("#themeMenuPosition").on("change", function() { $("#themeMenuPosition").on("change", function() {
if($(this).val() === 'site-first' || $(this).val() === 'site-second') { if($(this).val() === 'site-first' || $(this).val() === 'site-second') {
@ -112,6 +118,7 @@ $("#themeMenuPosition").on("change", function() {
}); });
} }
}).trigger("change"); }).trigger("change");
// Affiche / Cache les options du menu fixe // Affiche / Cache les options du menu fixe
$("#themeMenuPosition").on("change", function() { $("#themeMenuPosition").on("change", function() {
if($(this).val() === 'top') { if($(this).val() === 'top') {
@ -123,3 +130,13 @@ $("#themeMenuPosition").on("change", function() {
}); });
} }
}).trigger("change"); }).trigger("change");
// Affiche la sélection de couleur auto
$("#themeMenuActiveColorAuto").on("change", function() {
if ($(this).is(':checked') ) {
$("#themeMenuActiveColorWrapper").slideUp();
} else {
$("#themeMenuActiveColorWrapper").slideDown();
}
}).trigger("change");

View File

@ -34,6 +34,22 @@
]); ?> ]); ?>
</div> </div>
</div> </div>
<div class="row">
<div class="col6">
<?php echo template::text('themeMenuActiveColor', [
'class' => 'colorPicker',
'help' => 'Couleur d\'arrièreplan du menu sélectionné.<br>Le curseur horizontal règle le niveau de transparence.',
'label' => 'Activé',
'value' => $this->getData(['theme', 'menu', 'activeColor'])
]); ?>
</div>
<div class="col12">
<?php echo template::checkbox('themeMenuActiveColorAuto', true, 'Page active, couleur de fond automatique.', [
'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.'
]); ?>
</div>
</div>
</div> </div>
</div> </div>
<div class="col4"> <div class="col4">