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

Refined cancellation reason textarea

Browse source 
no refs.
- refined style and copy
This commit is contained in:
Peter Zimon 2020-11-25 09:42:42 +01:00
parent df2e451294
commit 3ffe293003
2 changed files with 35 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
ghost/portal/src/components/Global.styles.js
View file

@ -88,6 +88,17 @@ export const GlobalStyles = `
svg { svg {
box-sizing: content-box; box-sizing: content-box;
} }
input,
textarea {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
font-size: 1.5rem;
}
textarea {
padding: 10px;
line-height: 1.5em;
}
`; `;
export default GlobalStyles; export default GlobalStyles;

44
ghost/portal/src/components/pages/AccountPlanPage.js
View file

@ -24,6 +24,13 @@ export const AccountPlanPageStyles = `
.gh-portal-cancellation-form .gh-portal-input-section { .gh-portal-cancellation-form .gh-portal-input-section {
margin-bottom: 20px; margin-bottom: 20px;
} }
.gh-portal-cancellation-form .gh-portal-input {
resize: none;
width: 100%;
height: 62px;
padding: 6px 12px;
}
`; `;
const React = require('react'); const React = require('react');
@ -157,26 +164,23 @@ const PlanConfirmationSection = ({action, member, plan, type, brandColor, onConf
return ( return (
<div className="gh-portal-cancellation-form"> <div className="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> <p>If you cancel your subscription now, you will continue to have access until <strong>{getDateString(subscription.current_period_end)}</strong>.</p>
<textarea <section className='gh-portal-input-section'>
className='gh-portal-input' <div className='gh-portal-input-labelcontainer'>
key='cancellation_reason' <label className='gh-portal-input-label'>Cancellation reason</label>
label='Cancellation reason' </div>
type='text' <textarea
name='cancellation_reason' className='gh-portal-input'
placeholder='Tell us why you are cancelling' key='cancellation_reason'
value={reason} label='Cancellation reason'
onChange={e => setReason(e.target.value)} type='text'
rows="2" name='cancellation_reason'
maxlength="500" placeholder=''
style={{ value={reason}
width: '100%', onChange={e => setReason(e.target.value)}
maxWidth: '100%', rows="2"
height: '50px', maxlength="500"
maxHeight: '50px', />
minHeight: '40px', </section>
padding: '6px 12px'
}}
/>
<ActionButton <ActionButton
onClick={e => onConfirm(e, reason)} onClick={e => onConfirm(e, reason)}
isRunning={isRunning} isRunning={isRunning}