uclixnjupyternbaccessibility issue fixes 1

[joshuazeltser]

We have fixed a number of the issues relating to the accessibility of Jupyter Notebooks. Please see a summary of our fixes below:

Issue	Description	Fix Operations
#4015	Narrator say x button instead of close button	Added an attribute to the javascript which sets the aria-label to close
#4010	Color contrast of markdown code syntax "` `" is lower than 4.5:1	Change color from #EFF01F to #D4D4D4
#4003	Color contrast of "Restart and Run" button is lower than 4.5:1	Overwrite Bootstrap attribute in acc_overwrite.less file
#4002	Color contrast of "reset" button under the nbextensions tag is lower than 4/5:1	Overwrite Bootstrap attribute in acc_overwrite.less file
#4001	Same as 4003	Same as #4003
#3999	Color contrast of "Terminal", "Notebook" button and kernel name, shutdown button are lower than 4.5:1	Overwrite Bootstrap attribute in acc_overwrite.less file
#3998	Role for Controls(New Notebook,Revert to Checkpoint,Download as) is given as Hyperlink/Link which is incorrect.	Used sr-only to read the right role(Dropdown)
#3997	Role for Some of the Controls(File,Edit,View,Insert,Cell...etc) is incorrect.	changed kernel listitem to be menu pop up link with menuitems within it
#3996	Role is incorrect for "Not Trusted"/ "Trusted" Control which is present at right of the menubar within a notebook.	Added role attribute with value "button" to the element
#3992	Accessible name can not be detected in Windows Inspect	Add appropriate title to the icon
#3988	Color contrast of "Delete" button is lower than 4.5:1	Overwrite Bootstrap attribute in acc_overwrite.less file
#3987	Color contrast of close button is lower than 4.5:1	Overwrite the opacity of button and hover selector
#3984	Keyboard focus is not clearly visible on the Controls(File,Edit,View,Insert,Cell...etc)present on the menubar.	It fix 2 issues: add focus outline and use browser's hover default value
#3973	New button role is said incorrectly by narrator	add span to be more consistent with other dropdowns and fix the problem
#3971	Narrator is not reading descriptive tooltip for "Select......" dropdown.	Made the tooltip more descriptive
#3970	Upload button wrong name causing narrator error	add aria-label with name
#3968	Narrator is only reading the tooltip for the "Duplicate","Edit","View","Refresh" buttons in .It is not reading the control name.	Changed the value of the aria-label attribute to control name. Easier to differentiate between tooltip and control name now as they were reading the same thing
#3963	The screen reader doesn't read the order of list item under "New" and "Select All/None" dropdown on tree page	For html static element, add aria-label with order number. For dynamic element, use JS add aria-label dynamiclly
#3961	The screen reader doesn't read the checked/unchecked state and the number of selected items for the check box on tree page	Use JQuery add aria-label dynamically
#3960	The "Select All/None" doesn't have an appropriate label	Same as #3963
#3951	Narrator say x button instead of close button	Same as #4015
#3941	Textfields in popups were not having their labels read by the narrator	Used aria-labelledby to read the label of the textfield to the listener
#3938	Screen reader has no label for the cell type combobox	Added appropriate aria-label
#3936	When selecting the Markdown cell type the popup box title is h4 while it should be h1 like the actual markdown text	Changed the dialog box so that in this case the title is h1 rather than h4
#4009	User have to 'TAB' twice to move over the controls such as 'Upload' button and 'Select All/None' checkbox.	Added tabindex=-1 for inner input