[MediaWiki-commits] [Gerrit] oojs/ui[master]: MenuLayout: Rewrite support for 'expanded: false'

2017-09-26 Thread jenkins-bot (Code Review)
jenkins-bot has submitted this change and it was merged. ( 
https://gerrit.wikimedia.org/r/380586 )

Change subject: MenuLayout: Rewrite support for 'expanded: false'
..


MenuLayout: Rewrite support for 'expanded: false'

I have just rediscovered the well-known fact that you can't have
equal-height columns with CSS floats. Use tables instead.

Also add examples with long contents to the demos to demostrate this,
and wrap existing examples in a framed PanelLayout, which looks pretty.

Follow-up to eb91004c67a62caab8fe798e31ff916e9dd3c315.

Bug: T98141
Change-Id: I54392db9b3a9902de8622a6b5c8668093a5715cd
---
M demos/classes/SampleTabPanel.js
M demos/pages/widgets.js
M src/layouts/MenuLayout.js
M src/styles/layouts/MenuLayout.less
M src/themes/apex/layouts.less
M src/themes/wikimediaui/layouts.less
6 files changed, 94 insertions(+), 56 deletions(-)

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



diff --git a/demos/classes/SampleTabPanel.js b/demos/classes/SampleTabPanel.js
index 03bce0d..39a7c6b 100644
--- a/demos/classes/SampleTabPanel.js
+++ b/demos/classes/SampleTabPanel.js
@@ -1,5 +1,7 @@
 Demo.SampleTabPanel = function DemoSampleTabPanel( name, config ) {
OO.ui.TabPanelLayout.call( this, name, config );
-   this.$element.text( this.label );
+   if ( this.$element.is( ':empty' ) ) {
+   this.$element.text( this.label );
+   }
 };
 OO.inheritClass( Demo.SampleTabPanel, OO.ui.TabPanelLayout );
diff --git a/demos/pages/widgets.js b/demos/pages/widgets.js
index 2bb62ac..fb59153 100644
--- a/demos/pages/widgets.js
+++ b/demos/pages/widgets.js
@@ -2680,27 +2680,46 @@
new OO.ui.FieldLayout(
new OO.ui.Widget( {
content: [
-   new 
OO.ui.BookletLayout( {
+   new OO.ui.PanelLayout( {
expanded: false,
-   outlined: true
-   } ).addPages( [
-   new 
Demo.SamplePage( 'first', {
-   
expanded: false,
-   label: 
'One'
-   } ),
-   new 
Demo.SamplePage( 'second', {
-   
expanded: false,
-   label: 
'Two'
-   } ),
-   new 
Demo.SamplePage( 'third', {
-   
expanded: false,
-   label: 
'Three'
-   } ),
-   new 
Demo.SamplePage( 'fourth', {
-   
expanded: false,
-   label: 
'Four'
-   } )
-   ] )
+   framed: true,
+   content: [
+   new 
OO.ui.BookletLayout( {
+   
expanded: false,
+   
outlined: true
+   } 
).addPages( [
+   
new Demo.SamplePage( 'first', {
+   
expanded: false,
+   
label: 'One'
+   
} ),
+   
new Demo.SamplePage( 'second', {
+   
expanded: false,
+   
label: 'Two'
+

[MediaWiki-commits] [Gerrit] oojs/ui[master]: MenuLayout: Rewrite support for 'expanded: false'

2017-09-25 Thread Code Review
Bartosz DziewoƄski has uploaded a new change for review. ( 
https://gerrit.wikimedia.org/r/380586 )

Change subject: MenuLayout: Rewrite support for 'expanded: false'
..

MenuLayout: Rewrite support for 'expanded: false'

I have just rediscovered the well-known fact that you can't have
equal-height columns with CSS floats. Use tables instead.

Also add examples with long contents to the demos to demostrate this,
and wrap existing examples in a framed PanelLayout, which looks pretty.

Follow-up to eb91004c67a62caab8fe798e31ff916e9dd3c315.

Change-Id: I54392db9b3a9902de8622a6b5c8668093a5715cd
---
M demos/classes/SampleTabPanel.js
M demos/pages/widgets.js
M src/layouts/MenuLayout.js
M src/styles/layouts/MenuLayout.less
M src/themes/apex/layouts.less
M src/themes/wikimediaui/layouts.less
6 files changed, 94 insertions(+), 56 deletions(-)


  git pull ssh://gerrit.wikimedia.org:29418/oojs/ui refs/changes/86/380586/1

diff --git a/demos/classes/SampleTabPanel.js b/demos/classes/SampleTabPanel.js
index 03bce0d..39a7c6b 100644
--- a/demos/classes/SampleTabPanel.js
+++ b/demos/classes/SampleTabPanel.js
@@ -1,5 +1,7 @@
 Demo.SampleTabPanel = function DemoSampleTabPanel( name, config ) {
OO.ui.TabPanelLayout.call( this, name, config );
-   this.$element.text( this.label );
+   if ( this.$element.is( ':empty' ) ) {
+   this.$element.text( this.label );
+   }
 };
 OO.inheritClass( Demo.SampleTabPanel, OO.ui.TabPanelLayout );
diff --git a/demos/pages/widgets.js b/demos/pages/widgets.js
index 2bb62ac..fb59153 100644
--- a/demos/pages/widgets.js
+++ b/demos/pages/widgets.js
@@ -2680,27 +2680,46 @@
new OO.ui.FieldLayout(
new OO.ui.Widget( {
content: [
-   new 
OO.ui.BookletLayout( {
+   new OO.ui.PanelLayout( {
expanded: false,
-   outlined: true
-   } ).addPages( [
-   new 
Demo.SamplePage( 'first', {
-   
expanded: false,
-   label: 
'One'
-   } ),
-   new 
Demo.SamplePage( 'second', {
-   
expanded: false,
-   label: 
'Two'
-   } ),
-   new 
Demo.SamplePage( 'third', {
-   
expanded: false,
-   label: 
'Three'
-   } ),
-   new 
Demo.SamplePage( 'fourth', {
-   
expanded: false,
-   label: 
'Four'
-   } )
-   ] )
+   framed: true,
+   content: [
+   new 
OO.ui.BookletLayout( {
+   
expanded: false,
+   
outlined: true
+   } 
).addPages( [
+   
new Demo.SamplePage( 'first', {
+   
expanded: false,
+   
label: 'One'
+   
} ),
+   
new Demo.SamplePage( 'second', {
+   
expanded: false,
+   
label: 'Two'
+