made database query page responsive

Signed-off-by: Manish Bisht <manish.bisht490@gmail.com>
This commit is contained in:
Manish Bisht 2017-06-19 15:28:21 +05:30
parent b82854ccd7
commit 79c9c7b781
3 changed files with 14 additions and 3 deletions

View File

@ -74,4 +74,7 @@ AJAX.registerOnload('db_qbe.js', function () {
$('#action').val('delete');
});
var windowwidth = $(window).width();
$('#responsivetable').css('max-width', (windowwidth - 35 ) + 'px');
});

View File

@ -836,7 +836,7 @@ class DbQbe
*/
private function _getTablesList()
{
$html_output = '<div class="floatleft">';
$html_output = '<div class="floatleft width100">';
$html_output .= '<fieldset>';
$html_output .= '<legend>' . __('Use Tables') . '</legend>';
// Build the options list for each table name
@ -1809,12 +1809,14 @@ class DbQbe
{
$html_output = '<form action="db_qbe.php" method="post" id="formQBE" '
. 'class="lock-page">';
$html_output .= '<div class="width100">';
$html_output .= '<fieldset>';
if ($GLOBALS['cfgRelation']['savedsearcheswork']) {
$html_output .= $this->_getSavedSearchesField();
}
$html_output .= '<div id="responsivetable" class="responsivetable">';
$html_output .= '<table class="data" style="width: 100%;">';
// Get table's <tr> elements
$html_output .= $this->_getColumnNamesRow();
@ -1832,7 +1834,9 @@ class DbQbe
$url_params['criteriaColumnCount'] = $this->_new_column_count;
$url_params['rows'] = $this->_new_row_count;
$html_output .= Url::getHiddenInputs($url_params);
$html_output .= '</div>';
$html_output .= '</fieldset>';
$html_output .= '</div>';
// get footers
$html_output .= $this->_getTableFooters();
// get tables select list
@ -1841,7 +1845,7 @@ class DbQbe
$html_output .= '<form action="db_qbe.php" method="post" class="lock-page">';
$html_output .= Url::getHiddenInputs(array('db' => $this->_db));
// get SQL query
$html_output .= '<div class="floatleft" style="width:50%">';
$html_output .= '<div class="floatleft desktop50">';
$html_output .= '<fieldset>';
$html_output .= '<legend>'
. sprintf(

View File

@ -45,6 +45,10 @@ body#loginform {
margin: 0 .5em;
}
.desktop50 {
width: 50%;
}
.all100 {
width: 100%;
}
@ -3558,7 +3562,7 @@ body .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
display: none;
}
.width100 {
.width100, .desktop50 {
width: 100%;
}