From 971b124b057307e927b4e07f348481cf8c324794 Mon Sep 17 00:00:00 2001
From: CuriousMagpie <eilatan@gmail.com>
Date: Wed, 15 Mar 2023 11:21:25 -0400
Subject: [PATCH 1/3] apply correct opacity to close icon

---
 website/client/src/components/externalLinkModal.vue | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/website/client/src/components/externalLinkModal.vue b/website/client/src/components/externalLinkModal.vue
index 1ff7ca2c54..e6988229a7 100644
--- a/website/client/src/components/externalLinkModal.vue
+++ b/website/client/src/components/externalLinkModal.vue
@@ -68,9 +68,11 @@
 
       & svg {
         fill: $yellow-1;
+        opacity: 0.75;
       }
        & :hover {
         fill: $yellow-1;
+        opacity: 1;
       }
     }
   }

From c726208d6e609393fe0439fa48700b53ffca240a Mon Sep 17 00:00:00 2001
From: CuriousMagpie <eilatan@gmail.com>
Date: Tue, 21 Mar 2023 13:00:15 -0400
Subject: [PATCH 2/3] add cancel option

---
 .../client/src/components/externalLinkModal.vue  | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

diff --git a/website/client/src/components/externalLinkModal.vue b/website/client/src/components/externalLinkModal.vue
index e6988229a7..47fe67af41 100644
--- a/website/client/src/components/externalLinkModal.vue
+++ b/website/client/src/components/externalLinkModal.vue
@@ -43,6 +43,13 @@
       >
         {{ $t('continue') }}
       </button>
+      <div
+        v-once
+        class="close-link justify-content-center"
+        @click="close()"
+      >
+        {{ $t('cancel') }}
+      </div>
     </div>
   </b-modal>
 </template>
@@ -129,6 +136,15 @@
       border-top: none;
       padding-top: 0;
     }
+    .close-link {
+      color: $purple-300;
+      line-height: 1.71;
+      font-size: 0.875rem;
+      cursor: pointer;
+      padding-top:16px;
+      padding-bottom: 8px;
+      text-align: center;
+    }
   }
 }
 </style>

From b264e539f4d0fe629cd6235632a533d1c277367d Mon Sep 17 00:00:00 2001
From: CuriousMagpie <eilatan@gmail.com>
Date: Tue, 21 Mar 2023 14:49:43 -0400
Subject: [PATCH 3/3] add crtl/cmd instructions to skip modal

---
 .../src/components/externalLinkModal.vue      | 31 ++++++++++++++-----
 website/common/locales/en/generic.json        |  3 +-
 2 files changed, 25 insertions(+), 9 deletions(-)

diff --git a/website/client/src/components/externalLinkModal.vue b/website/client/src/components/externalLinkModal.vue
index 47fe67af41..2d64dfd536 100644
--- a/website/client/src/components/externalLinkModal.vue
+++ b/website/client/src/components/externalLinkModal.vue
@@ -33,6 +33,11 @@
       v-html="$t('leaveHabiticaText')"
     >
     </div>
+    <div
+      class="skip-modal"
+    >
+      {{ $t('skipExternalLinkModal') }}
+    </div>
 
     <!-- FOOTER -->
     <div slot="modal-footer">
@@ -64,13 +69,13 @@
 
   .modal-close {
     position: absolute;
-    right: 16px;
-    top: 16px;
+    right: 12px;
+    top: 12px;
     cursor: pointer;
 
     .icon-close {
-      width: 18px;
-      height: 18px;
+      width: 16px;
+      height: 16px;
       vertical-align: middle;
 
       & svg {
@@ -90,7 +95,7 @@
 
   .modal-header {
     justify-content: center;
-    padding-top: 24px;
+    padding-top: 32px;
     padding-bottom: 0px;
     background: $yellow-100;
     border-top-right-radius: 8px;
@@ -113,7 +118,7 @@
 
     h2 {
       color: $yellow-1;
-      // font-size: 1.25rem;
+      margin-bottom: 16px;
     }
   }
 
@@ -125,6 +130,16 @@
       font-size: 0.875rem;
       line-height: 1.71;
       text-align: center;
+      margin-top:24px;
+    }
+
+    .skip-modal {
+      color: $gray-100;
+      font-size: 0.75rem;
+      text-align: center;
+      line-height: 1.33;
+      margin-top: 16px;
+      // padding-bottom: 24px;
     }
   }
 
@@ -141,8 +156,8 @@
       line-height: 1.71;
       font-size: 0.875rem;
       cursor: pointer;
-      padding-top:16px;
-      padding-bottom: 8px;
+      margin-top:16px;
+      margin-bottom: 8px;
       text-align: center;
     }
   }
diff --git a/website/common/locales/en/generic.json b/website/common/locales/en/generic.json
index d360bed360..26a51eaf7b 100644
--- a/website/common/locales/en/generic.json
+++ b/website/common/locales/en/generic.json
@@ -214,5 +214,6 @@
   "askQuestion": "Ask a Question",
   "emptyReportBugMessage": "Report Bug Message missing",
   "leaveHabitica": "You are about to leave Habitica.com",
-  "leaveHabiticaText": "Habitica is not responsible for the content of any linked website that is not owned or operated by HabitRPG.<br>Please note that these websites' practices may differ from Habitica’s community guidelines."
+  "leaveHabiticaText": "Habitica is not responsible for the content of any linked website that is not owned or operated by HabitRPG.<br>Please note that these websites' practices may differ from Habitica’s community guidelines.",
+  "skipExternalLinkModal": "Hold CTRL (Windows) or Command (Mac) when clicking a link to skip this modal."
 }