From 9c80781e3f08d4733eb6e431952939c7c08a7977 Mon Sep 17 00:00:00 2001 From: Jake Wharton Date: Wed, 27 May 2020 14:36:18 -0400 Subject: [PATCH 1/9] Remove automatic capitalization of container name The name is not capitalized in the address bar or the list of names in the extension popup. --- src/css/confirm-page.css | 1 - 1 file changed, 1 deletion(-) diff --git a/src/css/confirm-page.css b/src/css/confirm-page.css index 113ffef..b954443 100644 --- a/src/css/confirm-page.css +++ b/src/css/confirm-page.css @@ -18,7 +18,6 @@ main { button .container-name, #current-container-name { font-weight: bold; - text-transform: capitalize; } @media only screen and (max-width: 1300px) { From c03df9d246dc69aa955e40d76e769e16c563b8cb Mon Sep 17 00:00:00 2001 From: Danny Colin Date: Fri, 8 Jan 2021 13:11:02 -0500 Subject: [PATCH 2/9] add a dark theme --- src/css/popup.css | 71 +++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 71 insertions(+) diff --git a/src/css/popup.css b/src/css/popup.css index 543936e..017ffe4 100644 --- a/src/css/popup.css +++ b/src/css/popup.css @@ -64,6 +64,7 @@ body { --icon-fit: 8; } + @media (min-resolution: 1dppx) { html { font-size: 14px; @@ -931,3 +932,73 @@ tr > td > .trash-button { tr:hover > td > .trash-button { display: block; } + +@media (prefers-color-scheme: dark) { + :root { + --title-text-color: #fff; + --text-normal-color: #f9f9fa; + --text-heading-color: #fff; + } + html { + background-color: #4a4a4a; + } + body { + color: #fff; + + --hr-grey: #38383d; + --text-grey: #f9f9fa; + } + h3.title { + color: #fff; + } + .bottom-btn { + background-color: #737373; + border: solid 1px #737373; + } + .btn-return.arrow-left { + background-color: transparent; + } + .onboarding-title, + .delete-container-confirm-title { + color: #ededf0; + } + input { + border: solid 1px #737373; + } + #edit-container-panel-name-input { + background-color: #38383d; + color: #fff; + } + .delete-container { + background-color: #4a4a4a; + } + .delete-btn { + background-color: #737373; + color: #f9f9fa; + } + .cancel-button, + .grey-button { + background-color: #737373; + color: #fff; + } + .button.secondary:hover, + .button.secondary:focus { + background-color: #676767; + } + .panel-footer { + border-block-end: solid 1px #4a4a4a; + } + img.menu-icon, + .menu-icon > img, + .menu-arrow > img, + .info-icon > img, + .btn-return.arrow-left { + filter: invert(1); + } + [data-identity-color="grey"] { + --identity-icon-color: #ededf0; + } + [type="radio"]:checked + [data-identity-color="grey"] { + --identity-icon-color: #616161; + } +} From d7688cb1f53a8e1bd14dcce811d2d1a4a2644e28 Mon Sep 17 00:00:00 2001 From: Danny Colin Date: Fri, 8 Jan 2021 13:19:18 -0500 Subject: [PATCH 3/9] fix stylelint errors --- src/css/popup.css | 25 ++++++++++++++++++++----- 1 file changed, 20 insertions(+), 5 deletions(-) diff --git a/src/css/popup.css b/src/css/popup.css index 017ffe4..c76b3ad 100644 --- a/src/css/popup.css +++ b/src/css/popup.css @@ -64,7 +64,6 @@ body { --icon-fit: 8; } - @media (min-resolution: 1dppx) { html { font-size: 14px; @@ -939,55 +938,69 @@ tr:hover > td > .trash-button { --text-normal-color: #f9f9fa; --text-heading-color: #fff; } + html { background-color: #4a4a4a; } + body { color: #fff; --hr-grey: #38383d; --text-grey: #f9f9fa; } + h3.title { color: #fff; } + .bottom-btn { background-color: #737373; border: solid 1px #737373; } + .btn-return.arrow-left { background-color: transparent; } + .onboarding-title, .delete-container-confirm-title { color: #ededf0; } + input { border: solid 1px #737373; } + #edit-container-panel-name-input { background-color: #38383d; color: #fff; } + .delete-container { - background-color: #4a4a4a; + background-color: #4a4a4a; } + .delete-btn { background-color: #737373; color: #f9f9fa; } + .cancel-button, .grey-button { background-color: #737373; color: #fff; } + .button.secondary:hover, .button.secondary:focus { - background-color: #676767; + background-color: #676767; } + .panel-footer { border-block-end: solid 1px #4a4a4a; } + img.menu-icon, .menu-icon > img, .menu-arrow > img, @@ -995,10 +1008,12 @@ tr:hover > td > .trash-button { .btn-return.arrow-left { filter: invert(1); } + [data-identity-color="grey"] { - --identity-icon-color: #ededf0; + --identity-icon-color: #ededf0; } + [type="radio"]:checked + [data-identity-color="grey"] { - --identity-icon-color: #616161; + --identity-icon-color: #616161; } } From 6b73cee79efa10c590e9bb35c5aff9a0a2622b66 Mon Sep 17 00:00:00 2001 From: Danny Colin Date: Sun, 10 Jan 2021 18:59:16 -0500 Subject: [PATCH 4/9] fix gradient colors in open tabs list --- src/css/popup.css | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/src/css/popup.css b/src/css/popup.css index c76b3ad..ec00a8c 100644 --- a/src/css/popup.css +++ b/src/css/popup.css @@ -1009,6 +1009,16 @@ tr:hover > td > .trash-button { filter: invert(1); } + #edit-sites-assigned .menu-icon, + #container-info-table .menu-icon { + filter: invert(0); + } + + .truncate-text::after { + background: #4a4a4a; + mask-image: linear-gradient(to right, transparent, #4a4a4a 70%); + } + [data-identity-color="grey"] { --identity-icon-color: #ededf0; } From 0c04b83207e481b836593a444d50b787ae0d7a9d Mon Sep 17 00:00:00 2001 From: Danny Colin Date: Sun, 10 Jan 2021 19:02:28 -0500 Subject: [PATCH 5/9] fix css indentations --- src/css/popup.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/css/popup.css b/src/css/popup.css index ec00a8c..cdfef70 100644 --- a/src/css/popup.css +++ b/src/css/popup.css @@ -1015,8 +1015,8 @@ tr:hover > td > .trash-button { } .truncate-text::after { - background: #4a4a4a; - mask-image: linear-gradient(to right, transparent, #4a4a4a 70%); + background: #4a4a4a; + mask-image: linear-gradient(to right, transparent, #4a4a4a 70%); } [data-identity-color="grey"] { From c371cd11d07123264ad20b57be7bd3dca6018d1a Mon Sep 17 00:00:00 2001 From: luke crouch Date: Mon, 11 Jan 2021 09:33:08 -0600 Subject: [PATCH 6/9] update web-ext to 5.4.1 --- package.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 47aaeb6..1e8d70e 100644 --- a/package.json +++ b/package.json @@ -22,10 +22,10 @@ "nyc": "^15.0.0", "sinon": "^7.5.0", "sinon-chai": "^3.3.0", - "stylelint-order": "^4.0.0", "stylelint": "^13.5.0", "stylelint-config-standard": "^20.0.0", - "web-ext": "^2.9.3", + "stylelint-order": "^4.0.0", + "web-ext": "^5.4.1", "webextensions-jsdom": "^1.2.1" }, "homepage": "https://github.com/mozilla/multi-account-containers#readme", From c2ff3f00f27e1dae48d7aca895c3d310538dcf7f Mon Sep 17 00:00:00 2001 From: Maxx Crawford Date: Mon, 11 Jan 2021 10:16:53 -0600 Subject: [PATCH 7/9] Fix #1946 - Update package.json/manifest to 7.2.0 --- package.json | 2 +- src/manifest.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 1e8d70e..c30bec7 100644 --- a/package.json +++ b/package.json @@ -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": "7.1.0", + "version": "7.2.0", "author": "Andrea Marchesini, Luke Crouch and Jonathan Kingston", "bugs": { "url": "https://github.com/mozilla/multi-account-containers/issues" diff --git a/src/manifest.json b/src/manifest.json index eb0f641..c40dbc4 100644 --- a/src/manifest.json +++ b/src/manifest.json @@ -1,7 +1,7 @@ { "manifest_version": 2, "name": "Firefox Multi-Account Containers", - "version": "7.1.0", + "version": "7.2.0", "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": { From 89719f72433539d4a501ec72072894409a95ddc6 Mon Sep 17 00:00:00 2001 From: Sergey Zolotarev Date: Thu, 21 Jan 2021 23:59:31 +0600 Subject: [PATCH 8/9] Implement container reordering --- src/css/popup.css | 20 +++++++++++ src/img/container-move.svg | 13 +++++++ src/js/popup.js | 73 +++++++++++++++++++++++++++++++++++--- 3 files changed, 102 insertions(+), 4 deletions(-) create mode 100644 src/img/container-move.svg diff --git a/src/css/popup.css b/src/css/popup.css index cdfef70..4dfb8dc 100644 --- a/src/css/popup.css +++ b/src/css/popup.css @@ -691,6 +691,10 @@ h3.title { max-inline-size: 300px; } +.menu-item.drag-over td { + border-block-start: 2px solid var(--text-normal-color); +} + .disabled-menu-item { color: grey; cursor: default; @@ -932,6 +936,22 @@ tr:hover > td > .trash-button { display: block; } +.move-button { + cursor: move; + display: inline-block; + height: 100%; + inline-size: 16px; + margin-block-end: 4px; + margin-block-start: 4px; + margin-inline-end: 10px; + margin-inline-start: auto; + text-align: center; +} + +.move-button > img { + height: 16px; +} + @media (prefers-color-scheme: dark) { :root { --title-text-color: #fff; diff --git a/src/img/container-move.svg b/src/img/container-move.svg new file mode 100644 index 0000000..ee4fd70 --- /dev/null +++ b/src/img/container-move.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/js/popup.js b/src/js/popup.js index 259d7c9..22a4b4c 100644 --- a/src/js/popup.js +++ b/src/js/popup.js @@ -10,6 +10,8 @@ const DEFAULT_ICON = "circle"; const NEW_CONTAINER_ID = "new"; const ONBOARDING_STORAGE_KEY = "onboarding-stage"; +const CONTAINER_ORDER_STORAGE_KEY = "container-order"; +const CONTAINER_DRAG_DATA_TYPE = "firefox-container"; // List of panels const P_ONBOARDING_1 = "onboarding1"; @@ -192,16 +194,29 @@ const Logic = { elementToEnable.classList.remove("disabled-menu-item"); }, + async saveContainerOrder(rows) { + const containerOrder = {}; + rows.forEach((node, index) => { + return containerOrder[node.dataset.containerId] = index; + }); + await browser.storage.local.set({ + [CONTAINER_ORDER_STORAGE_KEY]: containerOrder + }); + }, + async refreshIdentities() { - const [identities, state] = await Promise.all([ + const [identities, state, containerOrderStorage] = await Promise.all([ browser.contextualIdentities.query({}), browser.runtime.sendMessage({ method: "queryIdentitiesState", message: { windowId: browser.windows.WINDOW_ID_CURRENT } - }) + }), + browser.storage.local.get([CONTAINER_ORDER_STORAGE_KEY]) ]); + const containerOrder = + containerOrderStorage && containerOrderStorage[CONTAINER_ORDER_STORAGE_KEY]; this._identities = identities.map((identity) => { const stateObject = state[identity.cookieStoreId]; if (stateObject) { @@ -211,8 +226,11 @@ const Logic = { identity.numberOfOpenTabs = stateObject.numberOfOpenTabs; identity.isIsolated = stateObject.isIsolated; } + if (containerOrder) { + identity.order = containerOrder[identity.cookieStoreId]; + } return identity; - }); + }).sort((i1, i2) => i1.order - i2.order); }, getPanelSelector(panel) { @@ -1006,12 +1024,59 @@ Logic.registerPanel(MANAGE_CONTAINERS_PICKER, { data-identity-color="${identity.color}"> - ${identity.name}`; + ${identity.name} + + + `; fragment.appendChild(tr); tr.appendChild(td); + tr.draggable = true; + tr.dataset.containerId = identity.cookieStoreId; + tr.addEventListener("dragstart", (e) => { + e.dataTransfer.setData(CONTAINER_DRAG_DATA_TYPE, identity.cookieStoreId); + }); + tr.addEventListener("dragover", (e) => { + if (e.dataTransfer.types.includes(CONTAINER_DRAG_DATA_TYPE)) { + tr.classList.add("drag-over"); + e.preventDefault(); + } + }); + tr.addEventListener("dragenter", (e) => { + if (e.dataTransfer.types.includes(CONTAINER_DRAG_DATA_TYPE)) { + e.preventDefault(); + tr.classList.add("drag-over"); + } + }); + tr.addEventListener("dragleave", (e) => { + if (e.dataTransfer.types.includes(CONTAINER_DRAG_DATA_TYPE)) { + e.preventDefault(); + tr.classList.remove("drag-over"); + } + }); + tr.addEventListener("drop", async (e) => { + e.preventDefault(); + const parent = tr.parentNode; + const containerId = e.dataTransfer.getData(CONTAINER_DRAG_DATA_TYPE); + let droppedElement; + parent.childNodes.forEach((node) => { + if (node.dataset.containerId === containerId) { + droppedElement = node; + } + }); + if (droppedElement && droppedElement !== tr) { + tr.classList.remove("drag-over"); + parent.insertBefore(droppedElement, tr); + await Logic.saveContainerOrder(parent.childNodes); + await Logic.refreshIdentities(); + } + }); + Utils.addEnterHandler(tr, () => { pickedFunction(identity); }); From 7ebed4521d9b66119adebb132f344ec1d4dbb61e Mon Sep 17 00:00:00 2001 From: Maxx Crawford Date: Fri, 22 Jan 2021 09:30:17 -0600 Subject: [PATCH 9/9] Bump version from 7.2.0 to 7.3.0 --- package.json | 2 +- src/manifest.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index c30bec7..c5d4a91 100644 --- a/package.json +++ b/package.json @@ -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": "7.2.0", + "version": "7.3.0", "author": "Andrea Marchesini, Luke Crouch and Jonathan Kingston", "bugs": { "url": "https://github.com/mozilla/multi-account-containers/issues" diff --git a/src/manifest.json b/src/manifest.json index c40dbc4..7c8991b 100644 --- a/src/manifest.json +++ b/src/manifest.json @@ -1,7 +1,7 @@ { "manifest_version": 2, "name": "Firefox Multi-Account Containers", - "version": "7.2.0", + "version": "7.3.0", "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": {