jenkins-bot has submitted this change and it was merged. (
https://gerrit.wikimedia.org/r/367623 )
Change subject: Apex theme: Improve alignment of TextInputWidget and its
elements
......................................................................
Apex theme: Improve alignment of TextInputWidget and its elements
Improving vertical alignment in TextInputWidgets (icons, indicators,
labels) and fix its size as follow-up to Id526add14e9fb06
Bug: T171296
Change-Id: I0374f54f345bfa875ca4a0fb554e030a4672867c
---
M src/themes/apex/common.less
M src/themes/apex/widgets.less
2 files changed, 16 insertions(+), 6 deletions(-)
Approvals:
Esanders: Looks good to me, approved
jenkins-bot: Verified
Jforrester: Looks good to me, but someone else must approve
diff --git a/src/themes/apex/common.less b/src/themes/apex/common.less
index 7bfe443..176ec16 100644
--- a/src/themes/apex/common.less
+++ b/src/themes/apex/common.less
@@ -54,6 +54,8 @@
@padding-bottom-textinput: unit( 8 / 16 / 0.8, em );
@line-height-base: 1.4;
+@line-height-widget-multiline: 1.275;
+@line-height-widget-singleline: 1.172em; // Firefox needs a value, Chrome the
unit; equals `15px` at base `font-size: 12.8px`
// Theme animation variables
// Some of these values are duplicated in OO.ui.ApexTheme
diff --git a/src/themes/apex/widgets.less b/src/themes/apex/widgets.less
index 32ce2ac..f5c0042 100644
--- a/src/themes/apex/widgets.less
+++ b/src/themes/apex/widgets.less
@@ -255,7 +255,7 @@
&-php .oo-ui-indicatorWidget {
right: 0;
- max-height: 2.375em;
+ max-height: 2.5em;
margin: 0;
margin-right: 0.775em;
}
@@ -1157,7 +1157,6 @@
input,
textarea {
padding: @padding-top-textinput 0.5em @padding-bottom-textinput
0.5em;
- line-height: 1.275em;
font-size: inherit;
font-family: inherit;
background-color: @background-color-main;
@@ -1172,6 +1171,14 @@
}
.apex-placeholder();
+ }
+
+ input {
+ line-height: @line-height-widget-singleline;
+ }
+
+ textarea {
+ line-height: @line-height-widget-multiline;
}
&.oo-ui-widget-enabled {
@@ -1221,7 +1228,7 @@
}
.oo-ui-iconElement-icon {
- max-height: 2.375em;
+ max-height: 2.5em;
margin-left: 0.3em;
}
}
@@ -1233,14 +1240,15 @@
}
.oo-ui-indicatorElement-indicator {
- max-height: 2.375em;
+ max-height: 2.5em;
margin-right: 0.775em;
}
}
> .oo-ui-labelElement-label {
- padding: 0.4em;
- line-height: 1.5em;
+ top: 1px; // equals `border-width`
+ padding: @padding-top-textinput 0.4em @padding-bottom-textinput
0.4em;
+ line-height: @line-height-widget-singleline;
color: @color-subtle;
}
--
To view, visit https://gerrit.wikimedia.org/r/367623
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: I0374f54f345bfa875ca4a0fb554e030a4672867c
Gerrit-PatchSet: 2
Gerrit-Project: oojs/ui
Gerrit-Branch: master
Gerrit-Owner: VolkerE <[email protected]>
Gerrit-Reviewer: Bartosz Dziewoński <[email protected]>
Gerrit-Reviewer: Esanders <[email protected]>
Gerrit-Reviewer: Jforrester <[email protected]>
Gerrit-Reviewer: Prtksxna <[email protected]>
Gerrit-Reviewer: VolkerE <[email protected]>
Gerrit-Reviewer: jenkins-bot <>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
