TryGhost/Ghost
1
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2024-11-25 09:03:12 +03:00
Code Issues Projects Releases Wiki Activity

Fixed tier modal when free trial not enabled

Browse Source 
refs https://github.com/TryGhost/Team/issues/1791
This commit is contained in:
Djordje Vlaisavljevic 2022-08-14 13:59:32 +02:00
parent 5250dd9a12
commit 713635b49f
2 changed files with 115 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

131
ghost/admin/app/components/modal-tier.hbs
View File

@ -54,9 +54,10 @@
</GhFormGroup>
{{#unless this.isFreeTier}}
{{#if (feature 'freeTrial')}}
<div class="gh-settings-members-pricetrialcont">
<GhFormGroup @errors={{this.settings.errors}} @hasValidated={{this.settings.hasValidated}} @property="prices" data-test-formgroup="prices">
<div class="gh-settings-members-pricelabelcont">
<div class="gh-settings-members-pricelabelcont free-trial-enabled">
<label for="monthlyPrice" class="fw6">Prices</label>
<div>
<span class="gh-setting-members-currency gh-select">
@ -76,6 +77,95 @@
</span>
</div>
</div>
<div class="gh-setting-members-prices free-trial-enabled">
<div class="gh-input-group">
<GhTextInput
@id="monthlyPrice"
@value={{readonly this.stripeMonthlyAmount}}
@type="number"
@input={{action (mut this.stripeMonthlyAmount) value="target.value"}}
@focus-out={{this.validateStripePlans}}
/>
<span class="gh-input-append"><span class="ttu">{{this.currency}}</span>/month</span>
</div>
<div class="gh-input-group">
<GhTextInput
@id="yearlyPrice"
@value={{readonly this.stripeYearlyAmount}}
@type="number"
@input={{action (mut this.stripeYearlyAmount) value="target.value"}}
@focus-out={{this.validateStripePlans}}
@placeholder=''
data-test-title-input={{true}}
/>
<span class="gh-input-append"><span class="ttu">{{this.currency}}</span>/year</span>
</div>
</div>
{{#if this.stripePlanError}}
<p class="response w-100"><span class="red">{{this.stripePlanError}}</span></p>
{{/if}}
</GhFormGroup>
<GhFormGroup @errors={{this.errors}} @property="trialDays" data-test-formgroup="trialDays">
<div class="flex justify-between items-center mb2">
<div>
<h4 class="gh-tier-setting-title">Add a free trial</h4>
</div>
<div class="for-switch small">
<label class="switch" for="free-trial">
<Input
@checked={{this.freeTrialEnabled}}
@type="checkbox"
id="free-trial"
name="free-trial"
{{on "click" this.setFreeTrialEnabled}}
/>
<span class="input-toggle-component"></span>
</label>
</div>
</div>
<div class="gh-input-group {{unless this.freeTrialEnabled "gh-input-group-tier-trial-disabled"}}">
<GhTextInput
@value={{readonly this.tier.trialDays}}
@type="number"
{{on "input" this.setTrialDays}}
@name="trial"
@id="trial"
@class="gh-input"
@disabled={{unless this.freeTrialEnabled "true"}}
data-test-input="tier-trial" />
<span class="gh-input-append">days</span>
</div>
<p>After trial, members will be automatically subscribed to the full price</p>
{{#if this.hasTrialDaysError}}
<p class="response w-100"><span class="red">Free trial must be at least 1 day</span></p>
{{/if}}
</GhFormGroup>
</div>
{{else}}
<GhFormGroup @errors={{this.settings.errors}} @hasValidated={{this.settings.hasValidated}} @property="prices" data-test-formgroup="prices">
<div class="gh-settings-members-pricelabelcont">
<label for="monthlyPrice" class="fw6">Prices</label><span>–</span>
<div>
<span class="gh-setting-members-currency gh-select">
<div class="gh-setting-members-currencylabel">
<span>{{this.currency}}</span>
{{svg-jar "arrow-down-small"}}
</div>
<OneWaySelect
@value={{this.selectedCurrency}}
id="currency"
name="currency"
@options={{readonly this.allCurrencies}}
@optionValuePath="value"
@optionLabelPath="label"
@update={{action "setCurrency"}}
/>
</span>
</div>
</div>
<div class="gh-setting-members-prices">
<div class="gh-input-group">
@ -105,45 +195,8 @@
<p class="response w-100"><span class="red">{{this.stripePlanError}}</span></p>
{{/if}}
</GhFormGroup>
{{#if (feature 'freeTrial')}}
<GhFormGroup @errors={{this.errors}} @property="trialDays" data-test-formgroup="trialDays">
<div class="flex justify-between items-center mb2">
<div>
<h4 class="gh-tier-setting-title">Add a free trial</h4>
</div>
<div class="for-switch small">
<label class="switch" for="free-trial">
<Input
@checked={{this.freeTrialEnabled}}
@type="checkbox"
id="free-trial"
name="free-trial"
{{on "click" this.setFreeTrialEnabled}}
/>
<span class="input-toggle-component"></span>
</label>
</div>
</div>
{{/if}}
<div class="gh-input-group {{unless this.freeTrialEnabled "gh-input-group-tier-trial-disabled"}}">
<GhTextInput
@value={{readonly this.tier.trialDays}}
@type="number"
{{on "input" this.setTrialDays}}
@name="trial"
@id="trial"
@class="gh-input"
@disabled={{unless this.freeTrialEnabled "true"}}
data-test-input="tier-trial" />
<span class="gh-input-append">days</span>
</div>
<p>After trial, members will be automatically subscribed to the full price</p>
{{#if this.hasTrialDaysError}}
<p class="response w-100"><span class="red">Free trial must be at least 1 day</span></p>
{{/if}}
</GhFormGroup>
{{/if}}
</div>
<GhFormGroup>
<label for="welcomePage" class="fw6">Welcome page</label>
<GhUrlInput

10
ghost/admin/app/styles/layouts/settings.css
View File

@ -2415,6 +2415,9 @@ p.theme-validation-details {
.gh-settings-members-pricelabelcont {
display: flex;
align-items: baseline;
}
.gh-settings-members-pricelabelcont.free-trial-enabled {
justify-content: space-between;
margin-bottom: 3px;
}
@ -2452,8 +2455,15 @@ p.theme-validation-details {
}
.gh-setting-members-prices {
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 20px;
}
.gh-setting-members-prices.free-trial-enabled {
display: grid;
grid-template-rows: 1fr 1fr;
grid-template-columns: none !important;
grid-gap: 6px;
}