diff --git a/.eslintrc.js b/.eslintrc.js index f52aeb7..1273c43 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -46,7 +46,7 @@ module.exports = { "error", { "escape": { - "taggedTemplates": ["escaped", "Utils.escaped"] + "taggedTemplates": ["Utils.escaped"] } } ], diff --git a/src/css/popup.css b/src/css/popup.css index 3176ec9..a6f6494 100644 --- a/src/css/popup.css +++ b/src/css/popup.css @@ -392,7 +392,7 @@ manage things like container crud */ background-image: var(--identity-icon); background-position: center center; background-repeat: no-repeat; - background-size: 16px 16px; + background-size: 16px; block-size: 100%; fill: var(--identity-icon-color); filter: url('/img/filters.svg#fill'); @@ -402,7 +402,7 @@ manage things like container crud */ background-image: url('/img/multiaccountcontainer-16.svg'); background-position: center center; background-repeat: no-repeat; - background-size: 16px 16px; + background-size: 16px; block-size: 100%; } @@ -647,6 +647,9 @@ body { font-size: 13px; inline-size: 320px; letter-spacing: -0.1px; + --highlight-blue: #1296f8; + --hr-grey: #e3e3e3; + --text-grey: #737373; } h3.title { @@ -679,7 +682,7 @@ h3.title { } .hover-highlight:hover { - background: #1296f8; + background: var(--highlight-blue); color: #fff; } @@ -739,7 +742,7 @@ h3.title { hr { border: 0; - border-block-start: 1px solid #e3e3e3; + border-block-start: 1px solid var(--hr-grey); display: block; margin-block-end: 0; margin-block-start: 6px; @@ -752,7 +755,7 @@ hr { } .sub-header { - color: #737373; + color: var(--text-grey); height: 24px; line-height: 24px; padding-block-end: 0; @@ -762,7 +765,7 @@ hr { } .edit-form { - color: #737373; + color: var(--text-grey); flex: 1; padding-block-end: 0; padding-block-start: 0; @@ -778,7 +781,7 @@ hr { } .bottom-btn { - background-color: #e3e3e3; + background-color: var(--hr-grey); border: solid 1px #d9d9d9; cursor: pointer; height: 41px; @@ -794,7 +797,7 @@ hr { .delete-container { background-color: #fff; - border-block-start: solid 1px #e3e3e3; + border-block-start: solid 1px var(--hr-grey); cursor: default; display: flex; height: 65px; @@ -843,7 +846,7 @@ input { padding-inline-start: 0; } -#edit-container-panel-name-input { +.edit-container-panel-name-input { height: 29px; } @@ -851,7 +854,7 @@ input { height: 23px; } -#site-isolation { +.site-isolation { inset-block-end: auto; position: fixed; } @@ -861,19 +864,14 @@ input { padding-inline-start: 25px; } -#manage-assigned-sites-list { - color: #5a9de6; +.manage-assigned-sites-list { + color: var(--highlight-blue); } -#info-icon { - border: solid 1px #000; - border-radius: 7px; - color: #000; +.info-icon { cursor: pointer; - font-size: 10px; - font-weight: bold; - height: 14px; - inline-size: 14px; + height: 16px; + inline-size: 16px; inset-block-start: 13px; position: absolute; right: 13px; @@ -906,9 +904,4 @@ tr > td > .trash-button { tr:hover > td > .trash-button { display: block; -} - -.new-container-icon { - font-size: 24px; - margin-block-start: -2px; -} +} \ No newline at end of file diff --git a/src/img/container-openin-16.svg b/src/img/container-openin-16.svg new file mode 100644 index 0000000..6786b5e --- /dev/null +++ b/src/img/container-openin-16.svg @@ -0,0 +1,9 @@ + + + + + + + diff --git a/src/img/info-thin-16.svg b/src/img/info-thin-16.svg new file mode 100644 index 0000000..c3edf49 --- /dev/null +++ b/src/img/info-thin-16.svg @@ -0,0 +1,13 @@ + + + + + + + + + diff --git a/src/img/new-16.svg b/src/img/new-16.svg new file mode 100644 index 0000000..b759168 --- /dev/null +++ b/src/img/new-16.svg @@ -0,0 +1,6 @@ + + + + diff --git a/src/img/open-in-new-16.svg b/src/img/open-in-new-16.svg deleted file mode 100644 index c6685c4..0000000 --- a/src/img/open-in-new-16.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - diff --git a/src/js/background/backgroundLogic.js b/src/js/background/backgroundLogic.js index f35ddac..cd649cb 100644 --- a/src/js/background/backgroundLogic.js +++ b/src/js/background/backgroundLogic.js @@ -1,4 +1,3 @@ -const NUMBER_OF_KEYBOARD_SHORTCUTS = 2; const DEFAULT_TAB = "about:newtab"; const backgroundLogic = { NEW_TAB_PAGES: new Set([ @@ -7,10 +6,11 @@ const backgroundLogic = { "about:home", "about:blank" ]), + NUMBER_OF_KEYBOARD_SHORTCUTS: 2, unhideQueue: [], init() { browser.commands.onCommand.addListener(function (command) { - for (let i=0; i < NUMBER_OF_KEYBOARD_SHORTCUTS; i++) { + for (let i=0; i < this.NUMBER_OF_KEYBOARD_SHORTCUTS; i++) { const key = "open_container_" + i; const cookieStoreId = identityState.keyboardShortcut[key]; if (command === key) { diff --git a/src/js/background/identityState.js b/src/js/background/identityState.js index afec9c5..8d8f275 100644 --- a/src/js/background/identityState.js +++ b/src/js/background/identityState.js @@ -1,5 +1,3 @@ -const NUM_OF_KEYBOARD_SHORTCUTS = 2; - window.identityState = { keyboardShortcut: {}, storageArea: { @@ -51,7 +49,7 @@ window.identityState = { }, async loadKeyboardShortcuts () { - for (let i=0; i < NUM_OF_KEYBOARD_SHORTCUTS; i++) { + for (let i=0; i < backgroundLogic.NUMBER_OF_KEYBOARD_SHORTCUTS; i++) { const key = "open_container_" + i; const storageObject = await this.area.get(key); identityState.keyboardShortcut[key] = storageObject[key]; diff --git a/src/js/pageAction.js b/src/js/pageAction.js index 129bc48..91445ce 100644 --- a/src/js/pageAction.js +++ b/src/js/pageAction.js @@ -16,10 +16,9 @@ async function init() { ${identity.name}`; - - fragment.appendChild(tr); - + tr.appendChild(td); + fragment.appendChild(tr); Utils.addEnterHandler(tr, async () => { Utils.alwaysOpenInContainer(identity); diff --git a/src/js/popup.js b/src/js/popup.js index 1998cb7..6972073 100644 --- a/src/js/popup.js +++ b/src/js/popup.js @@ -725,6 +725,17 @@ Logic.registerPanel(P_CONTAINER_INFO, { async prepare() { const identity = Logic.currentIdentity(); + const newTab = document.querySelector("#open-new-tab-in-info"); + Utils.addEnterHandler(newTab, () => { + try { + browser.tabs.create({ + cookieStoreId: identity.cookieStoreId + }); + window.close(); + } catch (e) { + window.close(); + } + }); // Populating the panel: name and icon document.getElementById("container-info-title").textContent = identity.name; @@ -922,7 +933,7 @@ Logic.registerPanel(MANAGE_CONTAINERS_PICKER, { diff --git a/src/manifest.json b/src/manifest.json index 79e43d5..c9513e2 100644 --- a/src/manifest.json +++ b/src/manifest.json @@ -41,16 +41,16 @@ "description": "Open containers panel" }, "open_container_0": { - "suggested_key": { - "default": "Ctrl+Shift+0" - }, - "description": "Container Shortcut 0" - }, - "open_container_1": { "suggested_key": { "default": "Ctrl+Shift+1" }, "description": "Container Shortcut 1" + }, + "open_container_1": { + "suggested_key": { + "default": "Ctrl+Shift+2" + }, + "description": "Container Shortcut 2" } }, "browser_action": { @@ -68,7 +68,7 @@ }, "page_action": { "browser_style": true, - "default_icon": "img/multiaccountcontainer-16.svg", + "default_icon": "img/container-openin-16.svg", "default_title": "Always open this in a Container", "default_popup": "pageActionPopup.html", "pinned": false, diff --git a/src/options.html b/src/options.html index 0476931..1b4852f 100644 --- a/src/options.html +++ b/src/options.html @@ -20,13 +20,11 @@

diff --git a/src/popup.html b/src/popup.html index 5ae3bb5..4f660cf 100644 --- a/src/popup.html +++ b/src/popup.html @@ -119,7 +119,9 @@

Multi-Account Containers

- i + + info +
@@ -153,7 +155,7 @@