VolkerE has uploaded a new change for review.
https://gerrit.wikimedia.org/r/303338
Change subject: MediaWiki theme: Fix misalignment of widgets by applying pixel
`min-height`
......................................................................
MediaWiki theme: Fix misalignment of widgets by applying pixel `min-height`
Fixing different height of widgets, which is causing misalignment, by
applying `min-height` in pixels. Also introducing
`@padding-input-vertical` Less variable and removing unnecessary CSS
properties like `width: 100%` when `display: block` is set.
Bug: T102127
Bug: T142115
Change-Id: Ifa2c7e8c6ad0991767f359230c755081ba889c7b
---
M src/styles/widgets/DropdownWidget.less
M src/styles/widgets/NumberInputWidget.less
M src/themes/mediawiki/common.less
M src/themes/mediawiki/elements.less
M src/themes/mediawiki/widgets.less
5 files changed, 10 insertions(+), 14 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/oojs/ui refs/changes/38/303338/1
diff --git a/src/styles/widgets/DropdownWidget.less
b/src/styles/widgets/DropdownWidget.less
index 6f69e88..e312771 100644
--- a/src/styles/widgets/DropdownWidget.less
+++ b/src/styles/widgets/DropdownWidget.less
@@ -5,7 +5,6 @@
position: relative;
&-handle {
- width: 100%;
display: block;
white-space: nowrap;
overflow: hidden;
diff --git a/src/styles/widgets/NumberInputWidget.less
b/src/styles/widgets/NumberInputWidget.less
index f97171c..0cfc764 100644
--- a/src/styles/widgets/NumberInputWidget.less
+++ b/src/styles/widgets/NumberInputWidget.less
@@ -26,7 +26,6 @@
.oo-ui-buttonElement-button {
min-width: 0;
width: 100%;
- min-height: 0;
}
.theme-oo-ui-numberInputWidget();
diff --git a/src/themes/mediawiki/common.less b/src/themes/mediawiki/common.less
index 10a9515..762cf33 100644
--- a/src/themes/mediawiki/common.less
+++ b/src/themes/mediawiki/common.less
@@ -39,7 +39,7 @@
// Box Sizes
@min-width-button-framed: 40px;
@max-width-input-default: 50em;
-@min-height-button-framed: 31px;
+@min-height-default: 31px;
@size-icon-min: 24px;
@size-indicator-min: 12px;
@@ -65,6 +65,8 @@
@border-width-default: 1px;
+@padding-input-vertical: 0.46875em;
+
@box-shadow-dialog: 0 0.15em 0 0 rgba( 0, 0, 0, 0.15 );
@box-shadow-menu: @box-shadow-dialog;
@box-shadow-focus-default: inset 0 0 0 1px @color-progressive;
diff --git a/src/themes/mediawiki/elements.less
b/src/themes/mediawiki/elements.less
index 9e548c8..44c3615 100644
--- a/src/themes/mediawiki/elements.less
+++ b/src/themes/mediawiki/elements.less
@@ -98,10 +98,10 @@
}
> .oo-ui-buttonElement-button {
- padding: 0.5em 1em;
min-width: @min-width-button-framed;
- min-height: @min-height-button-framed;
+ min-height: @min-height-default;
border-radius: @border-radius-default;
+ padding: @padding-input-vertical 1em;
position: relative;
.oo-ui-transition(
background @transition-ease-quick,
diff --git a/src/themes/mediawiki/widgets.less
b/src/themes/mediawiki/widgets.less
index c76807f..676fe7a 100644
--- a/src/themes/mediawiki/widgets.less
+++ b/src/themes/mediawiki/widgets.less
@@ -101,9 +101,8 @@
.oo-ui-inline-spacing( 0.5em );
&-handle {
- padding: 0.5em 0;
- height: 2.275em;
- line-height: 1.275;
+ padding: 0.54685em 1em 0.3125em 1em;
+ min-height: @min-height-default;
border: @border-default;
border-radius: @border-radius-default;
@@ -117,10 +116,6 @@
top: 0;
left: 0.25em;
margin: 0.3em;
- }
-
- .oo-ui-labelElement-label {
- margin: 0 1em;
}
}
@@ -462,7 +457,7 @@
font-size: inherit;
font-family: inherit;
height: 1.5em;
- padding: 0.5em 1em;
+ padding: @padding-input-vertical 1em;
}
&.oo-ui-widget-enabled {
@@ -585,6 +580,7 @@
input,
textarea {
+ min-height: @min-height-default;
padding: 0.5em;
margin: 0;
font-size: inherit;
@@ -966,7 +962,7 @@
}
.theme-oo-ui-menuOptionWidget () {
- padding: 0.5em 1em;
+ padding: @padding-input-vertical 1em;
&.oo-ui-optionWidget {
&-selected {
--
To view, visit https://gerrit.wikimedia.org/r/303338
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: Ifa2c7e8c6ad0991767f359230c755081ba889c7b
Gerrit-PatchSet: 1
Gerrit-Project: oojs/ui
Gerrit-Branch: master
Gerrit-Owner: VolkerE <volke...@wikimedia.org>
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
