16/03/2016
The wcDocker theme frame width has been changed from 6px to 4px. This change has
been brought about to keep the width of the frame consistent with the width of
the window divider.
Below is the git diff of wcDocker.js
diff --git a/web/pgadmin/static/js/wcDocker/wcDocker.js b/web/pgadmin/static/js/wcDocker/wcDocker.js
index 954d73e..bc64b3b 100755
--- a/web/pgadmin/static/js/wcDocker/wcDocker.js
+++ b/web/pgadmin/static/js/wcDocker/wcDocker.js
@@ -3408,14 +3408,14 @@ define('wcDocker/frame',[
this.$frame.append(this.$center);
if (this._isFloating) {
- this.$top = $('<div class="wcFrameEdgeH wcFrameEdge"></div>').css('top', '-6px').css('left', '0px').css('right', '0px');
- this.$bottom = $('<div class="wcFrameEdgeH wcFrameEdge"></div>').css('bottom', '-6px').css('left', '0px').css('right', '0px');
- this.$left = $('<div class="wcFrameEdgeV wcFrameEdge"></div>').css('left', '-6px').css('top', '0px').css('bottom', '0px');
- this.$right = $('<div class="wcFrameEdgeV wcFrameEdge"></div>').css('right', '-6px').css('top', '0px').css('bottom', '0px');
- this.$corner1 = $('<div class="wcFrameCornerNW wcFrameEdge"></div>').css('top', '-6px').css('left', '-6px');
- this.$corner2 = $('<div class="wcFrameCornerNE wcFrameEdge"></div>').css('top', '-6px').css('right', '-6px');
- this.$corner3 = $('<div class="wcFrameCornerNW wcFrameEdge"></div>').css('bottom', '-6px').css('right', '-6px');
- this.$corner4 = $('<div class="wcFrameCornerNE wcFrameEdge"></div>').css('bottom', '-6px').css('left', '-6px');
+ this.$top = $('<div class="wcFrameEdgeH wcFrameEdge"></div>').css('top', '-4px').css('left', '0px').css('right', '0px');
+ this.$bottom = $('<div class="wcFrameEdgeH wcFrameEdge"></div>').css('bottom', '-4px').css('left', '0px').css('right', '0px');
+ this.$left = $('<div class="wcFrameEdgeV wcFrameEdge"></div>').css('left', '-4px').css('top', '0px').css('bottom', '0px');
+ this.$right = $('<div class="wcFrameEdgeV wcFrameEdge"></div>').css('right', '-4px').css('top', '0px').css('bottom', '0px');
+ this.$corner1 = $('<div class="wcFrameCornerNW wcFrameEdge"></div>').css('top', '-4px').css('left', '-4px');
+ this.$corner2 = $('<div class="wcFrameCornerNE wcFrameEdge"></div>').css('top', '-4px').css('right', '-4px');
+ this.$corner3 = $('<div class="wcFrameCornerNW wcFrameEdge"></div>').css('bottom', '-4px').css('right', '-4px');
+ this.$corner4 = $('<div class="wcFrameCornerNE wcFrameEdge"></div>').css('bottom', '-4px').css('left', '-4px');
this.$frame.append(this.$top);
this.$frame.append(this.$bottom);
The same changes have been made to wcDocker-min.js and is not included as the
file is tidy formatted.
06/04/2016
The wcDocker is updated to remove the extra left and the right arrows ( signs ) which are not required for tab navigation. New rules has been added to set the position for each specific navigational buttons ; left & right
diff --git a/web/pgadmin/static/js/wcDocker/wcDocker.js b/web/pgadmin/static/js/wcDocker/wcDocker.js
index bc64b3b..b4a5193 100755
--- a/web/pgadmin/static/js/wcDocker/wcDocker.js
+++ b/web/pgadmin/static/js/wcDocker/wcDocker.js
@@ -3392,8 +3392,8 @@ define('wcDocker/frame',[
this.$tabBar = $('<div class="wcFrameTitleBar">');
this.$tabScroll = $('<div class="wcTabScroller">');
this.$center = $('<div class="wcFrameCenter wcPanelBackground">');
- this.$tabLeft = $('<div class="wcFrameButton" title="Scroll tabs to the left."><span class="fa fa-arrow-left"></span><</div>');
- this.$tabRight = $('<div class="wcFrameButton" title="Scroll tabs to the right."><span class="fa fa-arrow-right"></span>></div>');
+ this.$tabLeft = $('<div class="wcFrameButton wcFrameButtonLeft" title="Scroll tabs to the left."><span class="fa fa-arrow-left"></span></div>');
+ this.$tabRight = $('<div class="wcFrameButton wcFrameButtonRight" title="Scroll tabs to the right."><span class="fa fa-arrow-right"></span></div>');
this.$close = $('<div class="wcFrameButton" title="Close the currently active panel tab"><div class="fa fa-close"></div>X</div>');
this.$collapse = $('<div class="wcFrameButton" title="Collapse the active panel"><div class="fa fa-download"></div>C</div>');
@@ -5985,8 +5985,8 @@ define('wcDocker/tabframe',[
this.$tabBar = $('<div class="wcFrameTitleBar wcCustomTabTitle wcWide">');
this.$tabScroll = $('<div class="wcTabScroller">');
this.$center = $('<div class="wcFrameCenter wcPanelBackground">');
- this.$tabLeft = $('<div class="wcFrameButton" title="Scroll tabs to the left."><span class="fa fa-arrow-left"></span><</div>');
- this.$tabRight = $('<div class="wcFrameButton" title="Scroll tabs to the right."><span class="fa fa-arrow-right"></span>></div>');
+ this.$tabLeft = $('<div class="wcFrameButton wcFrameButtonLeft" title="Scroll tabs to the left."><span class="fa fa-arrow-left"></span></div>');
+ this.$tabRight = $('<div class="wcFrameButton wcFrameButtonRight" title="Scroll tabs to the right."><span class="fa fa-arrow-right"></span></div>');
this.$close = $('<div class="wcFrameButton" title="Close the currently active panel tab"><span class="fa fa-close"></span>X</div>');
//this.$maximize = $('<div class="wcFrameButton" title="Close the currently active panel tab"><span class="fa fa-expand"></span>X</div>');