Add premium plan card

codex-team · Dec 3, 2024 · 9b9d2cf · 9b9d2cf
1 parent 1678c28
commit 9b9d2cf
Show file tree

Hide file tree

Showing 3 changed files with 62 additions and 2 deletions.
diff --git a/src/components/modals/ChooseTariffPlanPopup.vue b/src/components/modals/ChooseTariffPlanPopup.vue
@@ -31,6 +31,30 @@
             @click.native="selectPlan(plan.id)"
             :horizontal="plans.length > 3"
           />
+
+          <div class="choose-plan__premium-card">
+            <div class="choose-plan__premium-card-title">
+              {{$t('workspaces.chooseTariffPlanDialog.premiumPlan')}}
+            </div>
+
+            <div class="choose-plan__premium-card-limit">
+              {{$t('workspaces.chooseTariffPlanDialog.premiumPlanLimit')}}
+            </div>
+
+            <div class="choose-plan__premium-card-price">
+              {{$t('workspaces.chooseTariffPlanDialog.premiumPlanPrice')}}
+            </div>
+
+            <a href="mailto:[email protected]">
+              <UiButton
+                small
+                submit
+                rounded
+                :content="$t('workspaces.chooseTariffPlanDialog.premiumPlanButtonText')"
+                class="tariff-plan__button"
+              />
+            </a>
+          </div>
         </div>
 
         <UiButton
@@ -234,5 +258,33 @@ export default Vue.extend({
     &__continue-button {
       margin-top: 30px;
     }
+
+    &__premium-card {
+      background: var(--color-bg-main);
+      border-radius: 7px;
+      display: flex;
+      align-items: center;
+      padding: 20px 25px;
+    }
+
+    &__premium-card-title {
+      font-weight: 600;
+      width: 150px;
+    }
+
+    &__premium-card-limit {
+      color: var(--color-text-second);
+      font-weight: 600;
+      font-size: 15px;
+      letter-spacing: 0;
+    }
+
+    &__premium-card-price {
+      margin-left: auto;
+      color: var(--color-text-second);
+      font-weight: 600;
+      font-size: 13px;
+      margin-right: 20px;
+    }
   }
 </style>
diff --git a/src/i18n/messages/en.json b/src/i18n/messages/en.json
@@ -226,7 +226,11 @@
       "onSuccess": "Workspace plan has been successfully changed",
       "onError": "Unable to change workspace plan due to an error, please try again later",
       "confirmSetToFreePlanDescription": "The old plan will be canceled. Unused errors and time will not be refunded.",
-      "confirmSetToPaidPlanDescription": "The old plan will be canceled. Unused errors and time will not be refunded. You will need to pay for a new tariff plan."
+      "confirmSetToPaidPlanDescription": "The old plan will be canceled. Unused errors and time will not be refunded. You will need to pay for a new tariff plan.",
+      "premiumPlan": "Premium",
+      "premiumPlanLimit": "> 500 000 events / mo",
+      "premiumPlanPrice": "Individual",
+      "premiumPlanButtonText": "Contact us"
     },
     "creationDialog": {
       "description": "Workspace will contain your projects. You’ll able to invite team members to join workspace and access projects.",

diff --git a/src/i18n/messages/ru.json b/src/i18n/messages/ru.json
@@ -226,7 +226,11 @@
       "onSuccess": "Тарифный план был успешно изменён",
       "onError": "Произошла ошибка, пожалуйста попробуйте ещё раз немного позже",
       "confirmSetToFreePlanDescription": "Старый план будет отменён. Деньги за неиспользованные ошибки и время не будут возвращены.",
-      "confirmSetToPaidPlanDescription": "Старый план будет отменён. Деньги за неиспользованные ошибки и время не будут возвращены. Вам будет необходимо оплатить новый тарифный план."
+      "confirmSetToPaidPlanDescription": "Старый план будет отменён. Деньги за неиспользованные ошибки и время не будут возвращены. Вам будет необходимо оплатить новый тарифный план.",
+      "premiumPlan": "Примиум",
+      "premiumPlanLimit": "> 500 000 событий / мес",
+      "premiumPlanPrice": "Индивидуальная",
+      "premiumPlanButtonText": "Связаться"
     },
     "creationDialog": {
       "description": "Воркспейс объединяет несколько проектов. Вы сможете добавить коллег с доступом ко всем проектам внутри воркспейса.",