add a tooltip

This commit is contained in:
tophf 2022-01-25 21:41:51 +03:00
parent 2736d8b006
commit 79fcb5705a
2 changed files with 20 additions and 12 deletions

View File

@ -1693,6 +1693,9 @@
"styleIncludeLabel": { "styleIncludeLabel": {
"message": "Custom included sites" "message": "Custom included sites"
}, },
"styleInjectionImportance": {
"message": "Toggle style's importance"
},
"styleInjectionOrder": { "styleInjectionOrder": {
"message": "Style injection order", "message": "Style injection order",
"description": "Tooltip for the button in the manager to open the dialog and also the title of this dialog" "description": "Tooltip for the button in the manager to open the dialog and also the title of this dialog"
@ -1702,7 +1705,7 @@
"description": "Hint in the injection order dialog in the manager" "description": "Hint in the injection order dialog in the manager"
}, },
"styleInjectionOrderHint_prio": { "styleInjectionOrderHint_prio": {
"message": "Important styles are listed below and are always injected last so they can override any newly installed styles. Click the style's mark to toggle its importance.", "message": "Important styles listed below are always injected last so they can override any newly installed styles. Click the style's mark to toggle its importance.",
"description": "Hint at the bottom of the injection order dialog in the manager" "description": "Hint at the bottom of the injection order dialog in the manager"
}, },
"styleExcludeLabel": { "styleExcludeLabel": {

View File

@ -12,6 +12,18 @@ async function InjectionOrder(show = true) {
const SEL_ENTRY = '.injection-order-entry'; const SEL_ENTRY = '.injection-order-entry';
const groups = await API.styles.getAllOrdered(); const groups = await API.styles.getAllOrdered();
const ols = {}; const ols = {};
const parts = {};
const entry = $create('li' + SEL_ENTRY, [
parts.name = $create('a', {
target: '_blank',
draggable: false,
}),
$create('a.injection-order-toggle', {
tabIndex: 0,
draggable: false,
title: t('styleInjectionImportance'),
}),
]);
await messageBoxProxy.show({ await messageBoxProxy.show({
title: t('styleInjectionOrder'), title: t('styleInjectionOrder'),
contents: $create('fragment', Object.entries(groups).map(makeList)), contents: $create('fragment', Object.entries(groups).map(makeList)),
@ -21,17 +33,10 @@ async function InjectionOrder(show = true) {
}); });
function makeEntry(style) { function makeEntry(style) {
return $create('li' + SEL_ENTRY + (style.enabled ? '.enabled' : ''), [ entry.classList.toggle('enabled', style.enabled);
$create('a', { parts.name.href = '/edit.html?id=' + style.id;
href: '/edit.html?id=' + style.id, parts.name.textContent = style.name;
target: '_blank', return entry.cloneNode(true);
draggable: false,
}, style.name),
$create('a.injection-order-toggle', {
tabIndex: 0,
draggable: false,
}),
]);
} }
function makeList([type, styles]) { function makeList([type, styles]) {