Paging: Integrate Button class. Theme: Add supporting classes for upcoming changes to list pages.

2026-01-06 11:43:50 +00:00 · 2019-10-19 16:55:46 -06:00
parent c2a9dcf66c
commit 349684bb00
5 changed files with 165 additions and 41 deletions
--- a/themes/default/css.php
+++ b/themes/default/css.php
@@ -1239,8 +1239,8 @@ $default_login = ($_REQUEST['login'] == 'default') ? true : false;
 		display: none;
 	}

-	/* expand search input on focus */
-	input[type=text].search {
+	/* expand list search input on focus */
+	input[type=text].list-search {
 		width: 70px;
 		min-width: 70px;
 		margin-left: 15px;
@@ -1249,7 +1249,7 @@ $default_login = ($_REQUEST['login'] == 'default') ? true : false;
 		transition: all .5s ease;
 		}

-	input[type=text].search:focus {
+	input[type=text].list-search:focus {
 		width: 150px;
 		}

@@ -2097,7 +2097,7 @@ $default_login = ($_REQUEST['login'] == 'default') ? true : false;
 		white-space: nowrap;
 		}

-/*******************************************************************************/
+/* LIST ACTION BAR *************************************************************/

 	div.action_bar {
 		position: -webkit-sticky;
@@ -2141,3 +2141,85 @@ $default_login = ($_REQUEST['login'] == 'default') ? true : false;
 		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)'; ?>;
 		}
+
+/* LIST ************************************************************************/
+
+	.list {
+		width: 100%;
+		}
+
+	.list tr {
+		cursor: default;
+		}
+
+	.list tr:hover td:not(.no-link),
+	.list tr:hover td:not(.no-link) a {
+		color: <?php echo ($_SESSION['theme']['text_link_color_hover']['text'] != '') ? $_SESSION['theme']['text_link_color_hover']['text'] : '#5082ca'; ?>;
+		cursor: pointer;
+		}
+
+	.list-header > th {
+		padding: 4px 7px;
+		text-align: left;
+		color: <?php echo ($_SESSION['theme']['table_heading_text_color']['text'] != '') ? $_SESSION['theme']['table_heading_text_color']['text'] : '#3164ad'; ?>;
+		font-size: <?php echo ($_SESSION['theme']['table_heading_text_size']['text'] != '') ? $_SESSION['theme']['table_heading_text_size']['text'] : '12px'; ?>;
+		font-family: <?php echo ($_SESSION['theme']['table_heading_text_font']['text'] != '') ? $_SESSION['theme']['table_heading_text_font']['text'] : 'arial'; ?>;
+		background: <?php echo ($_SESSION['theme']['table_heading_background_color']['text'] != '') ? $_SESSION['theme']['table_heading_background_color']['text'] : 'none'; ?>;
+		border-bottom: 1px solid <?php echo ($_SESSION['theme']['table_heading_border_color']['text'] != '') ? $_SESSION['theme']['table_heading_border_color']['text'] : '#a4aebf'; ?>;
+		}
+
+	.list-row:nth-child(odd) > :not(.action-button) {
+		background: <?php echo ($_SESSION['theme']['table_row_background_color_light']['text'] != '') ? $_SESSION['theme']['table_row_background_color_light']['text'] : '#ffffff'; ?>;
+		}
+
+	.list-row:nth-child(even) > :not(.action-button) {
+		background: <?php echo ($_SESSION['theme']['table_row_background_color_dark']['text'] != '') ? $_SESSION['theme']['table_row_background_color_dark']['text'] : '#e5e9f0'; ?>;
+		}
+
+	.list-row > td:not(.action-button) {
+		border-bottom: 1px solid <?php echo ($_SESSION['theme']['table_row_border_color']['text'] != '') ? $_SESSION['theme']['table_row_border_color']['text'] : '#c5d1e5'; ?>;
+		color: <?php echo ($_SESSION['theme']['table_row_text_color']['text'] != '') ? $_SESSION['theme']['table_row_text_color']['text'] : '#000'; ?>;
+		font-family: <?php echo ($_SESSION['theme']['table_row_text_font']['text'] != '') ? $_SESSION['theme']['table_row_text_font']['text'] : 'arial'; ?>;
+		font-size: <?php echo ($_SESSION['theme']['table_row_text_size']['text'] != '') ? $_SESSION['theme']['table_row_text_size']['text'] : '12px'; ?>;
+		text-align: left;
+		}
+
+	.list-row > :not(.checkbox) {
+		padding: <?php echo ($_SESSION['theme']['table_row_padding']['text'] != '') ? $_SESSION['theme']['table_row_padding']['text'] : '4px 7px 4px 7px'; ?>;
+		}
+
+	.list-row > td.description {
+		background: <?php echo ($_SESSION['theme']['table_row_background_color_medium']['text'] != '') ? $_SESSION['theme']['table_row_background_color_medium']['text'] : '#f0f2f6'; ?> !important;
+		}
+
+	.list-header > .checkbox,
+	.list-row > .checkbox {
+		width: 1px;
+		text-align: center;
+		}
+
+	.list-row > .checkbox {
+		padding: 3px 7px 1px 7px;
+		}
+
+	.list-row > .button {
+		margin: 0;
+		padding-top: 0;
+		padding-bottom: 0;
+		white-space: nowrap;
+		}
+
+	.list-row > .overflow {
+		max-width: 50px;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+		}
+
+	.list-header > .action-button,
+	.list-row > .action-button {
+		width: 1px;
+		white-space: nowrap;
+		background: none;
+		padding: 0;
+		}
--- a/themes/default/template.php
+++ b/themes/default/template.php
@@ -205,8 +205,8 @@ echo "<script language='JavaScript' type='text/javascript' src='<!--{project_pat
 		?>

 		//link table rows (except the last - the list_control_icons cell) on a table with a class of 'tr_hover', according to the href attribute of the <tr> tag
-			$('.tr_hover tr').each(function(i,e) {
-				$(e).children('td:not(.list_control_icon,.list_control_icons,.tr_link_void)').on('click', function() {
+			$('.tr_hover tr,.list tr').each(function(i,e) {
+				$(e).children('td:not(.list_control_icon,.list_control_icons,.tr_link_void,.list-row > .no-link,.list-row > .checkbox,.list-row > .button,.list-row > .action-button)').on('click', function() {
 					var href = $(this).closest("tr").attr("href");
 					var target = $(this).closest('tr').attr('target');
 					if (href) {
@@ -378,7 +378,7 @@ echo "<script language='JavaScript' type='text/javascript' src='<!--{project_pat
 			}
 		}

-		//handle action bar style on scroll
+	//handle action bar style on scroll
 		window.addEventListener('scroll', action_bar_scroll , false);
 		function action_bar_scroll() {
 			if (document.getElementById('action_bar')) {
@@ -387,6 +387,48 @@ echo "<script language='JavaScript' type='text/javascript' src='<!--{project_pat
 			}
 		}

+	//list functions
+		function list_all_toggle() {
+			var inputs = document.getElementsByTagName('input');
+			var checkbox_checked = document.getElementById('checkbox_all').checked;
+			for (var i = 0, max = inputs.length; i < max; i++) {
+				if (inputs[i].type === 'checkbox') {
+					inputs[i].checked = checkbox_checked;
+				}
+			}
+			if (checkbox_checked) {
+				document.getElementById('btn_check_all').style.display = 'none';
+				document.getElementById('btn_check_none').style.display = '';
+			}
+			else {
+				document.getElementById('btn_check_all').style.display = '';
+				document.getElementById('btn_check_none').style.display = 'none';
+			}
+		}
+
+		function list_self_check(checkbox_id) {
+			var inputs = document.getElementsByTagName('input');
+			for (var i = 0, max = inputs.length; i < max; i++) {
+				if (inputs[i].type === 'checkbox') {
+					inputs[i].checked = false;
+				}
+			}
+			document.getElementById(checkbox_id).checked = true;
+		}
+
+		function list_action_set(action) {
+			document.getElementById('action').value = action;
+		}
+
+		function list_form_submit(form_id) {
+			document.getElementById(form_id).submit();
+		}
+
+		function list_search_reset() {
+			document.getElementById('btn_reset').style.display = 'none';
+			document.getElementById('btn_search').style.display = '';
+		}
+
 </script>

 <?php