From c99492e63d9909da7ac0921070c2403ea11688bc Mon Sep 17 00:00:00 2001
From: Thiemo Kreuz <thiemo.kreuz@wikimedia.de>
Date: Fri, 18 May 2018 23:07:08 +0200
Subject: [PATCH] Make Timeless aware of OOUI multiselect widgets
These OOUI widgets are special in so far that:
* OOUI makes the actual <input> element invisible and partly fails
to do so because Timeless sets properties on <input>s that are not
reset by OOUI.
* An outer <div> is styled like an <input> instead. Timeless is not
aware of this and forgets to set it's overrides for <input>s there.
This patch is motivated by the AdvancedSearch extension which uses
these widgets, but is not limited to this.
This patch also does not fix all compatibility issues between Timeless
and these OOUI widgets, but greatly reduces the main issues. More to
come in later patches.
Bug: T192303
Change-Id: I8a4fc3f74dabdb54fd95cd133bb4fe28944c4a40
---
resources/ooui.less | 19 +++++++++++++++++++
1 file changed, 19 insertions(+)
diff --git a/resources/ooui.less b/resources/ooui.less
index 332a5fa..6524a56 100644
--- a/resources/ooui.less
+++ b/resources/ooui.less
@@ -1,3 +1,22 @@
+@import 'variables.less';
+
+.skin-timeless {
+ .oo-ui-tagMultiselectWidget-handle,
+ .oo-ui-capsuleMultiselectWidget-handle {
+ // Same as for regular <input> and <textarea>, copied from form.less
+ border-color: @grey;
+ margin: 0.5em 0;
+ min-height: 0;
+
+ > .oo-ui-tagMultiselectWidget-content > input,
+ > .oo-ui-capsuleMultiselectWidget-content > input {
+ // OOUI forgets to reset these properties when making the <input> invisible
+ box-shadow: none;
+ min-height: 0;
+ }
+ }
+}
+
.skin-timeless .oo-ui-windowManager-modal > .oo-ui-dialog,
.skin-timeless .ve-ui-overlay-global {
z-index: 101;