feautre Banner css + show and hide options

This commit is contained in:
Fred Tempez 2021-11-09 18:38:37 +01:00
parent 932caa814d
commit bd23324501
5 changed files with 40 additions and 17 deletions

View File

@ -2256,6 +2256,9 @@ class core extends common {
$colors = helper::colorVariants($this->getData(['theme', 'header', 'textColor'])); $colors = helper::colorVariants($this->getData(['theme', 'header', 'textColor']));
$css .= 'header span{color:' . $colors['normal'] . ';font-family:"' . str_replace('+', ' ', $this->getData(['theme', 'header', 'font'])) . '",sans-serif;font-weight:' . $this->getData(['theme', 'header', 'fontWeight']) . ';font-size:' . $this->getData(['theme', 'header', 'fontSize']) . ';text-transform:' . $this->getData(['theme', 'header', 'textTransform']) . '}'; $css .= 'header span{color:' . $colors['normal'] . ';font-family:"' . str_replace('+', ' ', $this->getData(['theme', 'header', 'font'])) . '",sans-serif;font-weight:' . $this->getData(['theme', 'header', 'fontWeight']) . ';font-size:' . $this->getData(['theme', 'header', 'fontSize']) . ';text-transform:' . $this->getData(['theme', 'header', 'textTransform']) . '}';
} }
if ($this->getData(['theme','header','feature']) === 'feature' ) {
$css .= 'header{height:' . $this->getData(['theme', 'header', 'height']) . ';}'; ;
}
// Menu // Menu
$colors = helper::colorVariants($this->getData(['theme', 'menu', 'backgroundColor'])); $colors = helper::colorVariants($this->getData(['theme', 'menu', 'backgroundColor']));
$css .= 'nav,nav.navMain a{background-color:' . $colors['normal'] . '}'; $css .= 'nav,nav.navMain a{background-color:' . $colors['normal'] . '}';

View File

@ -74,7 +74,7 @@
<span id="themeHeaderTitle">&nbsp;</span> <span id="themeHeaderTitle">&nbsp;</span>
<?php endif; ?> <?php endif; ?>
<?php else: ?> <?php else: ?>
<?php echo $this->getData(['theme','header','content']);?> <?php echo $this->getData(['theme','header','featureContent']);?>
<?php endif; ?> <?php endif; ?>
</div> <!--fin container --> </div> <!--fin container -->
</header> </header>
@ -115,8 +115,7 @@
): ?> ): ?>
<!-- Bannière dans le site --> <!-- Bannière dans le site -->
<?php echo ( $this->getData(['theme','header','linkHomePage']) && $this->getData(['theme','header','feature']) === 'wallpaper' ) ? '<a href="' . helper::baseUrl(false) . '">' : ''; ?> <?php echo ( $this->getData(['theme','header','linkHomePage']) && $this->getData(['theme','header','feature']) === 'wallpaper' ) ? '<a href="' . helper::baseUrl(false) . '">' : ''; ?>
<header class="<?php echo $this->getData(['theme', 'header', 'position']) === 'hide' ? 'displayNone' : ''; ?> <header class="<?php echo $this->getData(['theme', 'header', 'position']) === 'hide' ? 'displayNone' : ($this->getData(['theme', 'header', 'tinyHidden']) ? ' bannerDisplay' : ''); ?>">
<?php echo $this->getData(['theme', 'header', 'tinyHidden']) ? ' bannerDisplay' : ''; ?> ">
<div id="headerContainer" class="container"> <div id="headerContainer" class="container">
<?php if ($this->getData(['theme','header','feature']) === 'wallpaper' ): ?> <?php if ($this->getData(['theme','header','feature']) === 'wallpaper' ): ?>
<?php if( <?php if(
@ -129,7 +128,7 @@
<span id="themeHeaderTitle">&nbsp;</span> <span id="themeHeaderTitle">&nbsp;</span>
<?php endif; ?> <?php endif; ?>
<?php else: ?> <?php else: ?>
<?php echo $this->getData(['theme','header','content']);?> <?php echo $this->getData(['theme','header','featureContent']);?>
<?php endif; ?> <?php endif; ?>
</div> <!--fin container --> </div> <!--fin container -->
</header> </header>

View File

@ -139,7 +139,7 @@ class theme extends common {
]; ];
public static $headerFeatures = [ public static $headerFeatures = [
'wallpaper' => 'Couleur unie ou papier-peint', 'wallpaper' => 'Couleur unie ou papier-peint',
'content' => 'Contenu personnalisé' 'feature' => 'Contenu personnalisé'
]; ];
public static $imagePositions = [ public static $imagePositions = [
'top left' => 'En haut à gauche', 'top left' => 'En haut à gauche',

View File

@ -103,6 +103,7 @@ $("input, select").on("change", function() {
else { else {
css += 'header{margin:0}'; css += 'header{margin:0}';
} }
// Position de la bannière // Position de la bannière
var positionNav = <?php echo json_encode($this->getData(['theme', 'menu', 'position'])); ?>; var positionNav = <?php echo json_encode($this->getData(['theme', 'menu', 'position'])); ?>;
var positionHeader = $("#themeHeaderPosition").val(); var positionHeader = $("#themeHeaderPosition").val();
@ -222,3 +223,16 @@ $("#themeHeaderPosition").on("change", function() {
$("#themeHeaderSmallDisplay").slideDown(); $("#themeHeaderSmallDisplay").slideDown();
} }
}).trigger("change"); }).trigger("change");
// Affiche les blocs selon le type bannière
$("#themeHeaderFeature").on("change", function() {
if($(this).val() === 'wallpaper') {
$(".wallpaperContainer").show();
$(".featureContainer").hide();
}
if($(this).val() === 'feature') {
$(".featureContainer").show();
$(".wallpaperContainer").hide();
}
}).trigger("change");

View File

@ -17,20 +17,33 @@
<div class="block"> <div class="block">
<h4>Paramètres</h4> <h4>Paramètres</h4>
<div class="row"> <div class="row">
<div class="col6"> <div class="col4">
<?php echo template::select('themeHeaderFeature', $module::$headerFeatures, [ <?php echo template::select('themeHeaderFeature', $module::$headerFeatures, [
'label' => 'Nature de contenu', 'label' => 'Nature de contenu',
'selected' => $this->getData(['theme', 'header', 'feature']) 'selected' => $this->getData(['theme', 'header', 'feature'])
]); ?> ]); ?>
</div> </div>
<div class="col6"> <div class="col4">
<?php echo template::select('themeHeaderPosition', $module::$headerPositions, [ <?php echo template::select('themeHeaderPosition', $module::$headerPositions, [
'label' => 'Position', 'label' => 'Position',
'selected' => $this->getData(['theme', 'header', 'position']) 'selected' => $this->getData(['theme', 'header', 'position'])
]); ?> ]); ?>
</div> </div>
<div class="col4">
<?php echo template::select('themeHeaderHeight', $module::$headerHeights, [
'label' => 'Hauteur maximale',
'selected' => $this->getData(['theme', 'header', 'height']),
'help' => 'La hauteur maximale est de 600 pixels, même si les dimensions de l\'image sélectionnée sont supérieures. <br />Lorsque l\'adaptation est positionnée sur Responsive, la hauteur diminue proportionnellement à la largeur.'
]); ?>
</div>
</div> </div>
<div class="row"> <div class="row">
<div class="col4">
<?php echo template::select('themeHeaderContainer', $module::$containers, [
'label' => 'Largeur',
'selected' => $this->getData(['theme', 'header', 'container'])
]); ?>
</div>
<div class="col4"> <div class="col4">
<div id="themeHeaderSmallDisplay" class="displayNone"> <div id="themeHeaderSmallDisplay" class="displayNone">
<?php echo template::checkbox('themeHeaderTinyHidden', true, 'Masquer la bannière en écran réduit', [ <?php echo template::checkbox('themeHeaderTinyHidden', true, 'Masquer la bannière en écran réduit', [
@ -45,17 +58,11 @@
]); ?> ]); ?>
</div> </div>
</div> </div>
<div class="col4">
<?php echo template::select('themeHeaderContainer', $module::$containers, [
'label' => 'Largeur',
'selected' => $this->getData(['theme', 'header', 'container'])
]); ?>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> <div class="row wallpaperContainer">
<div class="row">
<div class="col12"> <div class="col12">
<div class="block"> <div class="block">
<h4>Couleurs</h4> <h4>Couleurs</h4>
@ -80,7 +87,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="row"> <div class="row wallpaperContainer">
<div class="col12"> <div class="col12">
<div class="block"> <div class="block">
<h4>Mise en forme du titre</h4> <h4>Mise en forme du titre</h4>
@ -115,7 +122,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="row"> <div class="row wallpaperContainer">
<div class="col12"> <div class="col12">
<div class="block"> <div class="block">
<h4>Papier peint</h4> <h4>Papier peint</h4>
@ -170,7 +177,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="row"> <div class="row featureContainer">
<div class="col12"> <div class="col12">
<div class="block"> <div class="block">
<h4>Contenu personnalisé</h4> <h4>Contenu personnalisé</h4>