add a tooltip

_locales/en/messages.json

@@ -1693,6 +1693,9 @@
   "styleIncludeLabel": {
     "message": "Custom included sites"
   },
+  "styleInjectionImportance": {
+    "message": "Toggle style's importance"
+  },
   "styleInjectionOrder": {
     "message": "Style injection order",
     "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"
   },
   "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"
   },
   "styleExcludeLabel": {

injection-order/injection-order.js

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