Bridges: Action Bar shadow on scroll.

This commit is contained in:
Nate 2019-10-17 14:24:34 -06:00
parent 86a6f21b4c
commit 27eb994250
4 changed files with 118 additions and 23 deletions

View File

@ -166,7 +166,7 @@
echo "</script>\n";
//show the content
echo "<div class='action_bar'>\n";
echo "<div class='action_bar' id='action_bar'>\n";
echo " <b style='float: left;'>".$text['title-bridges']." (".$num_rows.")</b>\n";
if (permission_exists('bridge_add')) {
echo button::create(['type'=>'button','label'=>$text['button-add'],'icon'=>$_SESSION['theme']['button_icon_add'],'link'=>'bridge_edit.php']);

View File

@ -1646,45 +1646,117 @@
$apps[$x]['default_settings'][$y]['default_setting_enabled'] = "false";
$apps[$x]['default_settings'][$y]['default_setting_description'] = "Set the expanded brand image path for the Side menu.";
$y++;
$apps[$x]['default_settings'][$y]['default_setting_uuid'] = "dde32589-2d0d-4d10-a42a-3948061c17fe";
$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_subcategory'] = "action_bar_border_bottom_size";
$apps[$x]['default_settings'][$y]['default_setting_subcategory'] = "action_bar_border_top";
$apps[$x]['default_settings'][$y]['default_setting_name'] = "text";
$apps[$x]['default_settings'][$y]['default_setting_value'] = "0 0 1px 0";
$apps[$x]['default_settings'][$y]['default_setting_value'] = "0";
$apps[$x]['default_settings'][$y]['default_setting_enabled'] = "false";
$apps[$x]['default_settings'][$y]['default_setting_description'] = "Sets the border size of the Action Bar.";
$apps[$x]['default_settings'][$y]['default_setting_description'] = "Sets the top border style of the Action Bar.";
$y++;
$apps[$x]['default_settings'][$y]['default_setting_uuid'] = "8a2d3b59-a54a-4519-b049-4293e1f0dd4a";
$apps[$x]['default_settings'][$y]['default_setting_uuid'] = "10df6678-e9a7-4762-9c36-061da4ddf027";
$apps[$x]['default_settings'][$y]['default_setting_category'] = "theme";
$apps[$x]['default_settings'][$y]['default_setting_subcategory'] = "action_bar_border_bottom_style";
$apps[$x]['default_settings'][$y]['default_setting_subcategory'] = "action_bar_border_right";
$apps[$x]['default_settings'][$y]['default_setting_name'] = "text";
$apps[$x]['default_settings'][$y]['default_setting_value'] = "solid";
$apps[$x]['default_settings'][$y]['default_setting_value'] = "0";
$apps[$x]['default_settings'][$y]['default_setting_enabled'] = "false";
$apps[$x]['default_settings'][$y]['default_setting_description'] = "Sets the border style of the Action Bar.";
$apps[$x]['default_settings'][$y]['default_setting_description'] = "Sets the right border style of the Action Bar.";
$y++;
$apps[$x]['default_settings'][$y]['default_setting_uuid'] = "1f5f0f7b-e779-48d0-b1a6-afa1a2c9cf9e";
$apps[$x]['default_settings'][$y]['default_setting_uuid'] = "7ee2f7a5-b2d8-4e89-9f12-dd7d55b80fb0";
$apps[$x]['default_settings'][$y]['default_setting_category'] = "theme";
$apps[$x]['default_settings'][$y]['default_setting_subcategory'] = "action_bar_border_bottom_color";
$apps[$x]['default_settings'][$y]['default_setting_subcategory'] = "action_bar_border_bottom";
$apps[$x]['default_settings'][$y]['default_setting_name'] = "text";
$apps[$x]['default_settings'][$y]['default_setting_value'] = "#dddddd";
$apps[$x]['default_settings'][$y]['default_setting_value'] = "0";
$apps[$x]['default_settings'][$y]['default_setting_enabled'] = "false";
$apps[$x]['default_settings'][$y]['default_setting_description'] = "Sets the border color of the Action Bar.";
$apps[$x]['default_settings'][$y]['default_setting_description'] = "Sets the bottom border style of the Action Bar.";
$y++;
$apps[$x]['default_settings'][$y]['default_setting_uuid'] = "544cec97-3407-42f8-8627-32f92bcbc46b";
$apps[$x]['default_settings'][$y]['default_setting_uuid'] = "2359ea9d-b842-4c1d-8939-6ae13a46f46f";
$apps[$x]['default_settings'][$y]['default_setting_category'] = "theme";
$apps[$x]['default_settings'][$y]['default_setting_subcategory'] = "action_bar_border_bottom_radius";
$apps[$x]['default_settings'][$y]['default_setting_subcategory'] = "action_bar_border_left";
$apps[$x]['default_settings'][$y]['default_setting_name'] = "text";
$apps[$x]['default_settings'][$y]['default_setting_value'] = "0";
$apps[$x]['default_settings'][$y]['default_setting_enabled'] = "false";
$apps[$x]['default_settings'][$y]['default_setting_description'] = "Sets the left border style of the Action Bar.";
$y++;
$apps[$x]['default_settings'][$y]['default_setting_uuid'] = "04f38a60-f167-4e9a-a22b-f66f7dbc2a46";
$apps[$x]['default_settings'][$y]['default_setting_category'] = "theme";
$apps[$x]['default_settings'][$y]['default_setting_subcategory'] = "action_bar_border_radius";
$apps[$x]['default_settings'][$y]['default_setting_name'] = "text";
$apps[$x]['default_settings'][$y]['default_setting_value'] = "0";
$apps[$x]['default_settings'][$y]['default_setting_enabled'] = "false";
$apps[$x]['default_settings'][$y]['default_setting_description'] = "Sets the border radius of the Action Bar.";
$y++;
$apps[$x]['default_settings'][$y]['default_setting_uuid'] = "9de3beba-3b56-40e3-b312-111674a3b30f";
$apps[$x]['default_settings'][$y]['default_setting_uuid'] = "3cb27f9e-ca01-4fdc-9192-59ad7f19e437";
$apps[$x]['default_settings'][$y]['default_setting_category'] = "theme";
$apps[$x]['default_settings'][$y]['default_setting_subcategory'] = "action_bar_background";
$apps[$x]['default_settings'][$y]['default_setting_name'] = "text";
$apps[$x]['default_settings'][$y]['default_setting_value'] = "none";
$apps[$x]['default_settings'][$y]['default_setting_enabled'] = "false";
$apps[$x]['default_settings'][$y]['default_setting_description'] = "Sets the background color/image of the Action Bar.";
$y++;
$apps[$x]['default_settings'][$y]['default_setting_uuid'] = "a6144bc4-2dd0-4762-a774-f6308e7f5ce3";
$apps[$x]['default_settings'][$y]['default_setting_category'] = "theme";
$apps[$x]['default_settings'][$y]['default_setting_subcategory'] = "action_bar_shadow";
$apps[$x]['default_settings'][$y]['default_setting_name'] = "text";
$apps[$x]['default_settings'][$y]['default_setting_value'] = "none";
$apps[$x]['default_settings'][$y]['default_setting_enabled'] = "false";
$apps[$x]['default_settings'][$y]['default_setting_description'] = "Sets the shadow properties of the Action Bar.";
$y++;
$apps[$x]['default_settings'][$y]['default_setting_uuid'] = "821e3672-434e-44f8-817d-4b1022dfa5c5";
$apps[$x]['default_settings'][$y]['default_setting_category'] = "theme";
$apps[$x]['default_settings'][$y]['default_setting_subcategory'] = "action_bar_border_top_scroll";
$apps[$x]['default_settings'][$y]['default_setting_name'] = "text";
$apps[$x]['default_settings'][$y]['default_setting_value'] = "0";
$apps[$x]['default_settings'][$y]['default_setting_enabled'] = "false";
$apps[$x]['default_settings'][$y]['default_setting_description'] = "Sets the top border style of the Action Bar when scrolled.";
$y++;
$apps[$x]['default_settings'][$y]['default_setting_uuid'] = "87b4bd71-90a6-4805-9294-cc73eed463f7";
$apps[$x]['default_settings'][$y]['default_setting_category'] = "theme";
$apps[$x]['default_settings'][$y]['default_setting_subcategory'] = "action_bar_border_right_scroll";
$apps[$x]['default_settings'][$y]['default_setting_name'] = "text";
$apps[$x]['default_settings'][$y]['default_setting_value'] = "0";
$apps[$x]['default_settings'][$y]['default_setting_enabled'] = "false";
$apps[$x]['default_settings'][$y]['default_setting_description'] = "Sets the right border style of the Action Bar when scrolled.";
$y++;
$apps[$x]['default_settings'][$y]['default_setting_uuid'] = "ed9757de-5d94-44dc-a8bd-1391cc9d04ed";
$apps[$x]['default_settings'][$y]['default_setting_category'] = "theme";
$apps[$x]['default_settings'][$y]['default_setting_subcategory'] = "action_bar_border_bottom_scroll";
$apps[$x]['default_settings'][$y]['default_setting_name'] = "text";
$apps[$x]['default_settings'][$y]['default_setting_value'] = "0";
$apps[$x]['default_settings'][$y]['default_setting_enabled'] = "false";
$apps[$x]['default_settings'][$y]['default_setting_description'] = "Sets the bottom border style of the Action Bar when scrolled.";
$y++;
$apps[$x]['default_settings'][$y]['default_setting_uuid'] = "5a26887e-5090-4e2d-8024-c00868f1792d";
$apps[$x]['default_settings'][$y]['default_setting_category'] = "theme";
$apps[$x]['default_settings'][$y]['default_setting_subcategory'] = "action_bar_border_left_scroll";
$apps[$x]['default_settings'][$y]['default_setting_name'] = "text";
$apps[$x]['default_settings'][$y]['default_setting_value'] = "0";
$apps[$x]['default_settings'][$y]['default_setting_enabled'] = "false";
$apps[$x]['default_settings'][$y]['default_setting_description'] = "Sets the left border style of the Action Bar when scrolled.";
$y++;
$apps[$x]['default_settings'][$y]['default_setting_uuid'] = "3772b98d-6b0e-4d16-9531-c51c4d233e3c";
$apps[$x]['default_settings'][$y]['default_setting_category'] = "theme";
$apps[$x]['default_settings'][$y]['default_setting_subcategory'] = "action_bar_border_radius_scroll";
$apps[$x]['default_settings'][$y]['default_setting_name'] = "text";
$apps[$x]['default_settings'][$y]['default_setting_value'] = "0";
$apps[$x]['default_settings'][$y]['default_setting_enabled'] = "false";
$apps[$x]['default_settings'][$y]['default_setting_description'] = "Sets the border radius of the Action Bar when scrolled.";
$y++;
$apps[$x]['default_settings'][$y]['default_setting_uuid'] = "48bd7be1-127c-4d57-bf07-df95e8a3245f";
$apps[$x]['default_settings'][$y]['default_setting_category'] = "theme";
$apps[$x]['default_settings'][$y]['default_setting_subcategory'] = "action_bar_background_scroll";
$apps[$x]['default_settings'][$y]['default_setting_name'] = "text";
$apps[$x]['default_settings'][$y]['default_setting_value'] = "rgba(255,255,255,0.9)";
$apps[$x]['default_settings'][$y]['default_setting_enabled'] = "false";
$apps[$x]['default_settings'][$y]['default_setting_description'] = "Sets the background color/opacity/image of the Action Bar.";
$apps[$x]['default_settings'][$y]['default_setting_description'] = "Sets the background color/image of the Action Bar when scrolled.";
$y++;
$apps[$x]['default_settings'][$y]['default_setting_uuid'] = "0d458ce5-4c6e-403d-8a3e-34edde660670";
$apps[$x]['default_settings'][$y]['default_setting_category'] = "theme";
$apps[$x]['default_settings'][$y]['default_setting_subcategory'] = "action_bar_shadow_scroll";
$apps[$x]['default_settings'][$y]['default_setting_name'] = "text";
$apps[$x]['default_settings'][$y]['default_setting_value'] = "0 3px 3px 0 rgba(0,0,0,0.2)";
$apps[$x]['default_settings'][$y]['default_setting_enabled'] = "false";
$apps[$x]['default_settings'][$y]['default_setting_description'] = "Sets the shadow style of the Action Bar when scrolled.";
$y++;
$apps[$x]['default_settings'][$y]['default_setting_uuid'] = "529d314f-8ab6-44d0-9e51-b742d411b81c";
$apps[$x]['default_settings'][$y]['default_setting_category'] = "theme";

View File

@ -2110,12 +2110,26 @@ $default_login = ($_REQUEST['login'] == 'default') ? true : false;
?>
top: <?php echo $action_bar_top; ?>;
text-align: right;
border-bottom-width: <?php echo ($_SESSION['theme']['action_bar_border_bottom_size']['text'] != '') ? $_SESSION['theme']['action_bar_border_bottom_size']['text'] : '1px'; ?>;
border-bottom-style: <?php echo ($_SESSION['theme']['action_bar_border_bottom_style']['text'] != '') ? $_SESSION['theme']['action_bar_border_bottom_style']['text'] : 'solid'; ?>;
border-bottom-color: <?php echo ($_SESSION['theme']['action_bar_border_bottom_color']['text'] != '') ? $_SESSION['theme']['action_bar_border_bottom_color']['text'] : '#ddd'; ?>;
border-bottom-left-radius: <?php echo ($_SESSION['theme']['action_bar_border_bottom_radius']['text'] != '') ? $_SESSION['theme']['action_bar_border_bottom_radius']['text'] : '0'; ?>;
border-bottom-right-radius: <?php echo ($_SESSION['theme']['action_bar_border_bottom_radius']['text'] != '') ? $_SESSION['theme']['action_bar_border_bottom_radius']['text'] : '0'; ?>;
border-top: <?php echo ($_SESSION['theme']['action_bar_border_top']['text'] != '') ? $_SESSION['theme']['action_bar_border_top']['text'] : '0'; ?>;
border-right: <?php echo ($_SESSION['theme']['action_bar_border_right']['text'] != '') ? $_SESSION['theme']['action_bar_border_right']['text'] : '0'; ?>;
border-bottom: <?php echo ($_SESSION['theme']['action_bar_border_bottom']['text'] != '') ? $_SESSION['theme']['action_bar_border_bottom']['text'] : '0'; ?>;
border-left: <?php echo ($_SESSION['theme']['action_bar_border_left']['text'] != '') ? $_SESSION['theme']['action_bar_border_left']['text'] : '0'; ?>;
border-radius: <?php echo ($_SESSION['theme']['action_bar_border_radius']['text'] != '') ? $_SESSION['theme']['action_bar_border_radius']['text'] : '0'; ?>;
background: <?php echo ($_SESSION['theme']['action_bar_background']['text'] != '') ? $_SESSION['theme']['action_bar_background']['text'] : 'none'; ?>;
box-shadow: <?php echo ($_SESSION['theme']['action_bar_shadow']['text'] != '') ? $_SESSION['theme']['action_bar_shadow']['text'] : 'none'; ?>;
padding: 10px;
background: <?php echo ($_SESSION['theme']['action_bar_background']['text'] != '') ? $_SESSION['theme']['action_bar_background']['text'] : 'rgba(255,255,255,0.9)'; ?>;
margin: -10px -10px 10px -10px;
-webkit-transition: all .3s ease;
-moz-transition: all .3s ease;
transition: all .3s ease;
}
div.action_bar.scroll {
border-top: <?php echo ($_SESSION['theme']['action_bar_border_top_scroll']['text'] != '') ? $_SESSION['theme']['action_bar_border_top_scroll']['text'] : 'initial'; ?>;
border-right: <?php echo ($_SESSION['theme']['action_bar_border_right_scroll']['text'] != '') ? $_SESSION['theme']['action_bar_border_right_scroll']['text'] : 'initial'; ?>;
border-bottom: <?php echo ($_SESSION['theme']['action_bar_border_bottom_scroll']['text'] != '') ? $_SESSION['theme']['action_bar_border_bottom_scroll']['text'] : 'initial'; ?>;
border-left: <?php echo ($_SESSION['theme']['action_bar_border_left_scroll']['text'] != '') ? $_SESSION['theme']['action_bar_border_left_scroll']['text'] : 'initial'; ?>;
border-radius: <?php echo ($_SESSION['theme']['action_bar_border_radius_scroll']['text'] != '') ? $_SESSION['theme']['action_bar_border_radius_scroll']['text'] : 'initial'; ?>;
background: <?php echo ($_SESSION['theme']['action_bar_background_scroll']['text'] != '') ? $_SESSION['theme']['action_bar_background_scroll']['text'] : 'rgba(255,255,255,0.9)'; ?>;
box-shadow: <?php echo ($_SESSION['theme']['action_bar_shadow_scroll']['text'] != '') ? $_SESSION['theme']['action_bar_shadow_scroll']['text'] : '0 3px 3px 0 rgba(0,0,0,0.2)'; ?>;
}

View File

@ -378,6 +378,15 @@ echo "<script language='JavaScript' type='text/javascript' src='<!--{project_pat
}
}
//handle action bar style on scroll
window.addEventListener('scroll', action_bar_scroll , false);
function action_bar_scroll() {
if (document.getElementById('action_bar')) {
if (this.scrollY > 20) { document.getElementById('action_bar').classList.add('scroll'); }
if (this.scrollY < 20) { document.getElementById('action_bar').classList.remove('scroll'); }
}
}
</script>
<?php