Feat(cloud)/pricing plan template details (#7867)

## Summary

- Use video helper popover in top up modal
- Update copy for video helper
- Misc style changes

## Changes

- **What**: /en/main.json, TopUpCreditsDialogContent.vue,
PricingTable.vue
- **Breaking**: <!-- Any breaking changes (if none, remove this line)
-->
- **Dependencies**: <!-- New dependencies (if none, remove this line)
-->

## Screenshots (if applicable)

<img width="2226" height="1322" alt="image"
src="https://github.com/user-attachments/assets/e8419c73-f26c-4d1c-84a6-10cdd10937c4"
/>
<img width="2880" height="1624" alt="image"
src="https://github.com/user-attachments/assets/b27c3665-5eae-4983-a40b-f88705bf53be"
/>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7867-Feat-cloud-pricing-plan-template-details-2e16d73d365081599610e47151b3783b)
by [Unito](https://www.unito.io)
This commit is contained in:
Simula_r
2026-01-06 18:45:06 -08:00
committed by GitHub
parent ea3b3ceb00
commit ab6678534f
4 changed files with 81 additions and 28 deletions

View File

@@ -157,7 +157,9 @@
<div class="flex flex-col gap-2">
<div class="flex flex-row items-start justify-between">
<div class="flex flex-col gap-2">
<span class="text-sm font-normal text-foreground">
<span
class="text-sm font-normal text-foreground leading-relaxed"
>
{{ t('subscription.videoEstimateLabel') }}
</span>
<div class="flex flex-row items-center gap-2 group pt-2">
@@ -220,16 +222,19 @@
}"
>
<div class="flex flex-col gap-2">
<p class="text-sm text-base-foreground">
<p class="text-sm text-base-foreground leading-normal">
{{ t('subscription.videoEstimateExplanation') }}
</p>
<a
href="https://cloud.comfy.org/?template=video_wan2_2_14B_fun_camera"
target="_blank"
rel="noopener noreferrer"
class="text-sm text-azure-600 hover:text-azure-400 underline"
class="text-sm text-azure-600 hover:text-azure-400 no-underline flex gap-1"
>
{{ t('subscription.videoEstimateTryTemplate') }}
<span class="underline">
{{ t('subscription.videoEstimateTryTemplate') }}
</span>
<span class="no-underline" v-html="'&rarr;'"></span>
</a>
</div>
</Popover>

View File

@@ -19,9 +19,9 @@ export interface TierPricing {
}
export const TIER_PRICING: Record<Exclude<TierKey, 'founder'>, TierPricing> = {
standard: { monthly: 20, yearly: 16, credits: 4200, videoEstimate: 164 },
creator: { monthly: 35, yearly: 28, credits: 7400, videoEstimate: 288 },
pro: { monthly: 100, yearly: 80, credits: 21100, videoEstimate: 821 }
standard: { monthly: 20, yearly: 16, credits: 4200, videoEstimate: 120 },
creator: { monthly: 35, yearly: 28, credits: 7400, videoEstimate: 211 },
pro: { monthly: 100, yearly: 80, credits: 21100, videoEstimate: 600 }
}
interface TierFeatures {