fix(subs): don't hide HG preview entirely

HabitRPG · Nov 1, 2024 · c341f0d · c341f0d
1 parent 028b94b
commit c341f0d
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 10 deletions.
diff --git a/website/client/src/components/settings/subscription.vue b/website/client/src/components/settings/subscription.vue
@@ -310,23 +310,29 @@
             <div
               class="hourglass-preview purple-gradient d-flex flex-column
               justify-content-center align-items-center position-relative mb-4"
-              v-if="nextHourGlass"
             >
               <div
                 v-once
                 class="svg svg-icon position-absolute left-24"
                 v-html="icons.hourglassLeft"
               >
               </div>
-              <div class="white mb-1">
-                {{ nextHourGlass }}
-              </div>
-              <div
-                v-once
-                class="purple-600"
-              >
-                {{ $t('nextHourglass') }}
+              <div v-if="nextHourGlass">
+                <div
+                  class="white mb-1"
+                >
+                  {{ nextHourGlass }}
+                </div>
+                <div
+                  v-once
+                  class="purple-600"
+                  >
+                  {{ $t('nextHourglass') }}
+                </div>
               </div>
+              <p class="w-50 text-center" v-else>
+                {{ $t('subscribeAgainContinueHourglasses') }}
+              </p>
               <div
                 v-once
                 class="svg svg-icon position-absolute right-24"
@@ -535,6 +541,11 @@
     border-radius: 8px;
     font-weight: 700;
 
+    p {
+      color: $white;
+      line-height: 1.4;
+    }
+
     .white {
       font-family: 'Roboto Condensed';
       font-size: 20px;

diff --git a/website/common/locales/en/subscriber.json b/website/common/locales/en/subscriber.json
@@ -255,5 +255,6 @@
     "nMonthsGift": "For <%= months %> months",
     "unlockNGemsGift": "They'll unlock <strong><%= count %> Gems</strong> per month instantly",
     "earn2GemsGift": "They'll earn <strong>+2 Gems</strong> every month they're subscribed",
-    "maxGemCapGift": "They'll have the max <strong>Gem Cap</strong>"
+    "maxGemCapGift": "They'll have the max <strong>Gem Cap</strong>",
+    "subscribeAgainContinueHourglasses": "Subscribe again to continue receiving Mystic Hourglasses"
 }