Commit Graph

11 Commits

Author SHA1 Message Date
Ed Sanders 90b5ff5149 Define documentable types in eslintrc instead of inline
Change-Id: I80f0557a6355208d2694f3776cce2ee858573a9c
2021-10-18 18:08:32 +00:00
jdlrobson caed16e26f Allow multiple search components on the same page
Styling should not depend on IDs to allow us to have multiple
searches in the page.

Precursor for wiring up search in the sticky header.

This also tweaks performance metrics to track separate metrics
for the sticky header search

Change-Id: I5b4192a8f5a9f95af26c1faf904f7cc994323518
2021-09-23 23:23:58 +00:00
jdlrobson ad5c127239 [Storybook] Add Header component
* Moves screen variables relating to Header to Header
* Adds a Header storybook entry
* Moves data-logo from Logo template to Header.mustache
* Updates UserLinks to use USER_LINK_PARTIALS
* Renames confusing SearchBox story names
* Updates package.json to use a static folder.
* Use mediawiki.org for sourcing mw-ui-button and mw-ui-icon styles
since deploys there come earlier
* Removes usages of ID selectors

Change-Id: I0e158fa7e62c56a50cfff497d75f0808effd1eed
2021-09-14 18:33:10 +00:00
jdlrobson 31dba307ed [refactor] SearchBox uses Icon template partial
Change-Id: I8ff49b85dd2151618e48251e0fc38152a50ca381
2021-09-09 18:57:37 +00:00
bwang d1f1f32418 Update UserLinks and SearchBox storybook stories to match prod
- Update UserLinks data to wrap link content with spans and other markup changes
- Use UserLinks__login.mustache and UserLinks__logout.mustache for rendering UserLink stories
- Add new SearchBox story to account for search collapse behavior in modern Vector

Change-Id: Ib0abce31db60a0c5c88dea17085e2974ac5112b5
2021-08-05 10:08:31 -05:00
jdlrobson 6777c5b1fe Collapse header at lower resolutions
Reduces the min-width to 340px with several changes at lower
resolutions
* collapses create account into dropdown
* hides language button and user messages
* The search component is updated to include a search toggle which
can be used to hide and show the search input at lower resolutions
- this leads to a slight HTML change with caching implications,
it also moves away from a BEM usage which is not standard for this
repository.
* limits width of logo based on the dimensions we display
in mobile

Bug: T276566
Change-Id: I89d75843ca7e33e6de93af5d7c22e46b7249c4b7
2021-06-30 21:43:35 +00:00
jdlrobson 39a333452b Refactor: html-userlangattributes -> html-user-language-attributes
This matches the name in core and is needed in preparation for
switching to SkinMustache

Additional change:
The JS variable htmluserlangattributes is renamed
"htmlUserLanguageAttributes"

Change-Id: I306ebb615f720852fb35c25ac240d6b802d05ecc
2020-07-15 10:18:45 -07:00
Ed Sanders 36e91dc04f build: Update devDependencies
Applies new ESLint documentation rules

Change-Id: I7fe458cf52e98baf92f3baec2d9ff54484326673
2020-07-01 14:43:39 -07:00
jdlrobson 87f08dcf5b [refactor] Drop form-id template property
In preparation for using the SkinMustache class and
core buildSearchProps method [1],
and to reduce the risk of that change,
move the ID from the template
data to the template itself:

[1] https://github.com/wikimedia/mediawiki/blob/master/includes/skins/SkinMustache.php#L93

Change-Id: I8d62ea6b1adf6ef0cbfa20e1876806eba70b169f
2020-06-25 18:21:38 +00:00
jdlrobson df2895f610 Cleanup: Use consistent naming in SearchBox
We have conventions about template variable naming.

* Drop camel case
* Prefix message keys with `msg-` followed by message key name
* Prefix HTML with `html-`

Change-Id: I34f04f3d217dc8caa4dcc29e60058951a6555b1e
2020-06-01 20:11:14 +00:00
Nicholas Ray e8a403e342 Rename Storybook Files to Reflect Their Respective Component
* Following up on the work from
Idf90ee2a0f1c1d08a31cf50099c0bebc7b67e619, this commit renames the
storybook files/storybook names to their respective component name.

e.g. personalNavigation.stories.js => PersonalMenu.stories.js

Bug: T243281
Change-Id: I68054663c5a597f90a826b6f75bf399382dca609
2020-03-03 18:32:55 +00:00