mirror of
https://gerrit.wikimedia.org/r/mediawiki/skins/MinervaNeue
synced 2024-11-17 19:21:39 +00:00
c0f08790ea
Note: this agitates T230232 again - when merging this please make sure a merge for I929090848f3e04647a97f4979ec78682623fa070 is pending. In various places we try to override the default mw-ui-icon behaviours The hacks need to be removed as part of addressing the core problem. Changes: * Wherever we use mw-ui-icon-before in PHP - wrap the label with a span so that label font-size is altered where needed - not the icon * Where a small icon is needed us isSmall parameter for the Icon component * Apply font-size to labels of mw-ui-icon-before elements * The browser tests need a slight update to access the span element inside a menu item - in the case of the logout button the label is always hidden, so we need to check the visibility of the parent element (secondary_action) Bug: T229440 Depends-On: I3f803ec4c9068b30aa93b803391aa4d65d8310ff Change-Id: I07e4ae233979636b739f1117dd7703571e0a9366
33 lines
1.1 KiB
Plaintext
33 lines
1.1 KiB
Plaintext
{{!
|
|
A list with visibility toggled by a checkbox.
|
|
string|null class Optional CSS class for the root element.
|
|
string checkboxID CSS identifier unique to the page needed to connect label and input.
|
|
string|null toggleID Optional toggle button CSS identifier to connect label and toggle aria.
|
|
string|null toggleClass Optional toggle button CSS class.
|
|
string|null analyticsEventName Optional analytics event, sent element is clicked
|
|
string|null listClass Optional list CSS class.
|
|
string|null text Optional text and aria label for the toggle button.
|
|
array|null items Optional array of drop down list items for the unordered list.
|
|
}}
|
|
<div class="toggle-list {{class}}">
|
|
<input
|
|
type="checkbox"
|
|
id="{{checkboxID}}"
|
|
class="toggle-list__checkbox"
|
|
role="button"
|
|
aria-labelledby="{{toggleID}}"
|
|
aria-expanded="false">
|
|
<label
|
|
id="{{toggleID}}"
|
|
class="toggle-list__toggle {{toggleClass}}"
|
|
for="{{checkboxID}}"
|
|
data-event-name="{{analyticsEventName}}">
|
|
{{text}}
|
|
</label>
|
|
<ul class="toggle-list__list new {{listClass}}">
|
|
{{#items}}
|
|
{{> ToggleList/ToggleListItem}}
|
|
{{/items}}
|
|
</ul>
|
|
</div>
|