fix(ui): make v-tippy theme switch proof

We create our own tippy theme using bootstrap css variables.

Author: pgiraud

src/assets/css/tippy-bootstrap.css

@@ -0,0 +1,12 @@
+/* tippy-bootstrap.css */
+
+.tippy-box[data-theme~='bootstrap'] {
+  background-color: var(--bs-body-bg);
+  color: var(--bs-body-color);
+  border: 1px solid var(--bs-border-color);
+  box-shadow: var(--bs-box-shadow);
+}
+
+.tippy-box[data-theme~='bootstrap'] > .tippy-arrow::before {
+  color: var(--bs-body-bg);
+}

src/components/Plan.vue

@@ -33,10 +33,13 @@ import { json_, pgsql_ } from "@/filters"
 import { setDefaultProps } from "vue-tippy"
 import { store } from "@/store.ts"
 
-setDefaultProps({ theme: "light" })
+setDefaultProps({
+  theme: "bootstrap",
+})
 
 import "tippy.js/dist/tippy.css"
-import "tippy.js/themes/light.css"
+import "tippy.js/dist/border.css"
+import "@/assets/css/tippy-bootstrap.css"
 import * as d3 from "d3"
 import {
   flextree,