rowan/multi-account-containers
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix for #1656, #1643, and #1637

Browse source 
removes enter key listener in favor of focus highlighting to notify user that there
is keyboard navigation available for the onboarding panels. (enter key listener was added
 as keyboard navication for onboarding panels).

bumped version
This commit is contained in:
Kendall Werts 2020-02-26 17:02:01 -06:00
parent 5b2add003a
commit ab88c6b2c6
5 changed files with 20 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
package.json
View file

@ -2,7 +2,7 @@
"name": "testpilot-containers",
"title": "Multi-Account Containers",
"description": "Containers helps you keep all the parts of your online life contained in different tabs. Custom labels and color-coded tabs help keep different activities — like online shopping, travel planning, or checking work email — separate.",
"version": "6.2.1",
"version": "6.2.2",
"author": "Andrea Marchesini, Luke Crouch and Jonathan Kingston",
"bugs": {
"url": "https://github.com/mozilla/multi-account-containers/issues"
@ -37,6 +37,7 @@
},
"scripts": {
"build": "npm test && cd src && web-ext build --overwrite-dest",
"webext": "web-ext run -s src/",
"lint": "npm-run-all lint:*",
"lint:addon": "addons-linter src --self-hosted",
"lint:css": "stylelint src/css/*.css",

5
src/css/popup.css
View file

@ -390,6 +390,11 @@ table {
background-color: #0675d3;
}
.onboarding-button:focus,
.half-onboarding-button:focus {
box-shadow: 0 0 0 1px #0a84ff inset, 0 0 0 1px #0a84ff, 0 0 0 4px rgba(10, 132, 255, 0.3);
}
/* Pop buttons are the square shaped buttons used to
manage things like container crud */
.pop-button {

8
src/js/popup.js
View file

@ -633,14 +633,6 @@ Logic.registerPanel(P_CONTAINERS_LIST, {
case 38:
previous();
break;
case 13: {
const panel = Logic.getCurrentPanelElement();
const button = panel.getElementsByTagName("A")[0];
if(button) {
button.click();
}
break;
}
case 39:
{
const showTabs = element.parentNode.querySelector(".show-tabs");

2
src/manifest.json
View file

@ -1,7 +1,7 @@
{
"manifest_version": 2,
"name": "Firefox Multi-Account Containers",
"version": "6.2.1",
"version": "6.2.2",
"incognito": "not_allowed",
"description": "Multi-Account Containers helps you keep all the parts of your online life contained in different tabs. Custom labels and color-coded tabs help keep different activities — like online shopping, travel planning, or checking work email — separate.",
"icons": {

24
src/popup.html
View file

@ -13,7 +13,7 @@
<p>
Use containers to organize tasks, manage accounts, and keep your focus where you want it.
</p>
<a href="#" class="onboarding-button onboarding-start-button">Get Started</a>
<a href="#" class="onboarding-button onboarding-start-button" tabindex="0">Get Started</a>
</div>
<div class="hide panel onboarding security-onboarding-panel-1">
@ -22,49 +22,49 @@
<p>
Use containers to organize tasks, manage accounts, and store sensitive data.
</p>
<a href="#" class="onboarding-button onboarding-start-button">Get Started</a>
<a href="#" class="onboarding-button onboarding-start-button" tabindex="0">Get Started</a>
</div>
<div class="panel onboarding onboarding-panel-2 hide">
<img class="onboarding-img" alt="How Containers Work" src="/img/onboarding-2.png" />
<h3 class="onboarding-title">Put containers to work for you.</h3>
<p>Features like color-coding and separate container tabs help you find things easily, focus your attention, and minimize distractions.</p>
<a href="#" class="onboarding-button onboarding-next-button">Next</a>
<a href="#" class="onboarding-button onboarding-next-button" tabindex="0">Next</a>
</div>
<div class="panel onboarding security-onboarding-panel-2 hide">
<img class="onboarding-img" alt="How Containers Work" src="/img/onboarding-2.png" />
<h3 class="onboarding-title">Put containers to work for you.</h3>
<p>Color-coding helps you categorize your online life, find things easily, and minimize distractions.</p>
<a href="#" class="onboarding-button onboarding-next-button">Next</a>
<a href="#" class="onboarding-button onboarding-next-button" tabindex="0">Next</a>
</div>
<div class="panel onboarding onboarding-panel-3 hide">
<img class="onboarding-img" alt="How Containers Work" src="/img/onboarding-3.png" />
<h3 class="onboarding-title">A place for everything, and everything in its place.</h3>
<p>Start with the containers we've created, or create your own.</p>
<a href="#" class="onboarding-button onboarding-almost-done-button">Next</a>
<a href="#" class="onboarding-button onboarding-almost-done-button" tabindex="0">Next</a>
</div>
<div class="panel onboarding security-onboarding-panel-3 hide">
<img class="onboarding-img" alt="How Containers Work" src="/img/onboarding-3-security.png" />
<h3 class="onboarding-title">Set boundaries for your browsing.</h3>
<p>Cookies are stored within a container, so you can segment sensitive data and browsing history to stay organized and to limit the impact of online trackers.</p>
<a href="#" class="onboarding-button onboarding-almost-done-button">Next</a>
<a href="#" class="onboarding-button onboarding-almost-done-button" tabindex="0">Next</a>
</div>
<div class="panel onboarding onboarding-panel-4 hide" id="onboarding-panel-4">
<img class="onboarding-img" alt="How to assign sites to containers" src="/img/onboarding-4.png" />
<h3 class="onboarding-title">Always open sites in the containers you want.</h3>
<p>Right-click inside a container tab to assign the site to always open in the container.</p>
<a href="#" id="onboarding-done-button" class="onboarding-button">Next</a>
<a href="#" id="onboarding-done-button" class="onboarding-button" tabindex="0">Next</a>
</div>
<div class="panel onboarding onboarding-panel-5 hide" id="onboarding-panel-5">
<img class="onboarding-img" alt="Long-press the New Tab button to create a new container tab." src="/img/onboarding-3.png" />
<h3 class="onboarding-title">Container tabs when you need them.</h3>
<p>Long-press the New Tab button to create a new container tab.</p>
<a href="#" id="onboarding-longpress-button" class="onboarding-button">Next</a>
<a href="#" id="onboarding-longpress-button" class="onboarding-button" tabindex="0">Next</a>
</div>
<div class="panel onboarding onboarding-panel-6 hide" id="onboarding-panel-6">
@ -72,8 +72,8 @@
<h3 class="onboarding-title">Syncing Containers is now Available!</h3>
<p>Turn on Sync to share container and site assignments with any computer connected to your Firefox Account.</p>
<div class="half-button-wrapper">
<a herf="#" id="no-sync" class="half-onboarding-button grey-button">Not Now</a>
<a href="#" id="start-sync-button" class="half-onboarding-button">Start Syncing</a>
<a herf="#" id="no-sync" class="half-onboarding-button grey-button" tabindex="0">Not Now</a>
<a href="#" id="start-sync-button" class="half-onboarding-button" tabindex="0">Start Syncing</a>
</div>
</div>
@ -82,8 +82,8 @@
<h3 class="onboarding-title">Firefox Account is required to sync.</h3>
<p>Click Sign In to confirm that your Firefox Account is active.</p>
<div class="half-button-wrapper">
<a herf="#" id="no-sign-in" class="half-onboarding-button grey-button">Not Now</a>
<a href="#" id="sign-in" class="half-onboarding-button">Sign In</a>
<a herf="#" id="no-sign-in" class="half-onboarding-button grey-button" tabindex="0">Not Now</a>
<a href="#" id="sign-in" class="half-onboarding-button" tabindex="0">Sign In</a>
</div>
</div>