TryGhost/Ghost
1
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2024-12-20 17:32:15 +03:00
Code Issues Projects Releases Wiki Activity

Refined paid account styles

Browse Source
This commit is contained in:
Peter Zimon 2020-07-21 10:40:39 +02:00
parent 73ee017b12
commit 94093a2041
3 changed files with 16 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ghost/portal/src/App.js
View File

@ -61,7 +61,7 @@ export default class App extends React.Component {
// Loads default page and popup state for local UI testing // Loads default page and popup state for local UI testing
if (process.env.NODE_ENV === 'development') { if (process.env.NODE_ENV === 'development') {
return { return {
page: 'accountPlan', page: 'accountHome',
showPopup: true showPopup: true
}; };
} }

2
ghost/portal/src/components/Frame.styles.js
View File

@ -153,7 +153,7 @@ export const GlobalStyles = `
.gh-portal-setting-heading { .gh-portal-setting-heading {
font-size: 13px; font-size: 13px;
margin-bottom: 4px; margin-bottom: 2px;
font-weight: 500; font-weight: 500;
} }

23
ghost/portal/src/components/pages/AccountHomePage.js
View File

@ -40,13 +40,13 @@ export const AccountHomePageStyles = `
.gh-portal-accountdetail-section { .gh-portal-accountdetail-section {
display: flex; display: flex;
align-items: center; align-items: flex-start;
margin-bottom: 32px; margin-bottom: 40px;
} }
.gh-portal-accountdetail-section:first-of-type { .gh-portal-accountdetail-section:first-of-type {
margin-top: 24px; margin-top: 32px;
margin-bottom: 26px; margin-bottom: 22px;
} }
.gh-portal-account-divider { .gh-portal-account-divider {
@ -67,13 +67,18 @@ export const AccountHomePageStyles = `
} }
.gh-portal-accountdetail-data { .gh-portal-accountdetail-data {
color: #656565;
line-height: 1em; line-height: 1em;
margin-top: 4px; margin-top: 4px;
color: #777;
} }
.gh-portal-accountdetail-data.small { .gh-portal-accountdetail-data.small {
font-size: 1.3rem; font-size: 1.3rem;
margin-top: 5px;
}
.gh-portal-setting-heading.paid-home {
font-weight: 600;
} }
/* Avatar styles */ /* Avatar styles */
@ -265,7 +270,7 @@ class PaidAccountHomePage extends React.Component {
<div> <div>
<section className='gh-portal-accountdetail-section'> <section className='gh-portal-accountdetail-section'>
<div className='flex flex-column flex-grow-1'> <div className='flex flex-column flex-grow-1'>
<h3 className='gh-portal-setting-heading'>Profile</h3> <h3 className='gh-portal-setting-heading paid-home'>Profile</h3>
<div> <div>
<div className='gh-portal-accountdetail-data'>{name}</div> <div className='gh-portal-accountdetail-data'>{name}</div>
<div className='gh-portal-accountdetail-data small'>{email}</div> <div className='gh-portal-accountdetail-data small'>{email}</div>
@ -276,7 +281,7 @@ class PaidAccountHomePage extends React.Component {
<section className='gh-portal-accountdetail-section'> <section className='gh-portal-accountdetail-section'>
<div className='flex flex-column flex-grow-1'> <div className='flex flex-column flex-grow-1'>
<h3 className='gh-portal-setting-heading'>Plan</h3> <h3 className='gh-portal-setting-heading paid-home'>Plan</h3>
<div> <div>
<div className='gh-portal-accountdetail-data'>{this.getPlanLabel(plan)}</div> <div className='gh-portal-accountdetail-data'>{this.getPlanLabel(plan)}</div>
</div> </div>
@ -286,7 +291,7 @@ class PaidAccountHomePage extends React.Component {
<section className='gh-portal-accountdetail-section'> <section className='gh-portal-accountdetail-section'>
<div className='flex flex-column flex-grow-1'> <div className='flex flex-column flex-grow-1'>
<h3 className='gh-portal-setting-heading'>Billing Info</h3> <h3 className='gh-portal-setting-heading paid-home'>Billing Info</h3>
<div> <div>
<div className='gh-portal-accountdetail-data'>{this.getCardLabel({defaultCardLast4})}</div> <div className='gh-portal-accountdetail-data'>{this.getCardLabel({defaultCardLast4})}</div>
</div> </div>
@ -296,7 +301,7 @@ class PaidAccountHomePage extends React.Component {
<section className='gh-portal-accountdetail-section'> <section className='gh-portal-accountdetail-section'>
<div className='flex flex-column flex-grow-1'> <div className='flex flex-column flex-grow-1'>
<h3 className='gh-portal-setting-heading'>Newsletter</h3> <h3 className='gh-portal-setting-heading paid-home'>Newsletter</h3>
<div> <div>
<div className='gh-portal-accountdetail-data'>You are subscribed to email newsletters</div> <div className='gh-portal-accountdetail-data'>You are subscribed to email newsletters</div>
</div> </div>