deblan-mirror/dnote
1
0
Fork 0
mirror of https://github.com/dnote/dnote synced 2026-03-18 00:09:56 +01:00
Code Issues Projects Releases Packages Wiki Activity

Render footer

Browse source
This commit is contained in:
Sung Won Cho 2019-11-27 11:58:03 +08:00
commit 639ac3e24c
2 changed files with 69 additions and 41 deletions
Download patch file Download diff file Expand all files Collapse all files

26
web/src/components/Subscription/Subscription.scss
View file

@ -18,12 +18,34 @@
@import '../App/responsive';
@import '../App/font';
@import '../App/theme';
@import '../App/rem';
.wrapper {
// padding-bottom: rem(80px);
background: white;
height: calc(100vh - #{$header-height});
display: flex;
flex-direction: column;
justify-content: center;
@include breakpoint(md) {
height: calc(100vh - #{$header-height});
}
}
.content {
margin-bottom: rem(40px);
@include breakpoint(md) {
margin-bottom: auto;
}
}
.footer {
margin-top: auto;
padding: rem(12px) 0;
text-align: center;
@include font-size('x-small');
color: $gray;
}
.hero {

88
web/src/components/Subscription/index.tsx
View file

@ -16,7 +16,7 @@
* along with Dnote. If not, see <https://www.gnu.org/licenses/>.
*/
import React, { Fragment } from 'react';
import React from 'react';
import Helmet from 'react-helmet';
import { Link } from 'react-router-dom';
import classnames from 'classnames';
@ -123,50 +123,56 @@ const Subscription: React.FunctionComponent<Props> = () => {
/>
</Helmet>
<div className={styles.hero}>
<div className={styles.content}>
<div className={styles.hero}>
<div className="container">
<h1 className={styles.heading}>Choose your Dnote plan.</h1>
</div>
</div>
<div className="container">
<h1 className={styles.heading}>Choose your Dnote plan.</h1>
</div>
</div>
<div className="container">
<div className={styles['plans-wrapper']}>
<CorePlan
wrapperClassName={styles['core-plan']}
ctaContent={
<a
href="https://github.com/dnote/dnote"
target="_blank"
rel="noopener noreferrer"
className="button button-normal button-second-outline button-stretch"
>
See source code
</a>
}
bottomContent={
<div className={styles.bottom}>
<FeatureList features={coreFeatures} />
</div>
}
/>
<ProPlan
wrapperClassName={styles['pro-plan']}
ctaContent={renderPlanCta()}
bottomContent={
<div className={styles.bottom}>
<div className={styles['pro-prelude']}>
Everything from the core plan, plus:
<div className={styles['plans-wrapper']}>
<CorePlan
wrapperClassName={styles['core-plan']}
ctaContent={
<a
href="https://github.com/dnote/dnote"
target="_blank"
rel="noopener noreferrer"
className="button button-normal button-second-outline button-stretch"
>
See source code
</a>
}
bottomContent={
<div className={styles.bottom}>
<FeatureList features={coreFeatures} />
</div>
<FeatureList
features={proFeatures}
wrapperClassName={styles['pro-feature-list']}
/>
</div>
}
/>
}
/>
<ProPlan
wrapperClassName={styles['pro-plan']}
ctaContent={renderPlanCta()}
bottomContent={
<div className={styles.bottom}>
<div className={styles['pro-prelude']}>
Everything from the core plan, plus:
</div>
<FeatureList
features={proFeatures}
wrapperClassName={styles['pro-feature-list']}
/>
</div>
}
/>
</div>
</div>
</div>
<footer className={styles.footer}>
&copy; 2019 Monomax Software Pty Ltd
</footer>
</div>
);
};