Bartosz Dziewoński has uploaded a new change for review.
https://gerrit.wikimedia.org/r/189360
Change subject: [WIP] Add horizontal alignment test to demo
......................................................................
[WIP] Add horizontal alignment test to demo
Bug: T87546
Change-Id: I1c523e6c7db90306c88db59510d569227190e622
---
M demos/pages/widgets.js
M demos/styles/demo.css
M demos/widgets.php
3 files changed, 81 insertions(+), 1 deletion(-)
git pull ssh://gerrit.wikimedia.org:29418/oojs/ui refs/changes/60/189360/1
diff --git a/demos/pages/widgets.js b/demos/pages/widgets.js
index a5440b5..a64d158 100644
--- a/demos/pages/widgets.js
+++ b/demos/pages/widgets.js
@@ -1,5 +1,5 @@
OO.ui.Demo.static.pages.widgets = function ( demo ) {
- var styles, states, buttonStyleShowcaseWidget, fieldsets,
+ var styles, states, buttonStyleShowcaseWidget,
horizontalAlignmentWidget, fieldsets,
$demo = demo.$element;
/**
@@ -181,6 +181,28 @@
} );
buttonStyleShowcaseWidget.$element.append( $( '<br>' ) );
} );
+
+ horizontalAlignmentWidget = new OO.ui.Widget( {
+ classes: [ 'oo-ui-demo-horizontal-alignment' ]
+ } );
+ horizontalAlignmentWidget.$element.append(
+ new OO.ui.CheckboxInputWidget( { selected: true } ).$element,
+ new OO.ui.RadioInputWidget( { selected: true } ).$element,
+ new OO.ui.ButtonWidget( { label: 'Button' } ).$element,
+ new OO.ui.ButtonGroupWidget( { items: [
+ new OO.ui.ButtonWidget( { label: 'A' } ),
+ new OO.ui.ButtonWidget( { label: 'B' } )
+ ] } ).$element,
+ new OO.ui.ButtonInputWidget( { label: 'ButtonInput' }
).$element,
+ new OO.ui.TextInputWidget( { value: 'TextInput' } ).$element,
+ new OO.ui.DropdownInputWidget( { options: [
+ {
+ label: 'DropdownInput',
+ value: null
+ }
+ ] } ).$element,
+ new OO.ui.LabelWidget( { label: 'Label' } ).$element
+ );
fieldsets = [
new OO.ui.FieldsetLayout( {
@@ -953,6 +975,17 @@
]
} ),
new OO.ui.FieldsetLayout( {
+ label: 'Inline alignment',
+ items: [
+ new OO.ui.FieldLayout(
+ horizontalAlignmentWidget,
+ {
+ align: 'top'
+ }
+ )
+ ]
+ } ),
+ new OO.ui.FieldsetLayout( {
label: 'Draggable',
items: [
new OO.ui.FieldLayout(
diff --git a/demos/styles/demo.css b/demos/styles/demo.css
index 1da6fd9..7218bce 100644
--- a/demos/styles/demo.css
+++ b/demos/styles/demo.css
@@ -110,6 +110,20 @@
opacity: 1;
}
+/* Widgets demo */
+
+.oo-ui-demo-horizontal-alignment > .oo-ui-checkboxInputWidget,
+.oo-ui-demo-horizontal-alignment > .oo-ui-radioInputWidget,
+.oo-ui-demo-horizontal-alignment > .oo-ui-buttonInputWidget,
+.oo-ui-demo-horizontal-alignment > .oo-ui-textInputWidget,
+.oo-ui-demo-horizontal-alignment > .oo-ui-dropdownInputWidget {
+ display: inline-block;
+}
+
+.oo-ui-demo-horizontal-alignment > .oo-ui-textInputWidget,
+.oo-ui-demo-horizontal-alignment > .oo-ui-dropdownInputWidget {
+ max-width: 10em;
+}
/* Console */
diff --git a/demos/widgets.php b/demos/widgets.php
index a95668c..05ec44a 100644
--- a/demos/widgets.php
+++ b/demos/widgets.php
@@ -145,6 +145,28 @@
}
$buttonStyleShowcaseWidget->appendContent( new OOUI\HtmlSnippet( '<br />' ) );
}
+
+ $horizontalAlignmentWidget = new OOUI\Widget(
array(
+ 'classes' => array(
'oo-ui-demo-horizontal-alignment' )
+ ) );
+ $horizontalAlignmentWidget->appendContent(
+ new OOUI\CheckboxInputWidget( array(
'selected' => true ) ),
+ new OOUI\RadioInputWidget( array(
'selected' => true ) ),
+ new OOUI\ButtonWidget( array( 'label'
=> 'Button' ) ),
+ new OOUI\ButtonGroupWidget( array(
'items' => array(
+ new OOUI\ButtonWidget( array(
'label' => 'A' ) ),
+ new OOUI\ButtonWidget( array(
'label' => 'B' ) )
+ ) ) ),
+ new OOUI\ButtonInputWidget( array(
'label' => 'ButtonInput' ) ),
+ new OOUI\TextInputWidget( array(
'value' => 'TextInput' ) ),
+ new OOUI\DropdownInputWidget( array(
'options' => array(
+ array(
+ 'label' =>
'DropdownInput',
+ 'value' => null
+ )
+ ) ) ),
+ new OOUI\LabelWidget( array( 'label' =>
'Label' ) )
+ );
echo new OOUI\FieldsetLayout( array(
'label' => 'Simple buttons',
@@ -585,6 +607,17 @@
)
) );
echo new OOUI\FieldsetLayout( array(
+ 'label' => 'Inline alignment',
+ 'items' => array(
+ new OOUI\FieldLayout(
+
$horizontalAlignmentWidget,
+ array(
+ 'align' => 'top'
+ )
+ )
+ )
+ ) );
+ echo new OOUI\FieldsetLayout( array(
'label' => 'Other widgets',
'items' => array(
new OOUI\FieldLayout(
--
To view, visit https://gerrit.wikimedia.org/r/189360
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I1c523e6c7db90306c88db59510d569227190e622
Gerrit-PatchSet: 1
Gerrit-Project: oojs/ui
Gerrit-Branch: master
Gerrit-Owner: Bartosz Dziewoński <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits