Merge pull request #2591 from mozilla/8.1.3-candidate

Firefox Accounts Rebrand (Dot Release)

.eslintrc.js

@@ -1,6 +1,6 @@
 module.exports = {
   "parserOptions": {
-    "ecmaVersion": 8
+    "ecmaVersion": 2018
   },
   "env": {
     "browser": true,
@@ -18,7 +18,11 @@ module.exports = {
     "XPCOMUtils": true,
     "OS": true,
     "ADDON_UNINSTALL": true,
-    "ADDON_DISABLE": true
+    "ADDON_DISABLE": true,
+    "CONTAINER_ORDER_STORAGE_KEY": true,
+    "proxifiedContainers": true,
+    "MozillaVPN": true,
+    "MozillaVPN_Background": true
   },
   "plugins": [
     "promise",
@@ -46,7 +50,7 @@ module.exports = {
       "error",
       {
         "escape": {
-          "taggedTemplates": ["escaped"]
+          "taggedTemplates": ["Utils.escaped"]
         }
       }
     ],

.github/ISSUE_TEMPLATE.md

@@ -1,27 +0,0 @@
-<!--
-  Feel free to ignore this Issue template if you just want to ask or suggest something. If you experience an Issue then please provide all asked information.
-
-  Also please make sure that:
-  - "Firefox will: Never remember history" in the Firefox Preferences/Options under "Privacy & Security > History" is NOT selected
-  - You are NOT using Firefox in a Private Window
-  - You can see a grayed out but ticked Checkbox with the description "Enable Container Tabs" in the Firefox Preferences/Options under "Tabs"
--->
-- Multi-Account Containers Version:
-- Operating System + Version:
-- Firefox Version:
-- Other installed Add-ons + Version + Enabled/Disabled-Status:
-<!-- To be able to copy & paste the full list of your Add-ons navigate to "about:support" and scroll down to "Extensions" -->
-
-
-### Actual behavior
-
-
-### Expected behavior
-
-
-### Steps to reproduce
-1.
-2.
-3.
-
-### Notes

.github/ISSUE_TEMPLATE/bug.yml

@@ -0,0 +1,53 @@
+name: Bug Report
+description: Report a problem in Multi-Account Containers
+labels: [bug]
+body:
+  - type: checkboxes
+    id: before-bug-report
+    attributes:
+      label: Before submitting a bug report
+      options:
+        - label: "I updated to the latest version of Multi-Account Container and tested if I can reproduce the issue"
+          required: true
+        - label: "I searched for existing reports to see if it hasn\'t already been reported"
+          required: true
+  - type: textarea
+    id: step_to_reproduce
+    attributes:
+      label: "Step to reproduce"
+      description: "Provide a list of steps you did to trigger this bug"
+      placeholder: |
+        1. I opened ...
+        2. I clicked on ...
+        3. ...
+    validations:
+      required: true
+  - type: textarea
+    id: actual_behavior
+    attributes:
+      label: "Actual behavior"
+      description: "Provide a description of what is currently happening"
+    validations:
+      required: true
+  - type: textarea
+    id: expected_behavior
+    attributes:
+      label: "Expected behavior"
+      description: "Provide a description of what should happen"
+    validations:
+      required: true
+  - type: textarea
+    id: additional_informations
+    attributes:
+      label: "Additional informations"
+      description: "Provide any other information revelant to this issue"
+    validations:
+      required: false
+  - type: textarea
+    id: about_support
+    attributes:
+      label: "Provide a copy of Troubleshooting Information page (optional)"
+      description: "To get a copy of the Troubleshooting Information page, type *about:support* in the address bar and click on the *Copy text to clipboard* button."
+      render: "plain text"
+    validations:
+      required: false

.github/ISSUE_TEMPLATE/config.yml

@@ -0,0 +1,17 @@
+blank_issues_enabled: false
+contact_links:
+  - name: "Explore our help articles"
+    url: "https://support.mozilla.org/kb/containers"
+    about: "Dig into the knowledge base, tips and tricks, troubleshooting, and so much more."
+  - name: "Ask a support question"
+    url: "https://support.mozilla.org/questions/new/desktop/form"
+    about: "Get support from our contributors or staff members."
+  - name: "Submit new ideas"
+    url: "https://connect.mozilla.org/t5/discussions/how-to-submit-a-great-idea-in-five-easy-steps/td-p/24"
+    about: "Have an idea for a new product feature? Share it with our community and staff members!"
+  - name: "Discussions" 
+    url: "https://connect.mozilla.org/t5/discussions/bd-p/discussions"
+    about: "Give feedback and participate in meaningful conversations with the community and Mozilla employees"
+  - name: "Discover more awesome tools"
+    url: "https://www.mozilla.org/firefox/products/"
+    about: "Learn more about other products from Mozilla"

.github/PULL_REQUEST_TEMPLATE/pull_request_template.md

@@ -0,0 +1,24 @@
+**Before submitting your pull request**
+
+- [ ] I agree to license my code under the [MPL 2.0 license](https://www.mozilla.org/en-US/MPL/2.0/).
+- [ ] I rebased my work on top of the main branch.
+- [ ] I ran `npm test` and all tests passed.
+- [ ] I added test coverages if relevant.
+
+# Description
+
+*Please include a summary of the changes including relevant motivation and context.*
+
+## Type of change
+
+*Select all that apply.*
+
+- [ ] Bug fix
+- [ ] New feature
+- [ ] Major change (fix or feature that would cause existing functionality to work differently than in the current version)
+
+Tag issues related to this pull request:
+
+*
+*
+*

.github/workflows/builds.yaml

@@ -0,0 +1,32 @@
+name: Builds
+on:
+  push:
+    branches:
+      - main
+      - production
+  pull_request:
+    branches:
+      - main
+      - production
+  schedule:
+    - cron: '0 2 * * *' # Daily at 2AM UTC
+
+jobs:
+  builds:
+    name: Builds
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Clone repository
+        uses: actions/checkout@v3
+
+      - name: Create the package
+        shell: bash
+        run: |
+          ./bin/build-addon.sh nightly.xpi
+
+      - name: Uploading
+        uses: actions/upload-artifact@v3
+        with:
+            name: ${{matrix.config.name}} Build
+            path: src/web-ext-artifacts

.github/workflows/test.yaml

@@ -0,0 +1,28 @@
+name: Test
+on:
+  push:
+    branches:
+      - main
+      - production
+  pull_request:
+    branches:
+
+jobs:
+  test:
+    name: Run tests
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Clone repository
+        uses: actions/checkout@v3
+
+      - name: Set up node
+        uses: actions/setup-node@v3
+        with:
+          node-version: lts/*
+
+      - name: Install dependencies
+        run: npm install --legacy-peer-deps
+
+      - name: Run tests
+        run: npm run test

.gitignore

@@ -1,5 +1,4 @@
 .DS_Store
-package-lock.json
 node_modules
 README.html
 *.xpi

.gitmodules

@@ -0,0 +1,5 @@
+[submodule "src/_locales"]
+	branch = main
+	path = src/_locales
+	url = https://github.com/mozilla-l10n/multi-account-containers-l10n.git 
+	ignore=all

.stylelintrc

@@ -9,8 +9,12 @@
 
   "rules": {
     "declaration-block-no-duplicate-properties": true,
-    "order/declaration-block-properties-alphabetical-order": true,
-    "property-blacklist": [
+    "property-no-unknown": [
+      true, {
+        ignoreProperties:
+          ["inset-block-end", "inset-block-start"]
+    }],
+    "property-disallowed-list": [
       "/(min[-]|max[-])height/",
       "/width/",
       "/top/",

.travis.yml

@@ -1,7 +0,0 @@
-language: node_js
-node_js:
-    - "lts/*"
-
-notifications:
-    irc:
-        - "ircs://irc.mozilla.org:6697/#testpilot-containers-bots"

CONTRIBUTING.md

@@ -1,35 +1,38 @@
 # Contributing
 
-Everyone is welcome to contribute to containers. Reach out to team members if you have questions:
+## Requirements
 
-- IRC: #containers on irc.mozilla.org
-- Email: containers@mozilla.com
+* Firefox 91.1.0+
+* Git 2.13+
+* Node 7+
 
-## Filing bugs
+## Getting Started
 
-If you find a bug with containers, please file a issue.
+1. Follow the instructions on [How to fork a repository][fork]
+2. Fetch the locales:
 
-Check first if the bug might already exist: https://github.com/mozilla/multi-account-containers/issues
+    ```
+    cd multi-account-containers
+    git submodule update --init
+    ```
+3. Install the project dependencies
+    ```
+    npm install --legacy-peer-deps
+    ```
+4. Run `npm run dev`.
 
-[Open an issue](https://github.com/mozilla/multi-account-containers/issues/new)
+## Translations
 
-1. Visit about:support
-2. Click "Copy raw data to clipboard" and paste into the bug. Alternatively copy the following sections into the issue:
-  - Application Basics
-  - Nightly Features (if you are in nightly)
-  - Extensions
-  - Experimental Features
-3. Include clear steps to reproduce the issue you have experienced.
-4. Include screenshots if possible.
+The translations are located in `src/_locales`. This directory is a git
+repository like any other. Before editing files in this folder, you need to:
 
-## Sending Pull Requests
+1. `cd src/_locales/`
+2. `git checkout -b message-updates-yyyymmdd`
+3. `git push -u origin message-updates-yyyymmdd`
 
-Patches should be submitted as pull requests. When submitting patches as PRs:
+You can then [open a pull request][pr] on [the l10n repository][l10n].
 
-- You agree to license your code under the project's open source license (MPL 2.0).
-- Base your branch off the current master (see below for an example workflow).
-- Add both your code and new tests if relevant.
-- Run npm test to make sure all tests still pass.
-- Please do not include merge commits in pull requests; include only commits with the new relevant code.
-
-See the main [README](./README.md) for information on prerequisites, installing, running and testing.
+[fork]: https://docs.github.com/en/get-started/quickstart/fork-a-repo
+[l10n]: https://github.com/mozilla-l10n/multi-account-containers-l10n/
+[pr]: https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/proposing-changes-to-your-work-with-pull-requests/about-pull-requests
+[web-ext]: https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Getting_started_with_web-ext

README.md

@@ -1,64 +1,32 @@
 # Multi-Account Containers
 
-The Firefox Multi-Account Containers extension lets you carve out a separate box for each of your online lives – no more opening a different browser just to check your work email! [Learn More Here](https://blog.mozilla.org/firefox/introducing-firefox-multi-account-containers/)
+[![Test](https://github.com/mozilla/multi-account-containers/actions/workflows/test.yaml/badge.svg)](https://github.com/mozilla/multi-account-containers/actions/workflows/test.yaml)
 
-[Available on addons.mozilla.org](https://addons.mozilla.org/en-GB/firefox/addon/multi-account-containers/)
+The Firefox Multi-Account Containers extension lets you carve out a separate box for each of your online lives – no more opening a different browser just to check your work email!
 
-For more info, see: 
+Learn more about Multi-Account Containers in
+[our end-user documentation][enduser].
 
-* [Test Pilot Product Hypothesis Document](https://docs.google.com/document/d/1WQdHTVXROk7dYkSFluc6_hS44tqZjIrG9I-uPyzevE8/edit#)
-* [Shield Product Hypothesis Document](https://docs.google.com/document/d/1vMD-fH_5hGDDqNvpRZk12_RhCN2WAe4_yaBamaNdtik/edit#)
+## Contributing
 
+Everyone is welcome to contribute to Multi-Account Containers. To learn how
+to contribute a patch to Multi-Account Container, please
+[read our contributing guide][contributing].
 
-## Requirements
+You can also chat with us on [our Matrix room][matrix] or [our forum][forum].
 
-* node 7+ (for jpm)
-* Firefox 57+
+This repository is governed by Mozilla's code of conduct and etiquette
+guidelines. For more details, [please read the Mozilla Community Participation Guidelines][cpg].
 
+### License
 
-## Development
+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 https://mozilla.org/MPL/2.0/.
 
-1. `npm install`
-2. `./node_modules/web-ext/bin/web-ext run -s src/`
-
-### Testing
-`npm run test`
-
-or 
-
-`npm run lint` 
-
-for just the linter
-
-There is a timeout test that sometimes fails on certain machines, so make sure to run the tests on your clone before you make any changes to see if you have this problem.
-
-### Distributing
-#### Make the new version
-
-1. Bump the version number in `package.json` and `manifest.json`
-2. Commit the version number bump
-3. Create a git tag for the version: `git tag <version>`
-4. Push the tag up to GitHub: `git push --tags`
-
-#### Publish to AMO
-
-1. `npm run-script build`
-2. [Upload the `.zip` to AMO](https://addons.mozilla.org/en-US/developers/addon/multi-account-containers/versions/submit/)
-
-#### Publish to GitHub
-Finally, we also publish the release to GitHub for those followers.
-
-1. Download the signed `.xpi` from [the addon versions page](https://addons.mozilla.org/en-US/developers/addon/multi-account-containers/versions)
-2. [Make the new release on
-   GitHub](https://github.com/mozilla/multi-account-containers/releases/new)
-   * Use the version number for "Tag version" and "Release title"
-   * Release notes: copy the output of `git log --no-merges --pretty=format:"%h %s" <previous-version>..<new-version>`
-   * Attach binaries: select the signed `.xpi` file
-
-### Links
-
-Facebook & Twitter icons CC-Attrib https://fairheadcreative.com.
-
-- [License](./LICENSE.txt)
-- [Contributing](./CONTRIBUTING.md)
-- [Code Of Conduct](./CODE_OF_CONDUCT.md)
+<!-- Please keep the list in alphabetical order -->
+[contributing]: CONTRIBUTING.md
+[cpg]: https://www.mozilla.org/about/governance/policies/participation/
+[enduser]: https://support.mozilla.org/en-US/kb/containers
+[forum]: https://discourse.mozilla.org/c/containers/223
+[matrix]: https://matrix.to/#/#containers:mozilla.org

bin/addons-linter.sh

@@ -0,0 +1,35 @@
+#!/bin/bash
+
+# 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/.
+
+# addons-linter is not happy to see a `.github` folder in src/_locales.
+# We need to do an horrible hack to run the test.
+
+. $(dirname $0)/commons.sh
+
+TMPDIR=/tmp/MAC_addonsLinter
+
+print Y "Update the submodules..."
+git submodule init || die
+git submodule update --remote --depth 1 src/_locales || die
+
+printn Y "Removing previous execution data... "
+rm -rf $TMPDIR || die
+print G "done."
+
+printn Y "Creating a tmp folder ($TMPDIR)... "
+mkdir $TMPDIR || die
+print G "done."
+
+printn Y "Copying data... "
+cp -r src $TMPDIR || die
+print G "done."
+
+printn Y "Removing the github folder... "
+rm -rf $TMPDIR/src/_locales/.github || die
+print G "done."
+
+print Y "Running the test..."
+npx addons-linter $TMPDIR/src || die

bin/build-addon.sh

@@ -1 +1,26 @@
-npm install && npm run deploy
+#!/bin/bash
+
+# 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/.
+
+. $(dirname $0)/commons.sh
+
+print Y "Update the submodules..."
+git submodule init || die
+git submodule update --remote --depth 1 src/_locales || die
+
+print Y "Installing dependencies..."
+npm install --legacy-peer-deps || die
+
+print Y "Running tests..."
+npm test
+
+print Y "Creating the final package..."
+cd src || die
+
+if [[ $# -gt 0 ]]; then
+  EXTRA_PARAMS="--filename $1"
+fi
+
+npx web-ext build --overwrite-dest $EXTRA_PARAMS || die

bin/commons.sh

@@ -0,0 +1,54 @@
+#!/bin/bash
+
+# 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/.
+
+printv() {
+  if [ -t 1 ]; then
+    NCOLORS=$(tput colors)
+
+    if test -n "$NCOLORS" && test "$NCOLORS" -ge 8; then
+      NORMAL="$(tput sgr0)"
+      RED="$(tput setaf 1)"
+      GREEN="$(tput setaf 2)"
+      YELLOW="$(tput setaf 3)"
+    fi
+  fi
+
+  if [[ $2 = 'G' ]]; then
+    # shellcheck disable=SC2086
+    echo $1 -e "${GREEN}$3${NORMAL}"
+  elif [[ $2 = 'Y' ]]; then
+    # shellcheck disable=SC2086
+    echo $1 -e "${YELLOW}$3${NORMAL}"
+  elif [[ $2 = 'N' ]]; then
+    # shellcheck disable=SC2086
+    echo $1 -e "$3"
+  else
+    # shellcheck disable=SC2086
+    echo $1 -e "${RED}$3${NORMAL}"
+  fi
+}
+
+print() {
+  printv '' "$1" "$2"
+}
+
+printn() {
+  printv "-n" "$1" "$2"
+}
+
+error() {
+  printv '' R "$1"
+}
+
+die() {
+  if [[ "$1" ]]; then
+    error "$1"
+  else
+    error Failed
+  fi
+
+  exit 1
+}

data/filters.svg

@@ -1,9 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<!-- 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/. -->
-<svg xmlns="http://www.w3.org/2000/svg">
-  <filter id="fill">
-    <feComposite in="FillPaint" in2="SourceGraphic" operator="in"/>
-  </filter>
-</svg>

data/usercontext.css

@@ -1,143 +0,0 @@
-#userContext-indicator {
-  height: 16px;
-  list-style-image: none !important;
-  vertical-align: middle;
-  width: 16px;
-}
-
-#userContext-label {
-  color: var(--identity-tab-color) !important;
-  margin-inline-end: 5px;
-  max-inline-size: 75px;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-#userContext-icons {
-  -moz-box-align: center;
-  align-items: center;
-  display: flex;
-  max-inline-size: 120px;
-}
-
-#userContext-icons[data-identity-color=""] {
-  display: none;
-}
-
-/* containers experiment */
-
-/* reset nightly containers */
-.tabbrowser-tab[usercontextid] {
-  background-image: none !important;
-  background-repeat: no-repeat;
-  background-size: 0;
-}
-
-/* special styles run through a psuedo-class off of
-these elements so they need to be relatively positioned.
-these styles address both regular and compact themes,
-special cases are addressed below */
-.tabbrowser-tab[usercontextid] .tab-background-middle,
-#main-window[style*='compact'] .tabbrowser-tab[usercontextid] .tab-content,
-#verticaltabs-box .tabbrowser-tab[usercontextid] .tab-content {
-  position: relative;
-}
-
-.tabbrowser-tab[usercontextid] .tab-background-middle::after,
-#main-window[style*='compact'] .tabbrowser-tab[usercontextid] .tab-content::after {
-  background-color: var(--identity-tab-color);
-  bottom: 0;
-  content: '';
-  height: 2px;
-  left: 0;
-  position: absolute;
-  right: 0;
-  width: 100%;
-  z-index: 999;
-}
-
-.tabbrowser-tab[usercontextid] .tab-background-middle::after {
-  background-color: var(--identity-tab-color);
-  border-radius: 2px 2px 0 0;
-  bottom: 1px;
-  height: 3px;
-}
-
-.tabbrowser-tab[usercontextid]:not([visuallyselected="true"]) .tab-background-middle::after {
-  bottom: 2px;
-  height: 2px !important;
-}
-
-.tabbrowser-tab[usercontextid][pinned="true"] .tab-background-middle::after {
-  left: -150%;
-  width: 400%;
-}
-
-.tabs-newtab-button .toolbarbutton-icon[type="menu"] {
-  margin-inline-end: 0;
-}
-
-.tabs-newtab-button .toolbarbutton-menu-dropmarker {
-  display: none;
-}
-
-#new-tab-overlay {
-  --icon-size: 16px;
-  -moz-appearance: none;
-  background: transparent;
-  font-style: -moz-use-system-font;
-  inline-size: 180px;
-  margin-inline-start: -50px !important;
-  visibility: visible;
-}
-
-#new-tab-overlay .panel-arrowcontent {
-  -moz-appearance: none !important;
-  background: none;
-  border: 0;
-  box-shadow: none;
-  display: block;
-  margin-block-end: 0;
-  margin-block-start: 2px;
-  padding-block-start: 0 !important;
-}
-
-#new-tab-overlay .panel-arrowcontent,
-#new-tab-overlay menuitem {
-  inline-size: 100%;
-}
-
-#new-tab-overlay .panel-arrowbox {
-  display: none;
-}
-
-#new-tab-overlay[hidden=true] {
-  display: none;
-}
-
-#new-tab-overlay menuitem {
-  -moz-appearance: none;
-  background: white;
-  border-radius: 20px;
-  border: 0;
-  box-shadow: 0 0 7px #0004;
-  color: #4b4b4b;
-  margin-block-end: 5px;
-  padding-block-end: 10px;
-  padding-block-start: 10px;
-  padding-inline-end: 10px;
-  padding-inline-start: 10px;
-}
-
-#new-tab-overlay menuitem:hover {
-  background: #f2f2f2;
-}
-
-#new-tab-overlay .menuitem-iconic[data-usercontextid] > .menu-iconic-left > .menu-iconic-icon {
-  block-size: var(--icon-size);
-  inline-size: var(--icon-size);
-}
-
-.menuitem-iconic[data-usercontextid] > .menu-iconic-left {
-  visibility: visible;
-}

data/usercontext.svg

@@ -1,72 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<!-- 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/. -->
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32" style="enable-background:new 0 0 32 32;">
-  <style>
-    path, circle, g {
-      fill: menutext;
-    }
-    path:not(:target),
-    circle:not(:target),
-    g:not(:target) {
-      display: none;
-    }
-  </style>
-  <path id="dollar" d="M16.2,0c-8.9,0-16,7.3-16,16c0,8.9,7.1,16,15.8,16s15.8-7.1,15.8-16C32,7.3,24.9,0,16.2,0z M17.1,25.1v1.6
-  c0,0.4-0.4,0.5-0.7,0.5c-0.4,0-0.7-0.2-0.7-0.5v-1.6c-3.2-0.2-5-1.8-5.5-4.3c0-0.2,0-0.2,0-0.4c0-0.5,0.4-0.9,0.9-0.9
-  c0.2,0,0.2,0,0.4,0c0.5,0,0.9,0.2,1.1,0.7c0.4,1.8,1.2,2.7,3.4,2.8v-6.8c-3.6-0.4-5.3-1.8-5.3-4.6c0-3,2.5-4.6,5.2-4.8V5.7
-  c0-0.4,0.4-0.5,0.7-0.5c0.4,0,0.7,0.2,0.7,0.5v1.1c2.7,0.4,4.4,1.8,5,3.9c0,0.2,0,0.2,0,0.4c0,0.5-0.4,0.7-0.7,0.9
-  c-0.2,0-0.2,0-0.4,0c-0.4,0-0.7-0.2-0.9-0.7c-0.4-1.4-1.2-2.3-3-2.5v6c3.2,0.7,5.5,1.8,5.5,5.2C22.8,23.5,20.1,25.1,17.1,25.1z
-   M12.4,11.6c0,1.6,0.7,2.5,3.2,3V8.7C13.7,8.9,12.4,10,12.4,11.6z M17.1,16.9v6.4c2.3-0.2,3.6-1.2,3.6-3.2
-  C20.6,17.8,19.2,17.2,17.1,16.9z"/>
-  <path id="briefcase" d="M23.1,5.3c0-1.4-1.2-2.7-2.8-2.7h-8.7c-1.4,0-2.7,1.2-2.7,2.7v4.4H7.1v19.6h17.8V9.8h-1.8V5.3z M20.8,9.8H11
-  V5.3c0-0.4,0.2-0.5,0.5-0.5h8.7c0.4,0,0.5,0.2,0.5,0.5V9.8z M1.8,9.8h2.7v19.6H1.8c-0.9,0-1.8-0.9-1.8-1.8v-16
-  C0,10.5,0.9,9.8,1.8,9.8z M32,11.6v16c0,0.9-0.7,1.8-1.8,1.8h-2.7V9.8h2.7C31.3,9.8,32,10.5,32,11.6z"/>
-  <path id="fingerprint" d="M7.17741905,12 C7.10965537,12 7.041327,11.9953181 6.97243393,11.985018 C6.33263187,11.8918489 5.90515601,11.3862071 6.01809547,10.8552833 C7.41798011,4.26321358 12.2613889,2.57493207 15.0238882,2.15590491 C19.6448063,1.45690206 24.3408291,3.21541158 25.8344535,5.29743816 C26.1664955,5.76047488 25.9835336,6.35881757 25.4244832,6.63364321 C24.8654329,6.9098734 24.1437497,6.75583996 23.8122724,6.29327142 C22.8923805,5.01043967 19.1749781,3.51130562 15.4479759,4.07406612 C12.8080159,4.474834 9.43056132,6.03623689 8.33561323,11.1942506 C8.23453242,11.666651 7.73816348,12 7.17741905,12 Z M16.63127,26 C16.1452186,26 15.6509104,25.9658335 15.147795,25.8938767 C10.637921,25.257137 6.71207921,21.8114952 6.01575422,17.8807924 C5.91171832,17.2932317 6.33391695,16.7382846 6.95813239,16.6404441 C7.58454965,16.5343208 8.17298555,16.9406954 8.27757192,17.5272206 C8.80876054,20.5255916 11.9766264,23.26409 15.4885263,23.7610576 C17.3975027,24.02766 20.959494,23.8221432 23.3220449,19.3789425 C24.4625867,17.2331815 23.0049831,11.881462 19.9521622,9.34692739 C18.2380468,7.92384005 16.4573263,7.76905536 14.6628445,8.89499751 C13.26469,9.77142052 11.8070864,12.2857658 11.8665355,14.6287608 C11.9127737,16.4835887 12.8386382,17.9325598 14.6171568,18.9363308 C15.2210054,19.2764429 16.9411759,19.4933486 17.9424527,18.8296898 C18.7257495,18.3104622 18.9591422,17.2761485 18.6365758,15.7583267 C18.3822659,14.5650869 17.2219077,12.4452096 16.6664991,12.3711821 C16.6692513,12.3722175 16.4666841,12.4312324 16.1276041,12.9095636 C15.8545786,13.2936782 15.58981,14.7297074 15.9476054,15.3581643 C16.0142104,15.4761941 16.0725586,15.5465978 16.3202632,15.5465978 C16.9532859,15.5465978 17.46686,16.0290705 17.46686,16.6249139 C17.46686,17.2207573 16.9543868,17.7042653 16.3213641,17.7042653 C15.2644914,17.7042653 14.4140391,17.2336992 13.9268868,16.3774655 C13.1083609,14.9388479 13.5536787,12.6548678 14.2202791,11.7137354 C15.2540327,10.2564816 16.3631986,10.1151564 17.1123672,10.2564816 C19.7066595,10.7389543 20.8763754,15.2908666 20.8857331,15.3359043 C21.5303153,18.3648181 20.3594985,19.8665919 19.264094,20.593407 C17.4151172,21.8192603 14.6920186,21.493643 13.4380832,20.7859819 C10.3280151,19.0310652 9.62013053,16.497566 9.5744428,14.6805283 C9.49022326,11.3643051 11.4779146,8.30018945 13.391845,7.10021984 C16.0417332,5.43848454 18.9877658,5.66781436 21.4714167,7.72919442 C25.1176276,10.7565552 27.0871539,17.1229168 25.3746898,20.3433702 C23.4326862,23.9950465 20.2983981,26 16.63127,26 Z M16.0845157,30 C14.9348455,30 13.9050564,29.8557557 13.0394288,29.6610017 C10.2114238,29.0257442 7.58700058,27.4599412 6.18892823,25.5735955 C5.84440518,25.1078371 5.98426642,24.4803503 6.50105099,24.1700066 C7.01675554,23.8596629 7.71552172,23.986423 8.06112477,24.4507244 C9.89498097,26.9252176 15.9397944,29.9781448 22.2508301,26.1937972 C22.7676147,25.8844249 23.4658409,26.0087566 23.8109039,26.474515 C24.155427,26.9397877 24.0161057,27.5672745 23.4993212,27.8776182 C20.7987573,29.4963593 18.2315746,30 16.0845157,30 Z"/>
-  <path id="cart" d="M26.9,21.4H9.4c-0.7,0-1.3,0.5-1.3,1.3s0.5,1.3,1.3,1.3h17.5c0.7,0,1.3-0.5,1.3-1.3
-  C28.5,21.9,27.8,21.4,26.9,21.4z M13.3,30.1c1.3,0,2.7-1.2,2.7-2.7c0-1.3-1.2-2.7-2.7-2.7s-2.7,1.2-2.7,2.7
-  C10.6,29,12,30.1,13.3,30.1z M23.9,30.1c1.3,0,2.7-1.2,2.7-2.7c0-1.3-1.2-2.7-2.7-2.7c-1.5,0-2.7,1.2-2.7,2.7
-  C21.4,29,22.6,30.1,23.9,30.1z M31.5,7.4L31.5,7.4H7.6V7.2L5.7,2.5C5.4,2.2,5.1,1.9,4.6,1.9H0.7C0,1.9,0,2.5,0,2.9
-  C0,3.5-0.2,4,0.7,4.2h2.7l0.7,1.5l4,13.3c0,0.2,0.2,0.5,0.8,0.5h18.5c0.3,0,0.7-0.2,0.7-0.5L32,8.3C32,8.1,31.8,7.4,31.5,7.4z"/>
-  <path id="vacation" d="M3.6,27l-2.5-1.8L0.8,25c-0.7-0.4-0.7-1.2-0.4-2c0.4-0.5,1.1-0.7,1.6-0.5l3.6,1.2c0-0.4,0.2-0.9,0.4-1.4
-  c0.2-0.7,0.5-1.6,1.1-2.3c0.2-0.4,0.5-0.7,0.7-1.2c0.2-0.4,0.5-0.9,0.9-1.2c0.4-0.9,1.1-1.6,1.8-2.5c0.7-0.9,1.4-1.6,2.3-2.5
-  c0.4-0.4,0.9-0.7,1.2-1.2c0.4-0.2,0.9-0.7,1.2-1.1c0.2-0.2,0.2-0.2,0.4-0.4L3.1,7.3c-0.2,0-0.2,0-0.4,0l-2,0.9
-  C0.2,8.3-0.3,7.6,0.2,7.1l2-2C2.4,5,2.4,5,2.5,5h17.9c0.5-0.5,1.2-1.1,1.8-1.6c0.7-0.7,1.4-1.2,2.1-1.8c0.4-0.4,0.7-0.5,1.1-0.7
-  c0.4-0.2,0.7-0.4,1.1-0.5c0.5,0,0.9-0.2,1.2-0.2s0.7,0,1.1,0s0.7,0,1.1,0c0.4,0,0.5,0,0.7,0.2c0.5,0,0.7,0.2,0.7,0.2
-  c0.2,0,0.2,0.2,0.4,0.4c0,0,0,0.4,0.2,0.7c0,0.2,0,0.5,0.2,0.7c0,0.4,0,0.7,0,1.1s0,0.7,0,1.1c0,0.4,0,0.9-0.2,1.2
-  c-0.2,0.4-0.4,0.7-0.5,1.1c-0.2,0.4-0.5,0.7-0.7,1.1c-0.5,0.7-1.1,1.4-1.8,2.1c-0.4,0.4-0.7,0.7-1.1,1.1v17.8c0,0.2,0,0.4-0.2,0.4
-  l-2,2c-0.5,0.5-1.2,0-1.1-0.5l0.7-2c0-0.2,0-0.2,0-0.4L22.8,16c-0.4,0.4-0.7,0.7-0.9,0.9c-0.4,0.4-0.7,0.9-1.2,1.2
-  c-0.4,0.4-0.7,0.9-1.2,1.2c-0.7,0.9-1.6,1.6-2.5,2.3c-0.9,0.7-1.6,1.4-2.5,2c-0.4,0.4-0.9,0.5-1.2,0.9c-0.4,0.2-0.7,0.5-1.2,0.7
-  c-0.7,0.4-1.6,0.7-2.3,1.1c-0.4,0.2-0.7,0.2-1.2,0.4L9.6,30c0.4,0.7,0,1.4-0.7,1.8c-0.5,0.2-1.2,0-1.6-0.5l-0.2-0.4l-1.8-2.3
-  c-0.2,0-0.2,0-0.4,0.2c-0.4,0-0.5,0.2-0.7,0.2s-0.2,0-0.4,0c-0.2,0-0.2,0-0.4,0c-0.2,0-0.4,0-0.5,0c-0.2,0-0.2,0-0.2,0s0,0,0-0.2
-  c0-0.2,0-0.2,0-0.5c0-0.2,0-0.2,0-0.4c0-0.2,0-0.2,0-0.4C3.4,27.5,3.4,27.3,3.6,27L3.6,27z M5.7,28.4L5.7,28.4L5.7,28.4L5.7,28.4z"
-  />
-  <path id="gift" d="M30.3,8.1h-4.5V8c0.7-0.7,1.3-1.9,1.3-3.2c0-2.6-2.1-4.7-4.9-4.7c-1.5,0-4.5,1.5-6.4,3.4C14,1.6,11,0.1,9.5,0.1
-  c-2.6,0-4.9,2.1-4.9,4.7C4.7,6.1,5.2,7.2,6,8H1.7C0.6,8,0,8.7,0,9.6v4.5c0,0.2,0.2,0.4,0.4,0.4h13.8V9.6h3.2v4.9h14.2
-  c0.2,0,0.4-0.2,0.4-0.4V9.6C32,8.7,31.4,8.1,30.3,8.1z M9.5,6.5C8.6,6.5,8,5.9,8,4.8s0.6-1.5,1.5-1.5s3.7,1.9,4.7,2.8
-  C13.7,6.3,9.5,6.5,9.5,6.5z M22.3,6.5c0,0-4.1-0.2-4.7-0.4c0.9-1.1,3.7-2.8,4.7-2.8S24,3.8,24,4.8S23.2,6.5,22.3,6.5z M1.7,17.7
-  h12.7v14.2H1.7V17.7z M17.6,17.7h12.7v14.2H17.6V17.7z"/>
-  <path id="food" d="M14.1,0.9v5.3h-1.4V0.9c0-1.1-1.4-1.1-1.4,0v5.3h-1.2V0.9c0-1.1-1.4-1.1-1.4,0v5.3H7.2V0.9c0-1.2-1.6-1.1-1.6,0
-  v10.4c0,1.8,1.2,3,2.8,3v15.2c0,1.6,1.1,2.5,2.1,2.5s2.1-0.9,2.1-2.5V14.3c1.6,0,2.8-1.4,2.8-2.8V0.9C15.6-0.4,14.1-0.2,14.1,0.9z
-   M19.8,3.7v25.8c0,3.2,4.2,3.2,4.2,0V17.1h2.3V3.7C26.5-1.2,19.8-1.2,19.8,3.7z"/>
-  <path id="fruit" d="M16.5,8c-2.1-0.9-3.9-1.2-6.6-0.9C4.6,8,1.8,12.6,1.8,18c0,5.9,4.8,14,9.8,14c1.6,0,3.9-1.2,4.4-1.2
-  c0.5,0,2.8,1.2,4.4,1.2c5,0,9.8-8.4,9.8-14c0-5.9-3.2-10.8-9.8-10.8C19,7.1,17.8,7.5,16.5,8z M11.7,0c1.1,0.2,3.2,0.9,4.1,2.3
-  c0.9,1.4,0.5,3.6,0.2,4.6c-1.2-0.2-3.2-0.7-4.1-2.3C11,3.2,11.4,1.1,11.7,0L11.7,0z"/>
-  <path id="pet" d="M28.5,8.1c0-1.1-1-1.9-2.1-2.4V3.7c-0.2-0.2-0.3-0.3-0.6-0.3c-0.6,0-1.1,0.8-1.3,2.1c-0.2,0-0.3,0-0.5,0l0,0
-  c0-0.2,0-0.3-0.2-0.5c-0.3-1.1-0.8-1.9-1.3-2.6C22,2.6,21.7,3.2,21.7,4L22,6.3c-0.3,0.2-0.6,0.3-1,0.6l-3.5,3.7l0,0
-  c0,0-6.3-0.8-10.9,0.2c-0.6,0-1,0.2-1.1,0.3c-0.5,0.2-0.8,0.3-1.1,0.6c-1.1-0.8-2.2-2.1-3.2-4c0-0.3-0.5-0.5-0.8-0.5s-0.5,0.6-0.3,1
-  c0.8,2.1,2.1,3.5,3.4,4.5c-0.5,0.5-0.8,1-1,1.6c0,0-0.3,2.2-0.3,5.5l1.4,8c0,1,0.8,1.8,1.9,1.8c1,0,1.9-0.8,1.9-1.8V23l0.5-1.3h8.8
-  l0.8,1.3v4.7c0,1,0.8,1.8,1.9,1.8c1,0,1.6-0.6,1.8-1.4l0,0l1.9-9l0,0l2.1-6.4h3c3.4,0,3.7-2.9,3.7-2.9L28.5,8.1z"/>
-  <path id="tree" d="M0.7,18c0,4.9,3.6,8.8,8.1,9.5v4.3c0.2,0,3.2,0,3.2,0v-4.3c1.8-0.4,3.6-1.1,4.9-2.5c0.2-0.2,0.2-0.2,0.2-0.5
-  c-0.2-0.4-0.2-1.1-0.2-1.6c0-2,0.2-4.9,1.6-7.9c0,0,0.9-1.6,0.7-1.8C18,7.2,14.4,0,10.4,0C5,0,0.7,12.6,0.7,18z M18.3,22.8
-  c0,3.1,2.2,5.6,4.9,6.3V32h3.2v-2.9c2.7-0.7,4.9-3.2,4.9-6.3c0-3.6-2.9-12.9-6.5-12.9S18.3,19.2,18.3,22.8z"/>
-  <path id="chill" d="M9.1,18.5l-5.7,5.9C3.2,23.8,3,23.3,3,22.6c0-2.5,2-4.4,4.4-4.4C7.8,18.1,8.5,18.3,9.1,18.5 M26.5,18.5l-5.7,5.9
-  c-0.2-0.5-0.4-1.1-0.4-1.8c0-2.5,2-4.4,4.4-4.4C25.4,18.1,26,18.3,26.5,18.5 M24.7,2L24.7,2c-0.7,0-1.4,0.7-1.4,1.4s0.7,1.4,1.4,1.4
-  c2.5,0,4.4,2,4.4,4.4v7.6c-1.6-1.2-3.6-1.8-5.5-1.4c-2.1,0.4-3.9,1.6-5,3.4c-1.6-1.2-3.9-1.2-5.5,0c-1.1-1.8-2.8-3-5-3.4
-  c-2-0.4-3.9,0.2-5.5,1.4V9.2c0-2.5,2-4.4,4.4-4.4c0.5,0,0.9-0.4,1.2-0.7c0.2-0.4,0.2-0.9,0-1.4C8.2,2.3,7.6,2,7.1,2
-  C3.2,2,0,5.2,0,9.2v13.5C0,26.7,3.2,30,7.1,30l0,0c3.9,0,7.1-3.2,7.1-7.3c0-0.2,0-0.4,0-0.5c0.2-0.9,0.9-1.4,1.8-1.4
-  s1.6,0.5,1.8,1.4v0.2c0,0.2,0,0.2,0,0.4c0,2,0.7,3.7,2.1,5c1.4,1.4,3,2.1,5,2.1l0,0c2,0,3.6-0.7,5-2.1c1.4-1.2,2.1-3.2,2.1-5V9.2
-  C32,5.2,28.8,2,24.7,2"/>
-  <circle id="circle" r="16" cx="16" cy="16" fill-rule="evenodd"/>
-</svg>

docs/acceptance.md

@@ -1,31 +0,0 @@
-# Acceptance Criteria
-
-## User Experience
-- [ ] It should place a containers button on the user’s browser toolbar
-- [ ] It should include all containers management UI inside a door hanger from this toolbar button
-- [ ] It should provide a set of default container choices for users to pick from (work, home, travel etc.)
-  - [ ] Each container type should have a color, icon and name
-- [ ] It should allow users to create new containers
-- [ ] It should allow users to delete containers
-- [ ] It should allow users to open container tabs
-  - [ ] each container tab should be clearly demarcated by color/icon etc.
-- [ ] It should provide a control to show/hide all open tabs of one container type
-- [ ] It should provide a control to sort tabs by container type
-- [ ] It should provide a control to allow users to open containers in new tab or new window by default
-
-## User Experience Non-Requirements (out of scope)
-- [ ] It should not show any UI in browser settings
-- [ ] It should not effect the awesome bar
-- [ ] It should not effect the Firefox Library 
-- [ ] It should not make any changes to sync functionality
-
-## Measurements
-- [ ] It should measure container tab creations per session
-- [ ] It should measure the type of container tab created
-- [ ] It should measure container tab creations
-- [ ] It should measure new container creations
-- [ ] It should measure container deletes
-- [ ] It should measure container sorts
-- [ ] It should measure container hides
-- [ ] It should report URIs accessed across multiple containers
-- [ ] It should measure the % of tab-based vs windows-based containers

docs/release.md

@@ -0,0 +1,31 @@
+# Release a new version
+
+## Make the new version
+
+1. Bump the version number in `package.json` and `manifest.json`
+2. Commit the version number bump
+3. Create a git tag for the version: `git tag <version>`
+4. Push the tag up to GitHub: `git push --tags`
+
+## Publish to AMO
+
+1. Run `./bin/build-addon.sh`
+2. [Upload the zip file to AMO][amo-upload]
+
+## Publish to GitHub
+
+Finally, we also publish the release to GitHub.
+
+1. Download the signed `.xpi` from [the addon versions page][addon-page]
+2. [Create a new release on GitHub][gh-release]
+   * For *Tag version* and *Release title*, use the version number
+   * For *Release notes*, copy the output of:
+     ```
+     git log --no-merges \
+             --pretty=format:"%h %s" <previous-version>..<new-version>
+     ```
+   * For the *Attach binaries*, select the signed `.xpi` file
+
+[addon-page]: https://addons.mozilla.org/developers/addon/multi-account-containers/versions
+[amo-upload]: https://addons.mozilla.org/developers/addon/multi-account-containers/versions/submit/
+[gh-release]: https://github.com/mozilla/multi-account-containers/releases/new

package.json

@@ -2,30 +2,30 @@
   "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.5",
-  "author": "Andrea Marchesini, Luke Crouch and Jonathan Kingston",
+  "version": "8.1.3",
+  "author": "Andrea Marchesini, Luke Crouch, Lesley Norton, Kendall Werts, Maxx Crawford, Jonathan Kingston",
   "bugs": {
     "url": "https://github.com/mozilla/multi-account-containers/issues"
   },
   "dependencies": {},
   "devDependencies": {
-    "addons-linter": "^1.3.2",
+    "addons-linter": "^3.23.0",
     "ajv": "^6.6.3",
     "chai": "^4.2.0",
-    "eslint": "^6.6.0",
-    "eslint-plugin-no-unsanitized": "^2.0.0",
-    "eslint-plugin-promise": "^3.4.0",
+    "eslint": "^7.32.0",
+    "eslint-plugin-no-unsanitized": "^4.0.0",
+    "eslint-plugin-promise": "^5.2.0",
     "htmllint-cli": "0.0.7",
-    "json": "^9.0.6",
+    "json": ">=10.0.0",
     "mocha": "^6.2.2",
     "npm-run-all": "^4.0.0",
     "nyc": "^15.0.0",
     "sinon": "^7.5.0",
     "sinon-chai": "^3.3.0",
-    "stylelint": "^7.9.0",
-    "stylelint-config-standard": "^16.0.0",
-    "stylelint-order": "^0.3.0",
-    "web-ext": "^2.9.3",
+    "stylelint": "^13.5.0",
+    "stylelint-config-standard": "^20.0.0",
+    "stylelint-order": "^4.0.0",
+    "web-ext": "^7.1.1",
     "webextensions-jsdom": "^1.2.1"
   },
   "homepage": "https://github.com/mozilla/multi-account-containers#readme",
@@ -36,10 +36,9 @@
     "url": "git+https://github.com/mozilla/multi-account-containers.git"
   },
   "scripts": {
-    "build": "npm test && cd src && web-ext build --overwrite-dest",
-    "webext": "web-ext run -s src/",
+    "dev": "web-ext run -s src/",
     "lint": "npm-run-all lint:*",
-    "lint:addon": "addons-linter src --self-hosted",
+    "lint:addon": "./bin/addons-linter.sh",
     "lint:css": "stylelint src/css/*.css",
     "lint:html": "htmllint *.html",
     "lint:js": "eslint .",

src/confirm-page.html

@@ -1,31 +1,44 @@
 <html>
 <head>
   <meta http-equiv="content-type" content="text/html; charset=utf-8">
-  <title>Multi-Account Containers Confirm Navigation</title>
+  <title data-i18n-message-id="confirmNavigationTitle"></title>
   <link xmlns="http://www.w3.org/1999/xhtml" rel="stylesheet" href="chrome://browser/skin/aboutNetError.css" type="text/css" media="all" />
+  <link xmlns="http://www.w3.org/1999/xhtml" rel="stylesheet" href="chrome://global/skin/aboutNetError.css" type="text/css" media="all" />
+  <script type="text/javascript" src="./js/i18n.js"></script>
   <link rel="stylesheet" href="/css/confirm-page.css" />
 </head>
 <body>
   <main>
     <div class="title">
-      <h1 class="title-text">Open this site in your assigned container?</h1>
+      <h1 class="title-text" data-i18n-message-id="openThisSiteConfirmation"></h1>
     </div>
     <form id="redirect-form">
-      <p>
-        You asked <dfn id="browser-name" title="Thanks for trying out Containers. Sorry we may have got your browser name wrong. #FxNightly" >Firefox</dfn> to always open <dfn class="container-name"></dfn> for this site:<br />
-      </p>
+      <p data-message-id="youAskedFireFox" data-message-arg="container-name"></p>
       <div id="redirect-url"></div>
-      <p>Would you still like to open in this current container?</p>
+      <p data-i18n-message-id="wouldYouStillLikeToOpenConfirmation"></p>
       <br />
       <br />
       <label for="never-ask" class="check-label">
         <input id="never-ask" type="checkbox" />
-        Remember my decision for this site
+        <span data-i18n-message-id="rememberMyDecision"></span>
       </label>
       <br />
       <div class="button-container">
-        <button id="deny" class="button">Open in <dfn id="current-container-name">Current</dfn> Container</button>
-        <button id="confirm" class="button primary" autofocus>Open in <dfn class="container-name"></dfn> Container</button>
+        <button id="deny"
+                class="button"
+                data-message-id="openInContainer"
+                data-message-arg="current-container-name">
+        </button>
+        <button id="deny-no-container"
+                class="button"
+                data-message-id="openInNoContainer">
+        </button>
+        <button id="confirm"
+                class="button primary"
+                autofocus
+                data-message-id="openInContainer"
+                data-message-arg="container-name">
+        </button>
       </div>
     </form>
   </main>

src/css/confirm-page.css

@@ -5,8 +5,8 @@
 
 main {
   background: url(/img/onboarding-4.png) no-repeat;
-  background-position: -10px -15px;
-  background-size: 300px;
+  background-position: 200px 0;
+  background-size: 120px;
   margin-inline-start: -350px;
   padding-inline-start: 350px;
 }
@@ -18,17 +18,16 @@ main {
 button .container-name,
 #current-container-name {
   font-weight: bold;
-  text-transform: capitalize;
 }
 
-@media only screen and (max-width: 1300px) {
+@media only screen and (max-width: 900px) {
   main {
     background: none;
   }
 
   /* for a mid sized window we have enough for this but not our image */
   .title {
-    background-image: url("chrome://global/skin/icons/info.svg");
+    background-image: url('chrome://global/skin/icons/info.svg');
   }
 }
 
@@ -77,6 +76,11 @@ dfn {
   font-style: normal;
 }
 
+#deny,
+#confirm {
+  flex-grow: 1;
+}
+
 .button-container > button {
   min-inline-size: 240px;
 }

src/css/options.css

@@ -0,0 +1,122 @@
+body {
+  --grey10: #e7e7e7;
+
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+  background: #fff;
+  color: rgb(74, 74, 79);
+  font-size: 13px;
+  overflow: hidden;
+}
+
+h3:first-of-type {
+  margin-block-start: 2.5rem;
+}
+
+label {
+  display: flex;
+  align-items: center;
+  font-size: 14px;
+}
+
+label > span {
+  padding-inline-end: 4px;
+}
+
+.settings-group {
+  margin-block-end: 16px;
+}
+
+form {
+  display: flex;
+  flex-direction: column;
+  padding-block-end: 1rem;
+}
+
+.settings-group p {
+  margin-inline-start: 24px;
+  margin-block: 4px 8px;
+}
+
+input[type="checkbox"] {
+  margin-inline: 0 8px;
+  margin-block: 1px auto;
+  inline-size: 16px;
+  block-size: 16px;
+}
+
+button {
+  margin-inline: 0 auto;
+}
+
+.keyboard-shortcut {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  max-inline-size: 70%;
+  align-items: center;
+}
+
+.bold {
+  font-weight: 600;
+}
+
+.moz-vpn-proxy-permissions {
+  margin-block: 0 2rem;
+  padding-block-end: 1rem;
+  border-block-end: 1px solid var(--grey10);
+  display: flex;
+  flex-direction: column;
+}
+
+h3.moz-vpn-proxy-permissions-title {
+  margin-block-start: 0;
+  position: relative;
+  display: flex;
+  align-items: center;
+}
+
+.warning-icon {
+  display: flex;
+  align-items: center;
+}
+
+.warning-icon.show-warning::before {
+  background-image: url("/img/warning.svg");
+  background-size: 24px;
+  background-repeat: no-repeat;
+  background-position: center;
+  content: "";
+  display: block;
+  block-size: 24px;
+  inline-size: 24px;
+  margin-inline-end: 0.5rem;
+}
+
+.moz-vpn-proxy-permissions-title::before,
+.moz-vpn-proxy-permissions-title::after {
+  background-color: var(--grey10);
+  content: "";
+  height: 1px;
+  flex: 1 1 0%;
+}
+
+h3.moz-vpn-proxy-permissions-title::before {
+  margin-inline-end: 2rem;
+  margin-inline-start: -50%;
+}
+
+h3.moz-vpn-proxy-permissions-title::after {
+  margin-inline-start: 2rem;
+  margin-inline-end: -50%;
+}
+
+@media (prefers-color-scheme: dark) {
+  body {
+    background: #23212a;
+    color: #fff;
+  }
+
+  p {
+    color: rgb(177, 177, 179);
+  }
+}

src/img/Account.svg

@@ -1 +1,3 @@
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 220 160"><defs><style>.cls-1{fill:#6a57a5;}.cls-2{fill:#5a4a9e;}.cls-3{fill:#e7dfff;}</style></defs><title>account</title><path class="cls-1" d="M110,138.89A58.89,58.89,0,1,1,168.89,80,59,59,0,0,1,110,138.89Z"/><path class="cls-2" d="M110,130.27A50.27,50.27,0,1,1,160.27,80,50.33,50.33,0,0,1,110,130.27Z"/><circle class="cls-3" cx="110.39" cy="65.12" r="23.27" transform="translate(-12.01 27.1) rotate(-13.28)"/><path class="cls-3" d="M141.78,92.87c-8.2-9.46-19.58,3.28-31.39,3.28S87.2,83.41,79,92.87a7.83,7.83,0,0,0-.53,9.53,38.43,38.43,0,0,0,63.83,0A7.83,7.83,0,0,0,141.78,92.87Z"/></svg>
+<!-- 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/. --><svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 220 160"><defs><style>.cls-1{fill:#6a57a5;}.cls-2{fill:#5a4a9e;}.cls-3{fill:#e7dfff;}</style></defs><title>account</title><path class="cls-1" d="M110,138.89A58.89,58.89,0,1,1,168.89,80,59,59,0,0,1,110,138.89Z"/><path class="cls-2" d="M110,130.27A50.27,50.27,0,1,1,160.27,80,50.33,50.33,0,0,1,110,130.27Z"/><circle class="cls-3" cx="110.39" cy="65.12" r="23.27" transform="translate(-12.01 27.1) rotate(-13.28)"/><path class="cls-3" d="M141.78,92.87c-8.2-9.46-19.58,3.28-31.39,3.28S87.2,83.41,79,92.87a7.83,7.83,0,0,0-.53,9.53,38.43,38.43,0,0,0,63.83,0A7.83,7.83,0,0,0,141.78,92.87Z"/></svg>

src/img/Sync.svg

@@ -1 +1,3 @@
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 220 160"><defs><style>.cls-1{fill:#9f9fad;}.cls-2{fill:#5a4a9e;}.cls-3{fill:#6a57a5;}.cls-4{fill:#8f8f9d;}.cls-5{fill:none;stroke:#80808e;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.6px;}.cls-6{fill:#231f20;opacity:0.4;}.cls-7{fill:#ee3389;}.cls-8{fill:#7661aa;}</style></defs><title>Sync</title><path class="cls-1" d="M119.16,122.69v4.81H19.76v-4.81l12.83-3.21h72.15Z"/><rect class="cls-1" x="24.57" y="55.35" width="89.79" height="67.34" rx="3"/><path class="cls-2" d="M79.08,65l-49.7,49.7a1.61,1.61,0,0,0,1.6,1.61h77a1.62,1.62,0,0,0,1.61-1.61V65Z"/><polygon class="cls-3" points="29.38 64.97 29.38 114.67 79.08 64.97 29.38 64.97"/><path class="cls-2" d="M107.94,60.16H31a1.6,1.6,0,0,0-1.6,1.6V65h80.17V61.76A1.61,1.61,0,0,0,107.94,60.16Z"/><path class="cls-4" d="M108.74,121.09H30.18a.81.81,0,0,1,0-1.61h78.56a.81.81,0,1,1,0,1.61Z"/><line class="cls-5" x1="63.61" y1="124.18" x2="74.83" y2="124.18"/><path class="cls-6" d="M114.35,127.35H102.2V71.64a5.53,5.53,0,0,1,5.52-5.53h6.63Z"/><path class="cls-1" d="M200.24,134.72v4.81h-99.4v-4.81l12.82-3.21h72.15Z"/><rect class="cls-1" x="105.65" y="67.38" width="89.79" height="67.34" rx="3"/><path class="cls-2" d="M160.16,77l-49.71,49.7a1.61,1.61,0,0,0,1.61,1.6h77a1.6,1.6,0,0,0,1.6-1.6V77Z"/><polygon class="cls-3" points="110.45 77 110.45 126.7 160.16 77 110.45 77"/><path class="cls-2" d="M189,72.19h-77a1.61,1.61,0,0,0-1.61,1.6V77h80.17V73.79A1.6,1.6,0,0,0,189,72.19Z"/><path class="cls-4" d="M189.82,133.11H111.26a.8.8,0,1,1,0-1.6h78.56a.8.8,0,0,1,0,1.6Z"/><line class="cls-5" x1="144.69" y1="136.2" x2="155.91" y2="136.2"/><path class="cls-7" d="M136.85,50l-3-.55a3,3,0,0,0-3.51,2.37l-.27,1.45c-1.59,8.36-9.86,14.42-19.66,14.42a21,21,0,0,1-15.93-6.89H103a3,3,0,0,0,3-3v-3a3,3,0,0,0-3-3H84.86a3,3,0,0,0-3,3V73.64a3,3,0,0,0,3,3h3a3,3,0,0,0,3-3V69.72a30.8,30.8,0,0,0,19.57,6.87c14.15,0,26.15-9.11,28.54-21.66l.27-1.45A2.94,2.94,0,0,0,136.85,50Z"/><path class="cls-8" d="M84.06,47l3,.54a3.41,3.41,0,0,0,.55,0,3,3,0,0,0,3-2.41l.27-1.45h0c1.59-8.36,9.86-14.42,19.65-14.42a21,21,0,0,1,15.94,6.89H117.9a3,3,0,0,0-3,3v3a3,3,0,0,0,3,3h18.15a3,3,0,0,0,3-3V23.43a3,3,0,0,0-3-3h-3a3,3,0,0,0-3,3v3.92a30.82,30.82,0,0,0-19.58-6.88c-14.14,0-26.14,9.11-28.53,21.67l-.27,1.45A3,3,0,0,0,84.06,47Z"/></svg>
+<!-- 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/. --><svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 220 160"><defs><style>.cls-1{fill:#9f9fad;}.cls-2{fill:#5a4a9e;}.cls-3{fill:#6a57a5;}.cls-4{fill:#8f8f9d;}.cls-5{fill:none;stroke:#80808e;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.6px;}.cls-6{fill:#231f20;opacity:0.4;}.cls-7{fill:#ee3389;}.cls-8{fill:#7661aa;}</style></defs><title>Sync</title><path class="cls-1" d="M119.16,122.69v4.81H19.76v-4.81l12.83-3.21h72.15Z"/><rect class="cls-1" x="24.57" y="55.35" width="89.79" height="67.34" rx="3"/><path class="cls-2" d="M79.08,65l-49.7,49.7a1.61,1.61,0,0,0,1.6,1.61h77a1.62,1.62,0,0,0,1.61-1.61V65Z"/><polygon class="cls-3" points="29.38 64.97 29.38 114.67 79.08 64.97 29.38 64.97"/><path class="cls-2" d="M107.94,60.16H31a1.6,1.6,0,0,0-1.6,1.6V65h80.17V61.76A1.61,1.61,0,0,0,107.94,60.16Z"/><path class="cls-4" d="M108.74,121.09H30.18a.81.81,0,0,1,0-1.61h78.56a.81.81,0,1,1,0,1.61Z"/><line class="cls-5" x1="63.61" y1="124.18" x2="74.83" y2="124.18"/><path class="cls-6" d="M114.35,127.35H102.2V71.64a5.53,5.53,0,0,1,5.52-5.53h6.63Z"/><path class="cls-1" d="M200.24,134.72v4.81h-99.4v-4.81l12.82-3.21h72.15Z"/><rect class="cls-1" x="105.65" y="67.38" width="89.79" height="67.34" rx="3"/><path class="cls-2" d="M160.16,77l-49.71,49.7a1.61,1.61,0,0,0,1.61,1.6h77a1.6,1.6,0,0,0,1.6-1.6V77Z"/><polygon class="cls-3" points="110.45 77 110.45 126.7 160.16 77 110.45 77"/><path class="cls-2" d="M189,72.19h-77a1.61,1.61,0,0,0-1.61,1.6V77h80.17V73.79A1.6,1.6,0,0,0,189,72.19Z"/><path class="cls-4" d="M189.82,133.11H111.26a.8.8,0,1,1,0-1.6h78.56a.8.8,0,0,1,0,1.6Z"/><line class="cls-5" x1="144.69" y1="136.2" x2="155.91" y2="136.2"/><path class="cls-7" d="M136.85,50l-3-.55a3,3,0,0,0-3.51,2.37l-.27,1.45c-1.59,8.36-9.86,14.42-19.66,14.42a21,21,0,0,1-15.93-6.89H103a3,3,0,0,0,3-3v-3a3,3,0,0,0-3-3H84.86a3,3,0,0,0-3,3V73.64a3,3,0,0,0,3,3h3a3,3,0,0,0,3-3V69.72a30.8,30.8,0,0,0,19.57,6.87c14.15,0,26.15-9.11,28.54-21.66l.27-1.45A2.94,2.94,0,0,0,136.85,50Z"/><path class="cls-8" d="M84.06,47l3,.54a3.41,3.41,0,0,0,.55,0,3,3,0,0,0,3-2.41l.27-1.45h0c1.59-8.36,9.86-14.42,19.65-14.42a21,21,0,0,1,15.94,6.89H117.9a3,3,0,0,0-3,3v3a3,3,0,0,0,3,3h18.15a3,3,0,0,0,3-3V23.43a3,3,0,0,0-3-3h-3a3,3,0,0,0-3,3v3.92a30.82,30.82,0,0,0-19.58-6.88c-14.14,0-26.14,9.11-28.53,21.67l-.27,1.45A3,3,0,0,0,84.06,47Z"/></svg>

src/img/amo-icon.svg

@@ -1 +1,3 @@
-<svg width="32px" height="33px" viewBox="0 0 32 33" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch --> <desc>Created with Sketch.</desc> <defs> <linearGradient x1="74.0423237%" y1="18.5882821%" x2="0%" y2="100%" id="linearGradient-1"> <stop stop-color="#00FEFF" offset="0%"/> <stop stop-color="#3D85FF" offset="100%"/> </linearGradient> </defs> <g id="Specs" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="Header-Copy" transform="translate(-182.000000, -152.000000)" fill="url(#linearGradient-1)"> <path d="M205.58574,176.859518 L205.58574,169.287998 C205.58574,169.287998 205.800116,167.315137 207.086372,167.315137 C208.372629,167.315137 208.265441,169.394639 210.677171,169.394639 C211.909834,169.394639 214,168.754792 214,165.022352 C214,161.289912 211.909834,160.810027 210.677171,160.810027 C208.265441,160.810027 208.372629,162.782888 207.086372,162.782888 C205.800116,162.782888 205.58574,160.756707 205.58574,160.756707 L205.58574,157.664114 C205.58574,156.491061 204.621048,155.531291 203.44198,155.531291 L197.814608,155.531291 C197.814608,155.531291 195.992412,155.211368 195.992412,153.931674 C195.992412,152.65198 198.028985,152.545339 198.028985,150.145914 C198.028985,148.91954 197.332262,147 193.580682,147 C189.829101,147 189.293161,148.91954 189.293161,150.145914 C189.293161,152.545339 191.115357,152.65198 191.115357,153.931674 C191.115357,155.211368 189.293161,155.531291 189.293161,155.531291 L184.148135,155.531291 C182.969067,155.531291 182.004375,156.491061 182.004375,157.664114 L182.004375,161.823118 C182.004375,161.823118 181.789999,165.022352 184.362512,165.022352 C186.023926,165.022352 186.07752,162.836209 188.274874,162.836209 C189.346755,162.836209 190.418635,163.8493 190.418635,166.035443 C190.418635,168.274907 189.346755,169.394639 188.274874,169.394639 C186.131114,169.394639 186.023926,167.208496 184.362512,167.208496 C181.789999,167.208496 182.004375,170.301089 182.004375,170.301089 L182.004375,176.859518 C182.004375,178.032571 182.969067,178.992341 184.148135,178.992341 L191.115357,178.992341 C191.115357,178.992341 194.49178,179.205623 194.49178,176.646236 C194.49178,174.993299 192.348019,174.726696 192.348019,172.540552 C192.348019,171.474141 193.527088,170.141127 195.778036,170.141127 C198.028985,170.141127 199.315241,171.474141 199.315241,172.540552 C199.315241,174.673375 197.225074,174.993299 197.225074,176.646236 C197.225074,179.258944 200.601497,178.992341 200.601497,178.992341 L203.44198,178.992341 C204.621048,178.992341 205.58574,178.032571 205.58574,176.859518 Z" id="Shape-Copy-23" transform="translate(198.000000, 163.000000) rotate(-42.000000) translate(-198.000000, -163.000000) "/> </g> </g> </svg>
+<!-- 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/. --><svg width="32px" height="33px" viewBox="0 0 32 33" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch --> <desc>Created with Sketch.</desc> <defs> <linearGradient x1="74.0423237%" y1="18.5882821%" x2="0%" y2="100%" id="linearGradient-1"> <stop stop-color="#00FEFF" offset="0%"/> <stop stop-color="#3D85FF" offset="100%"/> </linearGradient> </defs> <g id="Specs" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="Header-Copy" transform="translate(-182.000000, -152.000000)" fill="url(#linearGradient-1)"> <path d="M205.58574,176.859518 L205.58574,169.287998 C205.58574,169.287998 205.800116,167.315137 207.086372,167.315137 C208.372629,167.315137 208.265441,169.394639 210.677171,169.394639 C211.909834,169.394639 214,168.754792 214,165.022352 C214,161.289912 211.909834,160.810027 210.677171,160.810027 C208.265441,160.810027 208.372629,162.782888 207.086372,162.782888 C205.800116,162.782888 205.58574,160.756707 205.58574,160.756707 L205.58574,157.664114 C205.58574,156.491061 204.621048,155.531291 203.44198,155.531291 L197.814608,155.531291 C197.814608,155.531291 195.992412,155.211368 195.992412,153.931674 C195.992412,152.65198 198.028985,152.545339 198.028985,150.145914 C198.028985,148.91954 197.332262,147 193.580682,147 C189.829101,147 189.293161,148.91954 189.293161,150.145914 C189.293161,152.545339 191.115357,152.65198 191.115357,153.931674 C191.115357,155.211368 189.293161,155.531291 189.293161,155.531291 L184.148135,155.531291 C182.969067,155.531291 182.004375,156.491061 182.004375,157.664114 L182.004375,161.823118 C182.004375,161.823118 181.789999,165.022352 184.362512,165.022352 C186.023926,165.022352 186.07752,162.836209 188.274874,162.836209 C189.346755,162.836209 190.418635,163.8493 190.418635,166.035443 C190.418635,168.274907 189.346755,169.394639 188.274874,169.394639 C186.131114,169.394639 186.023926,167.208496 184.362512,167.208496 C181.789999,167.208496 182.004375,170.301089 182.004375,170.301089 L182.004375,176.859518 C182.004375,178.032571 182.969067,178.992341 184.148135,178.992341 L191.115357,178.992341 C191.115357,178.992341 194.49178,179.205623 194.49178,176.646236 C194.49178,174.993299 192.348019,174.726696 192.348019,172.540552 C192.348019,171.474141 193.527088,170.141127 195.778036,170.141127 C198.028985,170.141127 199.315241,171.474141 199.315241,172.540552 C199.315241,174.673375 197.225074,174.993299 197.225074,176.646236 C197.225074,179.258944 200.601497,178.992341 200.601497,178.992341 L203.44198,178.992341 C204.621048,178.992341 205.58574,178.032571 205.58574,176.859518 Z" id="Shape-Copy-23" transform="translate(198.000000, 163.000000) rotate(-42.000000) translate(-198.000000, -163.000000) "/> </g> </g> </svg>

src/img/arrow-icon-left-light.svg

@@ -0,0 +1,3 @@
+<!-- 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/. --><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"><path fill="#ffffff" d="M6.414 8l4.293-4.293a1 1 0 0 0-1.414-1.414l-5 5a1 1 0 0 0 0 1.414l5 5a1 1 0 0 0 1.414-1.414z"></path></svg>

src/img/arrow-icon-left.svg

@@ -0,0 +1,3 @@
+<!-- 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/. --><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"><path fill="context-fill" d="M6.414 8l4.293-4.293a1 1 0 0 0-1.414-1.414l-5 5a1 1 0 0 0 0 1.414l5 5a1 1 0 0 0 1.414-1.414z"></path></svg>

src/img/arrow-icon-right-light.svg

@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- 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/. -->
+<svg width="5px" height="8px" viewBox="0 0 5 8" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 53.2 (72643) - https://sketchapp.com -->
+    <title>Arrow</title>
+    <desc>Created with Sketch.</desc>
+    <defs>
+        <path d="M5.00090934,9.5006316 C4.79840046,9.50099392 4.61567086,9.37916873 4.53812503,9.19209489 C4.4605792,9.00502105 4.5035325,8.78964579 4.64690934,8.6466316 L7.29490934,6.0006316 L4.64690934,3.3546316 C4.45140054,3.1591228 4.45140054,2.8421404 4.64690934,2.6466316 C4.84241814,2.4511228 5.15940054,2.4511228 5.35490934,2.6466316 L8.35490934,5.6466316 C8.44895104,5.74043586 8.50180313,5.86780434 8.50180313,6.0006316 C8.50180313,6.13345886 8.44895104,6.26082734 8.35490934,6.3546316 L5.35490934,9.3546316 C5.26095861,9.44834555 5.13360821,9.5008686 5.00090934,9.5006316 Z" id="path-1"></path>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" opacity="0.6">
+        <g id="Icons-/-12-/-Arrowhead-Right-12---Thin" transform="translate(-4.000000, -2.000000)">
+            <rect id="bouding-box" x="0" y="0" width="12" height="12"></rect>
+            <mask id="mask-2" fill="white">
+                <use xlink:href="#path-1"></use>
+            </mask>
+            <g id="Shape" fill-rule="nonzero"></g>
+            <g id="Color-/-Photon-/-Primary---Grey-90-80%" mask="url(#mask-2)" fill="#ffffff" fill-opacity="0.8" fill-rule="evenodd">
+                <rect id="Rectangle" x="0" y="0" width="12" height="12"></rect>
+            </g>
+        </g>
+    </g>
+</svg>

src/img/arrow-icon-right.svg

@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- 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/. -->
+<svg width="5px" height="8px" viewBox="0 0 5 8" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 53.2 (72643) - https://sketchapp.com -->
+    <title>Arrow</title>
+    <desc>Created with Sketch.</desc>
+    <defs>
+        <path d="M5.00090934,9.5006316 C4.79840046,9.50099392 4.61567086,9.37916873 4.53812503,9.19209489 C4.4605792,9.00502105 4.5035325,8.78964579 4.64690934,8.6466316 L7.29490934,6.0006316 L4.64690934,3.3546316 C4.45140054,3.1591228 4.45140054,2.8421404 4.64690934,2.6466316 C4.84241814,2.4511228 5.15940054,2.4511228 5.35490934,2.6466316 L8.35490934,5.6466316 C8.44895104,5.74043586 8.50180313,5.86780434 8.50180313,6.0006316 C8.50180313,6.13345886 8.44895104,6.26082734 8.35490934,6.3546316 L5.35490934,9.3546316 C5.26095861,9.44834555 5.13360821,9.5008686 5.00090934,9.5006316 Z" id="path-1"></path>
+    </defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" opacity="0.6">
+        <g id="Icons-/-12-/-Arrowhead-Right-12---Thin" transform="translate(-4.000000, -2.000000)">
+            <rect id="bouding-box" x="0" y="0" width="12" height="12"></rect>
+            <mask id="mask-2" fill="white">
+                <use xlink:href="#path-1"></use>
+            </mask>
+            <g id="Shape" fill-rule="nonzero"></g>
+            <g id="Color-/-Photon-/-Primary---Grey-90-80%" mask="url(#mask-2)" fill="#000000" fill-rule="evenodd">
+                <rect id="Rectangle" x="0" y="0" width="12" height="12"></rect>
+            </g>
+        </g>
+    </g>
+</svg>

src/img/arrow-toggle.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8.71054 11.1175L11.3005 13.7075C11.6905 14.0975 12.3205 14.0975 12.7105 13.7075L15.3005 11.1175C15.9305 10.4875 15.4805 9.4075 14.5905 9.4075H9.41054C8.52054 9.4075 8.08054 10.4875 8.71054 11.1175Z" fill="#6D6D6E"/>
+</svg>

src/img/blank-tab.svg

@@ -1,3 +1,5 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18">
+<!-- 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/. --><svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18">
   <path d="M17,12v2a1,1,0,0,1-1,1H2a1,1,0,0,1-1-1V12a1,1,0,0,1,1-1H1.142c2.3,0,2.536-1.773,2.874-4,0.351-2.316.083-4,3.13-4h3.707C13.917,3,13.647,4.684,14,7c0.34,2.228.582,4,2.89,4H16A1,1,0,0,1,17,12Z" fill="white"/>
 </svg>

src/img/close-light.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M13.2225 11.9895L17.7594 7.45261C17.9155 7.29095 18.0019 7.07443 18 6.84969C17.998 6.62495 17.9079 6.40997 17.7489 6.25105C17.59 6.09213 17.375 6.00199 17.1503 6.00003C16.9256 5.99808 16.709 6.08447 16.5474 6.24061L12.0105 10.7775L7.47368 6.24061C7.31202 6.08447 7.0955 5.99808 6.87076 6.00003C6.64602 6.00199 6.43104 6.09213 6.27212 6.25105C6.1132 6.40997 6.02305 6.62495 6.0211 6.84969C6.01914 7.07443 6.10554 7.29095 6.26168 7.45261L10.7985 11.9895L6.26168 16.5263C6.17981 16.6054 6.11451 16.7 6.06959 16.8045C6.02467 16.9091 6.00102 17.0216 6.00003 17.1354C5.99904 17.2492 6.02073 17.3621 6.06383 17.4674C6.10693 17.5728 6.17057 17.6685 6.25105 17.7489C6.33153 17.8294 6.42723 17.8931 6.53257 17.9362C6.63791 17.9793 6.75078 18.001 6.86459 18C6.9784 17.999 7.09088 17.9753 7.19545 17.9304C7.30003 17.8855 7.39461 17.8202 7.47368 17.7383L12.0105 13.2015L16.5474 17.7383C16.709 17.8945 16.9256 17.9809 17.1503 17.9789C17.375 17.9769 17.59 17.8868 17.7489 17.7279C17.9079 17.569 17.998 17.354 18 17.1292C18.0019 16.9045 17.9155 16.688 17.7594 16.5263L13.2225 11.9895Z" fill="#ffffff"/>
+</svg>

src/img/close.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M13.2225 11.9895L17.7594 7.45261C17.9155 7.29095 18.0019 7.07443 18 6.84969C17.998 6.62495 17.9079 6.40997 17.7489 6.25105C17.59 6.09213 17.375 6.00199 17.1503 6.00003C16.9256 5.99808 16.709 6.08447 16.5474 6.24061L12.0105 10.7775L7.47368 6.24061C7.31202 6.08447 7.0955 5.99808 6.87076 6.00003C6.64602 6.00199 6.43104 6.09213 6.27212 6.25105C6.1132 6.40997 6.02305 6.62495 6.0211 6.84969C6.01914 7.07443 6.10554 7.29095 6.26168 7.45261L10.7985 11.9895L6.26168 16.5263C6.17981 16.6054 6.11451 16.7 6.06959 16.8045C6.02467 16.9091 6.00102 17.0216 6.00003 17.1354C5.99904 17.2492 6.02073 17.3621 6.06383 17.4674C6.10693 17.5728 6.17057 17.6685 6.25105 17.7489C6.33153 17.8294 6.42723 17.8931 6.53257 17.9362C6.63791 17.9793 6.75078 18.001 6.86459 18C6.9784 17.999 7.09088 17.9753 7.19545 17.9304C7.30003 17.8855 7.39461 17.8202 7.47368 17.7383L12.0105 13.2015L16.5474 17.7383C16.709 17.8945 16.9256 17.9809 17.1503 17.9789C17.375 17.9769 17.59 17.8868 17.7489 17.7279C17.9079 17.569 17.998 17.354 18 17.1292C18.0019 16.9045 17.9155 16.688 17.7594 16.5263L13.2225 11.9895Z" fill="black"/>
+</svg>

src/img/container-add.svg

@@ -1,13 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 20.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 viewBox="0 0 11 11" style="enable-background:new 0 0 11 11;" xml:space="preserve">
-<style type="text/css">
-	.st0{fill:#858585;}
-</style>
-<title>firefox</title>
-<g id="General-icons">
-	<polygon class="st0" points="10.8,4.4 6.4,4.4 6.4,0.2 4.6,0.2 4.6,4.4 0.2,4.4 0.2,6.4 4.6,6.4 4.6,10.8 6.4,10.8 6.4,6.4 
-		10.8,6.4 	"/>
-</g>
-</svg>

src/img/container-arrow.svg

@@ -1,9 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 20.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 viewBox="0 0 6 8" style="enable-background:new 0 0 6 8;" xml:space="preserve">
-<style type="text/css">
-	.st0{fill:#4C4C4C;}
-</style>
-<polygon id="Arrow---Disclosure---Collapsed-Copy" class="st0" points="5.5,4 1.5,7.7 0.5,6.8 3.5,4 0.5,1.2 1.5,0.3 "/>
-</svg>

src/img/container-close-tab.svg

@@ -1,3 +1,5 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 7 7">
-	<polygon fill="#4c4c4c" points="5.8,0 3.5,2.4 1.2,0 0,1.2 2.4,3.5 0.1,5.8 1.2,7 3.5,4.7 5.8,7 7,5.8 4.7,3.5 7,1.2"/>
+<!-- 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/. --><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 7 7">
+	<polygon fill="#FFFFFF" points="5.8,0 3.5,2.4 1.2,0 0,1.2 2.4,3.5 0.1,5.8 1.2,7 3.5,4.7 5.8,7 7,5.8 4.7,3.5 7,1.2"/>
 </svg>

src/img/container-delete.svg

@@ -1,10 +1,7 @@
 <?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 20.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 viewBox="0 0 12 12" style="enable-background:new 0 0 12 12;" xml:space="preserve">
-<style type="text/css">
-	.st0{fill:#858585;}
-</style>
-<path class="st0" d="M4.6,0.3h2.7c0.1,0,0.2,0.1,0.2,0.2v1H4.4v-1C4.4,0.4,4.5,0.3,4.6,0.3z M1.7,1.5h8.6c0.1,0,0.2,0.1,0.2,0.2
+<!-- 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/. -->
+<!-- Generator: Adobe Illustrator 20.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 12 12" style="enable-background:new 0 0 12 12;" xml:space="preserve">
+	<path fill="#FFFFFF" d="M4.6,0.3h2.7c0.1,0,0.2,0.1,0.2,0.2v1H4.4v-1C4.4,0.4,4.5,0.3,4.6,0.3z M1.7,1.5h8.6c0.1,0,0.2,0.1,0.2,0.2
 	l0.2,1.4H1.3l0.2-1.4C1.5,1.6,1.6,1.5,1.7,1.5z M6,11.7H3.2L2.1,3.9H6h3.9l-1.1,7.8H6L6,11.7z"/>
 </svg>

src/img/container-edit.svg

@@ -1,12 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 20.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 viewBox="0 0 12 12" style="enable-background:new 0 0 12 12;" xml:space="preserve">
-<style type="text/css">
-	.st0{fill:#858585;}
-</style>
-<g>
-	<path class="st0" d="M11.4,2.6L9.6,0.9c-0.1-0.1-0.2-0.1-0.3,0l-7,7l2,2l7-7C11.4,2.8,11.4,2.7,11.4,2.6z"/>
-	<path class="st0" d="M0.8,10.9c-0.1,0.3,0,0.4,0.4,0.4l2.3-0.6l-2-2L0.8,10.9z"/>
-</g>
-</svg>

src/img/container-hide.svg

@@ -1,19 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 20.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 viewBox="0 0 12 12" style="enable-background:new 0 0 12 12;" xml:space="preserve">
-<style type="text/css">
-	.st0{fill:#858585;}
-</style>
-<polygon class="st0" points="10.3,0.5 8.9,2 2,8.9 0.5,10.3 1.3,11.1 11.1,1.3 "/>
-<g>
-	<path class="st0" d="M4.8,7.5l2.8-2.8C7.2,4.3,6.7,4,6.1,4c-1.1,0-2,0.9-2,2C4.1,6.6,4.4,7.1,4.8,7.5z"/>
-	<path class="st0" d="M5.9,7.9c0,0,0.1,0,0.2,0c1.1,0,2-0.9,2-2c0,0,0-0.1,0-0.2L5.9,7.9z"/>
-</g>
-<g>
-	<path class="st0" d="M4.1,8.2C2.6,7.4,1.3,6.1,1.2,6C1.3,5.8,3.8,3.1,6,3.1c0.8,0,1.6,0.4,2.4,0.8L9,3.3C8.1,2.7,7,2.2,6,2.2
-		c-2.6,0-5.4,2.9-5.5,3.1C0.3,5.6,0.2,5.7,0.2,6v0c0,0.2,0.1,0.4,0.2,0.6c0.1,0.1,1.3,1.4,2.9,2.3L4.1,8.2z"/>
-	<path class="st0" d="M9.9,3.9L9.2,4.5c0.9,0.7,1.5,1.3,1.6,1.4C10.6,6.2,8.1,8.8,6,8.8c-0.3,0-0.6,0-0.9-0.1L4.4,9.4
-		C4.9,9.6,5.5,9.7,6,9.7c2.6,0,5.4-2.9,5.5-3.1c0.2-0.2,0.2-0.4,0.2-0.6v0c0-0.2,0-0.4-0.2-0.6C11.4,5.3,10.8,4.6,9.9,3.9z"/>
-</g>
-</svg>

src/img/container-move.svg

@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="30px" height="30px" viewBox="0 0 30 30" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><script xmlns=""/>
+    <defs/>
+    <g id="All" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="hamburger-menu" fill="#858585">
+            <g id="Group" transform="translate(2.000000, 6.000000)">
+                <rect id="Rectangle-path" x="0" y="0" width="26" height="2"/>
+                <rect id="Rectangle-path" x="0" y="8" width="26" height="2"/>
+                <rect id="Rectangle-path" x="0" y="16" width="26" height="2"/>
+            </g>
+        </g>
+    </g>
+</svg>

src/img/container-newtab.svg

@@ -1,4 +1,7 @@
 <?xml version="1.0" encoding="utf-8"?>
+<!-- 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/. -->
 <!-- Generator: Adobe Illustrator 20.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
 <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 	 viewBox="0 0 20 20" style="enable-background:new 0 0 20 20;" xml:space="preserve">

src/img/container-openin-16.svg

@@ -0,0 +1,9 @@
+<!-- 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/. -->
+<svg data-name="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+  <rect x="1" y="1" width="6" height="6" rx="1"/>
+  <rect x="1" y="9" width="6" height="6" rx="1"/>
+  <rect x="9" y="9" width="6" height="6" rx="1"/>
+  <path fill="context-fill" fill-opacity="context-fill-opacity" d="M14.92 1.62a1 1 0 0 0-0.54-0.54A1 1 0 0 0 14 1h-4a1 1 0 0 0 0 2h1.59l-2.3 2.29a1 1 0 0 0 0 1.42 1 1 0 0 0 1.42 0L13 4.41V6a1 1 0 0 0 2 0V2a1 1 0 0 0-0.08-0.38z"/>
+</svg>

src/img/container-site-light.svg

@@ -1 +0,0 @@
-<svg height="16" viewBox="0 0 16 16" width="16" xmlns="http://www.w3.org/2000/svg"><g fill="rgba(249, 249, 250, 0.8)" fill-rule="evenodd"><rect height="6" rx="1" width="6" x="1" y="1"/><path d="m11 1h2v6h-2z" transform="matrix(0 1 -1 0 16 -8)"/><path d="m11 1h2v6h-2z"/><rect height="6" rx="1" width="6" x="1" y="9"/><rect height="6" rx="1" width="6" x="9" y="9"/></g></svg>

src/img/container-site.svg

@@ -1 +0,0 @@
-<svg height="16" viewBox="0 0 16 16" width="16" xmlns="http://www.w3.org/2000/svg"><g fill="rgba(12, 12, 13, 0.8)" fill-rule="evenodd"><rect height="6" rx="1" width="6" x="1" y="1"/><path d="m11 1h2v6h-2z" transform="matrix(0 1 -1 0 16 -8)"/><path d="m11 1h2v6h-2z"/><rect height="6" rx="1" width="6" x="1" y="9"/><rect height="6" rx="1" width="6" x="9" y="9"/></g></svg>

src/img/container-sort.svg

@@ -1,17 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 20.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 viewBox="0 0 18 18" style="enable-background:new 0 0 18 18;" xml:space="preserve">
-<style type="text/css">
-	.st0{fill:#858585;}
-	.st1{fill-rule:evenodd;clip-rule:evenodd;fill:#858585;}
-</style>
-<path class="st0" d="M11.9,7.9c-1.2,0-1.5-0.8-1.8-2.4C10,4.4,9.8,2.5,8,2.5H4.6c-1.8,0-2,1.9-2.1,2.9C2.2,7.1,1.9,7.9,0.7,7.9v1.9
-	h11.2h5.4V7.9H11.9z"/>
-<path class="st0" d="M16,5.7c-0.1-1-0.3-2.9-2.1-2.9c0,0-3.8,0-3.9,0c-0.1,0-0.1,0.2-0.1,0.2c1.1,0.5,1.3,1.9,1.4,2.7
-	c0.1,1.1,0.3,1.5,0.8,1.5c0.1,0,4.1,0,4.1,0s0.1,0,0.1-0.1C16.2,6.6,16.1,6.2,16,5.7z"/>
-<path class="st1" d="M8,12.1H3.7v-1.2c0-0.3-0.2-0.4-0.5-0.2l-2.2,1.9c-0.3,0.2-0.3,0.6,0,0.9l2.2,1.9c0.3,0.2,0.5,0.2,0.5-0.2v-1.2
-	H8V12.1z"/>
-<path class="st1" d="M17.1,12.6l-2.2-1.9c-0.3-0.2-0.5-0.2-0.5,0.2v1.2H10v1.9h4.3v1.2c0,0.3,0.2,0.4,0.5,0.2l2.2-1.9
-	C17.4,13.2,17.4,12.8,17.1,12.6z"/>
-</svg>

src/img/container-unhide.svg

@@ -1,12 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 20.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 viewBox="0 0 12 12" style="enable-background:new 0 0 12 12;" xml:space="preserve">
-<style type="text/css">
-	.st0{fill:#858585;}
-</style>
-<circle class="st0" cx="6" cy="6" r="2"/>
-<path class="st0" d="M11.5,5.4C11.4,5.2,8.6,2.3,6,2.3s-5.4,3-5.5,3.1C0.3,5.6,0.2,5.8,0.2,6v0c0,0.2,0.1,0.4,0.2,0.6
-	C0.6,6.8,3.4,9.8,6,9.8s5.4-3,5.5-3.1c0.2-0.2,0.2-0.4,0.2-0.6v0C11.7,5.8,11.7,5.6,11.5,5.4z M10.8,6C10.6,6.2,8.1,8.9,6,8.9
-	S1.3,6.2,1.1,6l0,0C1.3,5.8,3.8,3.1,6,3.1S10.6,5.8,10.8,6L10.8,6z"/>
-</svg>