mediawiki-skins-Vector/includes/templates/Dropdown/Open.mustache
bwang d150131561 Generalize Pinnable functionality to not be limited to dropdowns, make Pinnable templates composable
This patch involves cached HTML changes
- Replace '-content-container' id with '-unpinned-container'
- Replace '-content' id with '-pinnable-element'
- Rename pinnableHeader.js to pinnableElement.js
- Replace PinnableDropdownContents.mustache with PinnableElement/Open.mustache and Close
- Add PinnedContainer/Open & Close and UnpinnedContainer/Open & Close
- Rename .vector-dropdown-content to .vector-pinnable-element
- Add new PinnableElement.less stylesheet

Bug: T318013
Change-Id: I85aec387f87126a17e760fd9fd10e10572ff3152
2022-11-30 17:17:20 -06:00

30 lines
1.1 KiB
Plaintext

{{!
See @typedef MenuDefinition
}}
{{! this template must be used with Dropdown/Close to avoid unclosed HTML tags }}
<div id="{{id}}" class="vector-menu vector-dropdown vector-menu-dropdown{{#class}} {{.}}{{/class}}" {{{html-tooltip}}} {{{html-user-language-attributes}}}>
{{!
Dropdown menus use the checkbox hack and require `input` and `label` elements.
`aria-label` is applied to the `input` which is semantically a button.
The `label` element is used as a visual button.
}}
<input type="checkbox"
id="{{id}}-checkbox"
role="button"
aria-haspopup="true"
data-event-name="ui.dropdown-{{id}}"
class="vector-menu-checkbox{{#checkbox-class}} {{.}}{{/checkbox-class}}"
{{#aria-label}}aria-label="{{.}}"{{/aria-label}}
{{{html-vector-menu-checkbox-attributes}}}
/>
<label
id="{{id}}-label"
for="{{id}}-checkbox"
class="vector-menu-heading{{#heading-class}} {{.}}{{/heading-class}}"
{{{html-vector-menu-heading-attributes}}}
>
{{{html-vector-heading-icon}}}<span class="vector-menu-heading-label">{{label}}</span>
</label>
<div class="vector-menu-content">