sweetalert tweaks

package.json

@@ -102,7 +102,7 @@
     "nord": "^0.2.1",
     "papaparse": "4.6.0",
     "rxjs": "6.3.3",
-    "sweetalert2": "^9.8.2",
+    "sweetalert2": "9.8.2",
     "tldjs": "2.3.1",
     "web-animations-js": "2.3.1",
     "zone.js": "0.8.28",

src/popup/app.component.ts

@@ -213,7 +213,7 @@ export class AppComponent implements OnInit {
     }
 
     private async showDialog(msg: any) {
-        let iconClasses = null;
+        let iconClasses: string = null;
         const type = msg.type;
         if (type != null) {
             // If you add custom types to this part, the type to SweetAlertIcon cast below needs to be changed.

src/popup/scss/plugins.scss

@@ -108,7 +108,7 @@ $fa-font-path: "~font-awesome/fonts";
 // SweetAlert
 
 .swal2-popup {
-    padding: 0;
+    padding: 15px 15px;
     border-radius: $border-radius;
     width: 34em; // slightly bigger than the hardcoded 478px in v1.
     @include themify($themes) {
@@ -117,14 +117,14 @@ $fa-font-path: "~font-awesome/fonts";
     }
 
     .swal2-icon {
-        margin: 15px auto 0 auto;
+        margin: 0 auto;
         width: auto;
         height: auto;
         border: none;
     }
 
     .swal2-content {
-        padding: 20px 20px 15px;
+        margin: 0;
         font-size: $font-size-base;
         @include themify($themes) {
             color: themed('textColor');
@@ -173,7 +173,7 @@ $fa-font-path: "~font-awesome/fonts";
     }
 
     .swal2-title {
-        padding: 10px 10px 15px 10px;
+        padding: 10px 0 15px;
         margin: 0;
         font-size: $font-size-large;
         
@@ -196,8 +196,7 @@ $fa-font-path: "~font-awesome/fonts";
     }
 
     .swal2-actions {
-        padding: 0 10px 10px 10px; // 0 due to padding to content being 15px
-        margin: 0;
+        margin: 20px auto 0;
         justify-content: flex-end;
 
         button {