Create modal for API token

Signed-off-by: Paul Mannarino <paul.mannarino@gmail.com>

scripts/pi-hole/js/settings.js

@@ -169,7 +169,7 @@ $(".api-token").confirm({
   text: "Make sure that nobody else can scan this code around you. They will have full access to the API without having to know the password. Note that the generation of the QR code will take some time.",
   title: "Confirmation required",
   confirm: function () {
-    window.open("scripts/pi-hole/php/api_token.php", "_blank");
+    $("#apiTokenModal").modal("show");
   },
   cancel: function () {
     // nothing to do
@@ -182,6 +182,17 @@ $(".api-token").confirm({
   dialogClass: "modal-dialog",
 });
 
+$("#apiTokenModal").on("show.bs.modal", function () {
+  var font = {
+    "font-family": $("body").css("font-family"),
+  };
+  $('iframe[name="apiToken_iframe"]').contents().find("body").css(font);
+  var table = {
+    margin: "auto",
+  };
+  $('iframe[name="apiToken_iframe"]').contents().find("table").css(table);
+});
+
 $("#DHCPchk").click(function () {
   $("input.DHCPgroup").prop("disabled", !this.checked);
   $("#dhcpnotice").prop("hidden", !this.checked).addClass("lookatme");