Improve filter box user experience

+ Reduce resizing when expanding input fields
+ Clearly indicate disabled vs. enabled date selection fields
+ Use modern UI style checkboxes and radio buttons

Fixes #22359

core/date_api.php

@@ -230,10 +230,11 @@ function print_year_range_option_list( $p_year = 0, $p_start = 0, $p_end = 0 ) {
  * @param boolean $p_allow_blank     Whether blank/null date is allowed.
  * @param integer $p_year_start      First year to display in drop down.
  * @param integer $p_year_end        Last year to display in drop down.
+ * @param string  $p_input_css       CSS classes to use with input fields
  * @return void
  * @access public
  */
-function print_date_selection_set( $p_name, $p_format, $p_date = 0, $p_default_disable = false, $p_allow_blank = false, $p_year_start = 0, $p_year_end = 0 ) {
+function print_date_selection_set( $p_name, $p_format, $p_date = 0, $p_default_disable = false, $p_allow_blank = false, $p_year_start = 0, $p_year_end = 0, $p_input_css = "input-sm" ) {
 	$t_chars = preg_split( '//', $p_format, -1, PREG_SPLIT_NO_EMPTY );
 	if( $p_date != 0 ) {
 		$t_date = preg_split( '/-/', date( 'Y-m-d', $p_date ), -1, PREG_SPLIT_NO_EMPTY );
@@ -252,25 +253,25 @@ function print_date_selection_set( $p_name, $p_format, $p_date = 0, $p_default_d
 
 	foreach( $t_chars as $t_char ) {
 		if( strcmp( $t_char, 'M' ) == 0 ) {
-			echo '<select class="input-sm" ' . helper_get_tab_index() . ' name="' . $p_name . '_month"' . $t_disable . '>';
+			echo '<select class="' . $p_input_css . '" ' . helper_get_tab_index() . ' name="' . $p_name . '_month"' . $t_disable . '>';
 			echo $t_blank_line;
 			print_month_option_list( $t_date[1] );
 			echo '</select>' . "\n";
 		}
 		if( strcmp( $t_char, 'm' ) == 0 ) {
-			echo '<select class="input-sm" ' . helper_get_tab_index() . ' name="' . $p_name . '_month"' . $t_disable . '>';
+			echo '<select class="' . $p_input_css . '" ' . helper_get_tab_index() . ' name="' . $p_name . '_month"' . $t_disable . '>';
 			echo $t_blank_line;
 			print_month_option_list( $t_date[1] );
 			echo '</select>' . "\n";
 		}
 		if( strcasecmp( $t_char, 'D' ) == 0 ) {
-			echo '<select class="input-sm" ' . helper_get_tab_index() . ' name="' . $p_name . '_day"' . $t_disable . '>';
+			echo '<select class="' . $p_input_css . '" ' . helper_get_tab_index() . ' name="' . $p_name . '_day"' . $t_disable . '>';
 			echo $t_blank_line;
 			print_day_option_list( $t_date[2] );
 			echo '</select>' . "\n";
 		}
 		if( strcasecmp( $t_char, 'Y' ) == 0 ) {
-			echo '<select class="input-sm" ' .  helper_get_tab_index() . ' name="' . $p_name . '_year"' . $t_disable . '>';
+			echo '<select class="' . $p_input_css . '" ' .  helper_get_tab_index() . ' name="' . $p_name . '_year"' . $t_disable . '>';
 			echo $t_blank_line;
 			print_year_range_option_list( $t_date[0], $p_year_start, $p_year_end );
 			echo '</select>' . "\n";