mirror of
https://github.com/TryGhost/Ghost.git
synced 2025-04-08 02:52:39 -05:00
Updated current plan visuals
This commit is contained in:
parent
f03ef9538d
commit
9529587ef7
3 changed files with 17 additions and 10 deletions
|
@ -326,6 +326,11 @@ const FrameStyles = `
|
|||
padding-bottom: 4vw;
|
||||
}
|
||||
|
||||
.gh-portal-popup-container.full-size.account-plan {
|
||||
justify-content: flex-start;
|
||||
padding-top: 4vmin;
|
||||
}
|
||||
|
||||
.gh-portal-popup-container.preview {
|
||||
animation: none !important;
|
||||
}
|
||||
|
|
|
@ -312,17 +312,19 @@ export const ProductsSectionStyles = ({site}) => {
|
|||
.gh-portal-current-plan {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 1.5rem;
|
||||
font-weight: 500;
|
||||
line-height: 1em;
|
||||
letter-spacing: 0.2px;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
height: 44px;
|
||||
border-radius: 5px;
|
||||
color: var(--grey0);
|
||||
font-weight: 600;
|
||||
color: var(--grey5);
|
||||
font-size: 1.4rem;
|
||||
font-weight: 500;
|
||||
line-height: 1em;
|
||||
letter-spacing: 0.2px;
|
||||
font-weight: 500;
|
||||
background: #f0f0f0;
|
||||
}
|
||||
|
||||
.gh-portal-product-card.only-free {
|
||||
|
@ -858,7 +860,7 @@ function ChangeProductCard({product, onPlanSelect}) {
|
|||
</div>
|
||||
{(currentPlan ?
|
||||
<div className='gh-portal-btn-product'>
|
||||
<span className='gh-portal-current-plan'>Current plan</span>
|
||||
<span className='gh-portal-current-plan'><span>Current plan</span></span>
|
||||
</div>
|
||||
:
|
||||
<div className='gh-portal-btn-product'>
|
||||
|
|
|
@ -125,7 +125,7 @@ const PlanConfirmationSection = ({plan, type, onConfirm}) => {
|
|||
const priceLabel = hasMultipleProductsFeature({site}) ? product?.name : 'Price';
|
||||
if (type === 'changePlan') {
|
||||
return (
|
||||
<>
|
||||
<div className='gh-portal-logged-out-form-container'>
|
||||
<div className='gh-portal-list mb6'>
|
||||
<section>
|
||||
<div className='gh-portal-list-detail'>
|
||||
|
@ -151,11 +151,11 @@ const PlanConfirmationSection = ({plan, type, onConfirm}) => {
|
|||
height: '40px'
|
||||
}}
|
||||
/>
|
||||
</>
|
||||
</div>
|
||||
);
|
||||
} else {
|
||||
return (
|
||||
<div className="gh-portal-cancellation-form">
|
||||
<div className="gh-portal-logged-out-form-container gh-portal-cancellation-form">
|
||||
<p>If you cancel your subscription now, you will continue to have access until <strong>{getDateString(subscription.current_period_end)}</strong>.</p>
|
||||
<section className='gh-portal-input-section'>
|
||||
<div className='gh-portal-input-labelcontainer'>
|
||||
|
|
Loading…
Add table
Reference in a new issue