Skip to content

Commit b9bc882

Browse files
FilledStacksFilledStacks
committed
- updates docusaurus
- Removes all footer links - adds newsletter sign up to landing page - Adds newsletter sign up to docs TCO
1 parent afe346e commit b9bc882

File tree

13 files changed

+417
-202
lines changed

13 files changed

+417
-202
lines changed

‎package.json‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -14,8 +14,8 @@
1414
"write-heading-ids": "docusaurus write-heading-ids"
1515
},
1616
"dependencies": {
17-
"@docusaurus/core": "^2.3.1",
18-
"@docusaurus/preset-classic": "^2.3.1",
17+
"@docusaurus/core": "^2.4.1",
18+
"@docusaurus/preset-classic": "^2.4.1",
1919
"@mdx-js/react": "^1.6.22",
2020
"autoprefixer": "^10.4.13",
2121
"clsx": "^1.2.1",
@@ -27,8 +27,8 @@
2727
"tailwindcss": "^3.2.4"
2828
},
2929
"devDependencies": {
30-
"@docusaurus/module-type-aliases": "^2.3.1",
31-
"@docusaurus/types": "^2.3.1",
30+
"@docusaurus/module-type-aliases": "^2.4.1",
31+
"@docusaurus/types": "^2.4.1",
3232
"@tsconfig/docusaurus": "^1.0.6",
3333
"@types/react": "^18.0.26",
3434
"typescript": "^4.9.4"

‎src/pages/index.tsx‎

Lines changed: 6 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import Link from "@docusaurus/Link";
33
import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
44
import { motion } from "framer-motion";
55
import { CLIIcon, FormIcon } from "../components/Icons";
6-
import Translate, {translate} from '@docusaurus/Translate';
6+
import Translate, { translate } from '@docusaurus/Translate';
77

88
const container = {
99
hidden: { opacity: 0 },
@@ -62,6 +62,7 @@ export default function Home() {
6262
</motion.div>
6363
</main>
6464

65+
6566
<div className="bg-gray-50">
6667
<section className="container text-center md:text-left flex gap-4 flex-col-reverse md:flex-row justify-evenly items-center min-h-[35vh] mx-auto py-16">
6768
<div>
@@ -91,7 +92,7 @@ export default function Home() {
9192
className="max-w-md text-xl"
9293
>
9394
<Translate id="index.powerfulCli.description">Never write boilerplate code again. The Stacked CLI
94-
generates your Views, Services and more.</Translate>
95+
generates your Views, Services and more.</Translate>
9596
<Link to="/docs/tooling/stacked-cli" className="block mt-2">
9697
<Translate id="index.powerfulCli.button">Learn More</Translate>
9798
</Link>
@@ -139,7 +140,7 @@ export default function Home() {
139140
className="max-w-md text-xl"
140141
>
141142
<Translate id="index.forms.description">No more setting up multiple controllers and cluttering
142-
up your build function. Let Stacked handle it.</Translate>
143+
up your build function. Let Stacked handle it.</Translate>
143144
<Link to="/docs/getting-started/form-basics" className="block mt-2">
144145
<Translate id="index.forms.button">Learn More</Translate>
145146
</Link>
@@ -215,7 +216,7 @@ export default function Home() {
215216
}}
216217
className="text-4xl"
217218
>
218-
<Translate id="index.more.title">And a lot more...</Translate>
219+
<Translate id="index.more.title">Stay up to date</Translate>
219220
</motion.h3>
220221
<motion.ul
221222
className="flex flex-col text-lg text-left list-none"
@@ -224,13 +225,7 @@ export default function Home() {
224225
whileInView="show"
225226
transition={{ delay: 0.05, staggerChildren: 1 }}
226227
>
227-
<motion.li variants={item}>✅ <Translate id="index.more.stateManagement">State management</Translate></motion.li>
228-
<motion.li variants={item}>✅ <Translate id="index.mroe.startupLogic">Start-up logic functionality</Translate></motion.li>
229-
<motion.li variants={item}>✅ <Translate id="index.more.navigation">Navigation</Translate></motion.li>
230-
<motion.li variants={item}>✅ <Translate id="index.more.dialogBuilders">Dialog UI builders</Translate></motion.li>
231-
<motion.li variants={item}>✅ <Translate id="index.more.bottomSheetBuilders">BottomSheet UI builders</Translate></motion.li>
232-
<motion.li variants={item}>✅ <Translate id="index.more.dependencyInversion">Dependency Inversion</Translate></motion.li>
233-
<motion.li variants={item}>✅ <Translate id="index.more.unitTests">Unit tests example</Translate></motion.li>
228+
<motion.li variants={item}><iframe src="https://filledstacks.substack.com/embed" width="480" height="320" style={{ border: "1px solid #EEE", background: "white" }}></iframe></motion.li>
234229
</motion.ul>
235230
</section>
236231
</div>

‎src/theme/DocItem/TOC/Desktop/index.js‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import React from 'react';
2+
import { ThemeClassNames } from '@docusaurus/theme-common';
3+
import { useDoc } from '@docusaurus/theme-common/internal';
4+
import TOC from '@theme/TOC';
5+
export default function DocItemTOCDesktop() {
6+
const { toc, frontMatter } = useDoc();
7+
return (
8+
<div>
9+
10+
<TOC
11+
toc={toc}
12+
minHeadingLevel={frontMatter.toc_min_heading_level}
13+
maxHeadingLevel={frontMatter.toc_max_heading_level}
14+
className={ThemeClassNames.docs.docTocDesktop}
15+
/>
16+
<iframe src="https://filledstacks.substack.com/embed" width="350" height="320" style={{ border: "1px solid #EEE", background: "white" }}></iframe>
17+
</div>
18+
);
19+
}

‎src/theme/Footer/Copyright/index.js‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import React from 'react';
2+
export default function FooterCopyright({copyright}) {
3+
return (
4+
<div
5+
className="footer__copyright"
6+
// Developer provided the HTML, so assume it's safe.
7+
// eslint-disable-next-line react/no-danger
8+
dangerouslySetInnerHTML={{__html: copyright}}
9+
/>
10+
);
11+
}

‎src/theme/Footer/Layout/index.js‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import React from 'react';
2+
import clsx from 'clsx';
3+
export default function FooterLayout({style, links, logo, copyright}) {
4+
return (
5+
<footer
6+
className={clsx('footer', {
7+
'footer--dark': style === 'dark',
8+
})}>
9+
<div className="container container-fluid">
10+
{(logo || copyright) && (
11+
<div className="footer__bottom text--center">
12+
{logo && <div className="margin-bottom--sm">{logo}</div>}
13+
{copyright}
14+
</div>
15+
)}
16+
</div>
17+
</footer>
18+
);
19+
}

‎src/theme/Footer/LinkItem/index.js‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import React from 'react';
2+
import Link from '@docusaurus/Link';
3+
import useBaseUrl from '@docusaurus/useBaseUrl';
4+
import isInternalUrl from '@docusaurus/isInternalUrl';
5+
import IconExternalLink from '@theme/Icon/ExternalLink';
6+
export default function FooterLinkItem({item}) {
7+
const {to, href, label, prependBaseUrlToHref, ...props} = item;
8+
const toUrl = useBaseUrl(to);
9+
const normalizedHref = useBaseUrl(href, {forcePrependBaseUrl: true});
10+
return (
11+
<Link
12+
className="footer__link-item"
13+
{...(href
14+
? {
15+
href: prependBaseUrlToHref ? normalizedHref : href,
16+
}
17+
: {
18+
to: toUrl,
19+
})}
20+
{...props}>
21+
{label}
22+
{href && !isInternalUrl(href) && <IconExternalLink />}
23+
</Link>
24+
);
25+
}

‎src/theme/Footer/Links/MultiColumn/index.js‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
import React from 'react';
2+
import LinkItem from '@theme/Footer/LinkItem';
3+
function ColumnLinkItem({item}) {
4+
return item.html ? (
5+
<li
6+
className="footer__item"
7+
// Developer provided the HTML, so assume it's safe.
8+
// eslint-disable-next-line react/no-danger
9+
dangerouslySetInnerHTML={{__html: item.html}}
10+
/>
11+
) : (
12+
<li key={item.href ?? item.to} className="footer__item">
13+
<LinkItem item={item} />
14+
</li>
15+
);
16+
}
17+
function Column({column}) {
18+
return (
19+
<div className="col footer__col">
20+
<div className="footer__title">{column.title}</div>
21+
<ul className="footer__items clean-list">
22+
{column.items.map((item, i) => (
23+
<ColumnLinkItem key={i} item={item} />
24+
))}
25+
</ul>
26+
</div>
27+
);
28+
}
29+
export default function FooterLinksMultiColumn({columns}) {
30+
return (
31+
<div className="row footer__links">
32+
{columns.map((column, i) => (
33+
<Column key={i} column={column} />
34+
))}
35+
</div>
36+
);
37+
}

‎src/theme/Footer/Links/Simple/index.js‎

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
import React from 'react';
2+
import LinkItem from '@theme/Footer/LinkItem';
3+
function Separator() {
4+
return <span className="footer__link-separator">·</span>;
5+
}
6+
function SimpleLinkItem({item}) {
7+
return item.html ? (
8+
<span
9+
className="footer__link-item"
10+
// Developer provided the HTML, so assume it's safe.
11+
// eslint-disable-next-line react/no-danger
12+
dangerouslySetInnerHTML={{__html: item.html}}
13+
/>
14+
) : (
15+
<LinkItem item={item} />
16+
);
17+
}
18+
export default function FooterLinksSimple({links}) {
19+
return (
20+
<div className="footer__links text--center">
21+
<div className="footer__links">
22+
{links.map((item, i) => (
23+
<React.Fragment key={i}>
24+
<SimpleLinkItem item={item} />
25+
{links.length !== i + 1 && <Separator />}
26+
</React.Fragment>
27+
))}
28+
</div>
29+
</div>
30+
);
31+
}

‎src/theme/Footer/Links/index.js‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import React from 'react';
2+
import {isMultiColumnFooterLinks} from '@docusaurus/theme-common';
3+
import FooterLinksMultiColumn from '@theme/Footer/Links/MultiColumn';
4+
import FooterLinksSimple from '@theme/Footer/Links/Simple';
5+
export default function FooterLinks({links}) {
6+
return isMultiColumnFooterLinks(links) ? (
7+
<FooterLinksMultiColumn columns={links} />
8+
) : (
9+
<FooterLinksSimple links={links} />
10+
);
11+
}

‎src/theme/Footer/Logo/index.js‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
import React from 'react';
2+
import clsx from 'clsx';
3+
import Link from '@docusaurus/Link';
4+
import {useBaseUrlUtils} from '@docusaurus/useBaseUrl';
5+
import ThemedImage from '@theme/ThemedImage';
6+
import styles from './styles.module.css';
7+
function LogoImage({logo}) {
8+
const {withBaseUrl} = useBaseUrlUtils();
9+
const sources = {
10+
light: withBaseUrl(logo.src),
11+
dark: withBaseUrl(logo.srcDark ?? logo.src),
12+
};
13+
return (
14+
<ThemedImage
15+
className={clsx('footer__logo', logo.className)}
16+
alt={logo.alt}
17+
sources={sources}
18+
width={logo.width}
19+
height={logo.height}
20+
style={logo.style}
21+
/>
22+
);
23+
}
24+
export default function FooterLogo({logo}) {
25+
return logo.href ? (
26+
<Link
27+
href={logo.href}
28+
className={styles.footerLogoLink}
29+
target={logo.target}>
30+
<LogoImage logo={logo} />
31+
</Link>
32+
) : (
33+
<LogoImage logo={logo} />
34+
);
35+
}

0 commit comments

Comments
 (0)