pgadmin-org
/
pgadmin4
mirror of https://github.com/pgadmin-org/pgadmin4.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Fixed controls alignment responsiveness to docker size change.

pull/20/head
Aditya Toshniwal 2019-01-17 18:20:12 +05:30 committed by Akshay Joshi
parent f779378e8a
commit 48660508ce
3 changed files with 57 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
web/pgadmin/browser/static/js/panel.js
View File

@ -147,27 +147,28 @@ define(
}
p.pgResizeTimeout = setTimeout(
function() {
var w = p.width();
var w = p.width(),
elAttr = 'xs';
p.pgResizeTimeout = null;
/** Calculations based on https://getbootstrap.com/docs/4.1/layout/grid/#grid-options **/
if (w < 480) {
w = 'xs';
elAttr = 'xs';
}
if (w >= 480) {
w = 'sm';
elAttr = 'sm';
}
if (w >= 768) {
w = 'md';
elAttr = 'md';
}
if (w >= 992) {
w = 'lg';
elAttr = 'lg';
}
if (w >=1200) {
w = 'xl';
elAttr = 'xl';
}
p.pgElContainer.attr('el', w);
p.pgElContainer.attr('el', elAttr);
},
100
);

15
web/pgadmin/static/js/alertify.pgadmin.defaults.js
View File

@ -201,28 +201,29 @@ define([
self.pgResizeTimeout = setTimeout(
function() {
var $el = $(this.elements.dialog),
w = $el.width();
w = $el.width(),
elAttr = 'xs';
this.pgResizeTimeout = null;
/** Calculations based on https://getbootstrap.com/docs/4.1/layout/grid/#grid-options **/
if (w < 480) {
w = 'xs';
elAttr = 'xs';
}
if (w >= 480) {
w = 'sm';
elAttr = 'sm';
}
if (w >= 768) {
w = 'md';
elAttr = 'md';
}
if (w >= 992) {
w = 'lg';
elAttr = 'lg';
}
if (w >=1200) {
w = 'xl';
elAttr = 'xl';
}
$el.attr('el', w);
$el.attr('el', elAttr);
}.bind(self),
100
);

46
web/pgadmin/static/scss/_pgadmin.grid.scss
View File

@ -41,16 +41,52 @@
flex-grow: 1;
max-width: 100%;
}
}
@for $i from 1 through $columns {
.pg-el-container[el=lg],
.pg-el-container[el=md],
.pg-el-container[el=sm]
.pg-el#{$infix}-#{$i} {
@for $i from 1 through $columns {
.pg-el-container[el=xl] {
.pg-el-sm-#{$i} {
@include make-col($i, $columns);
}
.pg-el-md-#{$i} {
@include make-col($i, $columns);
}
.pg-el-lg-#{$i} {
@include make-col($i, $columns);
}
.pg-el-xl-#{$i} {
@include make-col($i, $columns);
}
}
.pg-el-container[el=lg] {
.pg-el-sm-#{$i} {
@include make-col($i, $columns);
}
.pg-el-md-#{$i} {
@include make-col($i, $columns);
}
.pg-el-lg-#{$i} {
@include make-col($i, $columns);
}
}
.pg-el-container[el=md] {
.pg-el-md-#{$i} {
@include make-col($i, $columns);
}
.pg-el-sm-#{$i} {
@include make-col($i, $columns);
}
}
.pg-el-container[el=sm] {
.pg-el-sm-#{$i} {
@include make-col($i, $columns);
}
}
}
}
@include make-grid-columns();