BKDK-476

OS2web · Jun 10, 2021 · 7b07b33 · 7b07b33
1 parent ac96b01
commit 7b07b33
Show file tree

Hide file tree

Showing 5 changed files with 28 additions and 14 deletions.
diff --git a/web/themes/custom/fds_ballerup_theme/dist/javascripts/app.js b/web/themes/custom/fds_ballerup_theme/dist/javascripts/app.js
diff --git a/web/themes/custom/fds_ballerup_theme/fds_ballerup_theme.libraries.yml b/web/themes/custom/fds_ballerup_theme/fds_ballerup_theme.libraries.yml
@@ -10,6 +10,8 @@ styles:
 
 javascripts:
   js:
+    "https://unpkg.com/@popperjs/core@2": { type: external }
+    "https://unpkg.com/tippy.js@6": { type: external }
     dist/javascripts/app.js: {}
     dist/javascripts/modernizr.js: {}
   dependencies:

diff --git a/web/themes/custom/fds_ballerup_theme/package-lock.json b/web/themes/custom/fds_ballerup_theme/package-lock.json
diff --git a/web/themes/custom/fds_ballerup_theme/package.json b/web/themes/custom/fds_ballerup_theme/package.json
@@ -10,7 +10,8 @@
   "dependencies": {
     "dkfds": "^6.1.1",
     "font-awesome": "^4.7.0",
-    "material-design-icons": "^3.0.1"
+    "material-design-icons": "^3.0.1",
+    "tippy.js": "^6.3.1"
   },
   "devDependencies": {
     "browser-sync": "^2.26.12",

diff --git a/web/themes/custom/fds_ballerup_theme/src/javascripts/app.js b/web/themes/custom/fds_ballerup_theme/src/javascripts/app.js
@@ -138,10 +138,9 @@ document.addEventListener('DOMContentLoaded', function() {
 (function() {
   var links = document.querySelectorAll('a[href^="mailto:"]');
 
-  for (var i = 0; i < links.length; i += 1) {
-    var link = links[i];
-
-    link.setAttribute('data-tooltip', 'Du er nu ved at sende en almindelig e-mail. Hvis din besked indeholder personoplysninger, bør du i stedet sende den som en <u>sikker besked</u>');
-    link.classList.add('js-tooltip');
-  }
+  tippy(links, {
+    content: '<div style="text-align: center;">Du er nu ved at sende en almindelig e-mail. <br />Hvis din besked indeholder personoplysninger, bør du i stedet sende den som en <br /><a href="/sikkerbesked" style="color: #fff;">sikker besked</a></div>',
+    allowHTML: true,
+    interactive: true,
+  });
 }());