Infrastructure/ghost
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-02-17 23:44:39 -05:00
Code Issues Activity

Updated tier preview in tier modal

Browse source 
refs https://github.com/TryGhost/Team/issues/1791
This commit is contained in:
Djordje Vlaisavljevic 2022-08-16 16:44:11 +02:00
parent c4ea36cfde
commit 5f2d55dace
2 changed files with 41 additions and 61 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

69
ghost/admin/app/components/modal-tier.hbs
View file

@ -276,49 +276,34 @@
<span class="amount">0</span> <span class="amount">0</span>
</div> </div>
{{else}} {{else}}
{{#if this.isFreeTrialEnabled}}
<div class="gh-portal-tier-price">
<span class="amount">{{ this.tier.trialDays }} days free</span>
</div>
{{/if}}
{{#if this.stripeYearlyAmount}} {{#if this.stripeYearlyAmount}}
<div class="gh-portal-tier-price">
<span class="currency-sign">{{currency-symbol this.currency}}</span>
{{#if (eq this.previewCadence "monthly")}}
<span class="amount">
{{format-number this.stripeMonthlyAmount}}
</span>
<span class="billing-period">/month</span>
{{else}}
<span class="amount">
{{format-number this.stripeYearlyAmount}}
</span>
<span class="billing-period">/year</span>
{{/if}}
</div>
{{#if (feature 'freeTrial')}} {{#if (feature 'freeTrial')}}
{{#unless this.freeTrialEnabled}} {{#if this.isFreeTrialEnabled}}
<div class="gh-portal-tier-price"> <span class="gh-portal-discount-label">
<span class="currency-sign">{{currency-symbol this.currency}}</span> <span style="background-color: {{this.settings.accentColor}}"></span>
{{#if (eq this.previewCadence "monthly")}} {{ this.tier.trialDays }} days free</span>
<span class="amount">
{{format-number this.stripeMonthlyAmount}}
</span>
<span class="billing-period">/month</span>
{{else}}
<span class="amount">
{{format-number this.stripeYearlyAmount}}
</span>
<span class="billing-period">/year</span>
{{/if}} {{/if}}
</div>
{{/unless}}
{{else}} {{else}}
<div class="gh-portal-tier-price">
<span class="currency-sign">{{currency-symbol this.currency}}</span>
{{#if (eq this.previewCadence "monthly")}}
<span class="amount">
{{format-number this.stripeMonthlyAmount}}
</span>
<span class="billing-period">/month</span>
{{else}}
<span class="amount">
{{format-number this.stripeYearlyAmount}}
</span>
<span class="billing-period">/year</span>
{{/if}}
</div>
{{/if}}
{{#if (and (eq this.previewCadence "yearly") (gt this.discountValue 0))}} {{#if (and (eq this.previewCadence "yearly") (gt this.discountValue 0))}}
<span class="gh-portal-discount-label"> <span class="gh-portal-discount-label">
<span style="background-color: {{this.settings.accentColor}}"></span> <span style="background-color: {{this.settings.accentColor}}"></span>
{{this.discountValue}}% discount</span> {{this.discountValue}}% discount
</span>
{{/if}}
{{/if}} {{/if}}
{{else}} {{else}}
<div class="gh-portal-tier-price placeholder"> <div class="gh-portal-tier-price placeholder">
@ -329,15 +314,13 @@
{{/if}} {{/if}}
{{/if}} {{/if}}
</div> </div>
{{#if this.isFreeTrialEnabled}} {{#if (feature 'freeTrial')}}
<span class="after-trial-amount">Then {{#if (and (eq this.previewCadence "yearly") (gt this.discountValue 0))}}
{{#if (eq this.previewCadence "yearly")}} <span class="gh-portal-discount-label-trial" style={{this.accentColorStyle}}>
{{currency-symbol this.currency}}{{ format-number this.stripeYearlyAmount }}/year {{this.discountValue}}% discount
{{else}}
{{currency-symbol this.currency}}{{ format-number this.stripeMonthlyAmount }}/month
{{/if}}
</span> </span>
{{/if}} {{/if}}
{{/if}}
</div> </div>
<div class="gh-portal-tier-card-details"> <div class="gh-portal-tier-card-details">

11
ghost/admin/app/styles/layouts/tiers.css
View file

@ -790,14 +790,11 @@
opacity: 0.35; opacity: 0.35;
} }
.gh-tier-form-tierpreview .after-trial-amount { .gh-tier-form-tierpreview .gh-portal-discount-label-trial {
display: block; font-weight: 600;
font-size: 1.5rem; font-size: 1.3rem;
font-weight: 500;
color: #686868;
margin-top: 6px;
margin-bottom: 6px;
line-height: 1; line-height: 1;
margin-top: 4px;
} }
.gh-tier-setting-title { .gh-tier-setting-title {