Skip to content

Commit 0d12972

Browse files
MMeschMMesch
committed
CTAs: left-align all; add Read more scroll button to all page headers
Remove flex-full-centered wrapper from LinkToContact (Banner centers its own children). Add ScrollDownCTA to every page header alongside the primary CTA, left-aligned in a flex row.
1 parent 659590a commit 0d12972

8 files changed

Lines changed: 53 additions & 18 deletions

File tree

‎src/components/LinkToContact.tsx‎

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,10 +2,8 @@ import Link from "@docusaurus/Link";
22

33
export default function LinkToContact({ label }: { label: string }) {
44
return (
5-
<div className="flex-full-centered">
6-
<Link className="link-to-button" href="/contact">
7-
{label}
8-
</Link>
9-
</div>
5+
<Link className="link-to-button" href="/contact">
6+
{label}
7+
</Link>
108
);
119
}

‎src/components/layout/ScrollDownCTA.tsx‎

Lines changed: 17 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,26 @@ import React from "react";
33
export default function ScrollDownCTA({ label = "Read more" }: { label?: string }) {
44
return (
55
<button
6-
className="link-to-button"
76
onClick={() => window.scrollBy({ top: window.innerHeight, behavior: "smooth" })}
8-
style={{ display: "inline-flex", alignItems: "center", gap: "8px", cursor: "pointer", background: "none", border: "none", padding: 0 }}
7+
style={{
8+
display: "inline-flex",
9+
alignItems: "center",
10+
gap: "8px",
11+
cursor: "pointer",
12+
background: "none",
13+
border: "none",
14+
padding: "14px 0",
15+
fontFamily: "var(--ifm-font-family-roboto)",
16+
fontSize: "15px",
17+
fontWeight: 700,
18+
letterSpacing: "0.5px",
19+
color: "var(--ifm-color-primary-p2)",
20+
textDecoration: "none",
21+
}}
922
>
1023
{label}
11-
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
12-
<path d="M8 3v10M4 9l4 4 4-4" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round" />
24+
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
25+
<path d="M9 3.5v11M4.5 10l4.5 4.5 4.5-4.5" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
1326
</svg>
1427
</button>
1528
);

‎src/pages/about/index.tsx‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import CardGrid from "@site/src/components/layout/CardGrid";
1111
import Card from "@site/src/components/layout/Card";
1212
import SectionSeparator from "@site/src/components/layout/SectionSeparator";
1313
import LinkToContact from "@site/src/components/LinkToContact";
14+
import ScrollDownCTA from "@site/src/components/layout/ScrollDownCTA";
1415

1516
export function getTeamByPageName(name: string) {
1617
for (const [, members] of Object.entries(teams)) {
@@ -29,7 +30,10 @@ export function AboutContent() {
2930
<h1>About QuantStack</h1>
3031
<p className="page-tagline">~30 engineers and researchers building the infrastructure of modern science.</p>
3132
<p>Founded in Paris in 2016. JupyterLab, Mamba, JupyterLite, emscripten-forge — tools reaching millions daily. Our founder received the ACM Software System Award, given to the same cohort as the creators of Unix, Java, and the World Wide Web.</p>
32-
<LinkToContact label="Get in touch" />
33+
<div style={{ display: "flex", gap: "var(--ifm-spacing-xl)", alignItems: "center", flexWrap: "wrap" }}>
34+
<LinkToContact label="Get in touch" />
35+
<ScrollDownCTA />
36+
</div>
3337
</Section>
3438
<SectionSeparator variant={4} />
3539
<Section>

‎src/pages/blog.tsx‎

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import Section from "../components/layout/Section";
55
import SectionSeparator from "../components/layout/SectionSeparator";
66
import AtomOrange from "/img/icons/RSSOrange.svg";
77
import BlogGrid from "../components/Blog";
8+
import ScrollDownCTA from "../components/layout/ScrollDownCTA";
89

910
export default function BlogPage(): JSX.Element {
1011
return (
@@ -15,10 +16,13 @@ export default function BlogPage(): JSX.Element {
1516
<p>
1617
Technical deep-dives, release notes, and perspectives from the people who wrote the code. Read about the decisions, trade-offs, and discoveries that go into the tools powering modern science. From Mamba's solver design to JupyterLab's real-time collaboration protocol — these posts come from the engineers who made the calls.
1718
</p>
18-
<a href={"/atom.xml"} className="link-to-button" style={{ display: "inline-flex", alignItems: "center", gap: "8px" }}>
19-
<AtomOrange width={"20px"} height={"20px"} />
20-
Subscribe via RSS
21-
</a>
19+
<div style={{ display: "flex", gap: "var(--ifm-spacing-xl)", alignItems: "center", flexWrap: "wrap" }}>
20+
<a href={"/atom.xml"} className="link-to-button" style={{ display: "inline-flex", alignItems: "center", gap: "8px" }}>
21+
<AtomOrange width={"20px"} height={"20px"} />
22+
Subscribe via RSS
23+
</a>
24+
<ScrollDownCTA label="Read posts" />
25+
</div>
2226
</Section>
2327
<SectionSeparator variant={1} />
2428
<Section>

‎src/pages/careers.tsx‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import Banner from "../components/layout/Banner";
77
import Link from "@docusaurus/Link";
88
import styles from "./careers.module.css";
99
import PlayCircle from "@site/static/img/icons/PlayCircle.svg";
10+
import ScrollDownCTA from "../components/layout/ScrollDownCTA";
1011

1112
import GroupPhotoUrl from "@site/static/img/group/group-photo.png";
1213
import SylvainPictureUrl from "@site/static/img/interviews/Sylvain_WTJ.png";
@@ -59,7 +60,10 @@ function CareersContent() {
5960
<h1>Join the QuantStack team.</h1>
6061
<p className="page-tagline">Your code will reach millions. Your contributions go upstream.</p>
6162
<p>We are ~30 researchers and engineers building the infrastructure of scientific computing. This is not a support role — it's a principal contributor role from day one. Most of us have PhDs or deep research backgrounds, and every one of us ships code upstream.</p>
62-
<Link className="link-to-button" href="/contact">Get in touch</Link>
63+
<div style={{ display: "flex", gap: "var(--ifm-spacing-xl)", alignItems: "center", flexWrap: "wrap" }}>
64+
<Link className="link-to-button" href="/contact">Get in touch</Link>
65+
<ScrollDownCTA />
66+
</div>
6367
</Section>
6468

6569
<SectionSeparator variant={2} />

‎src/pages/projects.tsx‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import SectionSeparator from "../components/layout/SectionSeparator";
66
import SplitSection from "../components/layout/SplitSection";
77
import Banner from "../components/layout/Banner";
88
import LinkToContact from "../components/LinkToContact";
9+
import ScrollDownCTA from "../components/layout/ScrollDownCTA";
910
import styles from "./projects.module.css";
1011

1112
import JupyterLogoUrl from "@site/static/img/projects/Jupyter.png";
@@ -28,7 +29,10 @@ function ProjectsContent() {
2829
Our tools are dependencies of dependencies — the foundation powering research pipelines, commercial data stacks, and classroom notebooks at scale.
2930
Everything we make is open-source, community-governed, and maintained for the long term.
3031
</p>
31-
<LinkToContact label="Work with us" />
32+
<div style={{ display: "flex", gap: "var(--ifm-spacing-xl)", alignItems: "center", flexWrap: "wrap" }}>
33+
<LinkToContact label="Work with us" />
34+
<ScrollDownCTA />
35+
</div>
3236
</Section>
3337

3438
<SectionSeparator variant={1} />

‎src/pages/services.tsx‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import SectionSeparator from "../components/layout/SectionSeparator";
66
import SplitSection from "../components/layout/SplitSection";
77
import Banner from "../components/layout/Banner";
88
import LinkToContact from "../components/LinkToContact";
9+
import ScrollDownCTA from "../components/layout/ScrollDownCTA";
910

1011
import SupportIllustration from "/img/illustrations/support.svg";
1112
import SpecialProjectsIllustration from "@site/static/img/illustrations/special_projects.svg";
@@ -24,7 +25,10 @@ function ServicesContent() {
2425
or a long-term engineering partner — you talk to the people who wrote the code.
2526
No account managers, no escalation queues.
2627
</p>
27-
<LinkToContact label="Get in touch" />
28+
<div style={{ display: "flex", gap: "var(--ifm-spacing-xl)", alignItems: "center", flexWrap: "wrap" }}>
29+
<LinkToContact label="Get in touch" />
30+
<ScrollDownCTA />
31+
</div>
2832
</Section>
2933

3034
<SectionSeparator variant={4} />

‎src/pages/sponsor.tsx‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import Section from "../components/layout/Section";
55
import SectionSeparator from "../components/layout/SectionSeparator";
66
import Banner from "../components/layout/Banner";
77
import LinkToContact from "../components/LinkToContact";
8+
import ScrollDownCTA from "../components/layout/ScrollDownCTA";
89
import { MainAreaFundableProjects } from "../components/fundable";
910

1011
export function FundableContent() {
@@ -14,7 +15,10 @@ export function FundableContent() {
1415
<h1>Sponsor open-source work</h1>
1516
<p className="page-tagline">Back the features the scientific community needs.</p>
1617
<p>High-demand open-source features with detailed plans already in place — the work is scoped, the need is proven, only funding is missing. Sponsoring through QuantStack means your investment lands upstream and benefits the entire ecosystem. Back a project and get it shipped.</p>
17-
<LinkToContact label="Get in touch" />
18+
<div style={{ display: "flex", gap: "var(--ifm-spacing-xl)", alignItems: "center", flexWrap: "wrap" }}>
19+
<LinkToContact label="Get in touch" />
20+
<ScrollDownCTA />
21+
</div>
1822
</Section>
1923
<SectionSeparator variant={3} />
2024
<Section>

0 commit comments

Comments
 (0)