Add label to Options dialog > Categories input fields

Add label to indicate the function of the input field underneath the
categories label in the options dialog. The <label> element is
preferred for screen readers and users with visual disabilities.

Bug: T146966
Change-Id: Ib300ca7a1fd55d320c1a1a8c8c7fd01ab8b0b9c5
This commit is contained in:
hunter 2018-04-13 12:45:03 -06:00 committed by HunterH
parent 3a9ec6bcce
commit be5289689f
4 changed files with 16 additions and 1 deletions

View file

@ -1693,6 +1693,7 @@
"visualeditor-categories-tool",
"visualeditor-dialog-meta-advancedsettings-label",
"visualeditor-dialog-meta-advancedsettings-section",
"visualeditor-dialog-meta-categories-addcategory-label",
"visualeditor-dialog-meta-categories-category",
"visualeditor-dialog-meta-categories-data-label",
"visualeditor-dialog-meta-categories-defaultsort-help",

View file

@ -151,6 +151,7 @@
"visualeditor-dialog-media-upload": "Upload",
"visualeditor-dialog-meta-advancedsettings-label": "Advanced settings",
"visualeditor-dialog-meta-advancedsettings-section": "Advanced settings",
"visualeditor-dialog-meta-categories-addcategory-label": "Add a category to this page",
"visualeditor-dialog-meta-categories-category": "Category",
"visualeditor-dialog-meta-categories-data-label": "Categories",
"visualeditor-dialog-meta-categories-defaultsort-help": "You can override how this page is sorted when displayed within a category by setting a different index to sort with instead. This is often used to make pages about people show by last name, but be named with their first name shown first.",

View file

@ -165,6 +165,7 @@
"visualeditor-dialog-media-upload": "Label for the upload button\n{{Identical|Upload}}",
"visualeditor-dialog-meta-advancedsettings-label": "Title for the advanced settings dialog section.\n{{Identical|Advanced settings}}",
"visualeditor-dialog-meta-advancedsettings-section": "Label for the advanced settings dialog section.\n{{Identical|Advanced settings}}",
"visualeditor-dialog-meta-categories-addcategory-label": "Label for field that adds a category to the page",
"visualeditor-dialog-meta-categories-category": "Title of popup for editing category options.\n{{Identical|Category}}",
"visualeditor-dialog-meta-categories-data-label": "Label for the categories sub-section.\n{{Identical|Category}}",
"visualeditor-dialog-meta-categories-defaultsort-help": "Message displayed as contextual help about the <nowiki>{{DEFAULTSORT:…}}</nowiki> control to editors in the page categories panel.",

View file

@ -31,13 +31,25 @@ ve.ui.MWCategoriesPage = function VeUiMWCategoriesPage( name, config ) {
label: ve.msg( 'visualeditor-dialog-meta-categories-data-label' ),
icon: 'tag'
} );
this.categoryOptionsFieldset = new OO.ui.FieldsetLayout( {
label: ve.msg( 'visualeditor-dialog-meta-categories-options' ),
icon: 'advanced'
} );
this.categoryWidget = new ve.ui.MWCategoryWidget( {
$overlay: config.$overlay
} );
this.addCategory = new OO.ui.FieldLayout(
this.categoryWidget,
{
$overlay: config.$overlay,
align: 'top',
label: ve.msg( 'visualeditor-dialog-meta-categories-addcategory-label' )
}
);
this.defaultSortInput = new OO.ui.TextInputWidget( {
placeholder: this.fallbackDefaultSortKey
} );
@ -64,7 +76,7 @@ ve.ui.MWCategoriesPage = function VeUiMWCategoriesPage( name, config ) {
} );
// Initialization
this.categoriesFieldset.$element.append( this.categoryWidget.$element );
this.categoriesFieldset.addItems( [ this.addCategory ] );
this.categoryOptionsFieldset.addItems( [ this.defaultSort ] );
this.$element.append( this.categoriesFieldset.$element, this.categoryOptionsFieldset.$element );
};