jenkins-bot has submitted this change and it was merged.

Change subject: Add padded option to layouts
......................................................................


Add padded option to layouts

Objectives:

* Add option to layouts to control whether it's padded or not
* Rename "scroll" option to "scrollable" to better fit with it's boolean value

Changes:

ve.ui.Layout.css
* Add styles for scrollable and padded options

ve.ui.StackPanelLayout.js, ve.ui.PagedDialog.js, ve.ui.ReferenceListDialog.js
* Update use of scroll option

ve.ui.PanelLayout.js
* Add padded option
* Rename scroll option to scrollable
* Switch to using a class for scrollable option, rather than hardcoding CSS 
properties

Change-Id: I50e996b9d2fde361238cde75e09baa5872e12223
---
M modules/ve-mw/ui/dialogs/ve.ui.MWReferenceListDialog.js
M modules/ve/ui/dialogs/ve.ui.PagedDialog.js
M modules/ve/ui/layouts/ve.ui.PanelLayout.js
M modules/ve/ui/layouts/ve.ui.StackPanelLayout.js
M modules/ve/ui/styles/ve.ui.Layout.css
5 files changed, 23 insertions(+), 8 deletions(-)

Approvals:
  Catrope: Looks good to me, approved
  jenkins-bot: Verified



diff --git a/modules/ve-mw/ui/dialogs/ve.ui.MWReferenceListDialog.js 
b/modules/ve-mw/ui/dialogs/ve.ui.MWReferenceListDialog.js
index 7573398..f6f0cb5 100644
--- a/modules/ve-mw/ui/dialogs/ve.ui.MWReferenceListDialog.js
+++ b/modules/ve-mw/ui/dialogs/ve.ui.MWReferenceListDialog.js
@@ -37,6 +37,9 @@
        ve.ui.MWDialog.prototype.initialize.call( this );
 
        // Properties
+       this.editPanel = new ve.ui.PanelLayout( {
+               '$$': this.frame.$$, 'scrollable': true, 'padded': true
+       } );
        this.optionsFieldset = new ve.ui.FieldsetLayout( {
                '$$': this.frame.$$,
                'label': ve.msg( 
'visualeditor-dialog-reference-options-section' ),
@@ -59,9 +62,8 @@
 
        // Initialization
        this.optionsFieldset.$.append( this.groupLabel.$, this.groupInput.$ );
-       this.$body
-               .append( this.optionsFieldset.$ )
-               .addClass( 've-ui-mwReferenceListDialog-body' );
+       this.editPanel.$.append( this.optionsFieldset.$ );
+       this.$body.append( this.editPanel.$ );
        this.$foot.append( this.applyButton.$ );
 };
 
diff --git a/modules/ve/ui/dialogs/ve.ui.PagedDialog.js 
b/modules/ve/ui/dialogs/ve.ui.PagedDialog.js
index 4882bd2..92c334b 100644
--- a/modules/ve/ui/dialogs/ve.ui.PagedDialog.js
+++ b/modules/ve/ui/dialogs/ve.ui.PagedDialog.js
@@ -40,7 +40,7 @@
  */
 ve.ui.PagedDialog.prototype.initializePages = function () {
        // Properties
-       this.outlinePanel = new ve.ui.PanelLayout( { '$$': this.frame.$$, 
'scroll': true } );
+       this.outlinePanel = new ve.ui.PanelLayout( { '$$': this.frame.$$, 
'scrollable': true } );
        this.pagesPanel = new ve.ui.StackPanelLayout( { '$$': this.frame.$$ } );
        this.layout = new ve.ui.GridLayout(
                [this.outlinePanel, this.pagesPanel], { '$$': this.frame.$$, 
'widths': [1, 2] }
@@ -96,7 +96,7 @@
  */
 ve.ui.PagedDialog.prototype.addPage = function ( name, config ) {
        // Create and add page panel and outline item
-       this.pages[name] = new ve.ui.PanelLayout( { '$$': this.frame.$$, 
'scroll': true } );
+       this.pages[name] = new ve.ui.PanelLayout( { '$$': this.frame.$$, 
'scrollable': true } );
        if ( config.$content ) {
                this.pages[name].$.append( config.$content );
        }
diff --git a/modules/ve/ui/layouts/ve.ui.PanelLayout.js 
b/modules/ve/ui/layouts/ve.ui.PanelLayout.js
index 103dbe7..fac7e42 100644
--- a/modules/ve/ui/layouts/ve.ui.PanelLayout.js
+++ b/modules/ve/ui/layouts/ve.ui.PanelLayout.js
@@ -13,7 +13,8 @@
  *
  * @constructor
  * @param {Object} [config] Config options
- * @cfg {boolean} [scroll] Allow vertical scrolling
+ * @cfg {boolean} [scrollable] Allow vertical scrolling
+ * @cfg {boolean} [padded] Pad the content from the edges
  */
 ve.ui.PanelLayout = function VeUiPanelLayout( config ) {
        // Config initialization
@@ -25,7 +26,11 @@
        // Initialization
        this.$.addClass( 've-ui-panelLayout' );
        if ( config.scroll ) {
-               this.$.css( 'overflow-y', 'auto' );
+               this.$.addClass( 've-ui-panelLayout-scrollable' );
+       }
+
+       if ( config.padded ) {
+               this.$.addClass( 've-ui-panelLayout-padded' );
        }
 
        // Add directionality class:
diff --git a/modules/ve/ui/layouts/ve.ui.StackPanelLayout.js 
b/modules/ve/ui/layouts/ve.ui.StackPanelLayout.js
index 6e72cf6..2b14581 100644
--- a/modules/ve/ui/layouts/ve.ui.StackPanelLayout.js
+++ b/modules/ve/ui/layouts/ve.ui.StackPanelLayout.js
@@ -18,7 +18,7 @@
  */
 ve.ui.StackPanelLayout = function VeUiStackPanelLayout( config ) {
        // Config initialization
-       config = ve.extendObject( config, { 'scroll': true } );
+       config = ve.extendObject( config, { 'scrollable': true } );
 
        // Parent constructor
        ve.ui.PanelLayout.call( this, config );
diff --git a/modules/ve/ui/styles/ve.ui.Layout.css 
b/modules/ve/ui/styles/ve.ui.Layout.css
index 825deea..c532348 100644
--- a/modules/ve/ui/styles/ve.ui.Layout.css
+++ b/modules/ve/ui/styles/ve.ui.Layout.css
@@ -17,6 +17,14 @@
        bottom: 0;
 }
 
+.ve-ui-panelLayout-scrollable {
+       overflow-y: auto;
+}
+
+.ve-ui-panelLayout-padded {
+       padding: 2em;
+}
+
 /* ve.ui.FieldsetLayout */
 
 .ve-ui-fieldsetLayout {

-- 
To view, visit https://gerrit.wikimedia.org/r/74190
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings

Gerrit-MessageType: merged
Gerrit-Change-Id: I50e996b9d2fde361238cde75e09baa5872e12223
Gerrit-PatchSet: 2
Gerrit-Project: mediawiki/extensions/VisualEditor
Gerrit-Branch: master
Gerrit-Owner: Trevor Parscal <[email protected]>
Gerrit-Reviewer: Catrope <[email protected]>
Gerrit-Reviewer: jenkins-bot

_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits

Reply via email to