diff --git a/src/public/app/services/note_tooltip.js b/src/public/app/services/note_tooltip.js
index 77ec358d6..74c4d20ad 100644
--- a/src/public/app/services/note_tooltip.js
+++ b/src/public/app/services/note_tooltip.js
@@ -59,10 +59,11 @@ async function mouseEnterHandler() {
         $(this).tooltip({
             delay: {"show": 300, "hide": 100},
             container: 'body',
-            placement: 'auto',
+            // https://github.com/zadam/trilium/issues/2794 https://github.com/zadam/trilium/issues/2988
+            // with bottom this flickering happens a bit less
+            placement: 'bottom',
             trigger: 'manual',
             boundary: 'window',
-            offset: "0, 20", // workaround for https://github.com/zadam/trilium/issues/2794
             title: html,
             html: true,
             template: '<div class="tooltip note-tooltip" role="tooltip"><div class="arrow"></div><div class="tooltip-inner"></div></div>',
diff --git a/src/public/app/widgets/dialogs/about.js b/src/public/app/widgets/dialogs/about.js
index cbfeb7046..8ab9482e9 100644
--- a/src/public/app/widgets/dialogs/about.js
+++ b/src/public/app/widgets/dialogs/about.js
@@ -38,7 +38,7 @@ const TPL = `
 
                     <tr>
                         <th>Build revision:</th>
-                        <td><a href="" class="external" target="_blank" class="build-revision"></a></td>
+                        <td><a href="" class="build-revision external" target="_blank"></a></td>
                     </tr>
 
                     <tr>
diff --git a/src/public/app/widgets/mermaid.js b/src/public/app/widgets/mermaid.js
index 7be42e692..094fe1d3d 100644
--- a/src/public/app/widgets/mermaid.js
+++ b/src/public/app/widgets/mermaid.js
@@ -61,7 +61,7 @@ export default class MermaidWidget extends NoteContextAwareWidget {
             gantt: { useMaxWidth: false },
             "class": { useMaxWidth: false },
             state: { useMaxWidth: false },
-            pie: { useMaxWidth: false },
+            pie: { useMaxWidth: true },
             journey: { useMaxWidth: false },
             git: { useMaxWidth: false },
         });
diff --git a/src/public/app/widgets/toc.js b/src/public/app/widgets/toc.js
index 22837a809..5e4855d72 100644
--- a/src/public/app/widgets/toc.js
+++ b/src/public/app/widgets/toc.js
@@ -152,7 +152,9 @@ export default class TocWidget extends CollapsibleWidget {
             //
             // Create the list item and set up the click callback
             //
-            const $li = $('<li style="cursor:pointer">' + m[2] + '</li>');
+
+            const headingText = $("<div>").html(m[2]).text();
+            const $li = $('<li style="cursor:pointer">').text(headingText);
             // XXX Do this with CSS? How to inject CSS in doRender?
             $li.hover(function () {
                 $(this).css("font-weight", "bold");