Cleanup jQuery (#2139)

assets/css/style.scss

@@ -406,3 +406,55 @@ input#nav-toggle,
   font-size: 0.875em;
   content: "\f186";
 }
+
+/* Vanilla CSS implementation for tooltip */
+[data-toggle="tooltip"] {
+  cursor: pointer;
+  position: relative;
+  z-index: 1337;
+}
+
+[data-toggle="tooltip"]:before,
+[data-toggle="tooltip"]:after {
+  opacity: 0;
+  transition: opacity 0.15s linear;
+  pointer-events: none;
+}
+
+[data-toggle="tooltip"]:before {
+  background-color: #000;
+  border-radius: 3px;
+  bottom: 150%;
+  content: attr(data-original-title);
+  color: #fff;
+  font-size: 14px;
+  left: 50%;
+  line-height: 1.2;
+  margin-bottom: 5px;
+  margin-left: -100px;
+  padding: 7px;
+  position: absolute;
+  text-align: center;
+  width: 200px;
+}
+
+/* Little arrow */
+[data-toggle="tooltip"]:after {
+  border-style: solid;
+  border-left-color: transparent;
+  border-right-color: transparent;
+  border-top-color: #000;
+  border-width: 5px;
+  border-bottom: none;
+  bottom: 150%;
+  content: " ";
+  left: 50%;
+  margin-left: -5px;
+  position: absolute;
+  width: 0;
+}
+
+[data-toggle="tooltip"]:hover:before,
+[data-toggle="tooltip"]:hover:after {
+  opacity: .9;
+}

assets/js/main.js

@@ -1,6 +1,3 @@
-$(function() {
-  $("[data-toggle='tooltip']").tooltip();
-});
 document.querySelectorAll(".onclick-select").forEach(element => {
   element.addEventListener("click", element.select);
 });