From a413f35f707bc352df3de2e8414909603c32d65e Mon Sep 17 00:00:00 2001 From: Nate Date: Sat, 19 Oct 2019 20:29:44 -0600 Subject: [PATCH] CSS: Define responsive breakpoints, add to Access Controls, Bridges, Call Block, Buttons class. --- app/access_controls/access_controls.php | 4 +- app/bridges/bridges.php | 4 +- app/call_block/call_block.php | 4 +- resources/classes/button.php | 2 +- themes/default/css.php | 53 +++++++++++++++++++++---- 5 files changed, 53 insertions(+), 14 deletions(-) diff --git a/app/access_controls/access_controls.php b/app/access_controls/access_controls.php index a30c6fc3b9..f75fe1465b 100644 --- a/app/access_controls/access_controls.php +++ b/app/access_controls/access_controls.php @@ -154,7 +154,7 @@ echo " \n"; echo th_order_by('access_control_name', $text['label-access_control_name'], $order_by, $order); echo th_order_by('access_control_default', $text['label-access_control_default'], $order_by, $order); - echo th_order_by('access_control_description', $text['label-access_control_description'], $order_by, $order); + echo th_order_by('access_control_description', $text['label-access_control_description'], $order_by, $order, null, "class='hide-xs'"); if (permission_exists('access_control_edit') && $_SESSION['theme']['list_row_edit_button']['boolean'] == 'true') { echo "  \n"; } @@ -173,7 +173,7 @@ echo " \n"; echo " ".escape($row['access_control_name'])."\n"; echo " ".escape($row['access_control_default'])."\n"; - echo " ".escape($row['access_control_description'])."\n"; + echo " ".escape($row['access_control_description'])."\n"; if (permission_exists('access_control_edit') && $_SESSION['theme']['list_row_edit_button']['boolean'] == 'true') { echo " "; echo button::create(['type'=>'button','title'=>$text['button-edit'],'icon'=>$_SESSION['theme']['button_icon_edit'],'link'=>$list_row_url]); diff --git a/app/bridges/bridges.php b/app/bridges/bridges.php index 6749eb4ea5..cff3a7b202 100644 --- a/app/bridges/bridges.php +++ b/app/bridges/bridges.php @@ -193,7 +193,7 @@ echo th_order_by('bridge_name', $text['label-bridge_name'], $order_by, $order); echo th_order_by('bridge_destination', $text['label-bridge_destination'], $order_by, $order); echo th_order_by('bridge_enabled', $text['label-bridge_enabled'], $order_by, $order, null, "class='center'"); - echo " ".$text['label-description']."\n"; + echo " ".$text['label-description']."\n"; if (permission_exists('bridge_edit') && $_SESSION['theme']['list_row_edit_button']['boolean'] == 'true') { echo "  \n"; } @@ -225,7 +225,7 @@ echo " "; echo button::create(['type'=>'submit','class'=>'link','label'=>$text['label-'.$row['bridge_enabled']],'title'=>$text['button-toggle'],'onclick'=>"list_self_check('checkbox_".$x."'); list_action_set('toggle'); list_form_submit('form_list')"]); echo " \n"; - echo " ".escape($row['bridge_description'])."\n"; + echo " ".escape($row['bridge_description'])."\n"; if (permission_exists('bridge_edit') && $_SESSION['theme']['list_row_edit_button']['boolean'] == 'true') { echo " "; echo button::create(['type'=>'button','title'=>$text['button-edit'],'icon'=>$_SESSION['theme']['button_icon_edit'],'link'=>$list_row_url]); diff --git a/app/call_block/call_block.php b/app/call_block/call_block.php index 65017330a4..7cdfdd0e56 100644 --- a/app/call_block/call_block.php +++ b/app/call_block/call_block.php @@ -186,7 +186,7 @@ echo th_order_by('call_block_action', $text['label-action'], $order_by, $order); echo th_order_by('call_block_enabled', $text['label-enabled'], $order_by, $order, null, "class='center'"); echo th_order_by('date_added', $text['label-date-added'], $order_by, $order); - echo " ".$text['label-description']."\n"; + echo " ".$text['label-description']."\n"; if (permission_exists('call_block_edit') && $_SESSION['theme']['list_row_edit_button']['boolean'] == 'true') { echo "  \n"; } @@ -218,7 +218,7 @@ echo button::create(['type'=>'submit','class'=>'link','label'=>$text['label-'.$row['call_block_enabled']],'title'=>$text['button-toggle'],'onclick'=>"list_self_check('checkbox_".$x."'); list_action_set('toggle'); list_form_submit('form_list')"]); echo " \n"; echo " ".date("j M Y H:i:s".(defined('TIME_24HR') && TIME_24HR == 1 ? 'a' : null), $row['date_added'])."\n"; - echo " ".escape($row['call_block_description'])."\n"; + echo " ".escape($row['call_block_description'])."\n"; if (permission_exists('call_block_edit') && $_SESSION['theme']['list_row_edit_button']['boolean'] == 'true') { echo " "; echo button::create(['type'=>'button','title'=>$text['button-edit'],'icon'=>$_SESSION['theme']['button_icon_edit'],'link'=>$list_row_url]); diff --git a/resources/classes/button.php b/resources/classes/button.php index d1a5bf2ce4..9abc59e439 100644 --- a/resources/classes/button.php +++ b/resources/classes/button.php @@ -58,7 +58,7 @@ if (!class_exists('button')) { !$array['icon'] || $array['class'] == 'link' )) { - $hide_class = $array['icon'] && $button_icons != 'always' && $button_icons != 'never' ? 'hide-sm' : null; + $hide_class = $array['icon'] && $button_icons != 'always' && $button_icons != 'never' ? 'hide-md-dn' : null; $pad_class = $array['icon'] ? 'pad' : null; $button .= "".$array['label'].""; } diff --git a/themes/default/css.php b/themes/default/css.php index ab19802579..eebe6b9fa2 100644 --- a/themes/default/css.php +++ b/themes/default/css.php @@ -712,17 +712,56 @@ $default_login = ($_REQUEST['login'] == 'default') ? true : false; } - /* small screen, hide button labels if icons present */ - @media (max-width: 990px) { - button:not(.btn-link) > span.button-label.hide-sm { +/* BREAKPOINTS ****************************************************************/ + + /* hide button labels on medium and smaller screens (only if icons present) */ + @media (max-width: 991.98px) { + button:not(.btn-link) > span.button-label.hide-md-dn { display: none; } } - /* large screen show button labels if icons present */ - @media (min-width: 991px) { - button:not(.btn-link) > span.button-label.hide-sm { - display: inline; + /* screens = extra small */ + @media (max-width: 575.98px) { + .hide-xs, + .hide-sm-dn, + .hide-md-dn, + .hide-lg-dn { + display: none; + } + } + + /* screens = small */ + @media (min-width: 576px) and (max-width: 767.98px) { + .hide-sm, + .hide-sm-dn, + .hide-md-dn, + .hide-lg-dn { + display: none; + } + } + + /* screens = medium */ + @media (min-width: 768px) and (max-width: 991.98px) { + .hide-md, + .hide-md-dn, + .hide-lg-dn { + display: none; + } + } + + /* screens = large */ + @media (min-width: 992px) and (max-width: 1199.98px) { + .hide-lg, + .hide-lg-dn { + display: none; + } + } + + /* screens >= extra large */ + @media (min-width: 1200px) { + .hide-xl { + display: none; } }