dbxe
/
fusionpbx
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Theme: Side Menu updates.

This commit is contained in:
Nate 2020-05-23 14:00:49 -06:00
parent 23c7d64d44
commit f18e2423ed
5 changed files with 141 additions and 75 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

74
resources/classes/menu.php
View File

@ -1078,50 +1078,35 @@ if (!class_exists('menu')) {
public function menu_vertical($menu_array) { public function menu_vertical($menu_array) {
//menu brand image and/or text //menu brand image and/or text
$html .= " <div id='menu_side_control_container'>\n";
$html .= " <div class='menu_side_control_state' style='float: right; ".($_SESSION['theme']['menu_side_state']['text'] != 'expanded' ? 'display: none' : null)."'>\n";
if ($_SESSION['theme']['menu_brand_type']['text'] != 'none') {
$html .= " <a class='menu_side_item_main menu_side_contract' onclick='menu_side_contract();' style='padding: 8px 15px !important; ".($_SESSION['theme']['menu_side_state']['text'] != 'expanded' ? "display: none;" : null)."'><i class='fas fa-bars fa-fw'></i></a>\n";
}
if ($_SESSION['theme']['menu_side_state_user']['boolean'] == 'true') {
$html .= " <a class='menu_side_item_main' id='menu_side_state_set_expanded' onclick=\"menu_side_state_set('expanded');\" style='padding: 8px 14px 8px 16px !important; ".($_SESSION['theme']['menu_side_state']['text'] == 'expanded' ? 'display: none' : null)."' title=\"".$this->text['theme-label-pin_menu']."\"><i class='fas fa-toggle-off fa-sm fa-fw'></i></a>\n";
$html .= " <a class='menu_side_item_main' id='menu_side_state_set_contracted' onclick=\"menu_side_state_set('contracted'); menu_side_contract();\" style='padding: 8px 14px 8px 16px !important; ".($_SESSION['theme']['menu_side_state']['text'] != 'expanded' ? 'display: none' : null)."' title=\"".$this->text['theme-label-unpin_menu']."\"><i class='fas fa-toggle-on fa-sm fa-fw'></i></a>\n";
}
$html .= " </div>\n";
if ($_SESSION['theme']['menu_brand_type']['text'] == 'none') { if ($_SESSION['theme']['menu_brand_type']['text'] == 'none') {
$html = " <div id='menu_side_control_container'>\n"; $html .= " <a class='menu_side_item_main menu_side_contract' onclick='menu_side_contract();' style='".($_SESSION['theme']['menu_side_state_user']['boolean'] == 'true' ? "max-width: calc(100% - 50px);" : null)." ".($_SESSION['theme']['menu_side_state']['text'] != 'expanded' ? "display: none;" : null)."' title=\"".$this->text['theme-label-contract_menu']."\"><i class='fas fa-bars fa-fw' style='z-index: 99800; padding-left: 1px;'></i></a>";
$html .= " <div class='menu_side_contract' style='float: right; ".($_SESSION['theme']['menu_side_state']['text'] != 'expanded' ? 'display: none' : null)."'>\n"; }
$html .= " <a class='menu_side_item_main' id='menu_side_state_set_expanded' onclick=\"menu_side_state_set('expanded');\" style='padding: 10px 15px !important; ".($_SESSION['theme']['menu_side_state']['text'] == 'expanded' ? 'display: none' : null)."' title=\"".$this->text['theme-label-pin_menu']."\"><i class='fas fa-toggle-off fa-fw'></i></a>\n"; if ($_SESSION['theme']['menu_brand_type']['text'] == 'text') {
$html .= " <a class='menu_side_item_main' id='menu_side_state_set_contracted' onclick=\"menu_side_state_set('contracted'); menu_side_contract();\" style='padding: 10px 15px !important; ".($_SESSION['theme']['menu_side_state']['text'] != 'expanded' ? 'display: none' : null)."' title=\"".$this->text['theme-label-unpin_menu']."\"><i class='fas fa-toggle-on fa-fw'></i></a>\n"; $menu_brand_text = $_SESSION['theme']['menu_brand_text']['text'] != '' ? escape($_SESSION['theme']['menu_brand_text']['text']) : "FusionPBX";
$html .= " </div>\n"; $html .= " <a class='menu_brand_text' ".($_SESSION['theme']['menu_side_state']['text'] != 'expanded' ? "style='display: none;'" : null)." href='".PROJECT_PATH."/'>".$menu_brand_text."</a>\n";
$html .= " <a class='menu_side_item_main menu_side_contract' onclick='menu_side_contract();' style='max-width: calc(100% - 50px); ".($_SESSION['theme']['menu_side_state']['text'] != 'expanded' ? "display: none;" : null)."' title=\"".$this->text['theme-label-contract_menu']."\"><i class='fas fa-chevron-left fa-fw' style='z-index: 99800; padding-left: 1px;'></i></a>"; }
$html .= " <a class='menu_side_item_main menu_side_expand' ".($_SESSION['theme']['menu_side_state']['text'] == 'expanded' ? "style='display: none';" : null)." onclick='menu_side_expand();' title=\"".$this->text['theme-label-expand_menu']."\"><i class='fas fa-bars fa-fw' style='z-index: 99800; padding-left: 1px;'></i></a>"; if ($_SESSION['theme']['menu_brand_type']['text'] == 'image' || $_SESSION['theme']['menu_brand_type']['text'] == '') {
$html .= " </div>\n"; $menu_brand_image_contracted = $_SESSION['theme']['menu_side_brand_image_contracted']['text'] != '' ? $_SESSION['theme']['menu_side_brand_image_contracted']['text'] : PROJECT_PATH."/themes/default/images/logo_side_contracted.png";
$menu_brand_image_expanded = $_SESSION['theme']['menu_side_brand_image_expanded']['text'] != '' ? $_SESSION['theme']['menu_side_brand_image_expanded']['text'] : PROJECT_PATH."/themes/default/images/logo_side_expanded.png";
$html .= " <a class='menu_brand_image' href='".PROJECT_PATH."/'>";
$html .= "<img id='menu_brand_image_contracted' style='".($_SESSION['theme']['menu_side_state']['text'] == 'expanded' ? "display: none;" : null)."' src='".escape($menu_brand_image_contracted)."' title=\"".escape($menu_brand_text)."\">";
$html .= "<img id='menu_brand_image_expanded' ".($_SESSION['theme']['menu_side_state']['text'] != 'expanded' ? "style='display: none;'" : null)." src='".escape($menu_brand_image_expanded)."' title=\"".escape($menu_brand_text)."\">";
$html .= "</a>\n";
} }
else { else {
$html = " <div id='menu_side_brand_container'>\n"; $html .= " <a class='menu_side_item_main menu_side_expand' ".($_SESSION['theme']['menu_side_state']['text'] == 'expanded' ? "style='display: none';" : null)." onclick='menu_side_expand();' title=\"".$this->text['theme-label-expand_menu']."\"><i class='fas fa-bars fa-fw' style='z-index: 99800; padding-left: 1px;'></i></a>";
//menu toggle buttons
if ($_SESSION['theme']['menu_brand_type']['text'] != 'none') {
$html .= " <div style='float: right; margin-right: -20px; margin-top: -20px;'>\n";
$html .= " <a class='menu_side_item_main menu_side_contract' onclick='menu_side_contract();' style='padding: 8px 15px !important; ".($_SESSION['theme']['menu_side_state']['text'] != 'expanded' ? "display: none;" : null)."'><i class='fas fa-chevron-left fa-fw'></i></a>\n";
$html .= " <div class='menu_side_contract' style='".($_SESSION['theme']['menu_side_state']['text'] != 'expanded' ? 'display: none' : null)."'>\n";
$html .= " <a class='menu_side_item_main' id='menu_side_state_set_expanded' onclick=\"menu_side_state_set('expanded');\" style='padding: 8px 15px !important; ".($_SESSION['theme']['menu_side_state']['text'] == 'expanded' ? 'display: none' : null)."' title=\"".$this->text['theme-label-pin_menu']."\"><i class='fas fa-toggle-off fa-fw'></i></a>\n";
$html .= " <a class='menu_side_item_main' id='menu_side_state_set_contracted' onclick=\"menu_side_state_set('contracted'); menu_side_contract();\" style='padding: 8px 15px !important; ".($_SESSION['theme']['menu_side_state']['text'] != 'expanded' ? 'display: none' : null)."' title=\"".$this->text['theme-label-unpin_menu']."\"><i class='fas fa-toggle-on fa-fw'></i></a>\n";
$html .= " </div>\n";
$html .= " </div>\n";
}
//show the menu brand image and/or text
$menu_brand_image_contracted = $_SESSION['theme']['menu_side_brand_image_contracted']['text'] != '' ? $_SESSION['theme']['menu_side_brand_image_contracted']['text'] : PROJECT_PATH."/themes/default/images/logo_side_contracted.png";
$menu_brand_image_expanded = $_SESSION['theme']['menu_side_brand_image_expanded']['text'] != '' ? $_SESSION['theme']['menu_side_brand_image_expanded']['text'] : PROJECT_PATH."/themes/default/images/logo_side_expanded.png";
$menu_brand_text = ($_SESSION['theme']['menu_brand_text']['text'] != '') ? escape($_SESSION['theme']['menu_brand_text']['text']) : "FusionPBX";
if ($_SESSION['theme']['menu_brand_type']['text'] == 'image' || $_SESSION['theme']['menu_brand_type']['text'] == '') {
$html .= " <a href='".PROJECT_PATH."/' style='text-decoration: none;'>";
$html .= "<img id='menu_brand_image_contracted' style='".($_SESSION['theme']['menu_side_state']['text'] == 'expanded' ? "display: none;" : null)." width: 20px; margin-left: -2px; margin-top: -5px;' src='".escape($menu_brand_image_contracted)."' title=\"".escape($menu_brand_text)."\">";
$html .= "<img id='menu_brand_image_expanded' ".($_SESSION['theme']['menu_side_state']['text'] != 'expanded' ? "style='display: none;'" : null)." src='".escape($menu_brand_image_expanded)."' title=\"".escape($menu_brand_text)."\">";
$html .= "</a>\n";
}
else if ($_SESSION['theme']['menu_brand_type']['text'] == 'image_text') {
$html .= " <a href='".PROJECT_PATH."/' style='text-decoration: none;'>";
$html .= "<img id='menu_brand_image_contracted' style='".($_SESSION['theme']['menu_side_state']['text'] == 'expanded' ? "display: none;" : null)." width: 20px; margin-left: -2px; margin-top: -5px;' src='".escape($menu_brand_image_contracted)."' title=\"".escape($menu_brand_text)."\">";
$html .= "<span class='menu_brand_text' ".($_SESSION['theme']['menu_side_state']['text'] != 'expanded' ? "style='display: none;'" : null).">".$menu_brand_text."</span>";
$html .= "</a>\n";
}
else if ($_SESSION['theme']['menu_brand_type']['text'] == 'text') {
$html .= " <a class='menu_brand_text' ".($_SESSION['theme']['menu_side_state']['text'] != 'expanded' ? "style='display: none;'" : null)." href='".PROJECT_PATH."/'>".$menu_brand_text."</a>\n";
}
$html .= " </div>\n";
} }
$html .= " </div>\n";
//main menu items //main menu items
if (is_array($menu_array) && sizeof($menu_array) != 0) { if (is_array($menu_array) && sizeof($menu_array) != 0) {
foreach ($menu_array as $menu_index_main => $menu_item_main) { foreach ($menu_array as $menu_index_main => $menu_item_main) {
@ -1146,16 +1131,11 @@ if (!class_exists('menu')) {
$html .= " <div style='height: 100px;'></div>\n"; $html .= " <div style='height: 100px;'></div>\n";
} }
$html .= "</div>\n"; $html .= "</div>\n";
if ($_SESSION['theme']['menu_side_state']['text'] == 'expanded') { $html .= "<div id='content_container' ".($_SESSION['theme']['menu_side_state']['text'] != 'expanded' ? "onclick=\"if ($(window).width() >= 576 && document.getElementById('menu_side_state_current').value != 'expanded') { menu_side_contract(); }\"" : null).">\n";
$content_container_width = is_numeric($_SESSION['theme']['menu_side_width_expanded']['text']) ? $_SESSION['theme']['menu_side_width_expanded']['text'] : '225';
}
else {
$content_container_width = is_numeric($_SESSION['theme']['menu_side_width_contracted']['text']) ? $_SESSION['theme']['menu_side_width_contracted']['text'] : '60';
}
$html .= "<div id='content_container' style='padding: 0; width: calc(100% - ".$content_container_width."px); float: right; padding-top: 0px; text-align: center;' ".($_SESSION['theme']['menu_side_state']['text'] != 'expanded' ? "onclick=\"if (document.getElementById('menu_side_state_current').value != 'expanded') { menu_side_contract(); }\"" : null).">\n";
$html .= " <div id='content_header'>\n"; $html .= " <div id='content_header'>\n";
//header: left //header: left
$html .= "<div class='float-left'>\n"; $html .= "<div class='float-left'>\n";
$html .= button::create(['type'=>'button','title'=>$this->text['theme-label-expand_menu'],'icon'=>'bars','class'=>'default hide-sm-up','onclick'=>'menu_side_expand();']);
$html .= "</div>\n"; $html .= "</div>\n";
//header: right //header: right
$html .= "<span class='float-right' style='white-space: nowrap;'>"; $html .= "<span class='float-right' style='white-space: nowrap;'>";

3
resources/footer.php
View File

@ -182,7 +182,8 @@
//build menu by style //build menu by style
switch ($_SESSION['theme']['menu_style']['text']) { switch ($_SESSION['theme']['menu_style']['text']) {
case 'side': case 'side':
$container_open = "<div id='menu_side_container'>\n"; $menu_side_toggle = $_SESSION['theme']['menu_side_toggle']['text'] == 'hover' ? " onmouseenter=\"if ($('#menu_side_container').width() < 100) { menu_side_expand(); }\" onmouseleave=\"if ($('#menu_side_container').width() > 100 && $('#menu_side_state_current').val() != 'expanded') { menu_side_contract(); }\"" : null;
$container_open = "<div id='menu_side_container' class='hide-xs' ".$menu_side_toggle." >\n";
$menu = new menu; $menu = new menu;
$menu->text = $text; $menu->text = $text;
$menu_html = $menu->menu_vertical($_SESSION['menu']['array']); $menu_html = $menu->menu_vertical($_SESSION['menu']['array']);

16
themes/default/app_config.php
View File

@ -1711,6 +1711,22 @@
$apps[$x]['default_settings'][$y]['default_setting_enabled'] = "true"; $apps[$x]['default_settings'][$y]['default_setting_enabled'] = "true";
$apps[$x]['default_settings'][$y]['default_setting_description'] = "Set the default state of the Side Menu: expanded (pinned) or contracted (unpinned)."; $apps[$x]['default_settings'][$y]['default_setting_description'] = "Set the default state of the Side Menu: expanded (pinned) or contracted (unpinned).";
$y++; $y++;
$apps[$x]['default_settings'][$y]['default_setting_uuid'] = "05e0318f-4344-4d40-9690-fb5cbcf20a2d";
$apps[$x]['default_settings'][$y]['default_setting_category'] = "theme";
$apps[$x]['default_settings'][$y]['default_setting_subcategory'] = "menu_side_state_user";
$apps[$x]['default_settings'][$y]['default_setting_name'] = "boolean";
$apps[$x]['default_settings'][$y]['default_setting_value'] = "true";
$apps[$x]['default_settings'][$y]['default_setting_enabled'] = "true";
$apps[$x]['default_settings'][$y]['default_setting_description'] = "Enable Side Menu toggle icon allowing users to choose their own state preference (contracted or expanded).";
$y++;
$apps[$x]['default_settings'][$y]['default_setting_uuid'] = "8ee8012a-da8c-483a-996d-d81b30a8bbea";
$apps[$x]['default_settings'][$y]['default_setting_category'] = "theme";
$apps[$x]['default_settings'][$y]['default_setting_subcategory'] = "menu_side_toggle";
$apps[$x]['default_settings'][$y]['default_setting_name'] = "text";
$apps[$x]['default_settings'][$y]['default_setting_value'] = "hover";
$apps[$x]['default_settings'][$y]['default_setting_enabled'] = "true";
$apps[$x]['default_settings'][$y]['default_setting_description'] = "Set whether the Side Menu opens & closes with a click (focus) or by mouse over/out (hover).";
$y++;
$apps[$x]['default_settings'][$y]['default_setting_uuid'] = "97a620e1-d7b2-4550-8648-726c3029143d"; $apps[$x]['default_settings'][$y]['default_setting_uuid'] = "97a620e1-d7b2-4550-8648-726c3029143d";
$apps[$x]['default_settings'][$y]['default_setting_category'] = "theme"; $apps[$x]['default_settings'][$y]['default_setting_category'] = "theme";
$apps[$x]['default_settings'][$y]['default_setting_subcategory'] = "action_bar_border_top"; $apps[$x]['default_settings'][$y]['default_setting_subcategory'] = "action_bar_border_top";

63
themes/default/css.php
View File

@ -516,12 +516,22 @@ header('Expires: '.gmdate('D, d M Y H:i:s',time()+3600).' GMT');
} }
/* menu side logo */ /* menu side logo */
a.menu_brand_image {
display: inline-block;
text-align: center;
padding: 15px 20px;
}
a.menu_brand_image:hover {
text-decoration: none;
}
img#menu_brand_image_contracted { img#menu_brand_image_contracted {
border: none; border: none;
width: auto; width: auto;
max-height: 30px; max-height: 20px;
max-width: 30px; max-width: 20px;
margin-right: 10px; margin-left: -1px;
} }
img#menu_brand_image_expanded { img#menu_brand_image_expanded {
@ -529,18 +539,19 @@ header('Expires: '.gmdate('D, d M Y H:i:s',time()+3600).' GMT');
height: auto; height: auto;
max-width: 145px; max-width: 145px;
max-height: 35px; max-height: 35px;
margin-top: -3px; margin-left: -7px;
margin-left: -6px;
} }
/* menu brand text */ /* menu brand text */
.menu_brand_text { a.menu_brand_text {
display: inline-block;
padding: 10px 20px;
color: <?php echo ($_SESSION['theme']['menu_brand_text_color']['text'] != '') ? $_SESSION['theme']['menu_brand_text_color']['text'] : 'rgba(255,255,255,0.80)'; ?>; color: <?php echo ($_SESSION['theme']['menu_brand_text_color']['text'] != '') ? $_SESSION['theme']['menu_brand_text_color']['text'] : 'rgba(255,255,255,0.80)'; ?>;
font-weight: 600; font-weight: 600;
white-space: nowrap; white-space: nowrap;
} }
.menu_brand_text:hover { a.menu_brand_text:hover {
color: <?php echo ($_SESSION['theme']['menu_brand_text_color_hover']['text'] != '') ? $_SESSION['theme']['menu_brand_text_color_hover']['text'] : 'rgba(255,255,255,1.0)'; ?>; color: <?php echo ($_SESSION['theme']['menu_brand_text_color_hover']['text'] != '') ? $_SESSION['theme']['menu_brand_text_color_hover']['text'] : 'rgba(255,255,255,1.0)'; ?>;
text-decoration: none; text-decoration: none;
} }
@ -574,7 +585,6 @@ header('Expires: '.gmdate('D, d M Y H:i:s',time()+3600).' GMT');
div#menu_side_container > a.menu_side_item_main, div#menu_side_container > a.menu_side_item_main,
div#menu_side_container > div > a.menu_side_item_main, div#menu_side_container > div > a.menu_side_item_main,
div#menu_side_container > div#menu_side_brand_container a.menu_side_item_main,
div#menu_side_container > div#menu_side_control_container a.menu_side_item_main { div#menu_side_container > div#menu_side_control_container a.menu_side_item_main {
display: block; display: block;
width: 100%; width: 100%;
@ -594,10 +604,7 @@ header('Expires: '.gmdate('D, d M Y H:i:s',time()+3600).' GMT');
div#menu_side_container > div > a.menu_side_item_main:active, div#menu_side_container > div > a.menu_side_item_main:active,
div#menu_side_container > div#menu_side_control_container > div a.menu_side_item_main:hover, div#menu_side_container > div#menu_side_control_container > div a.menu_side_item_main:hover,
div#menu_side_container > div#menu_side_control_container > div a.menu_side_item_main:focus, div#menu_side_container > div#menu_side_control_container > div a.menu_side_item_main:focus,
div#menu_side_container > div#menu_side_control_container > div a.menu_side_item_main:active, div#menu_side_container > div#menu_side_control_container > div a.menu_side_item_main:active {
div#menu_side_container > div#menu_side_brand_container > div a.menu_side_item_main:hover,
div#menu_side_container > div#menu_side_brand_container > div a.menu_side_item_main:focus,
div#menu_side_container > div#menu_side_brand_container > div a.menu_side_item_main:active {
color: <?php echo ($_SESSION['theme']['menu_main_text_color_hover']['text'] != '') ? $_SESSION['theme']['menu_main_text_color_hover']['text'] : '#fd9c03'; ?>; color: <?php echo ($_SESSION['theme']['menu_main_text_color_hover']['text'] != '') ? $_SESSION['theme']['menu_main_text_color_hover']['text'] : '#fd9c03'; ?>;
background: <?php echo ($_SESSION['theme']['menu_main_background_color_hover']['text'] != '') ? $_SESSION['theme']['menu_main_background_color_hover']['text'] : 'rgba(0,0,0,1.0)'; ?>; background: <?php echo ($_SESSION['theme']['menu_main_background_color_hover']['text'] != '') ? $_SESSION['theme']['menu_main_background_color_hover']['text'] : 'rgba(0,0,0,1.0)'; ?>;
text-decoration: none; text-decoration: none;
@ -615,6 +622,12 @@ header('Expires: '.gmdate('D, d M Y H:i:s',time()+3600).' GMT');
cursor: pointer; cursor: pointer;
} }
@media (max-width: 575.98px) {
a.menu_side_item_sub {
padding: 8px 20px 8px 45px;
}
}
a.menu_side_item_sub:hover, a.menu_side_item_sub:hover,
a.menu_side_item_sub:focus, a.menu_side_item_sub:focus,
a.menu_side_item_sub:active { a.menu_side_item_sub:active {
@ -628,6 +641,32 @@ header('Expires: '.gmdate('D, d M Y H:i:s',time()+3600).' GMT');
cursor: pointer; cursor: pointer;
} }
div#content_container {
padding: 0;
padding-top: 0px;
text-align: center;
}
@media (max-width: 575.98px) {
div#content_container {
width: 100%;
}
}
@media (min-width: 576px) {
div#content_container {
<?php
if ($_SESSION['theme']['menu_side_state']['text'] == 'expanded') {
$content_container_width = is_numeric($_SESSION['theme']['menu_side_width_expanded']['text']) ? $_SESSION['theme']['menu_side_width_expanded']['text'] : '225';
}
else {
$content_container_width = is_numeric($_SESSION['theme']['menu_side_width_contracted']['text']) ? $_SESSION['theme']['menu_side_width_contracted']['text'] : '60';
}
?>
width: calc(100% - <?php echo $content_container_width; ?>px);
float: right;
}
}
/* BUTTONS ********************************************************************/ /* BUTTONS ********************************************************************/
/* buttons */ /* buttons */

60
themes/default/template.php
View File

@ -12,7 +12,7 @@
<meta charset='utf-8'> <meta charset='utf-8'>
<meta http-equiv='Content-Type' content='text/html; charset=UTF-8'> <meta http-equiv='Content-Type' content='text/html; charset=UTF-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge'> <meta http-equiv='X-UA-Compatible' content='IE=edge'>
<meta name='viewport' content='width=device-width, initial-scale=1'> <meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no' />
{*//external css files *} {*//external css files *}
<link rel='stylesheet' type='text/css' href='{$project_path}/resources/bootstrap/css/bootstrap.min.css.php'> <link rel='stylesheet' type='text/css' href='{$project_path}/resources/bootstrap/css/bootstrap.min.css.php'>
@ -102,17 +102,22 @@
{/literal} {/literal}
{else if $settings.theme.menu_brand_type == 'text'} {else if $settings.theme.menu_brand_type == 'text'}
{literal} {literal}
$('.menu_brand_text').fadeOut(180); $('.menu_brand_text').hide();
{/literal} {/literal}
{/if} {/if}
{literal} {literal}
$('#menu_side_container').animate({ width: '{/literal}{$settings.theme.menu_side_width_contracted}{literal}px' }, 250); $('.menu_side_control_state').hide();
$('#content_container').animate({ width: $(window).width() - {/literal}{$settings.theme.menu_side_width_contracted}{literal} }, 250, function() { $('#menu_side_container').animate({ width: '{/literal}{$settings.theme.menu_side_width_contracted}{literal}px' }, 180, function() {
menu_side_state_current = 'contracted'; menu_side_state_current = 'contracted';
}); });
if ($(window).width() >= 576) {
$('#content_container').animate({ width: $(window).width() - {/literal}{$settings.theme.menu_side_width_contracted}{literal} }, 250);
}
$('.menu_side_contract').hide(); $('.menu_side_contract').hide();
$('.menu_side_expand').show(); $('.menu_side_expand').show();
if ($(window).width() < 576) {
$('#menu_side_container').hide();
}
} }
} }
@ -129,12 +134,11 @@
{/literal} {/literal}
{/if} {/if}
{literal} {literal}
$('#menu_side_container').animate({ width: '{/literal}{$settings.theme.menu_side_width_expanded}{literal}px' }, 250, function() { $('.menu_side_expand').hide();
$('.menu_side_contract').fadeIn(180); $('.menu_side_contract').show();
}); $('#menu_side_container').show();
$('#content_container').animate({ width: $(window).width() - {/literal}{$settings.theme.menu_side_width_expanded}{literal} }, 250, function() { var menu_side_container_width = $(window).width() < 576 ? $(window).width() : '{/literal}{$settings.theme.menu_side_width_expanded}{literal}px';
$('.menu_brand_text').fadeIn(180); $('#menu_side_container').animate({ width: menu_side_container_width }, 180, function() {
$('.menu_side_item_title').fadeIn(180);
{/literal} {/literal}
{if $settings.theme.menu_brand_type == 'image' || $settings.theme.menu_brand_type == ''} {if $settings.theme.menu_brand_type == 'image' || $settings.theme.menu_brand_type == ''}
{literal} {literal}
@ -142,9 +146,15 @@
{/literal} {/literal}
{/if} {/if}
{literal} {literal}
menu_side_state_current = 'expanded'; $('.menu_side_control_state').fadeIn(180);
$('.menu_brand_text').fadeIn(180);
$('.menu_side_item_title').fadeIn(180, function() {
menu_side_state_current = 'expanded';
});
}); });
$('.menu_side_expand').hide(); if ($(window).width() >= 576) {
$('#content_container').animate({ width: $(window).width() - {/literal}{$settings.theme.menu_side_width_expanded}{literal} }, 250);
}
} }
} }
@ -561,7 +571,27 @@
{if $settings.theme.menu_style == 'side'} {if $settings.theme.menu_style == 'side'}
{literal} {literal}
$(window).on('resizeEnd', function() { $(window).on('resizeEnd', function() {
$('#content_container').animate({ width: $(window).width() - $('#menu_side_container').width() }, 200); if ($(window).width() < 576) {
if (menu_side_state_current == 'contracted') {
$('#menu_side_container').hide();
}
if (menu_side_state_current == 'expanded') {
$('#menu_side_container').show();
$('#menu_side_container').animate({ width: $(window).width() }, 180);
}
$('#content_container').animate({ width: $(window).width() }, 100);
}
else {
$('#menu_side_container').show();
if (menu_side_state_current == 'expanded') {
$('#menu_side_container').animate({ width: '{/literal}{$settings.theme.menu_side_width_expanded}{literal}px' }, 180, function() {
$('#content_container').animate({ width: $(window).width() - $('#menu_side_container').width() }, 100);
});
}
else {
$('#content_container').animate({ width: $(window).width() - $('#menu_side_container').width() }, 100);
}
}
}); });
{/literal} {/literal}
{/if} {/if}
@ -933,7 +963,7 @@
{if $settings.theme.menu_style == 'inline'}{$logo}{/if} {if $settings.theme.menu_style == 'inline'}{$logo}{/if}
{$menu} {$menu}
{if $settings.theme.menu_style == 'inline' || $settings.theme.menu_style == 'static'}<br />{/if} {if $settings.theme.menu_style == 'inline' || $settings.theme.menu_style == 'static'}<br />{/if}
{if $settings.theme.menu_style == 'side'}<input type='hidden' id='menu_side_state_current' value=''>{/if} {if $settings.theme.menu_style == 'side'}<input type='hidden' id='menu_side_state_current' value='{$menu_side_state}'>{/if}
{else} {*//default: fixed *} {else} {*//default: fixed *}
{$menu} {$menu}
{$container_open} {$container_open}