0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-03-25 02:31:59 -05:00

Added transition classnames for success icon

This commit is contained in:
Rishabh 2022-05-09 16:08:37 +05:30
parent a1be413924
commit 7ac062ae68

View file

@ -21,12 +21,18 @@ function AccountHeader() {
); );
} }
function SuccessIcon({show}) { function SuccessIcon({show, checked}) {
if (!show) { let classNames = [];
return null; if (show) {
classNames.push('gh-portal-show');
} }
if (checked) {
classNames.push('gh-portal-toggle-checked');
}
return ( return (
<div style={{marginRight: '8px', display: 'flex', transition: 'all ease 1s'}}> <div style={{marginRight: '8px', display: 'flex', transition: 'all ease 1s'}} className={classNames.join(' ')}>
<CheckmarkIcon className='gh-portal-checkmark-icon' alt='' style={{height: '24px', color: '#30cf43'}} /> <CheckmarkIcon className='gh-portal-checkmark-icon' alt='' style={{height: '24px', color: '#30cf43'}} />
</div> </div>
); );
@ -46,7 +52,7 @@ function NewsletterPrefSection({newsletter, subscribedNewsletters, setSubscribed
<p>{newsletter?.description}</p> <p>{newsletter?.description}</p>
</div> </div>
<div style={{display: 'flex', alignItems: 'center'}}> <div style={{display: 'flex', alignItems: 'center'}}>
<SuccessIcon show={showUpdated} /> <SuccessIcon show={showUpdated} checked={isChecked} />
<Switch id={newsletter.id} onToggle={(e, checked) => { <Switch id={newsletter.id} onToggle={(e, checked) => {
let updatedNewsletters = []; let updatedNewsletters = [];
if (!checked) { if (!checked) {