From 9d18c28476b57e3823bd86a28f81c35bea6aa643 Mon Sep 17 00:00:00 2001 From: Jessica Schilling Date: Mon, 18 May 2020 16:01:52 -0600 Subject: [PATCH 1/6] Stole header style from IPLD Explorer --- add-on/src/options/options.css | 13 +++---------- add-on/src/options/options.html | 10 +++++----- 2 files changed, 8 insertions(+), 15 deletions(-) diff --git a/add-on/src/options/options.css b/add-on/src/options/options.css index 7b6e189cc..97a78fb04 100644 --- a/add-on/src/options/options.css +++ b/add-on/src/options/options.css @@ -6,16 +6,9 @@ header { border-color: #69c4cd; text-transform: uppercase; } -.ipfs-logo { - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 553 235.3'%3E%3Cdefs%3E%3C/defs%3E%3Cpath fill='%23ffffff' d='M239 63h17.8v105H239V63zm35.6 0h36.3c7.9 0 14.5.9 19.6 2.6s9.2 4.1 12.1 7.1a24.45 24.45 0 0 1 6.2 10.2 40.75 40.75 0 0 1 1.8 12.1 45.69 45.69 0 0 1-1.8 12.9 26.58 26.58 0 0 1-6.2 10.8 30.59 30.59 0 0 1-12.1 7.3c-5.1 1.8-11.5 2.7-19.3 2.7h-19.1V168h-17.5V63zm36.2 51a38.37 38.37 0 0 0 11.1-1.3 16.3 16.3 0 0 0 6.8-3.7 13.34 13.34 0 0 0 3.5-5.8 29.75 29.75 0 0 0 1-7.6 25.68 25.68 0 0 0-1-7.7 12 12 0 0 0-3.6-5.5 17.15 17.15 0 0 0-6.9-3.4 41.58 41.58 0 0 0-10.9-1.2h-18.5V114h18.5zm119.9-51v15.3h-49.2V108h46.3v15.4h-46.3V168h-17.8V63h67zm26.2 72.9c.8 6.9 3.3 11.9 7.4 15s10.4 4.7 18.6 4.7a32.61 32.61 0 0 0 10.1-1.3 20.52 20.52 0 0 0 6.6-3.5 12 12 0 0 0 3.5-5.2 19.08 19.08 0 0 0 1-6.4 16.14 16.14 0 0 0-.7-4.9 12.87 12.87 0 0 0-2.6-4.5 16.59 16.59 0 0 0-5.1-3.6 35 35 0 0 0-8.2-2.4l-13.4-2.5a89.76 89.76 0 0 1-14.1-3.7 33.51 33.51 0 0 1-10.4-5.8 22.28 22.28 0 0 1-6.3-8.8 34.1 34.1 0 0 1-2.1-12.7 26 26 0 0 1 11.3-22.4 36.35 36.35 0 0 1 12.6-5.6 65.89 65.89 0 0 1 15.8-1.8c7.2 0 13.3.8 18.2 2.5a34.46 34.46 0 0 1 11.9 6.5 28.21 28.21 0 0 1 6.9 9.3 42.1 42.1 0 0 1 3.2 11l-16.8 2.6c-1.4-5.9-3.7-10.2-7.1-13.1s-8.7-4.3-16.1-4.3a43.9 43.9 0 0 0-10.5 1.1 19.47 19.47 0 0 0-6.8 3.1 11.63 11.63 0 0 0-3.7 4.6 14.08 14.08 0 0 0-1.1 5.4c0 4.6 1.2 8 3.7 10.3s6.9 4 13.2 5.3l14.5 2.8c11.1 2.1 19.2 5.6 24.4 10.5s7.8 12.1 7.8 21.4a31.37 31.37 0 0 1-2.4 12.3 25.27 25.27 0 0 1-7.4 9.8 36.58 36.58 0 0 1-12.4 6.6 56 56 0 0 1-17.3 2.4c-13.4 0-24-2.8-31.6-8.5s-11.9-14.4-12.6-26.2h18z'/%3E%3Cpath fill='%23469ea2' d='M30.3 164l84 48.5 84-48.5V67l-84-48.5-84 48.5v97z'/%3E%3Cpath fill='%236acad1' d='M105.7 30.1l-61 35.2a18.19 18.19 0 0 1 0 3.3l60.9 35.2a14.55 14.55 0 0 1 17.3 0l60.9-35.2a18.19 18.19 0 0 1 0-3.3L123 30.1a14.55 14.55 0 0 1-17.3 0zm84 48.2l-61 35.6a14.73 14.73 0 0 1-8.6 15l.1 70a15.57 15.57 0 0 1 2.8 1.6l60.9-35.2a14.73 14.73 0 0 1 8.6-15V79.9a20 20 0 0 1-2.8-1.6zm-150.8.4a15.57 15.57 0 0 1-2.8 1.6v70.4a14.38 14.38 0 0 1 8.6 15l60.9 35.2a15.57 15.57 0 0 1 2.8-1.6v-70.4a14.38 14.38 0 0 1-8.6-15L38.9 78.7z'/%3E%3Cpath fill='%23469ea2' d='M114.3 29l75.1 43.4v86.7l-75.1 43.4-75.1-43.4V72.3L114.3 29m0-10.3l-84 48.5v97l84 48.5 84-48.5v-97l-84-48.5z'/%3E%3Cpath fill='%23469ea2' d='M114.9 132h-1.2A15.66 15.66 0 0 1 98 116.3v-1.2a15.66 15.66 0 0 1 15.7-15.7h1.2a15.66 15.66 0 0 1 15.7 15.7v1.2a15.66 15.66 0 0 1-15.7 15.7zm0 64.5h-1.2a15.65 15.65 0 0 0-13.7 8l14.3 8.2 14.3-8.2a15.65 15.65 0 0 0-13.7-8zm83.5-48.5h-.6a15.66 15.66 0 0 0-15.7 15.7v1.2a15.13 15.13 0 0 0 2 7.6l14.3-8.3V148zm-14.3-89a15.4 15.4 0 0 0-2 7.6v1.2a15.66 15.66 0 0 0 15.7 15.7h.6V67.2L184.1 59zm-69.8-40.3L100 26.9a15.73 15.73 0 0 0 13.7 8.1h1.2a15.65 15.65 0 0 0 13.7-8l-14.3-8.3zM44.6 58.9l-14.3 8.3v16.3h.6a15.66 15.66 0 0 0 15.7-15.7v-1.2a16.63 16.63 0 0 0-2-7.7zM30.9 148h-.6v16.2l14.3 8.3a15.4 15.4 0 0 0 2-7.6v-1.2A15.66 15.66 0 0 0 30.9 148z'/%3E%3Cpath fill='%23083b54' fill-opacity='0.15' d='M114.3 213.2v-97.1l-84-48.5v97.1z'/%3E%3Cpath fill='%23083b54' fill-opacity='0.05' d='M198.4 163.8v-97l-84 48.5v97.1z'/%3E%3C/svg%3E%0A"); - background-repeat: no-repeat; - background-size: contain -} -#page-header-logo { - height: 3.2em; - margin-right: 2em; - margin-top: 0.25em; - width: 7.15em +#header-logo { + height: 50px; + width: 117.5px; } form * { font-family: Inter,system-ui,sans-serif; diff --git a/add-on/src/options/options.html b/add-on/src/options/options.html index f49fb4cc0..b292bf64d 100644 --- a/add-on/src/options/options.html +++ b/add-on/src/options/options.html @@ -7,11 +7,11 @@ -
- -

- Companion Preferences -

+
+
+ +
+

Companion Preferences

From 2516277c7bf998ca2a1a1bd3749cb5643a17643b Mon Sep 17 00:00:00 2001 From: Jessica Schilling Date: Mon, 18 May 2020 16:06:04 -0600 Subject: [PATCH 2/6] Boldface global toggle text --- add-on/src/options/forms/global-toggle-form.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/add-on/src/options/forms/global-toggle-form.js b/add-on/src/options/forms/global-toggle-form.js index 45c58b32a..2acd466da 100644 --- a/add-on/src/options/forms/global-toggle-form.js +++ b/add-on/src/options/forms/global-toggle-form.js @@ -8,7 +8,7 @@ const switchToggle = require('../../pages/components/switch-toggle') function globalToggleForm ({ active, onOptionChange }) { const toggle = onOptionChange('active') return html` -
+
diff --git a/add-on/src/options/options.js b/add-on/src/options/options.js index a717082e6..2e3b632e4 100644 --- a/add-on/src/options/options.js +++ b/add-on/src/options/options.js @@ -1,6 +1,7 @@ 'use strict' /* eslint-env browser, webextensions */ +const { i18n } = require('webextension-polyfill') const choo = require('choo') const optionsPage = require('./page') const optionsStore = require('./store') @@ -15,3 +16,6 @@ app.route('*', optionsPage) // Start the application and render it to the given querySelector app.mount('#root') + +// Set header translation +document.getElementById('header-text').innerText = i18n.getMessage('option_page_header') From 91bfb2c84e61aaa13c59eeee8f342cb0e08ed7b8 Mon Sep 17 00:00:00 2001 From: Marcin Rataj Date: Tue, 19 May 2020 03:11:32 +0200 Subject: [PATCH 6/6] fix(i18): translate options tab title --- add-on/src/options/options.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/add-on/src/options/options.js b/add-on/src/options/options.js index 2e3b632e4..842ad7380 100644 --- a/add-on/src/options/options.js +++ b/add-on/src/options/options.js @@ -18,4 +18,6 @@ app.route('*', optionsPage) app.mount('#root') // Set header translation -document.getElementById('header-text').innerText = i18n.getMessage('option_page_header') +const headerText = i18n.getMessage('option_page_header') +document.getElementById('header-text').innerText = headerText +document.title = headerText