Affichage menu avec min-width

This commit is contained in:
Deltacms 2022-11-23 18:09:45 +01:00
parent 1e718e2e6e
commit c2b33d1af2
6 changed files with 59 additions and 15 deletions

View File

@ -555,7 +555,9 @@ $(document).ready(function(){
$(window).on("resize", function() {
if( $(window).width() > 768 ){
$.each(parentPage, function(index, value) {
$('.' + value).css('min-width', '<?php echo $this->getData(['theme', 'menu', 'minWidhtParent']); ?>');
$('.navSub .'+value).css('width', $('.'+value).css('width'));
$('.' + value).css('text-align', 'left');
});
}
}).trigger("resize");

View File

@ -226,6 +226,8 @@ $text['core_theme_view']['menu'][33] = 'Proportional to that defined in the site
$text['core_theme_view']['menu'][34] = 'Style';
$text['core_theme_view']['menu'][35] = 'Character case';
$text['core_theme_view']['menu'][36] = 'Automatic background color';
$text['core_theme_view']['menu'][37] = 'Minimum width of a parent tab';
$text['core_theme_view']['menu'][38] = 'The submenu has a width imposed by the width of the parent tab, this selection sets a minimum width of the parent tab.';
$text['core_theme_view']['site'][0] = 'Back';
$text['core_theme_view']['site'][1] = 'Help';
$text['core_theme_view']['site'][2] = 'Save';
@ -513,4 +515,12 @@ $typeAddFont = [
//'link' => 'Fichier externe avec link',
//'import' => 'Fichier externe avec import'
];
$minWidthParent = [
'none' => 'free',
'50px' => '50px',
'100px' => '100px',
'120px' => '120px',
'150px' => '150px',
'200px' => '200px'
];
?>

View File

@ -226,6 +226,8 @@ $text['core_theme_view']['menu'][33] = 'Proportionnelle à celle définie dans l
$text['core_theme_view']['menu'][34] = 'Style';
$text['core_theme_view']['menu'][35] = 'Casse';
$text['core_theme_view']['menu'][36] = 'Couleur de fond automatique';
$text['core_theme_view']['menu'][37] = 'Largeur minimale d\'un onglet parent';
$text['core_theme_view']['menu'][38] = 'Le sous-menu a une largeur imposée par celle de l\'onglet parent, cette sélection permet de définir une largeur minimale de l\'onglet parent.';
$text['core_theme_view']['site'][0] = 'Retour';
$text['core_theme_view']['site'][1] = 'Aide';
$text['core_theme_view']['site'][2] = 'Enregistrer';
@ -512,4 +514,12 @@ $typeAddFont = [
//'link' => 'Fichier externe avec link',
//'import' => 'Fichier externe avec import'
];
$minWidthParent = [
'none' => 'libre',
'50px' => '50px',
'100px' => '100px',
'120px' => '120px',
'150px' => '150px',
'200px' => '200px'
];
?>

View File

@ -545,7 +545,8 @@ class theme extends common {
'burgerLogo' => $this->getInput('themeMenuBurgerLogo'),
'burgerContent' => $this->getInput('themeMenuBurgerContent'),
'burgerTextColor' => $this->getInput('themeMenuBurgerTextColor'),
'burgerFontSize' => $this->getInput('themeMenuBurgerFontSize')
'burgerFontSize' => $this->getInput('themeMenuBurgerFontSize'),
'minWidhtParent' => $this->getInput('themeMenuMinWidthParent'),
]]);
// Valeurs en sortie

View File

@ -122,7 +122,7 @@ $("input, select").on("change", function() {
$("nav").show().prependTo("#site");
break;
}
// Largeur étendue
if ($("#themeMenuWide").val() === 'none') {
$("#menu").removeClass();
@ -140,6 +140,18 @@ $("input, select").on("change", function() {
});
// Aperçu pour la largeur minimale de l'onglet parent
$("#themeMenuMinWidthParent").on("change", function() {
if( $(window).width() > 768 ){
$.each(parentPage, function(index, value) {
$('.' + value).css('min-width', $("#themeMenuMinWidthParent").val());
$('.navSub .'+value).css('width', $('.'+value).css('width'));
$('.' + value).css('text-align', 'left');
});
}
}).trigger("change");
//
// 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() {

View File

@ -54,36 +54,45 @@ echo template::formOpen('themeMenuForm'); ?>
</div>
</div>
<div class="row">
<div class="col4">
<div class="col3">
<?php echo template::select('themeMenuRadius', $menuRadius, [
'label' => $text['core_theme_view']['menu'][6],
'selected' => $this->getData(['theme', 'menu', 'radius']),
'help' => $text['core_theme_view']['menu'][7]
]); ?>
</div>
<div class="col4">
<div class="col3">
<?php echo template::select('themeMenuHeight', $menuHeights, [
'label' => $text['core_theme_view']['menu'][8],
'selected' => $this->getData(['theme', 'menu', 'height'])
]); ?>
</div>
<div class="col4">
<div class="col3">
<?php echo template::select('themeMenuTextAlign', $aligns, [
'label' => $text['core_theme_view']['menu'][9],
'selected' => $this->getData(['theme', 'menu', 'textAlign'])
]); ?>
</div>
<div class="col3">
<?php echo template::select('themeMenuMinWidthParent', $minWidthParent, [
'label' => $text['core_theme_view']['menu'][37],
'help' => $text['core_theme_view']['menu'][38],
'selected' => $this->getData(['theme', 'menu', 'minWidhtParent'])
]); ?>
</div>
</div>
<div id="themeMenuPositionOptions" class="displayNone">
<?php echo template::checkbox('themeMenuMargin', true, $text['core_theme_view']['menu'][10], [
'checked' => $this->getData(['theme', 'menu', 'margin'])
]); ?>
</div>
<div id="themeMenuPositionFixed" class="displayNone">
<?php echo template::checkbox('themeMenuFixed', true, $text['core_theme_view']['menu'][11], [
'checked' => $this->getData(['theme', 'menu', 'fixed'])
]); ?>
</div>
<div class="row">
<div id="themeMenuPositionOptions" class="displayNone">
<?php echo template::checkbox('themeMenuMargin', true, $text['core_theme_view']['menu'][10], [
'checked' => $this->getData(['theme', 'menu', 'margin'])
]); ?>
</div>
<div id="themeMenuPositionFixed" class="displayNone">
<?php echo template::checkbox('themeMenuFixed', true, $text['core_theme_view']['menu'][11], [
'checked' => $this->getData(['theme', 'menu', 'fixed'])
]); ?>
</div>
</div>
</div>
</div>
</div>