Consider the following list with a sublist:
<ul> <li>ZZZ <ul class="mw-collapsible"> <li>A <li>B </ul> </ul>
It looks as in the screenshot I will attach.
Instead, to be terser, the [Collapse] button should appear in the same line as ZZZ to save valuable vertical space on the screen.
After all, collapsibles have been invented to save vertical screen space.
So, if a user uses a collapsible, it is known that he or she values vertical space. This makes my point important for the user.
You can achieve a similar effect using custom togglers:
<ul> <li>ZZZ [<span class="mw-customtoggle-ZZZ">[[#|Expand/Collapse]]</span>] <ul class="mw-collapsible" id="mw-customcollapsible-ZZZ"> <li>A <li>B </ul> </ul>
@matmarex No, this is not the solution I need.
My site may be used by people with poor computer skills. Writing this is too complex.
I realize, I just suggested a workaround, since implementing your request might be non-trivial (and I am not working on it myself).
There is a better solution which I've done by paying $10 at Fiverr.
<ul> <li class="mw-custom-relative">ZZZ <ul class="mw-collapsible"> <li>A <li>B </ul> </ul>
with
.From the Fiverr developer:
You need to add this custom class and replace the common.less file inside your installation. You will find the common.less file here - /skins/Vector/components/
His solution is not ideal because it requires additional class mw-custom-relative, but it is much better than matmarex's solution.
Please integrate this into MediaWiki core.
Can I expect that this will be in MediaWiki core soon?
I need to know this now, or otherwise my project is stalled.
Have you considered providing a patch in Gerrit? (Though I'm not sure it would get accepted)
@VictorPorton Interesting approach. We can't integrate that patch unless the author (copyright owner) releases it under the GNU GPL 2 license. See https://www.mediawiki.org/wiki/Copyright.
I'll also note that it will only work for list items with short text. The left: 3%; part in the patch sets the horizontal position of the "[Collapse]" control, and it will overlap the list item text if it's longer. I don't think that would be okay to include in MediaWiki for all users (although it might work fine for you).
If I might offer some advice: it's much better to put styling customizations like this on the wiki itself. It will be easier to track the changes, and they won't be lost when you upgrade MediaWiki. You can edit the page "MediaWiki:Vector.css" on your wiki and add the styles there, rather than modify source code like /skins/Vector/components/common.less. See https://www.mediawiki.org/wiki/Manual:Interface/Stylesheets for more information about this feature. You should only include the modifications, and not copy the whole file – so only copy the last two blocks from that file:
.mw-custom-relative{
position:relative;
}
.mw-collapsible-toggle-li {
left: 3%;
list-style: outside none none;
position: absolute;
top: 0;
}I am the copyright holder for this file. I am releasing it under GNU GPL 2 license. Use it.
Sure, that leaves the second part, where it only works for very short list items…
I'm not sure why you insist on this being included in MediaWiki core when you can easily add the customization on-wiki, as I described.
I have written code which shows [Collapse] more compactly when the element to be collapsed is inside <li> tag (and is the only collapsible child of this <li> tag).
Here is my patch:
diff '--exclude=*~' '--exclude=*.b[ac]k' --exclude .svn --exclude .libs --exclude .deps --exclude autom4te.cache -Naur mediawiki.OLD/resources/src/jquery/jquery.makeCollapsible.js media wiki/resources/src/jquery/jquery.makeCollapsible.js --- mediawiki.OLD/resources/src/jquery/jquery.makeCollapsible.js 2015-12-21 03:02:43.000000000 +0200 +++ mediawiki/resources/src/jquery/jquery.makeCollapsible.js 2016-06-25 17:06:01.821991157 +0300 @@ -318,7 +318,10 @@ // If this is not a custom case, do the default: wrap the // contents and add the toggle link. Different elements are // treated differently. - if ( $collapsible.is( 'table' ) ) { + if ( $collapsible.parent().is( 'li' ) && $collapsible.parent().children('.mw-collapsible').size() == 1 ) { // special case of one collapsible in <li> tag + $toggleLink = buildDefaultToggleLink(); + $collapsible.before( $toggleLink ); + } else if ( $collapsible.is( 'table' ) ) { // If the table has a caption, collapse to the caption // as opposed to the first row
It works as expected and it is perfect to add this to MediaWiki core.
Change 296163 had a related patch set uploaded (by VictorPorton):
Bug T137676: More compact mw-collapsible inside <li>
Change 296163 had a related patch set uploaded (by Bartosz Dziewoński):
jquery.makeCollapsible: Special case of a list inside <li>
Change 296163 merged by jenkins-bot:
jquery.makeCollapsible: Special case of content inside <li>
T143484 was fixed in my patch at https://gerrit.wikimedia.org/r/#/c/305807/ but I've submitted the patch to a wrong changeset. Please help to add the patch to https://gerrit.wikimedia.org/r/#/c/296163/ where it belongs.