Commit graph

22 commits

Author SHA1 Message Date
bwang d54029a523 Remove nav element from Vector menus and only render label elements in Vector menus when needed. Add new nav landmarks corresponding to user links, main site nav, and article editing tools. Split out legacy Menu template.
Bug: T291304
Bug: T301051
Change-Id: I35c20103e4b45139ef1d3f73c23f6a744aa87a3c
2022-04-27 16:52:20 +00:00
jdlrobson 44aeee5d83 Vector uses html-title-heading
The H1 is available with the correct attributes in core now, so
we can use that instead of our own markup. This also means Vector
will benefit from updates to the heading in core such as main page
special handling.

Bug: T297728
Change-Id: I4d10370678fad6455d73994bf340891760543b71
2021-12-15 22:27:48 +00:00
bwang 687c6a50d8 Improve heading structure and heading semantics by removing redundant headings and labels for modern Vector
- Apply aria-hidden to h3 in Menu template, ensuring the nav landmarks are still properly labeled, but no longer reading duplicate labels to screenreaders
- Remove "Navigation menu" h2 element, which is not needed as the nav landmarks are already labeled
- Remove searchbox h3 element, which is redundant with the search landmark
- Scope all changes to modern vector

Bug: T265993
Change-Id: I4e5da7a0699160fa57234bd126b75243e0157778
2021-09-14 10:47:05 -05:00
jdlrobson 6300923601 Storybook should include UserLinks
Merge UserMenu into UserLinks for legacy and modern
Add a story for the UserLinks menu

Fixes: rendering of Skin (legacy) personal tools (the user icon
no longer overlaps)

Change-Id: I491ebb3962780bf2cf7f1dfb4dd09d576c294366
2021-05-27 19:27:27 +00:00
jdlrobson 3306124038 Introduce the vector-body class
This follows up I4c1b15d90bacbc9b13782a1d8f52e838ce8ecd83
In that change, a new class for Vector specific styles should have
been added and the existing CSS referenced. I could have sworn I did
this, but obviously not (perhaps a git rebase or unstage change problem).
We did it for the other skins e.g. Monobook (I90d85c21f4a62e6697f24e3ce388445a0a53c2b0)
but evidently not Vector.

We also have to worry about cached HTML now, the #bodyContent is
the most reliable selector to use for before and after
I4c1b15d90bacbc9b13782a1d8f52e838ce8ecd83

Additional:
Remove the mixin-clearfix rule on bodyContent - this is now
redundant with the changes in T279388 and should have been
removed.

Bug: T283206
Change-Id: I15103cea72c793589a03ab1a3e7f3b377acb287f
2021-05-21 13:50:31 -07:00
Jdlrobson efaf3aadf3 Remove mw-body-content from HTML that is not the article body
The `mw-body-content` class is currently decorating various things,
however should be limited to the body of the article. This allows
us to identify the wrapping element without resorting to a selector
that makes use of an identifier and to separate styling concerns of
UI (indicators and site notice) from article content.

Bug: T279388
Change-Id: I4c1b15d90bacbc9b13782a1d8f52e838ce8ecd83
2021-05-14 00:01:52 +00:00
Jan Drewniak c22dc8d95b Refactor: Renaming mustache variable page-isarticle to is-article
Modifies this variable name to use proper hyphen-case and
prioritizes the type of variable rather than it's source.

This prioritization makes sense in Mustache templates because the
variable is a boolean and is used exclusively in if statements,
e.g. {{#is-article}} ... {{/is-article}}

Change-Id: I72e9baf0a979d922b8217aabe8cf0c40699f891b
2021-05-10 08:55:06 +00:00
jdlrobson 68b52a77e2 Usages of page-langcode dropped for html-user-language-attributes
html-user-language-attributes contains not only the lang attribute
but also the direction. There doesn't seem any value in regenerating
just lang attribute

Change-Id: I93e8081be1e81adf16d40bff54f0cc22c7155dd7
2021-01-20 16:13:12 -08:00
jdlrobson 9f1a1fa829 Simplify menu code
SkinMustache in core provides most of what is required for Vector to
generate its menus.  In the interest of having a canonical source of
truth for menus across all skins, Vector should use this data.

To ensure the HTML generated is (mostly) the same after this patch to
prior, a few modifications are necessary:

* The data from core is decorated so that Vector can continue having its
  own custom class names on menus. This is done using the
  decoratePortletClass method.
* There is no support for a menu having a header representing the
  selected menu item, as is currently the case with variants. This is
  achieved via an extension to getPortletData. It's assumed that later
  when variants are merged with languages, this can be removed.
* Menus are agnostic to how they are displayed, so we must continue to
  add the is-dropdown template variable to drop down menus. In future we
  may want to rethink our Menu partial to make this unnecessary in PHP.
* The portal-first class is redundant in the modern Vector as we can
  use the first-child selector. Previously we introduced a class to
  service the legacy skin where this rule doesn't apply as #p-logo is
  the first child.  However, the legacy skin can do this using a special
  next sibling selector instead.

Bug: T268157
Change-Id: I5f7adc1840441b508ffee40139b85b64021789e6
2021-01-04 19:02:34 +00:00
jdlrobson 14e8b4d5b7 Use SkinMustache value for user messages
This is now provided in the core SkinMustache interface and
is not needed here.

Change-Id: Iaee8fad2b1fd5e72beee544b0c2e8f62ff371073
2020-10-09 11:38:38 -07:00
jdlrobson 5ac25943a2 Refactor: All messages should be listed from skin.json
This allows us easily to identify in templates what messages are
used and where, as well as allow us an easy way to tell when
messages are no longer being used.

Change-Id: I610224d551ebea54ae32e9e79901befe80cfd5ce
2020-08-28 17:12:10 +00:00
jdlrobson ee6974ad35 Merge SkinVector and VectorTemplate (step 1/2)
Please note I7e06a4cc226f3434c0f655212a464b8b98bcc7f4 should be
merged at the same time as this patch.

== The background ==
All extensions have been weaned of BaseTemplate hooks in
Wikimedia projects.

This change now means that Vector will no longer run
any BaseTemplate hooks. See the epic T253809 for the
implementation details.

== The change ==
BaseTemplate will now have nothing to do with the rendering of
Vector. The skin version is added to express the significance of
breaking compatibility with 3rd party extensions.

We TEMPORARILY remove SkinVector to retain git blame. SkinTemplateVector will
be renamed SkinVector in the follow up (see 2/2)
Update skin.json to use SkinTemplateVector for the skin (this will be fixed
in a follow up).

The isLegacy method is moved to SkinTemplateVector.

Changes of note:
* html-debuglog is no longer needed. SkinMustache includes this information on
the skins behalf
* html-printtail and html-headelement are now not needed in the master template
and added by SkinMustache
* Skin::getAfterPortlet does not provide the `after-portlet` wrapping element provided
by BaseTemplate::getAfterPortlet so this is added
* SkinTemplate::getFooterIcons does not support the options that BaseTemplate::getFooterIcons
does so any icons which do not have an image must be manually checked for and unset

Known changes to HTML output as a result of intentionally
delegating their output to the core SkinMustache class:
* A new line is removed between the body element and #mw-page-base
* #mw-html-debug-log now appears at the end of the body element
* #printfooter is now a child of #mw-content-text rather than sibling.

Bug: T251212
Change-Id: I4e89beb96f6401ed7e51bafdf0aac408f5a2c42f
2020-07-30 11:18:45 -07: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
jdlrobson 7a16ae249e Rename template variables to mirror SkinMustache
The renames made in this patch mirror the upstream change in
I3f7b2e5f07d03ac04ecdcba585194d619abe35e0 in preparation for adopting
the SkinMustache class.

Renames:
* 'data-indicators => 'array-indicators'
* 'html-bodycontent' => 'html-body-content'
* 'html-undelete' => 'html-undelete-link'
* 'html-sitenotice' => 'html-site-notice'
* 'html-catlinks' =>  'html-categories'
* 'html-dataaftercontent' => 'html-after-content'
* 'html-userlangattributes' => 'html-user-language-attributes'

Adjustments
* 'html-debuglog' is moved into html-printtail for consistency with
SkinMustache in core
* html-printfooter is now a part of html-bodycontent for consistency with
SkinMustache in core
Note: the activity of removing html-printtail and html-headelement from
the templates will be done when we adopt SkinMustache.

Bug: T257630
Depends-On: Ibac9729eaa96a38bc730a0132b102a894f6a172d
Change-Id: Ie92bda7846767c3cc9a1937c96a7fc08415b1bae
2020-07-13 21:57:40 +00:00
jdlrobson c405ffb155 Cleanup: Template variables
- Remove unused html-prebodyhtml template variable
- Don't use html- prefixed variables as if statements - this is
not supported by Mustache. (set to '' to confirm)

Change-Id: I0c860b4b2277e1796afa3e482cf61e95ef4fb342
2020-07-13 14:10:14 -07:00
Volker E a9b35fa2e4 Use core .mixin-clearfix() instead of DOM element
Removing  presentational `<div class="visualClear"></div>` in process.
Only leaving in for legacy/layout.less and adding comment for future
evaluation if clearfix is continuously needed. In modern we've
got all parts of Vector in our awareness without featuring `float`s.

Bug: T254195
Depends-On: Iddf8f1dffc2d30299b89b3f4966b7fe8ee63090b
Change-Id: I673c28c2d7da4f96c31121d9aec6558e390de24e
2020-07-01 11:20:26 -07:00
AronDemian 0e5cd53163 Make search jumplink's target the search input instead of the container
The exact search input element as target focus the searchbox. It saves 
AT users a user action, while still remaining read out due to connected 
label in screen readers.

Change-Id: I83003fbbb5b6903038d1ca8b323302cb8f52e841
2020-06-24 20:45:25 +00:00
jdlrobson a6dd9b25c5 Model indicators as their own template rather than a block of HTML
This reverts commit be3843e2a3 and
makes a few corrections.

Bug: T251212
Change-Id: Icb17f94e7fa4a70b0a0ea0b9cb9a12f2e727946f
2020-06-09 14:30:08 -07:00
Jdlrobson be3843e2a3 Revert "Model indicators as their own template rather than a block of HTML"
This reverts commit 0536bda116 which had a few problems. Thanks Timo for pointing them out.

Change-Id: Ie43a2068fdb14cc7c65eb670e93787f1fe12c6b3
2020-06-03 19:41:15 +00:00
jdlrobson 0536bda116 Model indicators as their own template rather than a block of HTML
Bug: T251212
Change-Id: I44b1e17f21112896d2bef54d04f17df861bb3dbb
2020-06-03 18:25:51 +00:00
jdlrobson e84809c44b Cleanup: Standardise msg keys
Keys prefixed with msg- should relate to i18n keys. Fix the existing
template variables where that's not the case.

Change-Id: I33587a09a9803a3667eaeea95ce3e1753439f413
2020-06-01 21:05:56 +00:00
Volker E 4200a8665c Naming convention using 'skin' as entrance point
Using 'skin' as entrance point files, similar to already existing
convention in MediaWiki land with 'skin.json' or 'SkinVector.php' as
example in Vector skin. Replacing Apache inspired 'index' convention.
Also renaming legacy to 'skin-legacy' to be clear on file base that it's
a modification of 'skin'.

Bug: T249073
Change-Id: Ief1c469724d4ffe238d307407c3ddb46f2e1abfa
2020-05-28 20:58:01 -07:00
Renamed from includes/templates/legacy.mustache (Browse further)