All pages: make header sections full viewport height

Author: MMesch

src/pages/about/index.tsx

@@ -25,7 +25,7 @@ export function getTeamByPageName(name: string) {
 export function AboutContent() {
   return (
     <>
-      <Section pageTop bg="yellow">
+      <Section pageTop fullHeight bg="yellow">
         <h1>About QuantStack</h1>
         <p>Founded in Paris in 2016, we are ~30 engineers and researchers who built the infrastructure layer of modern scientific computing. 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. We do this because we believe open-source is the most powerful force for good in science and technology.</p>
       </Section>

src/pages/blog.tsx

@@ -9,7 +9,7 @@ import BlogGrid from "../components/Blog";
 export default function BlogPage(): JSX.Element {
   return (
     <Layout>
-      <Section pageTop bg="yellow">
+      <Section pageTop fullHeight bg="yellow">
         <div style={{ display: "flex", alignItems: "center", gap: "12px" }}>
           <h1>
             Featured posts by QuantStack contributors

src/pages/careers.tsx

@@ -55,7 +55,7 @@ function InterviewCard({ person }) {
 function CareersContent() {
   return (
     <>
-      <Section pageTop bg="yellow">
+      <Section pageTop fullHeight bg="yellow">
         <h1>Join the QuantStack team.</h1>
         <p>We are ~30 researchers and engineers building the infrastructure of scientific computing. Your code will reach millions of users. Your contributions will go upstream. This is not a support role — it's a principal contributor role from day one.</p>
       </Section>

src/pages/contact.tsx

@@ -13,6 +13,7 @@ export default function ContactPage(): JSX.Element {
           <SplitSection
             ratio="50/50"
             pageTop
+            fullHeight
             reverse
             image={
               <ContactIllustration

src/pages/projects.tsx

@@ -19,7 +19,7 @@ function ProjectsContent() {
   return (
     <>
       {/* ── Header ────────────────────────────────────────────────────────── */}
-      <Section pageTop bg="yellow">
+      <Section pageTop fullHeight bg="yellow">
         <h1>Working in the open.</h1>
         <p className={styles.header_text}>
           From interactive environments to package managers to data formats — our tools reach

src/pages/services.tsx

@@ -15,7 +15,7 @@ function ServicesContent() {
   return (
     <>
       {/* ── Header ────────────────────────────────────────────────────────── */}
-      <Section pageTop bg="yellow">
+      <Section pageTop fullHeight bg="yellow">
         <h1>Hire the team that built the tools you depend on.</h1>
         <p>
           Bloomberg, AWS, Safran, ESA, and the Gates Foundation work with us because there is

src/pages/sponsor.tsx

@@ -10,7 +10,7 @@ import { MainAreaFundableProjects } from "../components/fundable";
 export function FundableContent() {
   return (
     <>
-      <Section pageTop bg="yellow">
+      <Section pageTop fullHeight bg="yellow">
         <h1>Sponsor open-source work</h1>
         <p>High-demand open-source features with detailed plans already in place — the work is scoped, the need is proven, only funding is missing. Back a project and get it shipped.</p>
       </Section>