wikimedia/mediawiki-skins-Vector
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/skins/Vector.git synced 2024-11-27 17:10:19 +00:00
Code Issues Packages Projects Releases Wiki Activity

Remove <div> inside of the <h3>

Browse source 
The <div> was introduced in aba11a7b but this is not valid in HTML 5.

This change ommits the <div> and attaches the background image to the
existing <span>.

Cached HTML with the <div></div> does not matter for the result.

Bug: T169551
Change-Id: I04f7032b6f6bafe10548fde690f55de66b56f61f
This commit is contained in:
Fomafix 2017-07-04 17:51:10 +02:00
parent 40699a9a28
commit 56ec1a3c87
3 changed files with 10 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
VectorTemplate.php
View file

@ -398,7 +398,7 @@ class VectorTemplate extends BaseTemplate {
}
?>
<h3 id="p-variants-label">
<span><?php echo htmlspecialchars( $variantLabel ) ?></span><div></div>
<span><?php echo htmlspecialchars( $variantLabel ) ?></span>
</h3>
<div class="menu">
@ -468,7 +468,7 @@ class VectorTemplate extends BaseTemplate {
?>" aria-labelledby="p-cactions-label">
<h3 id="p-cactions-label"><span><?php
$this->msg( 'vector-more-actions' )
?></span><div></div></h3>
?></span></h3>
<div class="menu">
<ul<?php $this->html( 'userlangattributes' ) ?>>

18
components/tabs.less
View file

@ -148,28 +148,20 @@ div.vectorMenu h3 span {
font-size: 0.8em;
padding-left: 0.7em;
padding-top: 1.375em;
margin-right: 20px;
padding-right: 20px;
font-weight: normal;
color: @menu-main-heading-color;
}
div.vectorMenu h3 div {
position: absolute;
top: 0;
right: 0;
width: 20px;
height: 2.5em;
.background-image-svg('images/arrow-down-icon.svg', 'images/arrow-down-icon.png');
background-position: 100% 70%;
background-position: 100% 100%;
background-repeat: no-repeat;
.transition(background-position 250ms);
}
div.vectorMenu.menuForceShow h3 div {
background-position: 100% 100%;
div.vectorMenu.menuForceShow h3 span {
background-position: 100% 130%;
}
div.vectorMenuFocus h3 div {
div.vectorMenuFocus h3 span {
.background-image-svg('images/arrow-down-focus-icon.svg', 'images/arrow-down-focus-icon.png');
}

6
vector.js
View file

@ -30,7 +30,7 @@ jQuery( function ( $ ) {
*/
$( 'div.vectorMenu' ).each( function () {
var $el = $( this );
$el.find( '> h3 > div' ).parent()
$el.find( '> h3 > span' ).parent()
.attr( 'tabindex', '0' )
// For accessibility, show the menu when the h3 is clicked (bug 24298/46486)
.on( 'click keypress', function ( e ) {
@ -41,10 +41,10 @@ jQuery( function ( $ ) {
} )
// When the heading has focus, also set a class that will change the arrow icon
.focus( function () {
$el.find( '> div' ).addClass( 'vectorMenuFocus' );
$el.find( '> span' ).addClass( 'vectorMenuFocus' );
} )
.blur( function () {
$el.find( '> div' ).removeClass( 'vectorMenuFocus' );
$el.find( '> span' ).removeClass( 'vectorMenuFocus' );
} );
} );