mediawiki-skins-MinervaNeue/components/PageActionsMenu/PageActionsMenu.mustache
Stephen Niedzielski edb4385345 Hygiene: extract ToggleList to a reusable component
A list that toggles visibility via the checkbox hack is needed in at
least two spots: the page actions overflow menu and the user menu. This
patch makes several refactors to turn what was previously hardcoded into
page actions a reusable component:

- Start a new components directory. Components are reusable and
  composable. The subdirectories are organized by function, not
  ResourceLoader module bundling which greatly improves the ability to
  see a component's full functionality in one directory instead of
  examining the entire codebase. See updates to README.

- Extract pageactions.less into:
  - ToggleList.less: LESS for any checkbox hack list.
  - DropDownList.less: LESS for lists that open downwards.
  - MenuListItem.less: LESS for list items of menus.
  The division makes it easier to see concerns, dependencies, and change
  code.

- Move pageActionMenu.mustache to a component and extract ToggleList
  template.

- Extract ToggleList.js from Toolbar.js.

Bug: T214540
Change-Id: I171831469a6733c458bc5c7ba249a5096ca975b8
2019-07-04 13:48:13 -06:00

19 lines
526 B
Plaintext

<nav class="page-actions-menu">
<ul id="page-actions" class="page-actions-menu__list">
{{#toolbar}}
<li id="{{name}}" class="page-actions-menu__list-item">
{{#components}}
<a id="{{id}}" href="{{href}}" class="{{class}}" data-event-name="{{data-event-name}}" role="button" title="{{title}}">
{{text}}
</a>
{{/components}}
</li>
{{/toolbar}}
{{#overflowMenu}}
<li id="{{item-id}}" class="page-actions-menu__list-item">
{{> ToggleList/ToggleList}}
</li>
{{/overflowMenu}}
</ul>
</nav>