Following on from I0edbd89, set the data-search-loc attribute to
"header-navigation" for legacy Vector.
Bug: T256100
Change-Id: I113c56ac9b18df46ebc13b9985aea03ba82419bd
Fixes the missing images in the Logo story.
The current method of downloading the images into
docs/ui/assets and treating them as static assets
(with the start-storybook -s option) could be problematic
if that directory is deleted or "cleaned" before the
storybook build.
Instead, the images are now downloaded into
./storybook/resolve-imports and imported explicitly in the
code in Logo.stories.data.js.
* ./storybook/resolve-less-imports renamed to resolve-imports
* .gitignore is updated to reflect that
* Webpack config is updated with the `resolve-imports` path
* static option (-s) is removed from npm start script
* Images are explicitly imported in Logo.stories.data.js
* Type definitions are added for .svg and .png files
Change-Id: I242d229242c86a5784d6d4611d0b9c7049712dac
The anon placeholder is now provided by core. The styles will remain to
style it to suit Vector needs.
This ULS hack is no longer needed as the extension is already using array
plus operator which does set union, so it only appends the right-hand array
to the left-hand array. Some string concatenation that prevented it from
working correctly has now been resolved by Ice379cd in core.
Bug: T263382
Change-Id: I5691529ab8c59f4053cff38ea6f7dd01c326c074
With I5772eb7 merged in core, it's no longer accurate to say that the
$options param is optional.
It's important to note this now, before someone report it as a bug.
Since the method is a public API and technically does not require a
parameter, no one will expect that following the rules (providing no
argument, as in `$skin = new SkinVector`) will throw fatal exception.
Bug: T262233
Change-Id: I771e5cc8ff205943016a26854da18088817b9238
Given I7184f2f5dd7fdb49fb928265bbf711ef9fd555c9 we can now
use the data generated by core which has the benefit of being
configurable per language variant.
Bug: T261153
Change-Id: I7a77f164da53c362da225ae3d13635f9ddca529f
Since SkinVector provides name via skin.json the name must be
passed in the test constructor.
This will be required as part of
I5772eb760e4fc56d2062a333ba4d7ca6995f3db2
Change-Id: I4087deb8b0726c9959ac15d77a0ed2442e4890f6
The mediawiki.searchSuggest protocol part of the SearchSatisfaction
instrumentation reads the value of an element with the "data-search-loc"
attribute and sets the event's inputLocation property accordingly.
Set the appropriate value for the attribute in
SkinVector::getTemplateData and render the attribute in
the SearchBox.mustache template.
Bug: T256100
Change-Id: I0edbd8906a042072b2055adc2889b083b2c6cac4
* Use `cp` over `ln` - the node resolver appears to
get tripped up by linked files.
* Fix a story referencing the wrong class
Follow up to I47da3046678117d5214354d1efe635f32f307dad
Bug: T263064
Change-Id: I80cb33ad70f9e6757dbe7f71b00539bec28abca9
A new config flag is added that buckets 50% of users into the old
header and the 50% into the new header.
Bug: T249363
Change-Id: I8b4fa475f9cd7e61ad2989e2a1485e7e64c8ab3f
This will allow us to add the A/B testing requirement for logged in
users.
In preparation for the new A/B test requirement, a custom requirement
is added as the feature management system does not
support OR operations and the desired effect is the case where:
* the SearchInHeader feature flag has been enabled
* OR the SearchInHeaderABTest feature flag has been enabled and the user is bucketed
Bug: T259250
Change-Id: If948603bd598e1b5597345f4268736417f4c3a24
* The margin-left should only be auto at small resolutions - otherwise on large
monitors it becomes visually separated from the logo
* the margin left should be larger
* and max width should be smaller.
Bug: T261686
Change-Id: Ia1331f51764a34f113e3336735e6cfd5fde1d49d
Drop max width feature flag.
Max-width will continue to not apply on special pages.
This saves us development effort by not needing to worry about
the case where the flag is not enabled. This flag is not false
in any production wikis.
Change-Id: I7ace4046e6b93ce63dd804da32e576a709485bfb
Minor visual fix for IE9 for modern mode with search not in header.
i.e. with these settings:
$wgVectorIsSearchInHeader = false;
$wgVectorDefaultSkinVersion = 2;
Slight refactor of CSS. Removes block of styles that "reset" floats.
These were uneccessary because as flex-children, the floats were
ignored on those elements anyway.
Moves flex-wrap on .mw-header from layout-search-header.less
to layout-default.less since that's where display:flex is defined
and the rule is general enough that it should apply for different layouts.
Remove the @supports block with the `float:none;`. That is unnecessary
because flex-children are not affected by floats.
Change-Id: Ida3d2a7bc2b2f70238129df876714228fe5cdf84
This moves the header, navigation, sidebar, and article toolbar to be
before the content in the DOM. As a result, a lot of absolute
positioning logic can be removed and styles can be simplified.
Note that although the sidebar was moved from the header into the
workspace container allowing it to de-absolutely positioned, its
absolute positioning was kept intact as it has a fair amount of
complexity that should be handled in a separate task.
To activate, set `$wgVectorIsSearchInHeader = true;`
Changes that could cause concern:
* The "jump to search" link was removed as the search is now much
earlier in the DOM and I questioned the value of keeping this. However,
it can be added back in if this change is contentious.
* A "jump to content" link was added to account for the new DOM order.
* Because the sidebar was taken out of the header, users will not be
able to tab from the sidebar button into the sidebar without additional
tweaking (e.g. should we add JS to enable this?). It was deemed that
this work can be saved as a follow-up task.
* I applied `overflow-y: auto` to the `mw-page-container` because the
header's top margin was collapsing and caused whitespace to appear
between the viewport and the header. Alternatively, we could apply a top
padding to the page container and remove the header's top margin. I went
for the simplest solution but am open to alternatives.
* I left the footer as-is in this patch to minimize risk. It might be
cleaner later on to move the footer inside the workspace container which
would leave only one workspace container.
Bug: T261802
Change-Id: Ic553fab3bde25769b103d899b92b3b694c00c384
Provides a loading indicator to show while the new Vue.js based
search widget loads. Given that the new widget will pull down the
entire Vue.js runtime, it's likely that there will be a delay
before the search suggestions appear. This loader is meant to
improve the perceived loading experience of the new widget.
Adds:
- New searchLoader.js file containing loading behaviour.
- This overrides the code searchSuggest loading behaviour.
- New SearchBoxLoader.less file containing the loader styles.
- i18n message: 'vector-search-loader'.
- The Event type to jsdoc.json
Bug: T254695
Change-Id: I6b5f0a60018954e10b9e80792030b67b2ec33e5a
