forked from mirrors/gecko-dev
d07b087748
Give `tabindex` attributes to each focusable element and handle enter keypresses (via the `dialogaccept` event) on them. The tab index ordering is: 1. Accept button (initial focus) 2. Settings button 3. Learn more 4. Not now Also give `#infoBody` a tab index of -1 so it doesn't receive focus. It does normally for some reason. The accept button still does not have a focus ring initially. When you hit tab the first time, the focus ring appear on the settings button. IMO it's better not to show the ring initially since most people won't be interacting with the dialog with the keyboard, and even those that do don't necessarily need to see it initially. If we do want it initially, calling `focus` on the button in a load event listener works. On Windows (and maybe Linux?), the arrow keys still move around the elements until the focus gets stuck on the Not now link. After that the arrow keys don't work anymore but the tab key still does. Not sure how to fix that part. Differential Revision: https://phabricator.services.mozilla.com/D125616
48 lines
2.1 KiB
HTML
48 lines
2.1 KiB
HTML
<?xml version="1.0"?>
|
|
|
|
<!-- This Source Code Form is subject to the terms of the Mozilla Public
|
|
- License, v. 2.0. If a copy of the MPL was not distributed with this
|
|
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
|
|
|
|
<?xml-stylesheet href="chrome://global/skin/global.css"?>
|
|
<?xml-stylesheet href="chrome://global/content/commonDialog.css"?>
|
|
<?xml-stylesheet href="chrome://global/skin/commonDialog.css"?>
|
|
<?xml-stylesheet href="chrome://browser/content/urlbar/quicksuggestOnboarding.css"?>
|
|
|
|
<window id="quicksuggestOnboardingDialogWindow"
|
|
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
|
|
xmlns:html="http://www.w3.org/1999/xhtml"
|
|
xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
|
|
aria-describedby="infoBody">
|
|
<dialog id="quicksuggestOnboardingDialog"
|
|
buttons="accept, extra1"
|
|
defaultButton="accept">
|
|
|
|
<linkset>
|
|
<html:link rel="localization" href="branding/brand.ftl"/>
|
|
</linkset>
|
|
|
|
<!-- The <div> was added in bug 1606617 to workaround bug 1614447 -->
|
|
<div xmlns="http://www.w3.org/1999/xhtml">
|
|
<div id="infoContainer">
|
|
<div id="notNowLinkContainer"><a id="onboardingNotNow" tabindex="4">Not now</a></div>
|
|
<xul:image id="infoIcon"/>
|
|
<h2 id="infoTitle">Say hello to smarter suggestions</h2>
|
|
<xul:description id="infoBody" tabindex="-1">Firefox Suggest uses your city location and search keywords to make contextual suggestions from Firefox and partners, while keeping your privacy in mind. <a id="onboardingLearnMore" tabindex="3">Learn more</a></xul:description>
|
|
<div id="illustration"/>
|
|
<div id="infoButtons">
|
|
<xul:button id="onboardingAcceptButton"
|
|
dlgtype="accept"
|
|
label="Allow suggestions"
|
|
tabindex="1"/>
|
|
<xul:button id="onboardingSettingsButton"
|
|
dlgtype="extra1"
|
|
label="Customize in settings"
|
|
tabindex="2"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="chrome://browser/content/urlbar/quicksuggestOnboarding.js"/>
|
|
</dialog>
|
|
</window>
|