diff --git a/docusaurus.config.ts b/docusaurus.config.ts index 27ee2b857..2d3df3403 100644 --- a/docusaurus.config.ts +++ b/docusaurus.config.ts @@ -20,6 +20,11 @@ const config: Config = { organizationName: "/HaudinFlorence/", // Usually your GitHub org/user name. projectName: "quantstack.github.io", // Usually your repo name. + clientModules: [ + require.resolve("./src/clientModules/navbarScroll.ts"), + require.resolve("./src/clientModules/backgroundScene.ts"), + ], + onBrokenLinks: "warn", onBrokenMarkdownLinks: "warn", staticDirectories: ["static"], @@ -107,6 +112,12 @@ const config: Config = { }, items: [ + { + to: "/", + className: "custom_navbar_item", + label: "Home", + position: "left", + }, { to: "/projects/", className: "custom_navbar_item", @@ -122,7 +133,7 @@ const config: Config = { { to: "/about/", className: "custom_navbar_item", - label: "About us", + label: "About", position: "left", }, { @@ -138,16 +149,22 @@ const config: Config = { position: "left", }, { - to: "/fundable/", - label: "Fundable projects", - position: "right", - className: "fundable_projects" + to: "/sponsor/", + className: "custom_navbar_item", + label: "Sponsor", + position: "left", }, { to: "/contact/", - label: "Contact us", + className: "custom_navbar_item", + label: "Contact", + position: "left", + }, + { + to: "/notebooklink/", + className: "navbar_notebooklink", + label: "Notebook.link", position: "right", - className: "contact", }, { to: "https://github.com/QuantStack", diff --git a/flake.lock b/flake.lock new file mode 100644 index 000000000..0b0400ab4 --- /dev/null +++ b/flake.lock @@ -0,0 +1,27 @@ +{ + "nodes": { + "nixpkgs": { + "locked": { + "lastModified": 1778443072, + "narHash": "sha256-zi7/fsqM/kFdNuED//4WOCUtezGtKKqRNORjMvfwjnA=", + "owner": "NixOS", + "repo": "nixpkgs", + "rev": "da5ad661ba4e5ef59ba743f0d112cbc30e474f32", + "type": "github" + }, + "original": { + "owner": "NixOS", + "ref": "nixos-unstable", + "repo": "nixpkgs", + "type": "github" + } + }, + "root": { + "inputs": { + "nixpkgs": "nixpkgs" + } + } + }, + "root": "root", + "version": 7 +} diff --git a/flake.nix b/flake.nix new file mode 100644 index 000000000..4a1005f9e --- /dev/null +++ b/flake.nix @@ -0,0 +1,24 @@ +{ + inputs.nixpkgs.url = "github:NixOS/nixpkgs/nixos-unstable"; + + outputs = { self, nixpkgs }: + let + system = "x86_64-linux"; + pkgs = nixpkgs.legacyPackages.${system}; + in { + devShells.${system}.default = pkgs.mkShell { + buildInputs = with pkgs; [ + nodejs_20 + python3 + pkg-config + cairo + pango + libpng + libjpeg + giflib + librsvg + pixman + ]; + }; + }; +} diff --git a/scripts/generate-atom-feed.mjs b/scripts/generate-atom-feed.mjs index 33d92bb5b..59e3744e5 100644 --- a/scripts/generate-atom-feed.mjs +++ b/scripts/generate-atom-feed.mjs @@ -1,6 +1,6 @@ import fs from 'fs'; import { Feed } from 'feed'; -import { blogpostsDetails } from '../src/components/blog/blogpostsDetails.js'; +import { blogpostsDetails } from '../src/pages/blogs/_blogpostsDetails.js'; import path from 'path'; import { fileURLToPath } from 'url'; const __filename = fileURLToPath(import.meta.url); diff --git a/scripts/generate-rss-feed.mjs b/scripts/generate-rss-feed.mjs index 6fbde0bf2..e1ec21605 100644 --- a/scripts/generate-rss-feed.mjs +++ b/scripts/generate-rss-feed.mjs @@ -1,6 +1,6 @@ import fs from 'fs'; import RSS from 'rss'; -import { blogpostsDetails } from '../src/components/blog/blogpostsDetails.js'; +import { blogpostsDetails } from '../src/pages/blogs/_blogpostsDetails.js'; import path from 'path'; import { fileURLToPath } from 'url'; const __filename = fileURLToPath(import.meta.url); diff --git a/src/clientModules/backgroundScene.ts b/src/clientModules/backgroundScene.ts new file mode 100644 index 000000000..04a7f4998 --- /dev/null +++ b/src/clientModules/backgroundScene.ts @@ -0,0 +1,147 @@ +// Injects a fixed full-page background scene (planets, graph, code snippets) +// directly into document.body. Color switches to white when a dark section +// is in the centre of the viewport, detected via a scroll listener. + +// ─── SVG data ──────────────────────────────────────────────────────────────── + +const NODES: [number, number][] = [ + [110, 95], [360, 60], [680, 85], [990, 50], [1230, 105], + [1385, 190], [1350, 410], [1160, 330], [1030, 190], [870, 295], + [760, 470], [1210, 590], [1030, 740], [800, 830], [570, 775], + [340, 845], [140, 755], [62, 510], +]; + +const EDGES: [number, number][] = [ + [0,1],[1,2],[2,3],[3,4],[4,5],[5,6],[4,8],[8,9],[9,10], + [7,6],[6,11],[11,12],[12,13],[13,14],[14,15],[15,16],[16,17], + [2,9],[10,14],[7,11],[3,8],[0,17], +]; + +const SNIPPETS = [ + { text: "mamba install xtensor", x: 770, y: 765, angle: -4 }, + { text: "import ipywidgets as w", x: 1075, y: 540, angle: -6 }, + { text: "voila dashboard.ipynb", x: 1295, y: 435, angle: 5 }, + { text: "xt::arange(10)", x: 305, y: 855, angle: 7 }, + { text: "jupyter lite build", x: 920, y: 115, angle: -3 }, + { text: "import pyarrow as pa", x: 180, y: 380, angle: 4 }, +]; + +function buildSVG(): string { + const edges = EDGES.map(([a, b]) => + ``, + ).join(""); + + const nodes = NODES.map(([x, y]) => + ``, + ).join(""); + + const snippets = SNIPPETS.map(({ text, x, y, angle }) => + `${text}`, + ).join(""); + + return ` + + + + + + + + + + + + + + + ${edges}${nodes} + ${snippets} +`; +} + +// ─── DOM element ────────────────────────────────────────────────────────────── + +let bgEl: HTMLDivElement | null = null; + +function mount(): void { + // Recover existing element after HMR resets the module variable + if (!bgEl) { + bgEl = document.getElementById("page-background-scene") as HTMLDivElement | null; + } + if (bgEl) return; + + bgEl = document.createElement("div"); + bgEl.setAttribute("aria-hidden", "true"); + bgEl.setAttribute("id", "page-background-scene"); + Object.assign(bgEl.style, { + position: "fixed", + inset: "0", + zIndex: "1", + pointerEvents: "none", + userSelect: "none", + overflow: "hidden", + color: "#1d1d1b", + transition: "color 0.6s ease", + }); + bgEl.innerHTML = buildSVG(); + document.body.appendChild(bgEl); +} + +function applyDark(dark: boolean): void { + if (!bgEl) return; + bgEl.style.color = dark ? "#ffffff" : "#1d1d1b"; + const p = bgEl.querySelector("#_pbg_p"); + const g = bgEl.querySelector("#_pbg_g"); + const s = bgEl.querySelector("#_pbg_s"); + if (p) p.setAttribute("opacity", dark ? "0.12" : "0.09"); + if (g) g.setAttribute("opacity", dark ? "0.18" : "0.14"); + if (s) s.setAttribute("opacity", dark ? "0.15" : "0.11"); +} + +// ─── Scroll-based dark detection ────────────────────────────────────────────── +// Re-queries the DOM on every scroll so it always reflects the current page. + +function updateColor(): void { + const vh = window.innerHeight; + const darkEls = document.querySelectorAll("[data-section-bg='dark']"); + let anyDark = false; + darkEls.forEach((el) => { + const { top, bottom } = el.getBoundingClientRect(); + // Trigger when the dark section covers the middle 60 % of the viewport + if (top < vh * 0.8 && bottom > vh * 0.2) anyDark = true; + }); + applyDark(anyDark); +} + +let scrollListenerAdded = false; + +// ─── Route lifecycle ────────────────────────────────────────────────────────── + +export function onRouteDidUpdate(): void { + mount(); + + // Add the scroll listener once (persists across SPA navigations) + if (!scrollListenerAdded) { + window.addEventListener("scroll", updateColor, { passive: true }); + scrollListenerAdded = true; + } + + // Always reset to light first, then re-check after the DOM settles + applyDark(false); + requestAnimationFrame(updateColor); +} diff --git a/src/clientModules/navbarScroll.ts b/src/clientModules/navbarScroll.ts new file mode 100644 index 000000000..5b2311456 --- /dev/null +++ b/src/clientModules/navbarScroll.ts @@ -0,0 +1,31 @@ +const THRESHOLD = 20; +const DARK_HERO_PAGES = ["/notebooklink/"]; +const LOGO_DEFAULT = "/img/quantstack/logo-website-smaller.svg"; +const LOGO_WHITE_TEXT = "/img/quantstack/logo-website-white-text.svg"; + +function update(): void { + const scrolled = window.scrollY > THRESHOLD; + const { pathname } = window.location; + const isHome = pathname === "/"; + const isDarkHero = DARK_HERO_PAGES.some((p) => pathname.startsWith(p)); + const useDarkLogo = isDarkHero && !scrolled; + document.documentElement.toggleAttribute("data-navbar-scrolled", scrolled); + document.documentElement.toggleAttribute( + "data-navbar-home-top", + isHome && !scrolled + ); + document.documentElement.toggleAttribute("data-navbar-dark-top", useDarkLogo); + const logoImg = document.querySelector(".navbar__logo img") as HTMLImageElement | null; + if (logoImg) { + logoImg.src = useDarkLogo ? LOGO_WHITE_TEXT : LOGO_DEFAULT; + } +} + +export function onRouteDidUpdate(): void { + update(); +} + +if (typeof window !== "undefined") { + window.addEventListener("scroll", update, { passive: true }); + update(); +} diff --git a/src/components/Blog.tsx b/src/components/Blog.tsx new file mode 100644 index 000000000..c2c682b65 --- /dev/null +++ b/src/components/Blog.tsx @@ -0,0 +1,32 @@ +import React, { useState } from "react"; +import CardGrid from "./layout/CardGrid"; +import BlogpostCard from "./BlogpostCard"; +import { blogpostsDetails } from "../pages/blogs/_blogpostsDetails"; +import styles from "../pages/blog.module.css"; + +export default function BlogGrid() { + const [searchField, setSearchField] = useState(""); + + const filtered = blogpostsDetails.filter((blogpost) => + [blogpost.title, blogpost.authors, blogpost.date, blogpost.summary] + .some((field) => field.toLowerCase().includes(searchField.toLowerCase())) + ); + + return ( + <> + setSearchField(e.target.value)} + /> + + {filtered.map((blogpost, index) => ( +
  • + +
    • + ))} +     + + ); +} diff --git a/src/components/BlogpostCard.tsx b/src/components/BlogpostCard.tsx new file mode 100644 index 000000000..5716e1d67 --- /dev/null +++ b/src/components/BlogpostCard.tsx @@ -0,0 +1,33 @@ +import styles from "../pages/blog.module.css"; +import Link from "@docusaurus/Link"; +import useBaseUrl from "@docusaurus/useBaseUrl"; +import Card from "./layout/Card"; + +export default function BlogpostCard({ blogpost }) { + return ( + + +
    + Illustration for the blog post. +
    +
    {blogpost.title}
    +
    + {blogpost.summary.length < 200 + ? blogpost.summary + : blogpost.summary.substring(0, 200) + "..."} +
    +
    +
    + + {blogpost.date} +
    +
    {blogpost.authors}
    +
    + +     + ); +} diff --git a/src/components/ContactForm.tsx b/src/components/ContactForm.tsx new file mode 100644 index 000000000..4ef02efa2 --- /dev/null +++ b/src/components/ContactForm.tsx @@ -0,0 +1,32 @@ +import styles from "../pages/contact.module.css"; + +export default function ContactForm() { + return ( +
    + {[ + { label: "Your name", name: "name", type: "text" }, + { label: "Your company", name: "company", type: "text" }, + { label: "Your email", name: "email", type: "text" }, + { label: "Your phone number", name: "phone-number", type: "text" }, + ].map(({ label, name, type }) => ( +
    + +
    + +
    +
    + ))} +
    + + -
    - -
    -
    - -
    -
    -
    - - ); - } \ No newline at end of file diff --git a/src/components/contact/index.tsx b/src/components/contact/index.tsx deleted file mode 100644 index eb0614f2d..000000000 --- a/src/components/contact/index.tsx +++ /dev/null @@ -1,33 +0,0 @@ -import styles from "./styles.module.css"; -import ContactForm from "./ContactForm"; -import { useEffect, useState } from "react"; -import ContactIllustration from "/img/illustrations/contact.svg"; - -export function Contact() { - return ( -
    -

    Contact us

    -
    -
    - -
    -
    - -
    -
    -
    - ); -} -export default Contact; diff --git a/src/components/footer/Footer.tsx b/src/components/footer/Footer.tsx index 2e0682037..f864a398c 100644 --- a/src/components/footer/Footer.tsx +++ b/src/components/footer/Footer.tsx @@ -41,7 +41,7 @@ export default function Footer() {
    • - Home + Home
    • diff --git a/src/components/footer/styles.module.css b/src/components/footer/styles.module.css index 6b0cc7760..b5253eb87 100644 --- a/src/components/footer/styles.module.css +++ b/src/components/footer/styles.module.css @@ -1,6 +1,8 @@ .footer_container { background-color: var(--ifm-color-primary-p1); padding: var(--ifm-spacing-xl) var(--ifm-spacing-2xl) 0 var(--ifm-spacing-2xl); + position: relative; + z-index: 2; } .copyright_container { diff --git a/src/components/fundable/FundableProjectCard.tsx b/src/components/fundable/FundableProjectCard.tsx new file mode 100644 index 000000000..bdf3ffeeb --- /dev/null +++ b/src/components/fundable/FundableProjectCard.tsx @@ -0,0 +1,35 @@ +import styles from "./styles.module.css"; +import { useHistory } from "@docusaurus/router"; +import ProgressBar from "./ProgressBar"; +import Card from "../layout/Card"; + +export default function FundableProjectCard({ project }) { + const history = useHistory(); + + function open() { + history.push({ + pathname: `/sponsor/${project.pageName}`, + state: { fromFundable: true, scrollY: window.scrollY }, + }); + } + + const desc = project.shortDescription.length > 160 + ? project.shortDescription.substring(0, 160) + "…" + : project.shortDescription; + + return ( + +
      {project.category}
      +
      {project.title}
      +

      {desc}

      +
      +
      {project.price}
      + +
      + {project.currentFundingPercentage}% funded + {project.currentNbOfFunders > 0 && ` · ${project.currentNbOfFunders} funder${project.currentNbOfFunders > 1 ? "s" : ""}`} +
      +
      +       + ); +} diff --git a/src/components/fundable/GetAQuotePage.tsx b/src/components/fundable/GetAQuotePage.tsx index 0c0510876..6e5a03346 100644 --- a/src/components/fundable/GetAQuotePage.tsx +++ b/src/components/fundable/GetAQuotePage.tsx @@ -6,7 +6,7 @@ import { useHistory, useLocation } from "@docusaurus/router"; import Layout from "@theme/Layout"; import { Route } from 'react-router-dom'; import { getCategoryFromProjectPageName } from "."; -import FundableProjects from "."; +import { FundableContent as FundableProjects } from "@site/src/pages/sponsor"; function GetAQuoteComponent({ project }) { return ( @@ -32,14 +32,14 @@ export default function GetAQuotePage() { const history = useHistory(); const handleClose = () => { - history.push('/fundable'); + history.push('/sponsor'); } return ( { const { pageName } = match.params; /* extract the dynamic part from the url i.e. the pageName*/ const projectsByCategory = getCategoryFromProjectPageName(pageName); diff --git a/src/components/fundable/LargeProjectCard.tsx b/src/components/fundable/LargeProjectCard.tsx index 2c29adfe6..22e0ef631 100644 --- a/src/components/fundable/LargeProjectCard.tsx +++ b/src/components/fundable/LargeProjectCard.tsx @@ -11,7 +11,7 @@ export function LargeProjectCardContent({ project }) { const pageName = project.pageName; history.push({ - pathname: `/fundable/${pageName}/GetAQuote`, + pathname: `/sponsor/${pageName}/GetAQuote`, state: { from: location.pathname, scrollY: window.scrollY }, }); } diff --git a/src/components/fundable/LargeProjectCardPage.tsx b/src/components/fundable/LargeProjectCardPage.tsx index 708342515..f8842904c 100644 --- a/src/components/fundable/LargeProjectCardPage.tsx +++ b/src/components/fundable/LargeProjectCardPage.tsx @@ -4,8 +4,8 @@ import { useHistory, useLocation } from '@docusaurus/router'; import { useEffect } from 'react'; import { Route } from 'react-router-dom'; import { getCategoryFromProjectPageName } from "."; +import { FundableContent } from "@site/src/pages/sponsor"; import styles from "@site/src/components/about/styles.module.css"; -import FundableProjects from '.'; import LargeProjectCard from './LargeProjectCard'; export default function LargeProjectCardPage() { @@ -25,13 +25,13 @@ export default function LargeProjectCardPage() { window.scrollTo({ top: scrollY, behavior: 'auto' }); } }, 0); - history.replace('/fundable'); + history.replace('/sponsor'); }; const handleClose = () => { const scrollY = location.state?.scrollY; if (location.state?.fromFundable) { - history.replace('/fundable'); + history.replace('/sponsor'); setTimeout(() => { if (scrollY !== undefined) { @@ -44,9 +44,9 @@ export default function LargeProjectCardPage() { } return ( - + { const { pageName } = match.params; /* extract the dynamic part from the url i.e. the pageName*/ const projectsByCategory = getCategoryFromProjectPageName(pageName); diff --git a/src/components/fundable/LinkToGetAQuote.tsx b/src/components/fundable/LinkToGetAQuote.tsx index 7219bb941..cbc41266f 100644 --- a/src/components/fundable/LinkToGetAQuote.tsx +++ b/src/components/fundable/LinkToGetAQuote.tsx @@ -6,7 +6,7 @@ export default function LinkToGetAQuote({ label, pageName }) {
      {label} diff --git a/src/components/fundable/SmallProjectCard.tsx b/src/components/fundable/SmallProjectCard.tsx index dba7e93d9..1dc0c3021 100644 --- a/src/components/fundable/SmallProjectCard.tsx +++ b/src/components/fundable/SmallProjectCard.tsx @@ -13,7 +13,7 @@ export function SmallProjectCard({ project }) { const pageName = project.pageName; history.push({ - pathname: `/fundable/${pageName}`, + pathname: `/sponsor/${pageName}`, state: { fromFundable: true, scrollY: window.scrollY }, }); } diff --git a/src/components/fundable/index.tsx b/src/components/fundable/index.tsx index 976fa64de..ad220d0f2 100644 --- a/src/components/fundable/index.tsx +++ b/src/components/fundable/index.tsx @@ -1,73 +1,61 @@ +import { useState, useEffect } from "react"; import styles from "./styles.module.css"; -import { fundableProjectsDetails } from "./projectsDetails"; -import ProjectCategory from "./ProjectCategory"; -import MenuSidebar from "./MenuSideBar"; -import LinkToContact from "../home/LinkToContact"; +import CardGrid from "../layout/CardGrid"; +import { fundableProjectsDetails } from "@site/src/pages/sponsor/_projectsDetails"; +import FundableProjectCard from "./FundableProjectCard"; + +const ALL_PROJECTS = Object.values(fundableProjectsDetails).flat(); +const CATEGORIES = ["All", ...new Set(ALL_PROJECTS.map((p) => p.category))]; export function getCategoryFromProjectPageName(pageName: string) { - for (const [categoryName, projectsByCategory] of Object.entries(fundableProjectsDetails)) { - const project = projectsByCategory.find((project) => project.pageName === pageName); - if (project) { - return projectsByCategory; - } + for (const projects of Object.values(fundableProjectsDetails)) { + const found = projects.find((p) => p.pageName === pageName); + if (found) return projects; } return null; } export function MainAreaFundableProjects() { - return ( -
      -

      Check out our projects available for funding!

      + const [active, setActive] = useState(() => { + if (typeof window === "undefined") return "All"; + const param = new URLSearchParams(window.location.search).get("category"); + return CATEGORIES.includes(param) ? param : "All"; + }); -
      - -
      -
      - -
      -
      - -
      -
      - -
      -
      -

      Can't find a project?

      -

      If you have a project in mind that you think would be relevant to our expertise, please contact us to discuss it.

      - -
      -
      - ) -} + useEffect(() => { + const url = new URL(window.location.href); + if (active === "All") { + url.searchParams.delete("category"); + } else { + url.searchParams.set("category", active); + } + window.history.replaceState(null, "", url.toString()); + }, [active]); -export default function FundableProjects() { - return ( + const visible = active === "All" + ? ALL_PROJECTS + : ALL_PROJECTS.filter((p) => p.category === active); -
      -
      -
      - -
      -
      - -
      -
      - -
      + return ( + <> +
      + {CATEGORIES.map((cat) => ( + + ))}
      -
      - + + {visible.map((project) => ( +
    • + +
      • + ))} + + ); } diff --git a/src/components/fundable/styles.module.css b/src/components/fundable/styles.module.css index a327b4996..c0f16fe70 100644 --- a/src/components/fundable/styles.module.css +++ b/src/components/fundable/styles.module.css @@ -1,11 +1,104 @@ +/* ── Filter + grid layout ──────────────────────────────── */ + +.filter_tags { + display: flex; + flex-wrap: wrap; + gap: var(--ifm-spacing-sm); + margin-bottom: var(--ifm-spacing-xl); +} + +.filter_tag { + padding: 6px var(--ifm-spacing-md); + border-radius: 20px; + border: 1.5px solid var(--ifm-color-secondary-s3); + background: transparent; + color: var(--ifm-color-secondary-s3); + font-family: var(--ifm-font-family-roboto); + font-size: 13px; + font-weight: 600; + cursor: pointer; + transition: background 0.15s, color 0.15s, border-color 0.15s; +} + +.filter_tag:hover { + background: var(--ifm-color-secondary-s1); + color: var(--ifm-color-secondary-s2); + border-color: var(--ifm-color-secondary-s1); +} + +.filter_tag_active { + background: var(--ifm-bg-emphasis); + color: white; + border-color: var(--ifm-bg-emphasis); +} + + +.fund_card { + gap: var(--ifm-spacing-sm); +} + +.fund_card_category { + font-size: 11px; + font-weight: 700; + text-transform: uppercase; + letter-spacing: 0.6px; + color: var(--ifm-color-secondary-s3); +} + +.fund_card_title { + font-family: var(--ifm-font-family-roboto); + font-size: 16px; + font-weight: 600; + color: var(--ifm-color-primary-p2); + line-height: 1.4; +} + +.fund_card_desc { + font-size: 13px !important; + color: var(--ifm-color-neutral-n1); + line-height: 1.5; + flex: 1; + padding: 0 !important; + margin: 0 !important; +} + +.fund_card_footer { + margin-top: auto; + padding-top: var(--ifm-spacing-sm); + border-top: 1px solid var(--ifm-color-neutral-n3); + display: flex; + flex-direction: column; + gap: 4px; +} + +.fund_card_price { + font-family: var(--ifm-font-family-roboto); + font-size: 17px; + font-weight: 700; + color: var(--ifm-color-primary-p2); +} + +.fund_card_pct { + font-size: 12px; + color: var(--ifm-color-neutral-n1); +} + +.propose_section { + border-top: 1px solid var(--ifm-color-neutral-n3); + padding-top: var(--ifm-spacing-2xl); + margin-top: var(--ifm-spacing-xl); +} + +/* ── Legacy card (kept for SmallProjectCard / ProjectCategory) ── */ + .small_project_card:hover { box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); } .project_category_header { - font-family: var(--ifm-font-family-rubik-one); + font-family: var(--ifm-font-family-roboto); font-style: normal; - font-weight: 400; + font-weight: 700; line-height: 20px; text-align: center; margin-bottom: var(--ifm-spacing-xl); @@ -15,7 +108,7 @@ .project_title { color: var(--ifm-text-color-main-title); - font-family: var(--ifm-font-family-bebas-neue); + font-family: var(--ifm-font-family-roboto); font-size: 32px; font-style: normal; font-weight: 600; @@ -43,7 +136,7 @@ left: 0; right: 0; bottom: 0; - background-color: rgba(0, 0, 0, 0.3); + background-color: var(--ifm-overlay-background); z-index: 1000; } @@ -52,7 +145,7 @@ top: 50%; left: 50%; transform: translate(-50%, -50%); - background-color: white; + background-color: var(--ifm-bg-neutral); border: 1px solid #ccc; box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2); border-radius: 20px; @@ -96,7 +189,6 @@ .link_to_get_a_quote { background-color: var(--ifm-color-orange-jupyter); color: white; - width: 358px; font-weight: 700; } @@ -106,41 +198,6 @@ margin: var(--ifm-spacing-md) 0; } -.menu_sidebar { - padding: 1rem; - overflow-y: auto; -} - -.menu_sidebar_item { - font-family: var(--ifm-font-family-roboto); - font-size: 16px; - font-style: normal; - font-weight: 500; - line-height: 48px; - /* 300% */ - letter-spacing: 0.15px; -} - -.menu_sidebar_container { - position: fixed; - display: flex; - height: auto; -} - -.menu_sidebar_indicator { - display: inline-block; - width: 6px; - height: 20px; - border-radius: 4px; - background-color: transparent; - margin-right: 10px; - transition: background-color 0.3s ease; - vertical-align: middle; -} - -.active_section .menu_sidebar_indicator { - background-color: #D9D9D9; -} .send_button { width: 258px; @@ -158,7 +215,7 @@ .form_label { font-size: 12px; color: var(--ifm-text-color); - background-color: var(--ifm-background-color); + background-color: var(--ifm-bg-neutral); } .project_information_container { @@ -302,14 +359,6 @@ padding: var(--ifm-spacing-md); } - .main_area_desktop { - display: none - } - - .menu_sidebar { - display: none - } - .small_project_card { width: 90vw; margin-bottom: var(--ifm-spacing-lg); @@ -409,10 +458,6 @@ max-height: 95vh; } - .main_area_desktop { - display: none - } - .small_input { width: 400px; height: 56px; @@ -435,10 +480,6 @@ height: 200px; } - .menu_sidebar { - display: none - } - .get_a_quote_dialog { width: 80vw; padding: 40px; @@ -486,14 +527,6 @@ max-height: 95vh; } - .main_area_mobile { - display: none; - } - - .main_area_desktop { - padding-left: 80px; - } - .small_input { width: 400px; height: 56px; diff --git a/src/components/home/AboutQS/index.tsx b/src/components/home/AboutQS/index.tsx deleted file mode 100644 index 14e5903d6..000000000 --- a/src/components/home/AboutQS/index.tsx +++ /dev/null @@ -1,37 +0,0 @@ -import styles from "./styles.module.css"; -import GroupPhotoUrl from "@site/static/img/group/QuantStack-2000-58.png"; -import LinkToAboutUs from "../LinkToAboutUs"; - -export default function AboutQS() { - return ( -
      -
      -
      -
      - We are a team of expert of open-source developers, the very same - people behind a number of technologies that you already use. -
      -
      -
      -
      -
      -
      - { -
      -
      -
      -
      -
      -
      - -
      -
      -
      -
      - ); -} diff --git a/src/components/home/AboutQS/styles.module.css b/src/components/home/AboutQS/styles.module.css deleted file mode 100644 index 90fa260f8..000000000 --- a/src/components/home/AboutQS/styles.module.css +++ /dev/null @@ -1,30 +0,0 @@ -@media only screen and (max-width: 996px) { - .aboutQS_container { - background-color: var(--ifm-color-secondary-s2); - color: white; - padding: var(--ifm-spacing-2xl) var(--ifm-spacing-2xl) 0 - var(--ifm-spacing-2xl); - text-align: center; - } - - .aboutQS_text { - font-size: 14px; - text-align: center; - margin-bottom: var(--ifm-spacing-xl); - } -} - -@media only screen and (min-width: 996px) { - .aboutQS_container { - background-color: var(--ifm-color-primary-p1); - color: var(--ifm-color-primary-p2); - padding: var(--ifm-spacing-2xl) var(--ifm-spacing-5xl) 0 - var(--ifm-spacing-5xl); - } - - .aboutQS_text { - font-size: 24px; - text-align: center; - margin-bottom: var(--ifm-spacing-lg); - } -} diff --git a/src/components/home/Hero/Banner.tsx b/src/components/home/Hero/Banner.tsx deleted file mode 100644 index f70731341..000000000 --- a/src/components/home/Hero/Banner.tsx +++ /dev/null @@ -1,40 +0,0 @@ -// src/components/PageBanner.tsx -import React from 'react'; -import styles from "./styles.module.css"; -import LinkToNotebookLink from './LinkToNotebookLink'; - -export default function Banner() { - return ( -
      -
      -
      -
      Introducing Notebook.link
      -
      The future of notebook sharing
      - -
      -
      -
      - -
      -
      Introducing Notebook.link
      -
      The future of notebook sharing
      - -
      -
      -
      -
      -
      Introducing Notebook.link
      -
      The future of notebook sharing
      - -
      -
      -
      -
      -
      Introducing Notebook.link
      -
      The future of notebook sharing
      - -
      -
      -
      - ); -} diff --git a/src/components/home/Hero/LinkToNotebookLink.tsx b/src/components/home/Hero/LinkToNotebookLink.tsx deleted file mode 100644 index ca31445f6..000000000 --- a/src/components/home/Hero/LinkToNotebookLink.tsx +++ /dev/null @@ -1,9 +0,0 @@ -import styles from "./styles.module.css"; - -export default function LinkToNotebookLink({label}) { - return ( - - ); -} diff --git a/src/components/home/Hero/LogosTableBy8.tsx b/src/components/home/Hero/LogosTableBy8.tsx deleted file mode 100644 index 1f485e89e..000000000 --- a/src/components/home/Hero/LogosTableBy8.tsx +++ /dev/null @@ -1,382 +0,0 @@ -import styles from "./styles.module.css"; -import BloombergLogoUrl from "@site/static/img/logos/Bloomberg.png"; -import SGLogoUrl from "@site/static/img/logos/SG.png"; -import RapyutaLogoUrl from "@site/static/img/logos/Rapyuta.png"; -import CFMLogoUrl from "@site/static/img/logos/CFM.png"; -import EngieLogoUrl from "@site/static/img/logos/Engie.png"; -import JRCLogoUrl from "@site/static/img/logos/JRC.png"; -import ERDCLogoUrl from "@site/static/img/logos/ERDC.png"; -import PandaLogoUrl from "@site/static/img/logos/Panda.png"; -import UniversiteParisCiteLogoUrl from "@site/static/img/logos/UniversiteParisCite.png"; -import AirbusLogoUrl from "@site/static/img/logos/Airbus.png"; -import INRIALogoUrl from "@site/static/img/logos/INRIA.png"; -import CNAMLogoUrl from "@site/static/img/logos/CNAM.png"; -import NatixisLogoUrl from "@site/static/img/logos/Natixis.png"; -import NumfocusLogoUrl from "@site/static/img/logos/Numfocus.png"; -import RobocorpLogoUrl from "@site/static/img/logos/Robocorp.png"; -import CalPolyLogoUrl from "@site/static/img/logos/CalPoly.png"; -import MaxFordhamLogoUrl from "@site/static/img/logos/MaxFordham.png"; -import GainTheoryUrl from "@site/static/img/logos/GainTheory.png"; -import EnthoughtLogoUrl from "@site/static/img/logos/Enthought.png"; -import CressetLogoUrl from "@site/static/img/logos/Cresset.png"; -import TDKLogoUrl from "@site/static/img/logos/TDK.png"; -import HarvardLogoUrl from "@site/static/img/logos/Harvard.png"; -import EMBLLogoUrl from "@site/static/img/logos/EMBL.png"; -import QuantCoUrl from "@site/static/img/logos/QuantCo.png"; -import VoltronDataLogoUrl from "@site/static/img/logos/VoltronData.png"; -import SafranLogoUrl from "@site/static/img/logos/Safran.png"; -import DEShawLogoUrl from "@site/static/img/logos/DEShaw.png"; -import UniversiteParisSaclayLogoUrl from "@site/static/img/logos/UniversiteParisSaclay.png"; -import UnitedRoboticsLogoUrl from "@site/static/img/logos/UnitedRobotics.png"; -import CEALogoUrl from "@site/static/img/logos/CEA.png"; -import EcolePolytechniqueLogoUrl from "@site/static/img/logos/EcolePolytechnique.png"; -import ESALogoUrl from "@site/static/img/logos/ESA.png"; -import CNESLogoUrl from "@site/static/img/logos/CNES.png"; -import GatesFoundationLogoUrl from "@site/static/img/logos/GatesFoundation.png"; -import SovereignTechAgencyLogoUrl from "@site/static/img/logos/SovereignTechAgency.png"; - -import Slider from "react-slick"; -// Import css files -import "slick-carousel/slick/slick.css"; -import "slick-carousel/slick/slick-theme.css"; - -export default function SimpleSlider() { - let settings = { - dots: true, - infinite: true, - speed: 1000, - slidesToShow: 1, - slidesToScroll: 1, - arrows: false, - autoplay: true, - }; - return ( - -
      - -
      -
      - -
      -
      - -
      -
      - -
      -
      - -
      -       - ); -} - -export function LogosTable1() { - return ( -
      -
      -
      - {"Logo -
      -
      - {"Logo -
      -
      - {"Logo -
      -
      - {"Logo -
      -
      -
      -
      - {"Logo -
      -
      - {"Logo -
      - -
      - {"Logo -
      -
      - {"Logo -
      -
      -
      - ); -} - -export function LogosTable2() { - return ( -
      -
      -
      - {"Logo -
      -
      - {"Logo -
      -
      - {"Logo -
      -
      - {"Logo -
      -
      -
      -
      - {"Logo -
      -
      - {"Logo -
      -
      - {"Logo -
      -
      - {"Logo -
      -
      -
      - ); -} - -export function LogosTable3() { - return ( -
      -
      -
      - {"Logo -
      -
      - {"Logo -
      - -
      - {"Logo -
      -
      - {"Logo -
      -
      -
      -
      - {"Logo -
      -
      - {"Logo -
      -
      - {"Logo -
      -
      - {"Logo -
      -
      -
      - ); -} - -export function LogosTable4() { - return ( -
      -
      -
      - {"Logo -
      -
      - {"Logo -
      -
      - {"Logo -
      -
      - {"Logo -
      -
      -
      -
      - {"Logo -
      -
      - {"Logo -
      -
      - {"Logo -
      -
      - {"Logo -
      -
      -
      - ); -} - -export function LogosTable5() { - return ( -
      -
      -
      - {"Logo -
      -
      - {"Logo -
      -
      - {"Logo -
      -
      -
      - ); -} diff --git a/src/components/home/Hero/index.tsx b/src/components/home/Hero/index.tsx deleted file mode 100644 index 8dfa4ea7a..000000000 --- a/src/components/home/Hero/index.tsx +++ /dev/null @@ -1,62 +0,0 @@ -import styles from "./styles.module.css"; -import SimpleSlider from "./LogosTableBy8"; -import Astronaut from "/img/quantstack/astronaut.svg"; -import Banner from "./Banner"; - - -export function Hero() { - return ( -
      - -
      -
      -
      -
      -
      -
      -

      - Open-source for discovery, science, and education -

      -

      - A team behind major open-source projects of the scientific - computing ecosystem -

      -

      - Jupyter, Conda-forge, Mamba, Voilà, Xtensor and more. -

      -
      - -
      - -
      -
      -
      -
      -
      -
      -
      -
      -
      We have worked with
      -
      -
      -
      -
      - -
      -
      -
      -
      -
      - ); -} -export default Hero; diff --git a/src/components/home/Hero/styles.module.css b/src/components/home/Hero/styles.module.css deleted file mode 100644 index 89e31f669..000000000 --- a/src/components/home/Hero/styles.module.css +++ /dev/null @@ -1,225 +0,0 @@ -.h2_custom { - color: var(--ifm-color-blue-jupyter); -} - -.sub_header { - text-align: left; -} - -.hero_container { - background-color: var(--ifm-color-primary-p0); - padding-bottom: var(--ifm-spacing-3xl); -} - -.row_max_width { - max-width: 1500px; - display: flex; -} - -.banner_container_small { - position: relative; - width: 100%; - display: flex; - align-items: center; - background-image: url('/img/banner/notebook-link-banner-small.svg'); - background-position: center; - background-repeat: no-repeat; - height: 464px; - padding-bottom: 110px; -} - -.banner_container_medium { - position: relative; - width: 100%; - display: flex; - align-items: center; - background-image: url('/img/banner/notebook-link-banner-medium.svg'); - background-position: center; - background-repeat: no-repeat; - height: 464px; - padding-bottom: 110px; -} - -.banner_container_large { - position: relative; - width: 100%; - display: flex; - align-items: center; - background-image: url('/img/banner/notebook-link-banner-large.svg'); - background-position: center; - background-repeat: no-repeat; - height: 464px; - padding-bottom: 110px; -} - -.banner_container_very_large { - position: relative; - width: 100%; - display: flex; - align-items: center; - background-image: url('/img/banner/notebook-link-banner-very-large.svg'); - background-position: center; - background-repeat: no-repeat; - height: 464px; - padding-bottom: 110px; -} - - -.banner_image { - width: 100%; - height: auto; - display: block; -} - -.banner_text_overlay { - margin-top: 50px; - margin-left: auto; - margin-right: auto; - text-align: center; - color: white; - /* or whatever contrasts with your SVG */ - font-size: 2rem; - font-family: var(--ifm-font-family-kode-mono); -} - -.banner_text_overlay_title { - font-size: 48px; - font-weight: 400; - font-style: normal; - line-height: 100%; -} - -.banner_text_overlay_subtitle { - font-size: 32px; - font-style: normal; -} - -.notebook_link { - color: #FCF12B; - font-weight: 700; - font-style: bold; - line-height: 100%; - font-family: var(--ifm-font-family-inter); -} - -:global(.link-to-button).link_to_notebook_link { - display: flex; - align-items: center; - justify-content: center; - background: linear-gradient(135deg, - #5242FF, - #2A2A2A); - color: white; - width: 358px; - font-weight: 700; - font-family: var(--ifm-font-family-roboto); - font-weight: 600; - font-size: 24px; -} - -@media only screen and (max-width: 576px) { - - /*Mobile*/ - .logos_carousel { - display: none; - } - - .banner_container_medium { - display: none - } - - .banner_container_large { - display: none - } - - .banner_container_very_large { - display: none - } -} - -@media screen and (min-width: 576px) and (max-width: 996px) { - - /*Tablet*/ - .logos_carousel { - display: none; - } - - .banner_container_small { - display: none - } - - .banner_container_large { - display: none - } - - .banner_container_very_large { - display: none - } -} - -@media screen and (min-width: 996px) and (max-width: 1511px) { - - /*Desktop: small screen*/ - .table_with_8_customers { - margin-bottom: var(--ifm-spacing-xl); - } - - .customer_logo { - filter: grayscale(1); - width: 100px; - } - - .worked_with { - font-size: 24px; - font-weight: 200; - font-family: var(--ifm-font-family-rubik-one); - color: var(--ifm-color-primary-p2); - text-align: center; - margin: var(--ifm-spacing-2xl) 0; - } - - .banner_container_small { - display: none - } - - .banner_container_medium { - display: none - } - - .banner_container_very_large { - display: none - } -} - -@media only screen and (min-width: 1511px) { - /* Desktop : large screen*/ - .table_with_8_customers { - margin-bottom: var(--ifm-spacing-xl); - } - - .customer_logo { - filter: grayscale(1); - width: 100px; - } - - .worked_with { - font-size: 24px; - font-weight: 200; - font-family: var(--ifm-font-family-rubik-one); - color: var(--ifm-color-primary-p2); - text-align: center; - margin: var(--ifm-spacing-2xl) 0; - } - - .banner_container_small { - display: none - } - - .banner_container_medium { - display: none - } - - .banner_container_large { - display: none - } -} \ No newline at end of file diff --git a/src/components/home/Home.tsx b/src/components/home/Home.tsx deleted file mode 100644 index 9c3c95ca3..000000000 --- a/src/components/home/Home.tsx +++ /dev/null @@ -1,23 +0,0 @@ - -import Hero from "./Hero"; -import WhatWeDo from "./WhatWeDo"; -import ProjectsOverview from "./ProjectsOverview"; -import AboutQS from "./AboutQS"; -import News from "./News"; -import LearnMore from "./LearnMore"; - - -export function Home(): JSX.Element { - return ( - <> - - - - - - - - ); -} - -export default Home; \ No newline at end of file diff --git a/src/components/home/LearnMore/index.tsx b/src/components/home/LearnMore/index.tsx deleted file mode 100644 index ce20d37e8..000000000 --- a/src/components/home/LearnMore/index.tsx +++ /dev/null @@ -1,13 +0,0 @@ -import LinkToContact from "../LinkToContact"; -import styles from "./styles.module.css"; - -export default function LearnMore() { - return ( -
      -
      Want to learn more?
      - Schedule a meeting and benefit from our expertise on Jupyter, Conda-forge, - high-performance computing, and open-source development. - -
      - ); -} diff --git a/src/components/home/LearnMore/styles.module.css b/src/components/home/LearnMore/styles.module.css deleted file mode 100644 index 838b19f99..000000000 --- a/src/components/home/LearnMore/styles.module.css +++ /dev/null @@ -1,6 +0,0 @@ -@media only screen and (max-width: 996px) { - /*Mobile*/ - .learn_more_container { - display: none; - } -} \ No newline at end of file diff --git a/src/components/home/LinkToAboutUs.tsx b/src/components/home/LinkToAboutUs.tsx deleted file mode 100644 index adbe99591..000000000 --- a/src/components/home/LinkToAboutUs.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import styles from "./styles.module.css"; -import Link from "@docusaurus/Link"; - -export default function LinkToAboutUs({label}) { - return ( -
      - - {label} - -
      - ); -} diff --git a/src/components/home/LinkToBlogs.tsx b/src/components/home/LinkToBlogs.tsx deleted file mode 100644 index 2ae3acb53..000000000 --- a/src/components/home/LinkToBlogs.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import styles from "./styles.module.css"; -import Link from "@docusaurus/Link"; - -export default function LinkToBlogs({label}) { - return ( -
      - - {label} - -
      - ); -} diff --git a/src/components/home/LinkToContact.tsx b/src/components/home/LinkToContact.tsx deleted file mode 100644 index d3936b01d..000000000 --- a/src/components/home/LinkToContact.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import styles from "./styles.module.css"; -import Link from "@docusaurus/Link"; - -export default function LinkToContact({label}) { - return ( -
      - - {label} - -
      - ); -} diff --git a/src/components/home/LinkToProjects.tsx b/src/components/home/LinkToProjects.tsx deleted file mode 100644 index 03860ddf1..000000000 --- a/src/components/home/LinkToProjects.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import styles from "./styles.module.css"; -import Link from "@docusaurus/Link"; - -export default function LinkToProjects({label}) { - return ( -
      - - {label} - -
      - ); -} diff --git a/src/components/home/LinkToServices.tsx b/src/components/home/LinkToServices.tsx deleted file mode 100644 index 7c7c7252e..000000000 --- a/src/components/home/LinkToServices.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import styles from "./styles.module.css"; -import Link from "@docusaurus/Link"; - -export default function LinkToServices({label}) { - return ( -
      - - {label} - -
      - ); -} diff --git a/src/components/home/News/index.tsx b/src/components/home/News/index.tsx deleted file mode 100644 index fa594a3e2..000000000 --- a/src/components/home/News/index.tsx +++ /dev/null @@ -1,46 +0,0 @@ -import BlogpostCard from "../../blog/BlogpostCard"; -import { blogpostsDetails } from "../../blog/blogpostsDetails"; -import styles from "./styles.module.css"; -import LinkToBlogs from "../LinkToBlogs"; - -export default function News() { - const numberOfBlogs = blogpostsDetails.length; - return ( -
      -
      -
      -

      Recent blog contributions

      -
      -
      -
      -
        -
      • -
        - -
        -
        • -
      • -
        - -
        -
        • -
      • -
        - -
        -
        • -
      - - -
      - ); -} diff --git a/src/components/home/News/styles.module.css b/src/components/home/News/styles.module.css deleted file mode 100644 index 2096f772d..000000000 --- a/src/components/home/News/styles.module.css +++ /dev/null @@ -1,10 +0,0 @@ -@media only screen and (max-width: 996px) { - /*Mobile */ - .news_container { - display: none; - } -} - -.news_container { - margin-top: var(--ifm-spacing-2xl); -} diff --git a/src/components/home/ProjectsOverview/Computing.tsx b/src/components/home/ProjectsOverview/Computing.tsx deleted file mode 100644 index 1ce02eaaf..000000000 --- a/src/components/home/ProjectsOverview/Computing.tsx +++ /dev/null @@ -1,26 +0,0 @@ -import styles from "./styles.module.css"; -import ComputingMD from "@site/src/components/home/ProjectsOverview/descriptions/Computing.md"; -import XTensorXSIMDPicture from "@site/static/img/projects/xtensor_xsimd.svg"; - -export default function ComputingProjects() { - return ( -
      -
      -
      -

      Scientific computing

      -

      - Supporting the development of several C++ scientific computing - packages. -

      - - -
      -
      - -
      -
      -
      - ); -} diff --git a/src/components/home/ProjectsOverview/DataAnalysis.tsx b/src/components/home/ProjectsOverview/DataAnalysis.tsx deleted file mode 100644 index 577026a13..000000000 --- a/src/components/home/ProjectsOverview/DataAnalysis.tsx +++ /dev/null @@ -1,24 +0,0 @@ -import styles from "./styles.module.css"; -import DataAnalysisMD from "@site/src/components/home/ProjectsOverview/descriptions/DataAnalysis.md"; -import ApacheArrowPicture from "@site/static/img/projects/apache_arrow.svg"; - -export default function DataAnalysisProjects() { - return ( -
      -
      -
      -

      Data Analysis

      -

      - Supporting the development of key data analysis technologies. -

      - -
      -
      - -
      -
      -
      - ); -} diff --git a/src/components/home/ProjectsOverview/Jupyter.tsx b/src/components/home/ProjectsOverview/Jupyter.tsx deleted file mode 100644 index 580800442..000000000 --- a/src/components/home/ProjectsOverview/Jupyter.tsx +++ /dev/null @@ -1,28 +0,0 @@ -import styles from "./styles.module.css"; -import JupyterMD from "./descriptions/Jupyter.md"; -import JupyterPictureUrl from "@site/static/img/projects/jupyterlab_examples.png"; - -export default function JupyterProject() { - return ( -
      -
      -
      -

      Jupyter project

      -

      We strive to sustain the project in the long term.

      - -
      - -
      - {"Picture -
      -
      -
      - ); -} diff --git a/src/components/home/ProjectsOverview/Robotics.tsx b/src/components/home/ProjectsOverview/Robotics.tsx deleted file mode 100644 index 3374bb199..000000000 --- a/src/components/home/ProjectsOverview/Robotics.tsx +++ /dev/null @@ -1,40 +0,0 @@ -import styles from "./styles.module.css"; -import RoboticsMD from "@site/src/components/home/ProjectsOverview/descriptions/Robotics.md"; -import RoboticsPictureUrl from "@site/static/img/projects/robotics.png"; - -export default function RoboticsProjects() { - return ( -
      -
      -
      -

      Robotics

      -

      - We just kicked off a new initiative to Robotics education. -

      - -
      -
      - { -
      -
      -
      - ); -} diff --git a/src/components/home/ProjectsOverview/RoboticsReverse.tsx b/src/components/home/ProjectsOverview/RoboticsReverse.tsx deleted file mode 100644 index 54a99d39e..000000000 --- a/src/components/home/ProjectsOverview/RoboticsReverse.tsx +++ /dev/null @@ -1,28 +0,0 @@ -import styles from "./styles.module.css"; -import RoboticsMD from "@site/src/components/home/ProjectsOverview/descriptions/Robotics.md"; -import RoboticsPictureUrl from "@site/static/img/projects/robotics.png"; - -export default function RoboticsProjects() { - return ( -
      -
      -
      - {"Picture -
      -
      -

      Robotics

      -

      - We just kicked off a new initiative to Robotics education. -

      - -
      -
      -
      - ); -} diff --git a/src/components/home/ProjectsOverview/SpecialProjects.tsx b/src/components/home/ProjectsOverview/SpecialProjects.tsx deleted file mode 100644 index e624bf2f8..000000000 --- a/src/components/home/ProjectsOverview/SpecialProjects.tsx +++ /dev/null @@ -1,24 +0,0 @@ -import styles from "./styles.module.css"; -import SpecialProjectsMD from "@site/src/components/home/ProjectsOverview/descriptions/SpecialProjects.md"; -import SpecialProjectsPictureUrl from "@site/static/img/projects/special_projects.png"; - -export default function SpecialProjects() { - return ( -
      -
      -
      -

      Special projects

      -

      - Applications built from the ground up and addressing a complete use - case. -

      - - -
      -
      - {"Picture -
      -
      -
      - ); - } \ No newline at end of file diff --git a/src/components/home/ProjectsOverview/SupplyChain.tsx b/src/components/home/ProjectsOverview/SupplyChain.tsx deleted file mode 100644 index 98c5f4162..000000000 --- a/src/components/home/ProjectsOverview/SupplyChain.tsx +++ /dev/null @@ -1,39 +0,0 @@ -import styles from "./styles.module.css"; -import SupplyChainMD from "./descriptions/SupplyChain.md"; -import MambaPictureUrl from "@site/static/img/projects/mamba_console.png"; - -export default function SupplyChainProjects() { - return ( -
      -
      -
      -

      Software supply chain

      -

      - We are the main organization supporting the mamba package manager. -

      -
      - -
      -
      - {"Picture -
      -
      -
      - ); -} diff --git a/src/components/home/ProjectsOverview/SupplyChainReversed.tsx b/src/components/home/ProjectsOverview/SupplyChainReversed.tsx deleted file mode 100644 index 33d06cd57..000000000 --- a/src/components/home/ProjectsOverview/SupplyChainReversed.tsx +++ /dev/null @@ -1,33 +0,0 @@ -import styles from "./styles.module.css"; -import SupplyChainMD from "./descriptions/SupplyChain.md"; -import MambaPictureUrl from "@site/static/img/projects/mamba_console.png"; - -export default function SupplyChainProjects() { - return ( -
      -
      -
      - {"Picture -
      -
      -

      Software supply chain

      -

      - We are the main organization supporting the mamba package manager. -

      -
      - -
      -
      -
      - ); -} diff --git a/src/components/home/ProjectsOverview/descriptions/Computing.md b/src/components/home/ProjectsOverview/descriptions/Computing.md deleted file mode 100644 index a5d453c99..000000000 --- a/src/components/home/ProjectsOverview/descriptions/Computing.md +++ /dev/null @@ -1,5 +0,0 @@ -QuantStack is the main organization supporting the development of several C++ scientific computing packages such as: - -- Xsimd, a unified API for SIMD operations, used by projects such as Apache Arrow, Firefox, Krita, Pythran, and naturally, xtensor. - -- Xtensor, a multi-dimensional array library in C++, supporting NumPy-style API and features, such as universal functions and broadcasting, while being lazy-evaluated. Language bindings for Python, R, and Julia are also available. \ No newline at end of file diff --git a/src/components/home/ProjectsOverview/descriptions/DataAnalysis.md b/src/components/home/ProjectsOverview/descriptions/DataAnalysis.md deleted file mode 100644 index 32292dd1f..000000000 --- a/src/components/home/ProjectsOverview/descriptions/DataAnalysis.md +++ /dev/null @@ -1,8 +0,0 @@ - -Since 2024, QuantStack is involved in the development of: - -- Apache Arrow, a memory format designed for efficient columnar data storage. It serves as the foundation for many data science frameworks, enabling seamless interoperability between various data systems and programming languages, - -- Apache Parquet, a column-oriented data file format designed for efficient data storage and retrieval. - -QuantStack is home to several maintainers of the project who are committed to its continuous improvement and advancement. \ No newline at end of file diff --git a/src/components/home/ProjectsOverview/descriptions/Jupyter.md b/src/components/home/ProjectsOverview/descriptions/Jupyter.md deleted file mode 100644 index d88641391..000000000 --- a/src/components/home/ProjectsOverview/descriptions/Jupyter.md +++ /dev/null @@ -1,4 +0,0 @@ -Our team is deeply involved in the development of the Jupyter project, at both technical and organizational levels, with several members participating in the project governance in various capacities. - -We are responsible for some of the main innovations of the past years (JupyterLite, Collaborative editing in JupyterLab, the Voilà dashboard system, the JupyterLab visual debugger). - diff --git a/src/components/home/ProjectsOverview/descriptions/Robotics.md b/src/components/home/ProjectsOverview/descriptions/Robotics.md deleted file mode 100644 index b24e067aa..000000000 --- a/src/components/home/ProjectsOverview/descriptions/Robotics.md +++ /dev/null @@ -1,11 +0,0 @@ - - QuantStack created the RoboStack distribution of ROS, the first - multi-platform distribution of ROS, as conda packages. - - We are bootstrapping the jupyter-ros project, a - Jupyterlab-basedrobotics development environment for the ROS - ecosystem. - - We just kicked off a new initiative to Robotics education.
      - Stay tuned for more on this subject! - \ No newline at end of file diff --git a/src/components/home/ProjectsOverview/descriptions/SpecialProjects.md b/src/components/home/ProjectsOverview/descriptions/SpecialProjects.md deleted file mode 100644 index c570799aa..000000000 --- a/src/components/home/ProjectsOverview/descriptions/SpecialProjects.md +++ /dev/null @@ -1,12 +0,0 @@ -Special projects leverage the open-source software stack that we -maintain. They can rely, for instance, on the JupyterLab -application framework and assemble JupyterLab components to produce -a different application. - - Such examples include: - - - Glue-Web: a JupyterLab extension to link visualizations of scientific datasets across many files, - - JupyterCAD: a JupyterLab extension for collaborative 3D geometry modeling, - - JupyterGIS : a JupyterLab extension for collaborative GIS (Geographical Information System) editor in Jupyter. - - diff --git a/src/components/home/ProjectsOverview/descriptions/SupplyChain.md b/src/components/home/ProjectsOverview/descriptions/SupplyChain.md deleted file mode 100644 index 67b014cc1..000000000 --- a/src/components/home/ProjectsOverview/descriptions/SupplyChain.md +++ /dev/null @@ -1,9 +0,0 @@ - - We contribute to the conda-forge project, by maintaining a large - number of package recipes, and contributing to the underlying - infrastructure. - - - We created the first conda/mamba-based package distribution for - WebAssembly, emscripten-forge. - \ No newline at end of file diff --git a/src/components/home/ProjectsOverview/index.tsx b/src/components/home/ProjectsOverview/index.tsx deleted file mode 100644 index 29ff08841..000000000 --- a/src/components/home/ProjectsOverview/index.tsx +++ /dev/null @@ -1,20 +0,0 @@ -import JupyterProject from "./Jupyter"; -import SupplyChainProjects from "./SupplyChain"; -import SpecialProjects from "./SpecialProjects"; -import RoboticsProjects from "./Robotics"; -import ComputingProjects from "./Computing"; -import DataAnalysisProjects from "./DataAnalysis"; -import styles from "./styles.module.css"; - -export default function ProjectsOverview() { - return ( -
      - - - - - - -
      - ); -} diff --git a/src/components/home/ProjectsOverview/styles.module.css b/src/components/home/ProjectsOverview/styles.module.css deleted file mode 100644 index 81f624a1a..000000000 --- a/src/components/home/ProjectsOverview/styles.module.css +++ /dev/null @@ -1,26 +0,0 @@ -@media (max-width: 996px) { - .projects_overview_container { - display: none; - } -} - -.h2_custom { - color: var(--ifm-color-blue-jupyter); -} - -.col_project_overview_with_padding { - padding: var(--ifm-spacing-4xl) var(--ifm-spacing-3xl); -} - -.project_yellow { - background-color: var(--ifm-color-primary-p1); -} - -.project_light_yellow { - background-color: var(--ifm-color-primary-p0); -} -.container_projects { - padding: 0; - display: flex; - justify-content: center; -} \ No newline at end of file diff --git a/src/components/home/WhatWeDo/Topics.tsx b/src/components/home/WhatWeDo/Topics.tsx deleted file mode 100644 index 16478e2c0..000000000 --- a/src/components/home/WhatWeDo/Topics.tsx +++ /dev/null @@ -1,28 +0,0 @@ -import { topicsDetails } from "./topics/topicsDetails"; -import { TopicsCard } from "./TopicsCard"; -import JupyterMD from "./topics/Jupyter.md"; -import SupplyChainMD from "./topics/SupplyChain.md"; -import ComputingMD from "./topics/Computing.md"; - -const TopicsDescriptions = [JupyterMD, SupplyChainMD, ComputingMD]; - -export function Topics() { - return ( -
      -
      -
        - {topicsDetails.map((topics, index) => ( -
      • - -
        • - ))} -
      -
      -
      - ); -} - -export default Topics; diff --git a/src/components/home/WhatWeDo/TopicsCard.tsx b/src/components/home/WhatWeDo/TopicsCard.tsx deleted file mode 100644 index d1557e3c0..000000000 --- a/src/components/home/WhatWeDo/TopicsCard.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import styles from "./styles.module.css"; - -export function TopicsCard({ topics, TopicsDescriptionMD }) { - return ( -
      -
      - {topics.name} -
      -
      - -
      -
      - ); -} - -export default TopicsCard; diff --git a/src/components/home/WhatWeDo/index.tsx b/src/components/home/WhatWeDo/index.tsx deleted file mode 100644 index 6e43cbb8c..000000000 --- a/src/components/home/WhatWeDo/index.tsx +++ /dev/null @@ -1,33 +0,0 @@ -import styles from "./styles.module.css"; -import Topics from "./Topics"; -import LinkToServices from "../LinkToServices"; -import LinkToProjects from "../LinkToProjects"; - -export function WhatWeDo() { - return ( -
      -
      -
      - -
      -
      -
      -

      What we do

      -
      -
      - -
      -
      -
      - - -
      - -
      -
      -
      -
      - ); -} - -export default WhatWeDo; diff --git a/src/components/home/WhatWeDo/styles.module.css b/src/components/home/WhatWeDo/styles.module.css deleted file mode 100644 index 353f6dada..000000000 --- a/src/components/home/WhatWeDo/styles.module.css +++ /dev/null @@ -1,72 +0,0 @@ -.topics_header { - font-family: var(--ifm-font-family-rubik-one); - font-size: var(--ifm-font-size-secondary-title); - font-style: normal; - font-weight: 400; - line-height: 28px; - text-align: center; - margin-bottom: var(--ifm-spacing-xl); -} - -div .topics_header { - color: var(--ifm-color-neutral-n2); -} - -@media only screen and (max-width: 996px) { - /*Mobile*/ - .header { - display: none; - } - - .whatwedo_container { - /*background-color: var(--ifm-color-primary-p1);*/ - padding: 0; - margin-top: 0; - } - - .topics_card { - width: 80%; - text-align: justify; - background-color: var(--ifm-color-primary-p0); - margin: var(--ifm-spacing-lg) auto var(--ifm-spacing-lg) auto ; - } - - .topics_card .p { - padding: var(--ifm-spacing-xs) var(--ifm-spacing-xs); - } - - - .services_link_desktop { - display: none; - } -} - -@media only screen and (min-width: 996px) { - .header { - color: var(--ifm-color-primary-p2); - } - - .projects_link{ - display: none; - } - - .services_link_mobile { - display: none; - } - - .whatwedo_container { - background-color: var(--ifm-color-primary-p1); - padding: var(--ifm-spacing-3xl) var(--ifm-spacing-2xl) 0 - var(--ifm-spacing-2xl); - } - - .topics_card { - height: 462px; - width: 350px; - padding: var(--ifm-spacing-2xl) var(--ifm-spacing-lg); - border-radius: 8px; - box-shadow: 0px 0px 8px 1px #c8c8c7; - background-color: var(--ifm-color-primary-p0); - margin: 0 var(--ifm-spacing-lg) var(--ifm-spacing-xl) var(--ifm-spacing-lg); - } -} diff --git a/src/components/home/WhatWeDo/topics/Computing.md b/src/components/home/WhatWeDo/topics/Computing.md deleted file mode 100644 index 79297a227..000000000 --- a/src/components/home/WhatWeDo/topics/Computing.md +++ /dev/null @@ -1 +0,0 @@ -We created several popular scientific computing packages. XSimd, an unified API for SIMD operations, adopted by projects such as Apache Arrow, FireFox, Kytra, Pythran... Xtensor, a C++ n-dimensional array library with broadcasting and lazy evaluation. \ No newline at end of file diff --git a/src/components/home/WhatWeDo/topics/Jupyter.md b/src/components/home/WhatWeDo/topics/Jupyter.md deleted file mode 100644 index 7ff88a240..000000000 --- a/src/components/home/WhatWeDo/topics/Jupyter.md +++ /dev/null @@ -1 +0,0 @@ -Our team comprises key maintainers of the Jupyter project. We are responsible for a large part of the maintenance and continuous improvement of the project, ensuring its long-term sustainability. \ No newline at end of file diff --git a/src/components/home/WhatWeDo/topics/SupplyChain.md b/src/components/home/WhatWeDo/topics/SupplyChain.md deleted file mode 100644 index 07f55be5d..000000000 --- a/src/components/home/WhatWeDo/topics/SupplyChain.md +++ /dev/null @@ -1 +0,0 @@ -We contribute to the conda-forge project, which provides thousands of packages and accounts for billions of downloads. We created the mamba package manager, which underlies a lot of conda-forge’s infrastructure. \ No newline at end of file diff --git a/src/components/home/WhatWeDo/topics/topicsDetails.ts b/src/components/home/WhatWeDo/topics/topicsDetails.ts deleted file mode 100644 index adb3fbe61..000000000 --- a/src/components/home/WhatWeDo/topics/topicsDetails.ts +++ /dev/null @@ -1,17 +0,0 @@ -export const topicsDetails = [ - { - topics: "jupyter", - name: "Project Jupyter", - imageRoute: "", - }, - { - topics: "supplychain", - name: "Software Supply Chain", - imageRoute: "", - }, - { - topics: "computing", - name: "Scientific Computing", - imageRoute: "", - }, -]; diff --git a/src/components/home/styles.module.css b/src/components/home/styles.module.css deleted file mode 100644 index 54c987305..000000000 --- a/src/components/home/styles.module.css +++ /dev/null @@ -1,48 +0,0 @@ - -@media only screen and (max-width: 996px) { - /*Mobile*/ - .link_to { - background-color: var(--ifm-color-primary-p1); - color: var(--ifm-text-color-on-primary-p1); - width: 358px; - font-weight: 700; - } - - .link_to_services { - background-color: var(--ifm-color-primary-p1); - color: var(--ifm-text-color-on-primary-p1); - width: 358px; - font-weight: 700; - } - - .link_to_about_us { - background-color: var(--ifm-color-primary-p1); - color: var(--ifm-text-color-on-primary-p1); - width: 358px; - font-weight: 700; - } -} - -@media only screen and (min-width: 996px) { - .link_to { - background-color: var(--ifm-color-secondary-s2); - color: white; - width: 358px; - font-weight: 700; - } - - .link_to_services { - background-color: var(--ifm-color-blue-jupyter); - color: white; - width: 358px; - font-weight: 700; - } - - - .link_to_about_us { - background-color: var(--ifm-color-secondary-s2); - color: white; - width: 358px; - font-weight: 700; - } -} diff --git a/src/components/layout/BackgroundScene.module.css b/src/components/layout/BackgroundScene.module.css new file mode 100644 index 000000000..9b200130e --- /dev/null +++ b/src/components/layout/BackgroundScene.module.css @@ -0,0 +1,39 @@ +.container { + position: absolute; + inset: 0; + overflow: hidden; + pointer-events: none; + user-select: none; + z-index: 0; +} + +.planets { + animation: bg-planets 58s ease-in-out infinite; +} + +.graph { + animation: bg-graph 72s ease-in-out infinite; + animation-delay: -18s; +} + +.snippets { + animation: bg-snippets 44s ease-in-out infinite; + animation-delay: -9s; +} + +@keyframes bg-planets { + 0%, 100% { transform: translate(0px, 0px); } + 33% { transform: translate(11px, -16px); } + 66% { transform: translate(-8px, 10px); } +} + +@keyframes bg-graph { + 0%, 100% { transform: translate(0px, 0px); } + 50% { transform: translate(-13px, 8px); } +} + +@keyframes bg-snippets { + 0%, 100% { transform: translate(0px, 0px); } + 40% { transform: translate(7px, -11px); } + 75% { transform: translate(-5px, 13px); } +} diff --git a/src/components/layout/BackgroundScene.tsx b/src/components/layout/BackgroundScene.tsx new file mode 100644 index 000000000..4db65d6dc --- /dev/null +++ b/src/components/layout/BackgroundScene.tsx @@ -0,0 +1,110 @@ +import clsx from "clsx"; +import styles from "./BackgroundScene.module.css"; + +const NODES: [number, number][] = [ + [110, 95], [360, 60], [680, 85], [990, 50], [1230, 105], + [1385, 190], [1350, 410], [1160, 330], [1030, 190], [870, 295], + [760, 470], [1210, 590], [1030, 740], [800, 830], [570, 775], + [340, 845], [140, 755], [62, 510], +]; + +const EDGES: [number, number][] = [ + [0,1],[1,2],[2,3],[3,4],[4,5],[5,6],[4,8],[8,9],[9,10], + [7,6],[6,11],[11,12],[12,13],[13,14],[14,15],[15,16],[16,17], + [2,9],[10,14],[7,11],[3,8],[0,17], +]; + +const SNIPPETS = [ + { text: "import xarray as xr", x: 770, y: 765, angle: -4 }, + { text: "conda install -c conda-forge", x: 1075, y: 540, angle: -6 }, + { text: "∂L/∂θ = ∇θ L", x: 1295, y: 435, angle: 5 }, + { text: "df.groupby('date').sum()", x: 305, y: 855, angle: 7 }, + { text: "kernel = rbf(X, X.T)", x: 920, y: 115, angle: -3 }, +]; + +type Props = { variant?: "light" | "dark" }; + +export default function BackgroundScene({ variant = "light" }: Props) { + const c = variant === "dark" ? "#ffffff" : "#1d1d1b"; + const planetOp = variant === "dark" ? 0.10 : 0.07; + const graphOp = variant === "dark" ? 0.15 : 0.11; + const snippetOp = variant === "dark" ? 0.13 : 0.09; + + return ( + + ); +} diff --git a/src/components/layout/Banner.tsx b/src/components/layout/Banner.tsx new file mode 100644 index 000000000..44f811f29 --- /dev/null +++ b/src/components/layout/Banner.tsx @@ -0,0 +1,28 @@ +import clsx from "clsx"; +import styles from "./styles.module.css"; +import type { ReactNode } from "react"; + +type Props = { + bg?: "dark" | "light"; + title?: string; + cta?: ReactNode; + fullHeight?: boolean; + children: ReactNode; +}; + +export default function Banner({ bg = "dark", title, cta, fullHeight = false, children }: Props) { + return ( +
      + {title && ( +
      + {title} +
      + )} +
      {children}
      + {cta &&
      {cta}
      } +
      + ); +} diff --git a/src/components/layout/Card.tsx b/src/components/layout/Card.tsx new file mode 100644 index 000000000..22075073b --- /dev/null +++ b/src/components/layout/Card.tsx @@ -0,0 +1,28 @@ +import clsx from "clsx"; +import styles from "./styles.module.css"; +import React from "react"; + +type Props = { + bg?: "white" | "yellow" | "transparent"; + hover?: boolean; + className?: string; + onClick?: () => void; + children: React.ReactNode; +}; + +export default function Card({ bg = "white", hover = false, className, onClick, children }: Props) { + return ( +
      + {children} +
      + ); +} diff --git a/src/components/layout/CardGrid.tsx b/src/components/layout/CardGrid.tsx new file mode 100644 index 000000000..e090e54a3 --- /dev/null +++ b/src/components/layout/CardGrid.tsx @@ -0,0 +1,24 @@ +import clsx from "clsx"; +import styles from "./styles.module.css"; +import type { ReactNode } from "react"; + +type Props = { + cols?: 2 | 3 | 4; + children: ReactNode; + className?: string; +}; + +export default function CardGrid({ cols = 3, children, className }: Props) { + return ( +
        + {children} +
      + ); +} diff --git a/src/components/layout/PageBackground.module.css b/src/components/layout/PageBackground.module.css new file mode 100644 index 000000000..f2258a4d1 --- /dev/null +++ b/src/components/layout/PageBackground.module.css @@ -0,0 +1,45 @@ +.container { + position: fixed; + inset: 0; + pointer-events: none; + user-select: none; + z-index: 1; + /* color drives currentColor on all SVG children */ + color: var(--bg-scene-color, #1d1d1b); + transition: color 0.7s ease; + overflow: hidden; +} + +.planets { + opacity: var(--bg-planet-op, 0.07); + animation: bg-planets 58s ease-in-out infinite; +} + +.graph { + opacity: var(--bg-graph-op, 0.11); + animation: bg-graph 72s ease-in-out infinite; + animation-delay: -18s; +} + +.snippets { + opacity: var(--bg-snippet-op, 0.09); + animation: bg-snippets 44s ease-in-out infinite; + animation-delay: -9s; +} + +@keyframes bg-planets { + 0%,100% { transform: translate(0, 0); } + 33% { transform: translate(11px, -16px); } + 66% { transform: translate(-8px, 10px); } +} + +@keyframes bg-graph { + 0%,100% { transform: translate(0, 0); } + 50% { transform: translate(-13px, 8px); } +} + +@keyframes bg-snippets { + 0%,100% { transform: translate(0, 0); } + 40% { transform: translate(7px, -11px); } + 75% { transform: translate(-5px, 13px); } +} diff --git a/src/components/layout/PageBackground.tsx b/src/components/layout/PageBackground.tsx new file mode 100644 index 000000000..6963e6949 --- /dev/null +++ b/src/components/layout/PageBackground.tsx @@ -0,0 +1,101 @@ +import styles from "./PageBackground.module.css"; + +const NODES: [number, number][] = [ + [110, 95], [360, 60], [680, 85], [990, 50], [1230, 105], + [1385, 190], [1350, 410], [1160, 330], [1030, 190], [870, 295], + [760, 470], [1210, 590], [1030, 740], [800, 830], [570, 775], + [340, 845], [140, 755], [62, 510], +]; + +const EDGES: [number, number][] = [ + [0,1],[1,2],[2,3],[3,4],[4,5],[5,6],[4,8],[8,9],[9,10], + [7,6],[6,11],[11,12],[12,13],[13,14],[14,15],[15,16],[16,17], + [2,9],[10,14],[7,11],[3,8],[0,17], +]; + +const SNIPPETS = [ + { text: "import xarray as xr", x: 770, y: 765, angle: -4 }, + { text: "conda install -c conda-forge", x: 1075, y: 540, angle: -6 }, + { text: "∂L/∂θ = ∇θ L", x: 1295, y: 435, angle: 5 }, + { text: "df.groupby('date').sum()", x: 305, y: 855, angle: 7 }, + { text: "kernel = rbf(X, X.T)", x: 920, y: 115, angle: -3 }, +]; + +export default function PageBackground() { + return ( + + ); +} diff --git a/src/components/layout/Section.tsx b/src/components/layout/Section.tsx new file mode 100644 index 000000000..8fa2e9044 --- /dev/null +++ b/src/components/layout/Section.tsx @@ -0,0 +1,42 @@ +import clsx from "clsx"; +import styles from "./styles.module.css"; +import type { ReactNode } from "react"; + +type Props = { + bg?: "white" | "yellow" | "dark"; + spacing?: "normal" | "tight" | "loose"; + pageTop?: boolean; + fullHeight?: boolean; + background?: ReactNode; + children: ReactNode; + className?: string; +}; + +export default function Section({ + bg = "white", + spacing = "normal", + pageTop = false, + fullHeight = false, + background, + children, + className, +}: Props) { + return ( +
      + {background &&
      {background}
      } +
      +
      {children}
      +
      +
      + ); +} diff --git a/src/components/layout/SectionSeparator.tsx b/src/components/layout/SectionSeparator.tsx new file mode 100644 index 000000000..07189fcef --- /dev/null +++ b/src/components/layout/SectionSeparator.tsx @@ -0,0 +1,8 @@ +import clsx from "clsx"; +import styles from "./styles.module.css"; + +type Variant = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8; + +export default function SectionSeparator({ variant = 1 }: { variant?: Variant }) { + return
      ; +} diff --git a/src/components/layout/SplitSection.tsx b/src/components/layout/SplitSection.tsx new file mode 100644 index 000000000..80fde3751 --- /dev/null +++ b/src/components/layout/SplitSection.tsx @@ -0,0 +1,43 @@ +import clsx from "clsx"; +import styles from "./styles.module.css"; +import Section from "./Section"; +import type { ReactNode } from "react"; + +type Props = { + image: ReactNode; + reverse?: boolean; + ratio?: "60/40" | "50/50"; + bg?: "white" | "yellow" | "dark"; + spacing?: "normal" | "tight" | "loose"; + pageTop?: boolean; + fullHeight?: boolean; + background?: ReactNode; + children: ReactNode; +}; + +export default function SplitSection({ + image, + reverse = false, + ratio = "60/40", + bg = "white", + spacing = "normal", + pageTop = false, + fullHeight = false, + background, + children, +}: Props) { + return ( +
      +
      +
      {children}
      +
      {image}
      +
      +
      + ); +} diff --git a/src/components/layout/styles.module.css b/src/components/layout/styles.module.css new file mode 100644 index 000000000..bf63b0cb5 --- /dev/null +++ b/src/components/layout/styles.module.css @@ -0,0 +1,409 @@ +/* ─── Section ─── */ + +.section { + width: 100%; + padding: var(--ifm-spacing-4xl) 0; + position: relative; +} + +.section_bg_slot { + position: absolute; + inset: 0; + overflow: hidden; + pointer-events: none; + z-index: 0; +} + +.section_content { + position: relative; + z-index: 2; +} + +.section_page_top { + margin-top: calc(-1 * var(--ifm-navbar-height)); + padding-top: calc(var(--ifm-spacing-3xl) + var(--ifm-navbar-height)); +} + +.section_white { + background: var(--ifm-bg-neutral); +} + +.section_yellow { + background: var(--ifm-bg-brand); +} + +.section_dark { + background: var(--ifm-bg-emphasis); + color: white; +} + +.section_tight { + padding: var(--ifm-spacing-2xl) 0; +} + +.section_loose { + padding: var(--ifm-spacing-5xl) 0; +} + +.section_full_height { + min-height: 100vh; + display: flex; + flex-direction: column; + justify-content: center; + box-sizing: border-box; +} + +/* ─── SectionSeparator ─── */ + +.sep { + width: 100%; + height: 4px; + flex-shrink: 0; +} + +/* 8 segments — medium pace, irregular widths */ +.sep_v1 { + background: linear-gradient(to right, + #1d1d1b 0%, #1d1d1b 21%, + var(--ifm-color-accent-red) 21%, var(--ifm-color-accent-red) 28%, + #1d1d1b 28%, #1d1d1b 50%, + var(--ifm-color-accent-red) 50%, var(--ifm-color-accent-red) 57%, + #1d1d1b 57%, #1d1d1b 72%, + var(--ifm-color-accent-red) 72%, var(--ifm-color-accent-red) 80%, + #1d1d1b 80%, #1d1d1b 94%, + var(--ifm-color-accent-red) 94%, var(--ifm-color-accent-red) 100% + ); +} + +/* 7 segments — red-heavy, bold opener */ +.sep_v2 { + background: linear-gradient(to right, + var(--ifm-color-accent-red) 0%, var(--ifm-color-accent-red) 6%, + #1d1d1b 6%, #1d1d1b 28%, + var(--ifm-color-accent-red) 28%, var(--ifm-color-accent-red) 47%, + #1d1d1b 47%, #1d1d1b 66%, + var(--ifm-color-accent-red) 66%, var(--ifm-color-accent-red) 74%, + #1d1d1b 74%, #1d1d1b 89%, + var(--ifm-color-accent-red) 89%, var(--ifm-color-accent-red) 100% + ); +} + +/* 6 segments — wide, muscular */ +.sep_v3 { + background: linear-gradient(to right, + #1d1d1b 0%, #1d1d1b 26%, + var(--ifm-color-accent-red) 26%, var(--ifm-color-accent-red) 43%, + #1d1d1b 43%, #1d1d1b 67%, + var(--ifm-color-accent-red) 67%, var(--ifm-color-accent-red) 82%, + #1d1d1b 82%, #1d1d1b 93%, + var(--ifm-color-accent-red) 93%, var(--ifm-color-accent-red) 100% + ); +} + +/* 11 segments — staccato */ +.sep_v4 { + background: linear-gradient(to right, + #1d1d1b 0%, #1d1d1b 8%, + var(--ifm-color-accent-red) 8%, var(--ifm-color-accent-red) 13%, + #1d1d1b 13%, #1d1d1b 25%, + var(--ifm-color-accent-red) 25%, var(--ifm-color-accent-red) 33%, + #1d1d1b 33%, #1d1d1b 46%, + var(--ifm-color-accent-red) 46%, var(--ifm-color-accent-red) 54%, + #1d1d1b 54%, #1d1d1b 64%, + var(--ifm-color-accent-red) 64%, var(--ifm-color-accent-red) 73%, + #1d1d1b 73%, #1d1d1b 86%, + var(--ifm-color-accent-red) 86%, var(--ifm-color-accent-red) 93%, + #1d1d1b 93%, #1d1d1b 100% + ); +} + +/* 9 segments — syncopated, red-anchored */ +.sep_v5 { + background: linear-gradient(to right, + var(--ifm-color-accent-red) 0%, var(--ifm-color-accent-red) 14%, + #1d1d1b 14%, #1d1d1b 18%, + var(--ifm-color-accent-red) 18%, var(--ifm-color-accent-red) 35%, + #1d1d1b 35%, #1d1d1b 48%, + var(--ifm-color-accent-red) 48%, var(--ifm-color-accent-red) 57%, + #1d1d1b 57%, #1d1d1b 68%, + var(--ifm-color-accent-red) 68%, var(--ifm-color-accent-red) 79%, + #1d1d1b 79%, #1d1d1b 94%, + var(--ifm-color-accent-red) 94%, var(--ifm-color-accent-red) 100% + ); +} + +/* 12 segments — rapid alternation */ +.sep_v6 { + background: linear-gradient(to right, + #1d1d1b 0%, #1d1d1b 7%, + var(--ifm-color-accent-red) 7%, var(--ifm-color-accent-red) 14%, + #1d1d1b 14%, #1d1d1b 23%, + var(--ifm-color-accent-red) 23%, var(--ifm-color-accent-red) 30%, + #1d1d1b 30%, #1d1d1b 41%, + var(--ifm-color-accent-red) 41%, var(--ifm-color-accent-red) 48%, + #1d1d1b 48%, #1d1d1b 59%, + var(--ifm-color-accent-red) 59%, var(--ifm-color-accent-red) 66%, + #1d1d1b 66%, #1d1d1b 76%, + var(--ifm-color-accent-red) 76%, var(--ifm-color-accent-red) 84%, + #1d1d1b 84%, #1d1d1b 93%, + var(--ifm-color-accent-red) 93%, var(--ifm-color-accent-red) 100% + ); +} + +/* 14 segments — very rapid, nearly even */ +.sep_v7 { + background: linear-gradient(to right, + #1d1d1b 0%, #1d1d1b 5%, + var(--ifm-color-accent-red) 5%, var(--ifm-color-accent-red) 11%, + #1d1d1b 11%, #1d1d1b 18%, + var(--ifm-color-accent-red) 18%, var(--ifm-color-accent-red) 25%, + #1d1d1b 25%, #1d1d1b 34%, + var(--ifm-color-accent-red) 34%, var(--ifm-color-accent-red) 41%, + #1d1d1b 41%, #1d1d1b 51%, + var(--ifm-color-accent-red) 51%, var(--ifm-color-accent-red) 57%, + #1d1d1b 57%, #1d1d1b 65%, + var(--ifm-color-accent-red) 65%, var(--ifm-color-accent-red) 72%, + #1d1d1b 72%, #1d1d1b 81%, + var(--ifm-color-accent-red) 81%, var(--ifm-color-accent-red) 87%, + #1d1d1b 87%, #1d1d1b 94%, + var(--ifm-color-accent-red) 94%, var(--ifm-color-accent-red) 100% + ); +} + +/* 10 segments — skipped beat, long gap mid-line */ +.sep_v8 { + background: linear-gradient(to right, + #1d1d1b 0%, #1d1d1b 3%, + var(--ifm-color-accent-red) 3%, var(--ifm-color-accent-red) 9%, + #1d1d1b 9%, #1d1d1b 28%, + var(--ifm-color-accent-red) 28%, var(--ifm-color-accent-red) 36%, + #1d1d1b 36%, #1d1d1b 41%, + var(--ifm-color-accent-red) 41%, var(--ifm-color-accent-red) 58%, + #1d1d1b 58%, #1d1d1b 69%, + var(--ifm-color-accent-red) 69%, var(--ifm-color-accent-red) 75%, + #1d1d1b 75%, #1d1d1b 88%, + var(--ifm-color-accent-red) 88%, var(--ifm-color-accent-red) 100% + ); +} + +@media (max-width: 996px) { + .section { + padding: var(--ifm-spacing-3xl) 0; + } + + .section_page_top { + padding-top: calc(var(--ifm-spacing-2xl) + var(--ifm-navbar-height)); + } +} + +/* ─── SplitSection ─── */ + +.split { + display: flex; + align-items: center; + gap: var(--ifm-spacing-2xl); +} + +.split_reverse { + flex-direction: row-reverse; +} + +.split_text { + flex: 3; + min-width: 0; +} + +.split_image { + flex: 2; + display: flex; + align-items: center; + justify-content: center; + min-width: 0; +} + +.split_50 > .split_text { + flex: 1; +} + +.split_50 > .split_image { + flex: 1; +} + +@media (max-width: 996px) { + .split { + flex-direction: column; + align-items: stretch; + } + + .split_reverse { + flex-direction: column; + } + + .split_text, + .split_image { + width: 100%; + } +} + +/* ─── Card ─── */ + +.card { + background: var(--ifm-bg-neutral); + border-radius: 10px; + padding: var(--ifm-spacing-lg); + box-shadow: var(--ifm-shadow-card); + height: 100%; + box-sizing: border-box; + display: flex; + flex-direction: column; +} + +.card_yellow { + background: var(--ifm-bg-brand); +} + +.card_transparent { + background: transparent; + box-shadow: none; +} + +.card_hover { + cursor: pointer; + border: 1px solid transparent; + transition: box-shadow 0.2s, border-color 0.2s; +} + +.card_hover:hover { + box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); + border-color: var(--ifm-color-neutral-n3); +} + +@media (min-width: 996px) { + .card { + padding: var(--ifm-spacing-xl) var(--ifm-spacing-lg); + } +} + +/* ─── CardGrid ─── */ + +.card_grid { + display: grid; + gap: var(--ifm-spacing-xl); + grid-template-columns: repeat(3, 1fr); + list-style: none; + padding: 0; + margin: 0; +} + +.card_grid li { + margin-left: 0; +} + +.card_grid_2 { + grid-template-columns: repeat(2, 1fr); +} + +.card_grid_4 { + grid-template-columns: repeat(4, 1fr); +} + +@media (max-width: 996px) { + .card_grid { + grid-template-columns: repeat(2, 1fr); + } + + .card_grid_4 { + grid-template-columns: repeat(2, 1fr); + } + + .card_grid_2 { + grid-template-columns: 1fr; + } +} + +@media (max-width: 600px) { + .card_grid { + grid-template-columns: 1fr; + } + + .card_grid_4 { + grid-template-columns: 1fr; + } +} + +/* ─── Banner ─── */ + +.banner { + width: 100%; + display: flex; + flex-direction: column; + align-items: center; + text-align: center; + gap: var(--ifm-spacing-lg); + padding: var(--ifm-spacing-4xl) var(--ifm-spacing-4xl); + font-family: var(--ifm-font-family-roboto); + font-weight: 500; + line-height: 150%; +} + +.banner_dark { + background: var(--ifm-bg-emphasis); + color: white; + font-size: 28px; +} + +.banner_dark :global(.link-to-button) { + background: var(--ifm-color-accent-yellow); + color: var(--ifm-color-primary-p2); +} + +.banner_dark :global(.link-to-button):hover { + color: var(--ifm-color-primary-p2); + box-shadow: 0 8px 28px rgba(245, 229, 59, 0.5); +} + + +.banner_title { + font-style: normal; + font-weight: 600; + line-height: 150%; + letter-spacing: 2.112px; + margin-bottom: var(--ifm-spacing-md); +} + +.banner_title_dark { + font-size: 48px; + color: var(--ifm-color-primary-p1); +} + +.banner_title_light { + font-size: 32px; + color: var(--ifm-color-primary-p2); +} + +.banner_body { + max-width: 800px; +} + +.banner_full_height { + min-height: 100vh; + justify-content: center; +} + +@media (max-width: 996px) { + .banner { + padding: var(--ifm-spacing-2xl) var(--ifm-spacing-lg); + font-size: 16px; + line-height: 20px; + letter-spacing: 0.1px; + } + + .banner_title { + font-size: 32px; + letter-spacing: 2.112px; + } + + .banner_title_dark { + font-size: 32px; + } +} diff --git a/src/components/projects/AllProjects.tsx b/src/components/projects/AllProjects.tsx deleted file mode 100644 index 8ed3881c3..000000000 --- a/src/components/projects/AllProjects.tsx +++ /dev/null @@ -1,25 +0,0 @@ -import { projectsDetails } from "./descriptions/projectsDetails"; -import ProjectCard from "./ProjectCard"; -import styles from "./styles.module.css"; - -export default function AllProjects() { - return ( -
      -
        - {projectsDetails.map((project, index) => { - return ( -
      • -
        - -
        -
        • - ); - })} -
      -
      - ) -} diff --git a/src/components/projects/Header.tsx b/src/components/projects/Header.tsx deleted file mode 100644 index 0d9f7a57e..000000000 --- a/src/components/projects/Header.tsx +++ /dev/null @@ -1,17 +0,0 @@ -import styles from "./styles.module.css"; -import HeaderMD from "./descriptions/Header.md"; - -export default function Header() { - return ( -
      -
      -
      -

      Working in the open

      -
      - -
      -
      -
      -
      - ); -} diff --git a/src/components/projects/ProjectCard.tsx b/src/components/projects/ProjectCard.tsx deleted file mode 100644 index f921b5890..000000000 --- a/src/components/projects/ProjectCard.tsx +++ /dev/null @@ -1,35 +0,0 @@ -import styles from "./styles.module.css"; - -export default function ProjectCard({ project }): JSX.Element { - const prefix = "project_picture_"; - const base = `${prefix}${project.name}` - return ( -
      -
      -
      -
      {project.title}
      -
      - -
      -
      -
      -
      - {project.pictureAltText} -
      -
      -
      - ); -} diff --git a/src/components/projects/ScheduleAMeeting.tsx b/src/components/projects/ScheduleAMeeting.tsx deleted file mode 100644 index c83539b7b..000000000 --- a/src/components/projects/ScheduleAMeeting.tsx +++ /dev/null @@ -1,12 +0,0 @@ -import styles from "./styles.module.css"; -import LinkToContact from "../home/LinkToContact"; - -export default function ScheduleAMeeting() { - return ( -
      - Schedule a meeting and benefit from our experience in Python, C++, - in-browser data visualization, and high-performance computing. - -
      - ); -} diff --git a/src/components/projects/descriptions/ApacheArrow.md b/src/components/projects/descriptions/ApacheArrow.md deleted file mode 100644 index 58e149a59..000000000 --- a/src/components/projects/descriptions/ApacheArrow.md +++ /dev/null @@ -1,3 +0,0 @@ -The QuantStack team comprises key maintainers of the Apache Arrow project. The Apache Arrow team at QuantStack provides commercial support and custom development services in the Apache Arrow ecosystem. - -Check out our recent [announcement](https://medium.com/@QuantStack/quantstack-steps-up-to-support-apache-arrow-with-new-dedicated-team-9ddc952f20e2) on the launch of the Apache Arrow team at QuantStack. diff --git a/src/components/projects/descriptions/CondaForge.md b/src/components/projects/descriptions/CondaForge.md deleted file mode 100644 index b8078ea05..000000000 --- a/src/components/projects/descriptions/CondaForge.md +++ /dev/null @@ -1,14 +0,0 @@ -QuantStack is one of the key organizations supporting the -conda-forge project, a community-led collection of recipes, build -infrastructure and distributions for the conda/mamba package -manager. - -Adopted at the global scale, conda-forge has become the reference -source of build artifacts for the scientific computing ecosystem, -accounting for over 150 million package downloads monthly. - -QuantStack developed key components of the conda-forge -infrastructure, including the mamba package manager and the -mamba-build utility, which underlie the build system of conda-forge. -QuantStack team members also maintain a large number of conda-forge -packages. diff --git a/src/components/projects/descriptions/Header.md b/src/components/projects/descriptions/Header.md deleted file mode 100644 index 1c87c9b4f..000000000 --- a/src/components/projects/descriptions/Header.md +++ /dev/null @@ -1,9 +0,0 @@ -Projects developed at QuantStack have reached millions of end users, -from healthcare to education, from aerospace to geosciences, and -from data sciences to robotics. - - -Open-source development is a unique -way to break down collaboration barriers and reach users with -unexpected use cases. Enabling customization and extensions of the -tools enables this diversity of applications. diff --git a/src/components/projects/descriptions/Jupyter.md b/src/components/projects/descriptions/Jupyter.md deleted file mode 100644 index 9b582d64c..000000000 --- a/src/components/projects/descriptions/Jupyter.md +++ /dev/null @@ -1,15 +0,0 @@ - QuantStack is one of the main organizations supporting the Jupyter - project, an open-source ecosystem of developer tools meant to - improve the workflows of scientists and engineers. - - In the past years, Jupyter has become a de-facto standard in both - industry and academia, at the foundation of the main open-source and - commercial data science platforms, with millions of users. - - The team comprises nine core contributors and maintainers of the - project. We are also behind popular extensions for data - visualization, robotics, and dashboarding. - - The QuantStack team is responsible for major evolutions in the - project, such as the JupyterLab visual debugger, collaborative - editing, or the development of JupyterLite. \ No newline at end of file diff --git a/src/components/projects/descriptions/Robotics.md b/src/components/projects/descriptions/Robotics.md deleted file mode 100644 index a79602055..000000000 --- a/src/components/projects/descriptions/Robotics.md +++ /dev/null @@ -1,7 +0,0 @@ - QuantStack supports the open-source robotics ecosystem. - - We created the RoboStack distribution of ROS, the first conda/mamba - based distribution of ROS, and the first cross-platform - distribution of ROS. We are behind the jupyter-robotics project, a - collection of JupyterLab and Jupyter extensions integrating ROS with - the Jupyter ecosystem. \ No newline at end of file diff --git a/src/components/projects/descriptions/XTensorXSIMD.md b/src/components/projects/descriptions/XTensorXSIMD.md deleted file mode 100644 index da7e05022..000000000 --- a/src/components/projects/descriptions/XTensorXSIMD.md +++ /dev/null @@ -1,16 +0,0 @@ - QuantStack kickstarted the development of the xtensor and xsimd - projects, popular C++ libraries meant for numerical analysis with - multi-dimensional array expressions, and accelerated computing. - - xtensor provides: - - - an extensible expression system enabling lazy broadcasting, - - - an API following the idioms of the C++ standard library, - - - tools to manipulate array expressions and build upon xtensor. - - The xsimd project provides a unified API for utilizing SIMD - instructions of modern microprocessors.XSimd has seen a growing - adoption in the past years, by projects such as Firefox, Krita, - Pythran, and Apache Arrow. \ No newline at end of file diff --git a/src/components/projects/descriptions/projectsDetails.ts b/src/components/projects/descriptions/projectsDetails.ts deleted file mode 100644 index 54417eadb..000000000 --- a/src/components/projects/descriptions/projectsDetails.ts +++ /dev/null @@ -1,64 +0,0 @@ -import jupyterLogoUrl from "@site/static/img/projects/Jupyter.png"; -import xtensorLogoUrl from "@site/static/img/projects/xtensor.png"; -import condaforgeLogoUrl from "@site/static/img/projects/conda_forge.png"; -import apachearrowLogoUrl from "@site/static/img/projects/apache_arrow.png"; -import robostackPictureUrl from "@site/static/img/projects/robostack.png"; -import JupyterMD from "./Jupyter.md"; -import CondaForgeMD from "./CondaForge.md"; -import XTensorXSIMDMD from "./XTensorXSIMD.md"; -import ApacheArrowMD from "./ApacheArrow.md"; -import RoboticsMD from "./Robotics.md"; - - -export const projectsDetails = [ - { - name: "jupyter", - title: "Jupyter", - pictureRoute: jupyterLogoUrl, - pictureWidth: "198px", - pictureHeight: "234px", - pictureAltText: "Picture for Jupyter project showing its logo.", - ProjectMD: JupyterMD, - reverse: "false" - }, - { - name: "xtensorxsimd", - title: "Xtensor & Xsimd", - pictureRoute: xtensorLogoUrl, - pictureWidth: "257px", - pictureHeight: "257px", - pictureAltText: "Picture for Xtensor and Xsimd showing their respective logo.", - ProjectMD: XTensorXSIMDMD, - reverse: "true", - }, - { - name: "condaforge", - title: "Conda-forge", - pictureRoute: condaforgeLogoUrl, - pictureWidth: "196px", - pictureHeight: "180px", - pictureAltText: "Picture for Condaforge project showing its forge logo.", - ProjectMD: CondaForgeMD, - reverse:"false" - }, - { - name: "apache_arrow", - title: "Apache Arrow and Parquet", - pictureRoute: apachearrowLogoUrl, - pictureWidth: "176px", - pictureHeight: "63px", - pictureAltText: "Picture for Apache Arrow project showing the logo made of arrows.", - ProjectMD: ApacheArrowMD, - reverse:"false" - }, - { - name: "robotics", - title: "Robotics", - pictureRoute: robostackPictureUrl, - pictureWidth: "189px", - pictureHeight: "210px", - pictureAltText: "Picture for robotics project showing an illustration with a robotics device.", - ProjectMD: RoboticsMD, - reverse:"true" - }, -]; diff --git a/src/components/projects/index.tsx b/src/components/projects/index.tsx deleted file mode 100644 index fc43e6173..000000000 --- a/src/components/projects/index.tsx +++ /dev/null @@ -1,17 +0,0 @@ -import styles from "./styles.module.css"; -import Header from "./Header"; -import ScheduleAMeeting from "./ScheduleAMeeting"; -import AllProjects from "./AllProjects"; - -export default function Projects() { - return ( - <> -
      -
      - -
      - - - - ); -} diff --git a/src/components/projects/styles.module.css b/src/components/projects/styles.module.css deleted file mode 100644 index 362f0f78c..000000000 --- a/src/components/projects/styles.module.css +++ /dev/null @@ -1,147 +0,0 @@ - -.project_title { - margin-bottom: var(--ifm-spacing-md); - margin-top: var(--ifm-spacing-xl); - font-family: var(--ifm-font-family-bebas-neue); - font-size: var(--ifm-font-size-secondary-title); - font-style: normal; - font-weight: bolder; - line-height: 150%; - text-align: start; -} - -div .project_title { - color: var(--ifm-color-primary-p2); - padding-left: var(--ifm-spacing-xl); -} - -.project_description { - padding: var(--ifm-spacing-md) var(--ifm-spacing-xl); - text-align: justify; -} - -.project_description p { - color: var(--ifm-color-primary-p2); -} - -@media only screen and (max-width: 996px) { - /*Mobile*/ - .all_projects_container { - margin-bottom: var(--ifm-spacing-3xl); - - } - - .header_container { - padding-top: var(--ifm-spacing-2xl); - background-color: var(--ifm-color-primary-p1); - } - - .header_title { - padding-left: none; - } - - .header_text { - font-family: var(--ifm-font-family-roboto); - color: var(--ifm-color-primary-p2); - font-size: 14px; - font-style: normal; - font-weight: 400; - line-height: 20px; - letter-spacing: 0.25px; - text-align: justify; - margin-bottom: var(--ifm-spacing-lg); - padding: var(--ifm-spacing-lg) var(--ifm-spacing-xl); - } - - .project_text { - background-color: white; - text-align: justify; - } - - .project_picture_jupyter { - border: none; - margin-bottom: var(--ifm-spacing-xl); - } - - .project_picture_xtensorxsimd { - border: none; - margin-bottom: var(--ifm-spacing-xl); - } - - .project_picture_condaforge { - border: none; - margin-bottom: var(--ifm-spacing-xl); - } - - .project_picture_apache_arrow { - border: none; - margin-bottom: var(--ifm-spacing-xl); - } - - .project_picture_robotics { - border: none; - margin-bottom: var(--ifm-spacing-xl); - } -} - -@media only screen and (min-width: 996px) { - /*Desktop*/ - - .all_projects_container { - margin: 0 0 var(--ifm-spacing-5xl) 0 ; - } - .header_container { - margin-top: var(--ifm-spacing-6xl); - } - .header_title { - padding-left: var(--ifm-spacing-4xl); - } - - .header_text { - font-family: var(--ifm-font-family-roboto); - color: var(--ifm-color-primary-p2); - font-size: 22px; - font-style: normal; - font-weight: 400; - line-height: 28px; - margin-bottom: var(--ifm-spacing-3xl); - padding: var(--ifm-spacing-lg) var(--ifm-spacing-4xl); - } - - .project_text { - background-color: var(--ifm-color-orange-light); - padding: var(--ifm-spacing-4xl) var(--ifm-spacing-3xl); - margin-bottom: var(--ifm-spacing-lg); - border-radius: 10px; - } - - .project_picture_jupyter { - border: solid 1px var(--ifm-color-orange-jupyter); - margin-bottom: var(--ifm-spacing-lg); - border-radius: 10px; - } - - .project_picture_xtensorxsimd { - border: solid 1px var(--ifm-color-green-xtensor); - margin-bottom: var(--ifm-spacing-lg); - border-radius: 10px; - } - - .project_picture_condaforge { - border: solid 1px var(--ifm-color-grey-condaforge); - margin-bottom: var(--ifm-spacing-lg); - border-radius: 10px; - } - - .project_picture_apache_arrow { - border: solid 1px black; - margin-bottom: var(--ifm-spacing-lg); - border-radius: 10px; - } - - .project_picture_robotics { - border: solid 1px rgb(146, 95, 218); - margin-bottom: var(--ifm-spacing-lg); - border-radius: 10px; - } -} diff --git a/src/components/services/Header.tsx b/src/components/services/Header.tsx deleted file mode 100644 index 0bc1d7aba..000000000 --- a/src/components/services/Header.tsx +++ /dev/null @@ -1,18 +0,0 @@ -import styles from "./styles.module.css"; - -export default function Header() { - return ( -
      -
      -
      -
      -

      - Hire QuantStack to build upon the Jupyter, Mamba, and the PyData - ecosystem. -

      -
      -
      -
      -
      - ); -} diff --git a/src/components/services/SpecialProjects.tsx b/src/components/services/SpecialProjects.tsx deleted file mode 100644 index 13f298f51..000000000 --- a/src/components/services/SpecialProjects.tsx +++ /dev/null @@ -1,28 +0,0 @@ -import SpecialProjectsMD from "./descriptions/SpecialProjects.md"; -import SpecialProjectsIllustration from "@site/static/img/illustrations/special_projects.svg"; - -export default function SpecialProjects() { - return ( - <> -
      -
      -
      -
      -

      Special projects

      - -
      -
      - -
      -
      -
      -
      -
      - - ); -} diff --git a/src/components/services/Support.tsx b/src/components/services/Support.tsx deleted file mode 100644 index 82a9a2d73..000000000 --- a/src/components/services/Support.tsx +++ /dev/null @@ -1,22 +0,0 @@ -import SupportMD from "./descriptions/Support.md"; -import SupportIllustration from "/img/illustrations/support.svg"; - -export default function Support() { - return ( -
      -
      -
      -
      -
      - -
      -
      -
      -

      Professional Support

      - -
      -
      -
      -
      - ); -} \ No newline at end of file diff --git a/src/components/services/descriptions/SpecialProjects.md b/src/components/services/descriptions/SpecialProjects.md deleted file mode 100644 index 97745a196..000000000 --- a/src/components/services/descriptions/SpecialProjects.md +++ /dev/null @@ -1,9 +0,0 @@ - We develop new packages from the ground up. Such special projects built upon our open-source stack include: - -- JupyterCAD, -- JupyterLab-ROS, -- Glue Web, -- ipygany -and many more. - -You can contract with us to leverage the Jupyter, conda and the general PyData ecosystem in an optimal way. \ No newline at end of file diff --git a/src/components/services/descriptions/Support.md b/src/components/services/descriptions/Support.md deleted file mode 100644 index 473374bcd..000000000 --- a/src/components/services/descriptions/Support.md +++ /dev/null @@ -1,5 +0,0 @@ -We support organizations that depend on Jupyter, conda-forge, or the broader PyData ecosytem. - -We help deploy, extend, or customize software of the open-source scientific computing ecosystem. - -Work with the people behind the technology, and develop your strategy around the open-source stack. \ No newline at end of file diff --git a/src/components/services/index.tsx b/src/components/services/index.tsx deleted file mode 100644 index 911b924d0..000000000 --- a/src/components/services/index.tsx +++ /dev/null @@ -1,23 +0,0 @@ -import styles from "./styles.module.css"; -import Support from "./Support"; -import SpecialProjects from "./SpecialProjects"; -import Header from "./Header"; -import LinkToContact from "../home/LinkToContact"; - -export default function Services() { - return ( -
      -
      - - -
      -
      - Sign a support retainer for QuantStack services in our ecosystem. -
      - -
      -
      - ); -} diff --git a/src/components/services/styles.module.css b/src/components/services/styles.module.css deleted file mode 100644 index f8b585dfc..000000000 --- a/src/components/services/styles.module.css +++ /dev/null @@ -1,7 +0,0 @@ -.h2_custom { - color: var(--ifm-color-indigo-i1); -} - -ul { - padding-left: 20px; -} \ No newline at end of file diff --git a/src/css/custom.css b/src/css/custom.css index 803abaaa8..2a2d8a275 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -1,12 +1,13 @@ -@import url("https://fonts.googleapis.com/css2?family=Roboto"); -@import url("https://fonts.cdnfonts.com/css/bebas-neue"); -@import url("https://fonts.cdnfonts.com/css/rubik-one"); -@import url("https://fonts.cdnfonts.com/css/roboto-flex"); -@import url("https://fonts.googleapis.com/css2?family=Dosis"); -@import url('https://fonts.googleapis.com/css2?family=Kode+Mono:wght@400;500;600;700&display=swap'); -@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap'); +@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;600;700;800;900&display=swap"); +@import url("https://fonts.cdnfonts.com/css/bebas-neue?display=swap"); :root { + /* ── Page background scene ── */ + --bg-scene-color: #1d1d1b; + --bg-planet-op: 0.07; + --bg-graph-op: 0.11; + --bg-snippet-op: 0.09; + --ifm-color-orange-jupyter: #f37726; --ifm-color-blue-jupyter: #1976d2; --ifm-color-green-xtensor: #4ecb71; @@ -19,18 +20,32 @@ --ifm-text-color-on-primary-p1: #1e1c00; --ifm-color-secondary-s1: #a0c9ff; - --ifm-color-secondary-s2: #002646; + --ifm-color-secondary-s2: #0A0E2E; --ifm-color-secondary-s3: #00497F; --ifm-color-neutral-n1: #605e58; --ifm-color-neutral-n2: #371300; + --ifm-color-neutral-n3: #c8c8c7; + + --ifm-color-accent-yellow: #F5E53B; + --ifm-color-accent-red: #E8462A; + + --ifm-shadow-card: 0px 2px 12px rgba(160, 140, 40, 0.15); + --ifm-shadow-dialog: 0 8px 16px rgba(0, 0, 0, 0.2); + --ifm-overlay-background: rgba(0, 0, 0, 0.3); --ifm-text-color: var(--ifm-color-primary-p2); - --ifm-background-color: white; + --ifm-background-color: var(--ifm-bg-neutral); + + /* Semantic background roles */ + --ifm-bg-neutral: #ffffff; /* default reading surface */ + --ifm-bg-brand: #ffffff; /* yellow dropped — white throughout */ + --ifm-bg-emphasis: var(--ifm-color-secondary-s2); /* CTA / strong contrast — navy */ + /* footer */ - --ifm-background-color-footer: var(--ifm-color-primary-p1); + --ifm-background-color-footer: #f5f5f3; --ifm-text-color-footer: black; /*popup overlay*/ @@ -45,12 +60,7 @@ /*Font families */ --ifm-font-family-roboto: "Roboto"; - --ifm-font-family-roboto-flex: "Roboto Flex"; - --ifm-font-family-bebas-neue: "Bebas Neue"; - --ifm-font-family-rubik-one: "Rubik One"; - --ifm-font-family-dosis: "Dosis"; - --ifm-font-family-kode-mono: "Kode Mono"; - --ifm-font-family-inter: "Inter"; + --ifm-font-family-display: "Bebas Neue"; /* Spacing for margins and paddings */ --ifm-spacing-none: 0px; @@ -69,6 +79,8 @@ --ifm-spacing-8xl: 400px; --ifm-navbar-item-padding-horizontal: 2px; + + --ifm-content-width: 1200px; } .flex-full-centered { @@ -94,10 +106,6 @@ padding: 0; } -.row-reverse { - flex-direction: column-reverse; -} - ul { padding-left: 0; margin-left: 0; @@ -108,12 +116,6 @@ ul { padding: 0; } -.row-max-width { - max-width: 1500px; - display: flex; -} - - /***footer*****/ .footer__item { color: var(--ifm-text-color-footer); @@ -162,13 +164,6 @@ ul { color: var(--ifm-text-color-footer); } -.footer-astronaut { - display: flex; - width: 35px; - height: 35px; - padding: 10px; -} - @media (min-width: 1440px) { .container { max-width: none; @@ -177,50 +172,25 @@ ul { /****** Class that are specific for smaller screens*/ @media (max-width: 996px) { - .main-container-with-margins { - margin-left: 42px; - margin-right: 42px; - } - - .upper-container-with-margin-top { - margin-top: var(--ifm-spacing-2xl); - } - - .row-with-margin-top { - margin-top: var(--ifm-spacing-xl); - } - - .row-with-margin-bottom { - margin-bottom: var(--ifm-spacing-xl); - } - - .row-with-margins { - margin: var(--ifm-spacing-xl) 0; - } - - .col { - padding: 0; - } - h1 { color: var(--ifm-text-color-main-title); - font-family: var(--ifm-font-family-bebas-neue); - font-size: 32px; + font-family: var(--ifm-font-family-display); + font-size: 44px; font-style: normal; - font-weight: 600; - line-height: 150%; - /* 36px */ - letter-spacing: 1.056px; + font-weight: 900; + line-height: 110%; + letter-spacing: 0; text-align: center; padding: 0; } h2 { - font-family: var(--ifm-font-family-bebas-neue); - font-size: 24px; + font-family: var(--ifm-font-family-display); + font-size: 30px; font-style: normal; - font-weight: bolder; - line-height: 150%; + font-weight: 800; + line-height: 115%; + letter-spacing: 0; text-align: center; } @@ -239,101 +209,34 @@ ul { margin-left: 24px; } - .blue-banner-container { - font-family: var(--ifm-font-family-roboto); - font-size: 16px; - font-weight: 500; - color: var(--ifm-color-secondary-s2); - padding: var(--ifm-spacing-2xl) var(--ifm-spacing-lg) 0 var(--ifm-spacing-lg); - background-color: var(--ifm-color-secondary-s1); - line-height: 20px; - letter-spacing: 0.1px; - text-align: center; - } - - .blue-banner-header { - text-align: center; - font-family: var(--ifm-font-family-bebas-neue); - font-size: 32px; - font-style: normal; - font-weight: 600; - line-height: 150%; - letter-spacing: 2.112px; - background-color: var(--ifm-color-secondary-s1); - color: var(--ifm-color-secondary-s2); - } - .link-to-button { - width: 258px; - height: 56px; - font-family: var(--ifm-font-family-roboto); - border-radius: 35px; - background: var(--ifm-color-secondary-s2); - color: white; - font-size: 16px; - font-style: normal; - font-weight: 600; - line-height: 150%; - letter-spacing: -0.176px; - padding: 16px 36px; - border: none; - text-align: center; margin-top: var(--ifm-spacing-lg); margin-bottom: var(--ifm-spacing-lg); } - - .link-box { - height: 59px; - width: auto; - display: flex; - align-items: center; - justify-content: center; - } } /****** Class that are specific to larger screens*/ @media (min-width: 996px) { - .main-container-with-margins { - margin-left: 96px; - margin-right: 96px; - display: flex; - justify-content: center; - } - - .upper-container-with-margin-top { - margin-top: var(--ifm-spacing-6xl); - } - - .row-with-margin-top { - margin-top: var(--ifm-spacing-2xl); - } - - .row-with-margin-bottom { - margin-bottom: var(--ifm-spacing-2xl); - } - - .row-with-margins { - margin: var(--ifm-spacing-2xl) 0; - } - h1 { color: var(--ifm-color-primary-p2); - font-family: var(--ifm-font-family-bebas-neue); - font-size: var(--ifm-font-size-main-title); + font-family: var(--ifm-font-family-display); + font-size: 64px; font-style: normal; - font-weight: 800; - line-height: 150%; - letter-spacing: 2.112px; + font-weight: 900; + line-height: 110%; + letter-spacing: 0; text-align: start; - padding: 8px 36px 8px 20px; + padding: 0; + margin: var(--ifm-spacing-md) 0; } h2 { - font-family: var(--ifm-font-family-bebas-neue); - font-size: var(--ifm-font-size-secondary-title); + font-family: var(--ifm-font-family-display); + font-size: 40px; font-style: normal; - font-weight: bolder; - line-height: 150%; + font-weight: 800; + line-height: 115%; + letter-spacing: 0; text-align: start; } @@ -342,155 +245,77 @@ ul { font-size: var(--ifm-font-size-normal); font-style: normal; letter-spacing: 0.25px; - text-align: justify; - } - - .blue-banner-container { - text-align: center; - font-family: var(--ifm-font-family-roboto); - font-size: 28px; - font-style: normal; - font-weight: 500; - line-height: 150%; - background-color: var(--ifm-color-secondary-s1); - color: var(--ifm-color-secondary-s2); - padding: var(--ifm-spacing-2xl) var(--ifm-spacing-4xl) 0 var(--ifm-spacing-4xl); - } - - .blue-banner-header { - text-align: center; - font-family: var(--ifm-font-family-bebas-neue); - font-size: 48px; - font-style: normal; - font-weight: 600; - line-height: 150%; - letter-spacing: 2.112px; - background-color: var(--ifm-color-secondary-s1); - color: var(--ifm-color-secondary-s2); - margin-bottom: var(--ifm-spacing-2xl); + text-align: left; } .link-to-button { - width: 258px; - height: 56px; - font-family: var(--ifm-font-family-roboto); - border-radius: 35px; - background: var(--ifm-color-secondary-s2); - color: white; - font-size: 16px; - font-style: normal; - font-weight: 600; - line-height: 150%; - letter-spacing: -0.176px; - padding: 16px 36px; - border: none; - text-align: center; margin-top: var(--ifm-spacing-2xl); margin-bottom: var(--ifm-spacing-2xl); } - - .link-box { - height: 59px; - width: auto; - display: flex; - align-items: center; - justify-content: center; - } } /***********************************************************/ -.social-media-links { - margin-left: var(--ifm-spacing-3xl); - text-align: start; -} - -.spacing-none { - height: var(--ifm-spacing-none); -} - -.spacing-2xs { - height: var(--ifm-spacing-2xs); -} - -.spacing-xs { - height: var(--ifm-spacing-xs); -} - -.spacing-sm { - height: var(--ifm-spacing-sm); -} - -.spacing-md { - height: var(--ifm-spacing-md); -} - -.spacing-lg { - height: var(--ifm-spacing-lg); -} - -.spacing-xl { - height: var(--ifm-spacing-xl); -} - -.spacing-2xl { - height: var(--ifm-spacing-2xl); -} - -.spacing-3xl { - height: var(--ifm-spacing-3xl); -} - -.spacing-4xl { - height: var(--ifm-spacing-4xl); +/* Headings inside dark sections need explicit white */ +[class*="section_dark"] h1, +[class*="section_dark"] h2, +[class*="section_dark"] h3 { + color: white; } -.spacing-5xl { - height: var(--ifm-spacing-5xl); +/* BD-style red accent bar below section headings */ +.page-content h2::after { + content: ''; + display: block; + width: 36px; + height: 3px; + background: var(--ifm-color-accent-red); + margin-top: 10px; } -.spacing-6xl { - height: var(--ifm-spacing-6xl); +.page-content h2.text--center::after { + margin-left: auto; + margin-right: auto; } -.spacing-7xl { - height: var(--ifm-spacing-7xl); +/* No red bar on dark-background sections */ +[class*="section_dark"] .page-content h2::after { + display: none; } -.spacing-8xl { - height: var(--ifm-spacing-8xl); -} +/***********************************************************/ .link-to-button { - width: 258px; - height: 56px; + display: inline-flex; + align-items: center; + justify-content: center; + width: auto; font-family: var(--ifm-font-family-roboto); border-radius: 35px; background: var(--ifm-color-secondary-s2); color: white; - font-size: 16px; + font-size: 15px; font-style: normal; - font-weight: 600; - line-height: 150%; - letter-spacing: -0.176px; - padding: 16px 36px; + font-weight: 700; + letter-spacing: 0.5px; + padding: 14px 36px; border: none; text-align: center; - margin-top: var(--ifm-spacing-2xl); - margin-bottom: var(--ifm-spacing-2xl); + cursor: pointer; + transition: transform 0.15s ease, box-shadow 0.15s ease; + text-decoration: none; } -.link-box { - height: 59px; - width: auto; - display: flex; - align-items: center; - justify-content: center; +.link-to-button:hover { + color: white; + transform: translateY(-2px); + box-shadow: 0 8px 24px rgba(10, 14, 46, 0.35); + text-decoration: none; } -.social-media-links { - margin-left: var(--ifm-spacing-3xl); - text-align: start; +.link-to-button:active { + transform: translateY(0); + box-shadow: none; } /* @@ -548,7 +373,7 @@ so they are already assumed to be clickable anyway */ .pagination-nav__link:active, a.card:active, a.menu__link:active { - background: white; + background: var(--ifm-bg-neutral); color: #000; } @@ -568,43 +393,129 @@ a.menu__link:active { transform: scale(1); } -.contact { + + +/* Scroll-adaptive navbar */ +.navbar { + transition: background-color 0.25s ease, box-shadow 0.25s ease; + background-color: var(--ifm-navbar-background-color); +} + +html[data-bg-dark] { + --bg-scene-color: #ffffff; + --bg-planet-op: 0.10; + --bg-graph-op: 0.15; + --bg-snippet-op: 0.13; +} + +html:not([data-navbar-scrolled]) .navbar { + background-color: transparent !important; + box-shadow: none !important; +} + +html[data-navbar-scrolled] .navbar { + background-color: var(--ifm-bg-neutral) !important; + box-shadow: 0 1px 6px rgba(0, 0, 0, 0.08) !important; +} + +/* Home page at top: dark links over white hero */ +html[data-navbar-home-top] .navbar__link, +html[data-navbar-home-top] .custom_navbar_item { + color: var(--ifm-color-primary-p2); +} + +html[data-navbar-home-top] .custom_navbar_item:hover { background-color: var(--ifm-color-primary-p1); - color: var(--ifm-color-text-on-primary-p1); - font-size: 14px; - border-radius: 4px; - font-weight: bolder; - font-style: normal; - margin: var(--ifm-navbar-item-padding-vertical) 4px; - padding: 8px; + color: var(--ifm-color-primary-p2); } -.contact:hover { - background-color: white; +html[data-navbar-home-top] .navbar__link:hover { + color: var(--ifm-color-primary-p2); } -.fundable_projects { - background-color: var(--ifm-color-secondary-s1); - font-size: 14px; - color: black; - border-radius: 4px; - font-weight: bolder; - font-style: normal; - margin: var(--ifm-navbar-item-padding-vertical) 4px; - padding: 8px; +/* Dark-hero pages (e.g. /notebooklink/): white links over dark section */ +html[data-navbar-dark-top] .navbar__link, +html[data-navbar-dark-top] .custom_navbar_item { + color: white; +} + +html[data-navbar-dark-top] .custom_navbar_item:hover { + background-color: var(--ifm-color-primary-p1); + color: var(--ifm-color-primary-p2); +} + +html[data-navbar-dark-top] .navbar__link:hover { + color: var(--ifm-color-primary-p1); +} + +html[data-navbar-dark-top] .github-icon, +html[data-navbar-dark-top] .linkedin-icon, +html[data-navbar-dark-top] .bluesky-icon, +html[data-navbar-dark-top] .mastodon-icon, +html[data-navbar-dark-top] .rss-circle-icon { + filter: invert(1); +} + +html[data-navbar-dark-top] .navbar__toggle { + color: white; +} + +/* Sidebar opens over a light background — reset dark-top overrides */ +html[data-navbar-dark-top] .navbar-sidebar a { + color: var(--ifm-color-primary-p2) !important; +} + +html[data-navbar-dark-top] .navbar-sidebar a:hover { + color: black !important; } -.fundable_projects:hover { - background-color: var(--ifm-color-primary-p0); +html[data-navbar-dark-top] .navbar-sidebar .navbar__logo img { + filter: invert(1); } +html[data-navbar-dark-top] .navbar-sidebar .github-icon, +html[data-navbar-dark-top] .navbar-sidebar .linkedin-icon, +html[data-navbar-dark-top] .navbar-sidebar .bluesky-icon, +html[data-navbar-dark-top] .navbar-sidebar .mastodon-icon, +html[data-navbar-dark-top] .navbar-sidebar .rss-circle-icon { + filter: none; +} + +.navbar__inner { + position: relative; +} + +.navbar__inner .navbar__brand { + position: absolute; + left: 0; + top: 50%; + transform: translateY(-50%); +} + +.theme-layout-navbar-left { + flex: 1; + justify-content: center; +} + +@media (max-width: 996px) { + .theme-layout-navbar-left { + justify-content: flex-end; + } +} + +.theme-layout-navbar-right { + position: absolute; + right: 0; + top: 50%; + transform: translateY(-50%); +} .custom_navbar_item { font-family: var(--ifm-font-family-roboto); - width: 117px; height: 36px; padding: 6px 14px; text-align: center; + white-space: nowrap; } .custom_navbar_item:hover { @@ -613,17 +524,39 @@ a.menu__link:active { border-radius: 4px; } -.navbar__link:hover { - color: black; +.navbar_notebooklink { + font-family: var(--ifm-font-family-roboto); + font-size: 14px; + font-weight: 700; + letter-spacing: 0.3px; + padding: 6px 14px; + border: 2px solid var(--ifm-color-accent-red); + border-radius: 4px; + color: var(--ifm-color-accent-red) !important; + white-space: nowrap; + transition: background-color 0.15s ease, color 0.15s ease; + margin-right: var(--ifm-spacing-sm); } -.astronaut-footer { - background: url(@site/static/img/quantstack/astronaut-footer.svg); - content: ""; - display: flex; - height: 240px; - width: 240px; - background-repeat: no-repeat; +.navbar_notebooklink:hover { + background-color: var(--ifm-color-accent-red) !important; + color: white !important; + text-decoration: none; +} + +html[data-navbar-dark-top] .navbar_notebooklink { + border-color: var(--ifm-color-accent-yellow); + color: var(--ifm-color-accent-yellow) !important; +} + +html[data-navbar-dark-top] .navbar_notebooklink:hover { + background-color: var(--ifm-color-accent-yellow) !important; + color: var(--ifm-color-primary-p2) !important; +} + +html[data-navbar-scrolled] .navbar__link:hover, +html:not([data-navbar-home-top]) .navbar__link:hover { + color: black; } .rss-circle-icon:hover { @@ -701,38 +634,17 @@ a.menu__link:active { border: 0px solid; } -.cards-list { - list-style-type: none; - padding: 0; - margin: 0; -} - -ul.row { - margin: 0; - padding: 0; -} - -.projects-list { - list-style-type: none; - padding: none; - margin-left: 0; +.page-content { + max-width: var(--ifm-content-width); width: 100%; + margin: 0 auto; + padding-left: var(--ifm-spacing-2xl); + padding-right: var(--ifm-spacing-2xl); } -.row { - display: flex; - flex-wrap: wrap; - margin: 0 0; -} - -.items-list { - list-style-type: none; -} - -.custom-progress-bar::-webkit-progress-value { - background-color: var(--ifm-color-primary-p1); -} - -.custom-progress-bar::-webkit-progress-bar { - background-color: #eee; +@media (max-width: 996px) { + .page-content { + padding-left: var(--ifm-spacing-lg); + padding-right: var(--ifm-spacing-lg); + } } diff --git a/src/components/about/Team/Alexis.md b/src/pages/about/Team/Alexis.md similarity index 100% rename from src/components/about/Team/Alexis.md rename to src/pages/about/Team/Alexis.md diff --git a/src/components/about/Team/Anastasiia.md b/src/pages/about/Team/Anastasiia.md similarity index 100% rename from src/components/about/Team/Anastasiia.md rename to src/pages/about/Team/Anastasiia.md diff --git a/src/components/about/Team/Andreas.md b/src/pages/about/Team/Andreas.md similarity index 100% rename from src/components/about/Team/Andreas.md rename to src/pages/about/Team/Andreas.md diff --git a/src/components/about/Team/Antoine.md b/src/pages/about/Team/Antoine.md similarity index 100% rename from src/components/about/Team/Antoine.md rename to src/pages/about/Team/Antoine.md diff --git a/src/components/about/Team/AntoinePrv.md b/src/pages/about/Team/AntoinePrv.md similarity index 100% rename from src/components/about/Team/AntoinePrv.md rename to src/pages/about/Team/AntoinePrv.md diff --git a/src/components/about/Team/Anutosh.md b/src/pages/about/Team/Anutosh.md similarity index 100% rename from src/components/about/Team/Anutosh.md rename to src/pages/about/Team/Anutosh.md diff --git a/src/components/about/Team/Arjun.md b/src/pages/about/Team/Arjun.md similarity index 100% rename from src/components/about/Team/Arjun.md rename to src/pages/about/Team/Arjun.md diff --git a/src/components/about/Team/Darian.md b/src/pages/about/Team/Darian.md similarity index 100% rename from src/components/about/Team/Darian.md rename to src/pages/about/Team/Darian.md diff --git a/src/components/about/Team/David.md b/src/pages/about/Team/David.md similarity index 100% rename from src/components/about/Team/David.md rename to src/pages/about/Team/David.md diff --git a/src/components/about/Team/Denisa.md b/src/pages/about/Team/Denisa.md similarity index 100% rename from src/components/about/Team/Denisa.md rename to src/pages/about/Team/Denisa.md diff --git a/src/components/about/Team/Fanny.md b/src/pages/about/Team/Fanny.md similarity index 100% rename from src/components/about/Team/Fanny.md rename to src/pages/about/Team/Fanny.md diff --git a/src/components/about/Team/Florence.md b/src/pages/about/Team/Florence.md similarity index 100% rename from src/components/about/Team/Florence.md rename to src/pages/about/Team/Florence.md diff --git a/src/components/about/Team/Gabriela.md b/src/pages/about/Team/Gabriela.md similarity index 100% rename from src/components/about/Team/Gabriela.md rename to src/pages/about/Team/Gabriela.md diff --git a/src/components/about/Team/Greg.md b/src/pages/about/Team/Greg.md similarity index 100% rename from src/components/about/Team/Greg.md rename to src/pages/about/Team/Greg.md diff --git a/src/components/about/Team/Hind.md b/src/pages/about/Team/Hind.md similarity index 100% rename from src/components/about/Team/Hind.md rename to src/pages/about/Team/Hind.md diff --git a/src/components/about/Team/Ian.md b/src/pages/about/Team/Ian.md similarity index 100% rename from src/components/about/Team/Ian.md rename to src/pages/about/Team/Ian.md diff --git a/src/components/about/Team/Isabel.md b/src/pages/about/Team/Isabel.md similarity index 100% rename from src/components/about/Team/Isabel.md rename to src/pages/about/Team/Isabel.md diff --git a/src/components/about/Team/Jeremy.md b/src/pages/about/Team/Jeremy.md similarity index 100% rename from src/components/about/Team/Jeremy.md rename to src/pages/about/Team/Jeremy.md diff --git a/src/components/about/Team/Joel.md b/src/pages/about/Team/Joel.md similarity index 100% rename from src/components/about/Team/Joel.md rename to src/pages/about/Team/Joel.md diff --git a/src/components/about/Team/Johan.md b/src/pages/about/Team/Johan.md similarity index 100% rename from src/components/about/Team/Johan.md rename to src/pages/about/Team/Johan.md diff --git a/src/components/about/Team/Julien.md b/src/pages/about/Team/Julien.md similarity index 100% rename from src/components/about/Team/Julien.md rename to src/pages/about/Team/Julien.md diff --git a/src/components/about/Team/Marion.md b/src/pages/about/Team/Marion.md similarity index 100% rename from src/components/about/Team/Marion.md rename to src/pages/about/Team/Marion.md diff --git a/src/components/about/Team/Martin.md b/src/pages/about/Team/Martin.md similarity index 100% rename from src/components/about/Team/Martin.md rename to src/pages/about/Team/Martin.md diff --git a/src/components/about/Team/Matthias.md b/src/pages/about/Team/Matthias.md similarity index 100% rename from src/components/about/Team/Matthias.md rename to src/pages/about/Team/Matthias.md diff --git a/src/components/about/Team/Meriem.md b/src/pages/about/Team/Meriem.md similarity index 100% rename from src/components/about/Team/Meriem.md rename to src/pages/about/Team/Meriem.md diff --git a/src/components/about/Team/Nicolas.md b/src/pages/about/Team/Nicolas.md similarity index 100% rename from src/components/about/Team/Nicolas.md rename to src/pages/about/Team/Nicolas.md diff --git a/src/components/about/Team/Olivier.md b/src/pages/about/Team/Olivier.md similarity index 100% rename from src/components/about/Team/Olivier.md rename to src/pages/about/Team/Olivier.md diff --git a/src/components/about/Team/Raul.md b/src/pages/about/Team/Raul.md similarity index 100% rename from src/components/about/Team/Raul.md rename to src/pages/about/Team/Raul.md diff --git a/src/components/about/Team/Romain.md b/src/pages/about/Team/Romain.md similarity index 100% rename from src/components/about/Team/Romain.md rename to src/pages/about/Team/Romain.md diff --git a/src/components/about/Team/Sandrine.md b/src/pages/about/Team/Sandrine.md similarity index 100% rename from src/components/about/Team/Sandrine.md rename to src/pages/about/Team/Sandrine.md diff --git a/src/components/about/Team/Serge.md b/src/pages/about/Team/Serge.md similarity index 100% rename from src/components/about/Team/Serge.md rename to src/pages/about/Team/Serge.md diff --git a/src/components/about/Team/Sylvain.md b/src/pages/about/Team/Sylvain.md similarity index 100% rename from src/components/about/Team/Sylvain.md rename to src/pages/about/Team/Sylvain.md diff --git a/src/components/about/Team/Thorsten.md b/src/pages/about/Team/Thorsten.md similarity index 100% rename from src/components/about/Team/Thorsten.md rename to src/pages/about/Team/Thorsten.md diff --git a/src/components/about/Team/Trung.md b/src/pages/about/Team/Trung.md similarity index 100% rename from src/components/about/Team/Trung.md rename to src/pages/about/Team/Trung.md diff --git a/src/components/about/Team/Yahia.md b/src/pages/about/Team/Yahia.md similarity index 100% rename from src/components/about/Team/Yahia.md rename to src/pages/about/Team/Yahia.md diff --git a/src/components/about/Team/team.ts b/src/pages/about/Team/_team.ts similarity index 89% rename from src/components/about/Team/team.ts rename to src/pages/about/Team/_team.ts index 692ca21a9..df6ce3b7b 100644 --- a/src/components/about/Team/team.ts +++ b/src/pages/about/Team/_team.ts @@ -1,70 +1,70 @@ -import AlexisMD from "@site/src/components/about/Team/Alexis.md"; +import AlexisMD from "@site/src/pages/about/Team/Alexis.md"; import AlexisAvatarUrl from "@site/static/img/avatars/Alexis.png"; -import AnastasiiaMD from "@site/src/components/about/Team/Anastasiia.md"; +import AnastasiiaMD from "@site/src/pages/about/Team/Anastasiia.md"; import AnastasiiaAvatarUrl from "@site/static/img/avatars/Anastasiia.png"; -import AndreasMD from "@site/src/components/about/Team/Andreas.md"; +import AndreasMD from "@site/src/pages/about/Team/Andreas.md"; import AndreasAvatarUrl from "@site/static/img/avatars/Andreas.png"; -import AntoineMD from "@site/src/components/about/Team/Antoine.md"; +import AntoineMD from "@site/src/pages/about/Team/Antoine.md"; import AntoineAvatarUrl from "@site/static/img/avatars/Antoine2.png"; -import AntoinePrvMD from "@site/src/components/about/Team/AntoinePrv.md"; +import AntoinePrvMD from "@site/src/pages/about/Team/AntoinePrv.md"; import AntoinePrvAvatarUrl from "@site/static/img/avatars/AntoinePrv.png"; -import AnutoshMD from "@site/src/components/about/Team/Anutosh.md"; +import AnutoshMD from "@site/src/pages/about/Team/Anutosh.md"; import AnutoshAvatarUrl from "@site/static/img/avatars/Anutosh.png"; -import ArjunMD from "@site/src/components/about/Team/Arjun.md"; +import ArjunMD from "@site/src/pages/about/Team/Arjun.md"; import ArjunAvatarUrl from "@site/static/img/avatars/Arjun.png"; -import DavidMD from "@site/src/components/about/Team/David.md"; +import DavidMD from "@site/src/pages/about/Team/David.md"; import DavidAvatarUrl from "@site/static/img/avatars/David.png"; -import DarianMD from "@site/src/components/about/Team/Darian.md"; +import DarianMD from "@site/src/pages/about/Team/Darian.md"; import DarianAvatarUrl from "@site/static/img/avatars/Darian.png"; -import DenisaMD from "@site/src/components/about/Team/Denisa.md"; +import DenisaMD from "@site/src/pages/about/Team/Denisa.md"; import DenisaAvatarUrl from "@site/static/img/avatars/Denisa.png"; -import FlorenceMD from "@site/src/components/about/Team/Florence.md"; +import FlorenceMD from "@site/src/pages/about/Team/Florence.md"; import FlorenceAvatarUrl from "@site/static/img/avatars/Florence.png"; -import GabrielaMD from "@site/src/components/about/Team/Gabriela.md"; +import GabrielaMD from "@site/src/pages/about/Team/Gabriela.md"; import GabrielaAvatarUrl from "@site/static/img/avatars/Gabriela.png"; -import GregMD from "@site/src/components/about/Team/Greg.md"; +import GregMD from "@site/src/pages/about/Team/Greg.md"; import GregAvatarUrl from "@site/static/img/avatars/Greg.png"; -import HindMD from "@site/src/components/about/Team/Hind.md"; +import HindMD from "@site/src/pages/about/Team/Hind.md"; import HindAvatarUrl from "@site/static/img/avatars/Hind.png"; -import IanMD from "@site/src/components/about/Team/Ian.md"; +import IanMD from "@site/src/pages/about/Team/Ian.md"; import IanAvatarUrl from "@site/static/img/avatars/Ian.png"; -import IsabelMD from "@site/src/components/about/Team/Isabel.md"; +import IsabelMD from "@site/src/pages/about/Team/Isabel.md"; import IsabelAvatarUrl from "@site/static/img/avatars/Isabel.png"; -import JeremyMD from "@site/src/components/about/Team/Jeremy.md"; +import JeremyMD from "@site/src/pages/about/Team/Jeremy.md"; import JeremyAvatarUrl from "@site/static/img/avatars/Jeremy.png"; -import JoelMD from "@site/src/components/about/Team/Joel.md"; +import JoelMD from "@site/src/pages/about/Team/Joel.md"; import JoelAvatarUrl from "@site/static/img/avatars/Joel.png"; -import JohanMD from "@site/src/components/about/Team/Johan.md"; +import JohanMD from "@site/src/pages/about/Team/Johan.md"; import JohanAvatarUrl from "@site/static/img/avatars/Johan.png"; -import JulienMD from "@site/src/components/about/Team/Julien.md"; +import JulienMD from "@site/src/pages/about/Team/Julien.md"; import JulienAvatarUrl from "@site/static/img/avatars/Julien.png"; -import MarionMD from "@site/src/components/about/Team/Marion.md"; +import MarionMD from "@site/src/pages/about/Team/Marion.md"; import MarionAvatarUrl from "@site/static/img/avatars/Marion.png"; -import MartinMD from "@site/src/components/about/Team/Martin.md"; +import MartinMD from "@site/src/pages/about/Team/Martin.md"; import MartinAvatarUrl from "@site/static/img/avatars/Martin.png"; -import MatthiasMD from "@site/src/components/about/Team/Matthias.md"; +import MatthiasMD from "@site/src/pages/about/Team/Matthias.md"; import MatthiasAvatarUrl from "@site/static/img/avatars/Matthias.png"; -import MeriemMD from "@site/src/components/about/Team/Meriem.md"; +import MeriemMD from "@site/src/pages/about/Team/Meriem.md"; import MeriemAvatarUrl from "@site/static/img/avatars/Meriem.png"; -import NicolasMD from "@site/src/components/about/Team/Nicolas.md"; +import NicolasMD from "@site/src/pages/about/Team/Nicolas.md"; import NicolasAvatarUrl from "@site/static/img/avatars/Nicolas.png"; -import OlivierMD from "@site/src/components/about/Team/Olivier.md"; +import OlivierMD from "@site/src/pages/about/Team/Olivier.md"; import OlivierAvatarUrl from "@site/static/img/avatars/Olivier.png"; -import RaulMD from "@site/src/components/about/Team/Raul.md"; +import RaulMD from "@site/src/pages/about/Team/Raul.md"; import RaulAvatarUrl from "@site/static/img/avatars/Raul.png"; -import RomainMD from "@site/src/components/about/Team/Romain.md"; +import RomainMD from "@site/src/pages/about/Team/Romain.md"; import RomainAvatarUrl from "@site/static/img/avatars/Romain.png"; -import SandrineMD from "@site/src/components/about/Team/Sandrine.md"; +import SandrineMD from "@site/src/pages/about/Team/Sandrine.md"; import SandrineAvatarUrl from "@site/static/img/avatars/Sandrine.png"; -import SergeMD from "@site/src/components/about/Team/Serge.md"; +import SergeMD from "@site/src/pages/about/Team/Serge.md"; import SergeAvatarUrl from "@site/static/img/avatars/Serge.png"; -import SylvainMD from "@site/src/components/about/Team/Sylvain.md"; +import SylvainMD from "@site/src/pages/about/Team/Sylvain.md"; import SylvainAvatarUrl from "@site/static/img/avatars/Sylvain.png"; -import ThorstenMD from "@site/src/components/about/Team/Thorsten.md"; +import ThorstenMD from "@site/src/pages/about/Team/Thorsten.md"; import ThorstenAvatarUrl from "@site/static/img/avatars/Thorsten.png"; -import TrungMD from "@site/src/components/about/Team/Trung.md"; +import TrungMD from "@site/src/pages/about/Team/Trung.md"; import TrungAvatarUrl from "@site/static/img/avatars/Trung.png"; -import YahiaMD from "@site/src/components/about/Team/Yahia.md"; +import YahiaMD from "@site/src/pages/about/Team/Yahia.md"; import YahiaAvatarUrl from "@site/static/img/avatars/Yahia.png"; export const teams = { diff --git a/src/pages/about/index.tsx b/src/pages/about/index.tsx index 04b239c18..31dc4b01b 100644 --- a/src/pages/about/index.tsx +++ b/src/pages/about/index.tsx @@ -1,15 +1,92 @@ import Layout from "@theme/Layout"; -import useDocusaurusContext from "@docusaurus/useDocusaurusContext"; -import {About} from "@site/src/components/about"; import BrowserOnly from "@docusaurus/BrowserOnly"; import Footer from "@site/src/components/footer/Footer"; +import styles from "@site/src/components/about/styles.module.css"; +import { teams } from "@site/src/pages/about/Team/_team"; +import { valuesDetails } from "@site/src/components/about/valuesDetails"; +import { SmallPortraitCard } from "@site/src/components/about/SmallPortraitCard"; +import Section from "@site/src/components/layout/Section"; +import Banner from "@site/src/components/layout/Banner"; +import CardGrid from "@site/src/components/layout/CardGrid"; +import Card from "@site/src/components/layout/Card"; +import SectionSeparator from "@site/src/components/layout/SectionSeparator"; +import LinkToContact from "@site/src/components/LinkToContact"; + +export function getTeamByPageName(name: string) { + for (const [, members] of Object.entries(teams)) { + const person = members.find((person) => person.pageName === name); + if (person) { + return members; + } + } + return null; +} + +export function AboutContent() { + return ( + <> +
      +

      About QuantStack

      +

      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.

      +
      + +
      +

      Our values

      + + {valuesDetails.map((value, index) => ( +
    • + +
      + +
      +
      {value.name}
      +
      + +
      +       +
      • + ))} +       +
      + +
      +

      Meet the QuantStack team

      +
      + Most of us have PhDs or deep research backgrounds. We operate as a collective of principal contributors — everyone on the team ships code to the projects we maintain. No passengers. +
      + {[ + { label: "The leadership team", members: teams.leadershipTeam }, + { label: "The core team", members: teams.coreTeam }, + { label: "QuantStack collaborators", members: teams.QSCollaboratorsTeam }, + ].map(({ label, members }) => ( +
      +

      {label}

      + + {members.map((person) => ( +
    • + +
      • + ))} +       +
      + ))} +
      + } + > + We're looking for researchers and engineers who want to work at the frontier of open-source scientific computing — and ship code that millions of people depend on. + + + ); +} export default function AboutPage(): JSX.Element { - const { siteConfig } = useDocusaurusContext(); return ( - {() => } -
      + {() => } +
      ); } diff --git a/src/components/blog/styles.module.css b/src/pages/blog.module.css similarity index 51% rename from src/components/blog/styles.module.css rename to src/pages/blog.module.css index 92bbe7adb..5cb341d57 100644 --- a/src/components/blog/styles.module.css +++ b/src/pages/blog.module.css @@ -1,81 +1,69 @@ .blogpost_image { filter: grayscale(1); + height: 180px; + display: flex; + align-items: center; + justify-content: center; + background: var(--ifm-bg-brand); + border-radius: 4px; } .blogpost_card { height: 556px; - width: 369px; - border-radius: 8px; - box-shadow: 4px 4px 18px -1px #dee0fc; padding: var(--ifm-spacing-xl); - background: var(--ifm-background-color-card); -} - -.blogpost_card:hover { - border: 1px solid #cbc7b1; -} - -div .blogpost_header { - color: var(--ifm-text-color); -} -div .blogpost_summary { - color: var(--ifm-text-color); -} - -div .blogpost_authors { - color: var(--ifm-text-color); -} - -div .blogpost_date { - color: var(--ifm-text-color); } .blogpost_summary { - font-family: var(--ifm-font-family-roboto); font-size: 14px; - font-style: normal; font-weight: 300; - line-height: 150%; /* 21px */ + line-height: 150%; letter-spacing: -0.154px; text-align: justify; margin-bottom: var(--ifm-spacing-sm); height: 124px; color: var(--ifm-text-color); + flex: 1; } .blogpost_header { - color: var(---ifm-text-color); - font-family: var(--ifm-font-family-roboto); font-size: 16px; - font-style: normal; font-weight: 600; - line-height: 150%; /* 27px */ + line-height: 150%; letter-spacing: -0.198px; height: 64px; margin: var(--ifm-spacing-xl) 0; color: var(--ifm-text-color); } +.blogpost_footer { + margin-top: auto; + padding-top: var(--ifm-spacing-sm); +} + .blogpost_date { - color: var(---ifm-text-color); - font-family: var(--ifm-font-family-roboto); font-size: 12px; - font-style: normal; font-weight: 800; line-height: 16px; letter-spacing: -0.132px; - text-align: left; - color: var(--ifm-text-color); + color: var(--ifm-color-accent-red); +} + +.blogpost_date_dot { + display: inline-block; + width: 7px; + height: 7px; + border-radius: 50%; + background-color: var(--ifm-color-accent-red); + margin-right: 6px; + vertical-align: middle; + margin-bottom: 2px; } .blogpost_authors { - font-family: var(--ifm-font-family-roboto); font-size: 12px; - font-style: normal; font-weight: 400; line-height: 16px; - text-align: left; - color: var(--ifm-text-color); + color: var(--ifm-color-secondary-s3); } .search_input { @@ -86,7 +74,6 @@ div .blogpost_date { background-repeat: no-repeat; background-position: 8px; border-radius: 8px; - padding: var(--ifm-spacing-xs) var(--ifm-spacing-lg) var(--ifm-spacing-xs) - var(--ifm-spacing-lg); + padding: var(--ifm-spacing-xs) var(--ifm-spacing-lg) var(--ifm-spacing-xs) var(--ifm-spacing-lg); margin: var(--ifm-spacing-lg) 0; } diff --git a/src/pages/blog.tsx b/src/pages/blog.tsx index 3a88e7fdb..dc51e20f4 100644 --- a/src/pages/blog.tsx +++ b/src/pages/blog.tsx @@ -1,16 +1,32 @@ -import useDocusaurusContext from "@docusaurus/useDocusaurusContext"; import Layout from "@theme/Layout"; -import BlogsComponent from "../components/blog"; -import { blogpostsDetails } from "../components/blog/blogpostsDetails"; +import BrowserOnly from "@docusaurus/BrowserOnly"; import Footer from "../components/footer/Footer"; - +import Section from "../components/layout/Section"; +import SectionSeparator from "../components/layout/SectionSeparator"; +import AtomOrange from "/img/icons/RSSOrange.svg"; +import BlogGrid from "../components/Blog"; export default function BlogPage(): JSX.Element { - const { siteConfig } = useDocusaurusContext(); return ( - -
      +
      +
      +

      + Featured posts by QuantStack contributors +

      + + + +
      +

      + Technical deep-dives, release notes, and perspectives from maintainers at the source. Read about the decisions, trade-offs, and discoveries that go into the tools powering modern science. +

      +
      + +
      + {() => } +
      +
      ); } diff --git a/src/pages/blogs/Fanny.tsx b/src/pages/blogs/Fanny.tsx index ed976c5ad..19b85fcc7 100644 --- a/src/pages/blogs/Fanny.tsx +++ b/src/pages/blogs/Fanny.tsx @@ -1,4 +1,4 @@ -import Fanny from "@site/src/components/about/Team/Fanny.md"; +import Fanny from "@site/src/pages/about/Team/Fanny.md"; import styles from "@site/src/components/about/styles.module.css"; import FannyAvatarUrl from "@site/static/img/avatars/Fanny.png"; import Layout from "@theme/Layout"; diff --git a/src/components/blog/blogpostsDetails.js b/src/pages/blogs/_blogpostsDetails.js similarity index 100% rename from src/components/blog/blogpostsDetails.js rename to src/pages/blogs/_blogpostsDetails.js diff --git a/src/components/careers/styles.module.css b/src/pages/careers.module.css similarity index 88% rename from src/components/careers/styles.module.css rename to src/pages/careers.module.css index 70b0576ef..c6de3ca02 100644 --- a/src/components/careers/styles.module.css +++ b/src/pages/careers.module.css @@ -3,11 +3,6 @@ padding: 0; } -.interview_picture { - width: 100%; - height: auto; -} - .picture_container { position: relative; width: 100%; @@ -16,6 +11,11 @@ justify-content: center; } +.interview_picture { + width: 100%; + height: auto; +} + .play_interview { height: 60px; width: 60px; @@ -26,19 +26,12 @@ -ms-transform: translate(-50%, -50%); } -.link_to_WTJ { - background-color: var(--ifm-color-secondary-s2); - color: white; - width: 358px; - font-weight: 700; -} - .interview_card { width: 280px; height: 300px; - background-color: var(--ifm-background-color); + background-color: var(--ifm-bg-neutral); border-radius: 10px; - box-shadow: 0px 0px 8px 1px #c8c8c7; + box-shadow: var(--ifm-shadow-card); padding: var(--ifm-spacing-sm); text-align: center; margin-bottom: var(--ifm-spacing-xl); @@ -59,7 +52,7 @@ font-size: 22px; font-style: normal; font-weight: 400; - line-height: 128.571%; + line-height: 128.571%; margin-top: var(--ifm-spacing-lg); } @@ -74,14 +67,18 @@ letter-spacing: 0.5px; } +.link_to_WTJ { + background-color: var(--ifm-bg-emphasis); + color: white; + font-weight: 700; +} + @media only screen and (max-width: 996px) { - /*Mobile*/ .join_the_team_text { text-align: center; font-size: 18px; font-family: var(--ifm-font-family-roboto); color: var(--ifm-color-primary-p2); - text-align: center; font-style: normal; font-weight: 400; line-height: 36px; @@ -93,13 +90,11 @@ } @media only screen and (min-width: 996px) { - /*Desktop*/ .join_the_team_text { text-align: center; font-size: 28px; font-family: var(--ifm-font-family-roboto); color: var(--ifm-color-primary-p2); - text-align: center; font-style: normal; font-weight: 400; line-height: 36px; diff --git a/src/pages/careers.tsx b/src/pages/careers.tsx index 2075918ae..3483d54b6 100644 --- a/src/pages/careers.tsx +++ b/src/pages/careers.tsx @@ -1,16 +1,117 @@ -import useDocusaurusContext from '@docusaurus/useDocusaurusContext'; -import Layout from '@theme/Layout'; -import Careers from '../components/careers'; +import Layout from "@theme/Layout"; +import BrowserOnly from "@docusaurus/BrowserOnly"; import Footer from "../components/footer/Footer"; +import Section from "../components/layout/Section"; +import SectionSeparator from "../components/layout/SectionSeparator"; +import Banner from "../components/layout/Banner"; +import Link from "@docusaurus/Link"; +import styles from "./careers.module.css"; +import PlayCircle from "@site/static/img/icons/PlayCircle.svg"; +import GroupPhotoUrl from "@site/static/img/group/group-photo.png"; +import SylvainPictureUrl from "@site/static/img/interviews/Sylvain_WTJ.png"; +import JohanPictureUrl from "@site/static/img/interviews/Johan_WTJ.png"; +import MartinPictureUrl from "@site/static/img/interviews/Martin_WTJ.png"; +import JeremyPictureUrl from "@site/static/img/interviews/Jeremy_WTJ.png"; +import DarianPictureUrl from "@site/static/img/interviews/Darian_WTJ.png"; +import DavidPictureUrl from "@site/static/img/interviews/David_WTJ.png"; +import GabrielaPictureUrl from "@site/static/img/interviews/Gabriela_WTJ.png"; +import TrungPictureUrl from "@site/static/img/interviews/Trung_WTJ.png"; +import MeriemPictureUrl from "@site/static/img/interviews/Meriem_WTJ.png"; +import MatthiasPictureUrl from "@site/static/img/interviews/Matthias_WTJ.png"; +import SandrinePictureUrl from "@site/static/img/interviews/Sandrine_WTJ.png"; + +const interviews = [ + { completeName: "Sylvain Corlay", firstName: "Sylvain", position: "CEO", pictureUrl: SylvainPictureUrl, url: "https://www.dailymotion.com/video/xa0qmac" }, + { completeName: "Johan Mabille", firstName: "Johan", position: "Technical Director", pictureUrl: JohanPictureUrl, url: "https://www.dailymotion.com/video/x9zl9ta" }, + { completeName: "Martin Renou", firstName: "Martin", position: "Technical Director", pictureUrl: MartinPictureUrl, url: "https://www.dailymotion.com/video/x9zl9t6" }, + { completeName: "Jeremy Tuloup", firstName: "Jeremy", position: "Technical Director", pictureUrl: JeremyPictureUrl, url: "https://www.dailymotion.com/video/x9zl9t8" }, + { completeName: "Afshin Darian", firstName: "Darian", position: "Technical Director", pictureUrl: DarianPictureUrl, url: "https://www.dailymotion.com/video/x9zl9t2" }, + { completeName: "David Brochart", firstName: "David", position: "Technical Director", pictureUrl: DavidPictureUrl, url: "https://www.dailymotion.com/video/x9zl9t4" }, + { completeName: "Gabriela Vives", firstName: "Gabriela", position: "UX Designer and Researcher", pictureUrl: GabrielaPictureUrl, url: "https://www.dailymotion.com/video/x9zl9sw" }, + { completeName: "Trung Le Duc", firstName: "Trung", position: "Scientific Software Developer", pictureUrl: TrungPictureUrl, url: "https://www.dailymotion.com/video/x9zl9t0" }, + { completeName: "Sandrine Pataut", firstName: "Sandrine", position: "Scientific Software Developer", pictureUrl: SandrinePictureUrl, url: "https://www.dailymotion.com/video/xa0qmai" }, + { completeName: "Matthias Meschede", firstName: "Matthias", position: "Chief Operating Officer", pictureUrl: MatthiasPictureUrl, url: "https://www.dailymotion.com/video/xa0qmae" }, + { completeName: "Meriem Ben Ismail", firstName: "Meriem", position: "Scientific Software Developer", pictureUrl: MeriemPictureUrl, url: "https://www.dailymotion.com/video/xa0qmag" }, +]; + +function InterviewCard({ person }) { + return ( + +
      +
      +
      + {`${person.completeName}, + +
      +
      +
      {person.firstName}
      +
      {person.position}
      +
      + + ); +} + +function CareersContent() { + return ( + <> +
      +

      Join the QuantStack team.

      +

      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.

      +
      + + + +
      +
      + QuantStack team gathered at JupyterCon in Paris, May 2023. +
      +
      +
      + We're looking for researchers and engineers who want to work at the frontier of open-source scientific computing. If you have strong fundamentals, a taste for hard problems, and care deeply about the impact of your work — we'd like to meet you. +
      +
      +

      Working at QuantStack

      +
      +
        + {interviews.map((person) => ( +
      • +
        + +
        +
        • + ))} +
      +
      +
      +
      +
      + + + + OPEN OUR PROFILE + +
      + } + > + Learn more on our Welcome to the Jungle web page. + + + ); +} export default function CareersPage(): JSX.Element { - const { siteConfig } = useDocusaurusContext(); return ( - -
      + {() => } +
      ); } - diff --git a/src/components/contact/styles.module.css b/src/pages/contact.module.css similarity index 55% rename from src/components/contact/styles.module.css rename to src/pages/contact.module.css index ef330c1fb..e29c28515 100644 --- a/src/components/contact/styles.module.css +++ b/src/pages/contact.module.css @@ -4,8 +4,6 @@ background: var(--ifm-color-blue-jupyter); } - - .contact_form { margin-top: var(--ifm-spacing-xl); } @@ -13,48 +11,45 @@ .form_label { font-size: 12px; color: var(--ifm-text-color); - background-color: var(--ifm-background-color); + background-color: var(--ifm-bg-neutral); } - - @media only screen and (max-width: 996px) { - /*Mobile*/ .small_input { width: 300px; height: 56px; border-radius: 4px; } - + .large_input { width: 300px; height: 220px; border-radius: 4px; } + .send_button_container { height: 59px; width: 300px; margin: var(--ifm-spacing-2xl) 0; } - +} + +@media only screen and (min-width: 996px) { + .small_input { + width: 508px; + height: 56px; + border-radius: 4px; } - @media only screen and (min-width: 996px) { - /*Desktop*/ - .small_input { - width: 508px; - height: 56px; - border-radius: 4px; - } - - .large_input { - width: 508px; - height: 220px; - border-radius: 4px; - } - .send_button_container { - height: 59px; - width: 508px; - margin: var(--ifm-spacing-2xl) 0; - } - } \ No newline at end of file + .large_input { + width: 508px; + height: 220px; + border-radius: 4px; + } + + .send_button_container { + height: 59px; + width: 508px; + margin: var(--ifm-spacing-2xl) 0; + } +} diff --git a/src/pages/contact.tsx b/src/pages/contact.tsx index 1fd3daf8d..da25de8ab 100644 --- a/src/pages/contact.tsx +++ b/src/pages/contact.tsx @@ -1,15 +1,32 @@ -import useDocusaurusContext from "@docusaurus/useDocusaurusContext"; import Layout from "@theme/Layout"; -import Contact from "@site/src/components/contact"; import BrowserOnly from "@docusaurus/BrowserOnly"; import Footer from "../components/footer/Footer"; +import SplitSection from "../components/layout/SplitSection"; +import ContactForm from "../components/ContactForm"; +import ContactIllustration from "/img/illustrations/contact.svg"; export default function ContactPage(): JSX.Element { - const { siteConfig } = useDocusaurusContext(); return ( - {() => } -
      + + {() => ( + + } + > +

      Contact us

      + +       + )} +       +
      ); } diff --git a/src/pages/fundable.tsx b/src/pages/fundable.tsx deleted file mode 100644 index 8bb5a9295..000000000 --- a/src/pages/fundable.tsx +++ /dev/null @@ -1,14 +0,0 @@ -import useDocusaurusContext from '@docusaurus/useDocusaurusContext'; -import Layout from '@theme/Layout'; -import FundableProjects from '../components/fundable'; -import Footer from "../components/footer/Footer"; - -export default function FundableProjectsPage(): JSX.Element { - const { siteConfig } = useDocusaurusContext(); - return ( - - -
      - - ); -} \ No newline at end of file diff --git a/src/pages/home.tsx b/src/pages/home.tsx deleted file mode 100644 index 11a7a04c0..000000000 --- a/src/pages/home.tsx +++ /dev/null @@ -1,17 +0,0 @@ -import useDocusaurusContext from "@docusaurus/useDocusaurusContext"; -import Layout from "@theme/Layout"; -import Home from "../components/home/Home"; -import BrowserOnly from "@docusaurus/BrowserOnly"; -import Footer from "../components/footer/Footer"; - -export default function HomePage(): JSX.Element { - const { siteConfig } = useDocusaurusContext(); - return ( - -
      - {() => } -
      -
      -       - ); -} diff --git a/src/pages/index.module.css b/src/pages/index.module.css new file mode 100644 index 000000000..1b081f900 --- /dev/null +++ b/src/pages/index.module.css @@ -0,0 +1,202 @@ +/* ── Hero ─────────────────────────────────────────────────────────────────── */ + +.hero_container { + background-color: var(--ifm-bg-brand); + min-height: 100vh; + display: flex; + flex-direction: column; + justify-content: center; + padding-top: calc(var(--ifm-navbar-height) + var(--ifm-spacing-2xl)); + padding-bottom: var(--ifm-spacing-2xl); + margin-top: calc(-1 * var(--ifm-navbar-height)); + box-sizing: border-box; + position: relative; + overflow: hidden; +} + +.hero_body { + position: relative; + display: flex; + align-items: center; + gap: var(--ifm-spacing-2xl); +} + +.hero_text { + flex: 3; + min-width: 0; + position: relative; + z-index: 1; +} + +.hero_image { + flex: 2; + display: flex; + align-items: center; + justify-content: center; + position: relative; + z-index: 1; +} + +.hero_title { + font-size: 8rem; + line-height: 1; + white-space: nowrap; +} + +.sub_header { + text-align: left; +} + +.tech_tagline { + color: var(--ifm-color-accent-red); + font-size: var(--ifm-font-size-secondary-title); + font-weight: 700; +} + +.accent { + color: var(--ifm-color-accent-red); +} + +@media (max-width: 996px) { + .hero_title { + font-size: 4rem; + } + + .hero_body { + flex-direction: column; + padding: var(--ifm-spacing-xl) 0; + } + + .hero_image { + display: none; + } + + .tech_tagline { + font-size: 20px; + line-height: 150%; + } +} + +/* ── Services (How we work with you) ─────────────────────────────────────── */ + +.topics_header { + font-family: var(--ifm-font-family-roboto); + font-size: var(--ifm-font-size-secondary-title); + font-weight: 700; + line-height: 28px; + min-height: 56px; + display: flex; + align-items: flex-start; + justify-content: flex-start; + text-align: left; + margin-bottom: var(--ifm-spacing-xl); + color: var(--ifm-color-neutral-n2); +} + +.topics_card { + padding: var(--ifm-spacing-2xl) var(--ifm-spacing-lg); +} + +.services_link_mobile { + display: none; +} + +.projects_link { + display: none; +} + +@media (max-width: 996px) { + .services_link_mobile { + display: block; + } + + .projects_link { + display: block; + } + + .services_link_desktop { + display: none; + } +} + +/* ── Projects Overview ────────────────────────────────────────────────────── */ + +.projects_overview_container { + display: block; +} + +.tagline { + color: var(--ifm-color-blue-jupyter); +} + +@media (max-width: 996px) { + .projects_overview_container { + display: none; + } +} + +/* ── About Us ─────────────────────────────────────────────────────────────── */ + +.aboutQS_text { + font-size: 14px; + text-align: center; + margin-bottom: var(--ifm-spacing-xl); + max-width: 800px; + margin-left: auto; + margin-right: auto; +} + +.learn_more_button_container { + display: flex; + justify-content: center; + margin-top: var(--ifm-spacing-xl); +} + +.learn_more_button_container :global(.link-to-button) { + background: var(--ifm-color-accent-yellow); + color: var(--ifm-color-primary-p2); +} + +.learn_more_button_container :global(.link-to-button):hover { + color: var(--ifm-color-primary-p2); + box-shadow: 0 8px 28px rgba(245, 229, 59, 0.5); +} + +@media (min-width: 996px) { + .aboutQS_text { + font-size: 24px; + margin-bottom: var(--ifm-spacing-lg); + } +} + +/* ── News ─────────────────────────────────────────────────────────────────── */ + +@media (max-width: 996px) { + .news_wrapper { + display: none; + } +} + +/* ── Link buttons ─────────────────────────────────────────────────────────── */ + +@media only screen and (max-width: 996px) { + .link_to, + .link_to_services, + .link_to_about_us { + background-color: var(--ifm-color-primary-p1); + color: var(--ifm-text-color-on-primary-p1); + } + + .link_to:hover, + .link_to_services:hover, + .link_to_about_us:hover { + color: var(--ifm-text-color-on-primary-p1); + box-shadow: 0 8px 24px rgba(246, 241, 149, 0.5); + } +} + +@media only screen and (min-width: 996px) { + .link_to { background-color: var(--ifm-bg-emphasis); color: white; } + .link_to_services { background-color: var(--ifm-color-blue-jupyter); color: white; } + .link_to_about_us { background-color: var(--ifm-bg-emphasis); color: white; } +} diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 338a6dde5..2bce32dd8 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -1,16 +1,230 @@ -import useDocusaurusContext from "@docusaurus/useDocusaurusContext"; -import Layout from "@theme/Layout"; -import Home from "../components/home/Home"; import BrowserOnly from "@docusaurus/BrowserOnly"; +import Link from "@docusaurus/Link"; +import Layout from "@theme/Layout"; import Footer from "../components/footer/Footer"; +import Section from "../components/layout/Section"; +import SectionSeparator from "../components/layout/SectionSeparator"; +import SplitSection from "../components/layout/SplitSection"; +import Banner from "../components/layout/Banner"; +import Card from "../components/layout/Card"; +import CardGrid from "../components/layout/CardGrid"; +import LogoGrid from "../components/LogoGrid"; +import LinkToNotebookLink from "../components/LinkToNotebookLink"; +import BlogpostCard from "../components/BlogpostCard"; +import { blogpostsDetails } from "./blogs/_blogpostsDetails"; +import styles from "./index.module.css"; + +import Astronaut from "/img/quantstack/astronaut.svg"; +import GroupPhotoUrl from "@site/static/img/group/QuantStack-2000-58.png"; +import JupyterPictureUrl from "@site/static/img/projects/jupyterlab_examples.png"; +import MambaPictureUrl from "@site/static/img/projects/mamba_console.png"; +import SpecialProjectsPictureUrl from "@site/static/img/projects/special_projects.png"; +import RoboticsPictureUrl from "@site/static/img/projects/robotics.png"; +import XTensorXSIMDPicture from "@site/static/img/projects/xtensor_xsimd.svg"; +import ApacheArrowPicture from "@site/static/img/projects/apache_arrow.svg"; + +function HomeContent() { + const numberOfBlogs = blogpostsDetails.length; + + return ( + <> + {/* ── Hero ──────────────────────────────────────────────────────────── */} +
      +
      +
      +
      +

      QUANTSTACK

      +

      + OPEN TOOLS FOR DATA SCIENCE AND SCIENTIFIC COMPUTE +

      +

      + From Jupyter to Mamba to Apache Arrow, we maintain the stack millions of + researchers, engineers, and students depend on. Today we're also building + notebook.link to ship entire compute environments right your browser. +

      +
      +
      + +
      +
      +
      +
      + + + + {/* ── Trusted By ────────────────────────────────────────────────────── */} +
      +

      Trusted by

      + +
      + + + + {/* ── How we work with you (services) ───────────────────────────────── */} +
      +
      + DISCOVER OUR SERVICES +
      +

      How we work with you

      + +
    • + +
      Support Retainer
      +

      Direct access to the upstream maintainers of the tools your team depends on — not a helpdesk.

      +

      We triage issues, review pull requests, advise on architecture, and take ownership of problems your team cannot solve alone. Our clients include AWS, Bloomberg, Safran, and the European Space Agency.

      +       +
      • +
    • + +
      Custom Engineering
      +

      We build tools and platforms at the frontier of open-source scientific computing.

      +

      Recent examples: JupyterGIS for ESA, JupyterCAD for Safran Aircraft Engines, notebook.link. Everything we build goes back upstream wherever possible.

      +       +
      • +
    • + +
      Funded Development
      +

      Need a specific fix or feature in Mamba, JupyterLab, Arrow, or another project we maintain? We implement it upstream.

      +

      You get the feature. The community maintains it. No fork, no long-term maintenance burden on your team.

      +       +
      • +       +
      + DISCOVER ALL OF OUR PROJECTS +
      + DISCOVER OUR SERVICES +
      +
      +
      + + + + {/* ── What we work on (projects) ────────────────────────────────────── */} +
      +
      +

      What we work on

      +
      + + }> +

      Jupyter Ecosystem

      +

      Core contributors to JupyterLab, JupyterLite, Voilà, and the broader Jupyter ecosystem.

      +

      We co-founded JupyterLab and JupyterLite — the browser-native Jupyter that runs without a server. Our team drives real-time collaboration, AI integration, and the visual debugger across the Jupyter stack, and maintains Voilà, xeus, JupyterGIS, and JupyterCAD. JupyterLab reaches over 10 million users worldwide; JupyterLite serves hundreds of thousands of students on minimal infrastructure.

      +       + + }> +

      Package Management

      +

      We created Mamba, the fast conda replacement serving 5 million downloads per month.

      +

      We created Mamba, the fast, reliable conda replacement now serving 5 million downloads per month. We co-maintain conda-forge, delivering over 1 billion package downloads per month, and built emscripten-forge — the package forge that brings the full multilingual scientific computing stack to WebAssembly.

      +       + + }> +

      Bespoke Platforms

      +

      Platforms built on our open-source stack for clients and the community.

      +
        +
      • JupyterCAD — real-time collaborative 3D CAD editing, built for Safran Aircraft Engines.
        • +
      • JupyterGIS — collaborative geospatial platform for ESA and research institutions.
        • +
      +       + + }> +

      Robotics

      +

      Creators of RoboStack, the first multi-platform ROS distribution, and maintainers of jupyter-ros.

      +

      We created RoboStack, the first multi-platform distribution of ROS as conda packages, enabling robotics development on Linux, macOS, and Windows without system dependencies. We maintain jupyter-ros, a JupyterLab-based development environment for the ROS ecosystem.

      +       + + }> +

      Scientific Computing

      +

      Authors of xtensor and xsimd, adopted by Apache Arrow, Firefox, and Pythran.

      +

      We authored xtensor, a multi-dimensional array library for C++ with a NumPy-style API, and xsimd, a unified SIMD operations library adopted by Apache Arrow, Firefox, Krita, and Pythran.

      +       + + }> +

      Data Infrastructure

      +

      Principal maintainers of Apache Arrow's C++ core.

      +

      We are principal maintainers of Apache Arrow's C++ core — the in-memory columnar format underpinning most of the modern data ecosystem. We also maintain Apache Parquet, the dominant columnar storage format for analytics workloads.

      +       +
      + + {/* ── notebook.link ─────────────────────────────────────────────────── */} + } + > + A full Jupyter environment as a link. Instant setup, no server, no hassle. Sandboxed + compute runs in the browser, powered by WebAssembly and emscripten-forge. For{" "} + universities replacing JupyterHub, for{" "} + researchers sharing reproducible work, for{" "} + enterprise data teams, and for{" "} + public data portals serving millions of visitors + at near-zero infrastructure cost. + + + {/* ── About us ──────────────────────────────────────────────────────── */} +
      +

      About us

      +
      + QuantStack team photo +
      +

      + QuantStack was founded in 2016. Today we operate as a collective of about 30 engineers + contributing remotely or from our offices in Paris to the global open-source stack and + to our clients' projects. Many of us have PhD-level research experience or deep + engineering backgrounds. Our team combines decades of senior experience with the fresh + creativity and energy from more recent contributors. +

      +
      + Learn more +
      +
      + + + + {/* ── Recent blog posts ─────────────────────────────────────────────── */} +
      +
      +

      Recent blog contributions

      + + {[0, 1, 2].map((i) => ( +
    • + +
      • + ))} +       +
      + READ MORE POSTS +
      +
      +
      + + {/* ── End CTA ───────────────────────────────────────────────────────── */} + + SCHEDULE A MEETING +
      + } + > + Support retainer, custom feature, or a full engineering engagement — + you work directly with the upstream maintainers of the tools your team depends on. + + + ); +} export default function QSWebsite(): JSX.Element { - const { siteConfig } = useDocusaurusContext(); return ( - {() => } -
      + {() => } +
      ); } - diff --git a/src/pages/notebooklink.module.css b/src/pages/notebooklink.module.css new file mode 100644 index 000000000..5ea5f7994 --- /dev/null +++ b/src/pages/notebooklink.module.css @@ -0,0 +1,29 @@ +.product_label { + color: var(--ifm-color-accent-yellow); + font-family: var(--ifm-font-family-roboto); + font-size: 13px; + font-weight: 700; + letter-spacing: 2.5px; + text-transform: uppercase; + margin-bottom: var(--ifm-spacing-xs); + padding: 0; +} + +.subtitle { + color: rgba(255, 255, 255, 0.85); + font-size: var(--ifm-font-size-medium); + padding: 0; +} + +.feature_icon { + font-size: 32px; + margin-bottom: var(--ifm-spacing-sm); + display: block; +} + +.feature_title { + font-family: var(--ifm-font-family-display); + font-weight: 800; + font-size: 22px; + margin-bottom: var(--ifm-spacing-xs); +} diff --git a/src/pages/notebooklink.tsx b/src/pages/notebooklink.tsx new file mode 100644 index 000000000..1f0acc03c --- /dev/null +++ b/src/pages/notebooklink.tsx @@ -0,0 +1,132 @@ +import Layout from "@theme/Layout"; +import BrowserOnly from "@docusaurus/BrowserOnly"; +import Footer from "../components/footer/Footer"; +import SplitSection from "../components/layout/SplitSection"; +import Section from "../components/layout/Section"; +import SectionSeparator from "../components/layout/SectionSeparator"; +import CardGrid from "../components/layout/CardGrid"; +import Card from "../components/layout/Card"; +import Banner from "../components/layout/Banner"; +import Rocket from "/img/notebooklink/rocket.svg"; +import LinkToNotebookLink from "../components/LinkToNotebookLink"; +import styles from "./notebooklink.module.css"; + +function NotebookLinkContent() { + return ( + <> + + } + > +

      Our product: Notebook.link

      +

      Browser-native scientific computing. Large-scale deployments, no server, no setup, no limits.

      + +       + +
      +

      A complete compute environment in a link.

      +

      + Notebook.link delivers a full Jupyter environment running entirely in the browser — + powered by WebAssembly. No installation, no server spin-up, no IT ticket. + Click the link, start computing. +

      +

      + Built on JupyterLite and emscripten-forge, our open-source stack that brings + the complete scientific ecosystem — NumPy, SciPy, Pandas, Matplotlib, + and hundreds more including in C, R, Fortran and other languages — to any modern browser. The compute runs on your users' devices, + not our servers. That means it scales to any number of users for the cost of file storage. +

      +
      + +
      +

      Proven at scale.

      +

      + The technology has been tested to deploy notebooks to tens of thousands of concurrent users + — just from standard static web servers. Zero compute infrastructure cost per user. +

      + +
    • + +
      hundres of thousands of students
      +

      JupyterLite — the same engine powering notebook.link — has been tested with hundreds of thousands of users.

      +       +
      • +
    • + +
      orders of magnitude cheaper
      +

      Compared to JupyterHub, or other commercial platforms. Because users bring their own compute, we only add the comfort layer, your cost remains low.

      +       +
      • +
    • + +
      Order-0 scaling
      +

      More users don't mean more servers. Browser-based execution means your platform scales without your costs scaling with it.

      +       +
      • +       +
      + +
      +

      Built for every use case.

      + +
    • + +
      Education
      +

      Replace JupyterHub for your institution. No containers per student, no DevOps burden, no IT tickets. LMS integration via LTI. Gradable notebooks with encrypted solutions.

      +       +
      • +
    • + +
      Research
      +

      Share reproducible work as a link. Byte-identical WASM environments mean your results are reproducible — not just in theory, but in practice. Computational irreproducibility costs billions annually.

      +       +
      • +
    • + +
      Enterprise data platforms
      +

      Give internal analysts a Jupyter environment without the security overhead of local installs or the cost of per-user cloud kernels. SSO, RBAC, and audit logging on the roadmap. Backend kernels still available on demand.

      +       +
      • +
    • + +
      Public data portals
      +

      Let millions of visitors interact with your data — including geospatial datasets via JupyterGIS or other advanced IDEs — without provisioning a single compute server. Data stays in the browser, GDPR-compliant by architecture.

      +       +
      • +
    • + +
      Agentic AI
      +

      Let AI agents access compute environments and run real calculations right in the browser, like claude code but sandboxed, safe and available on the fly.

      +       +
      • +       +
      + + } + > + Free tier includes unlimited WebAssembly compute, link sharing, and basic storage. + Enterprise plans for universities and organizations with advanced storage and user management, on-demand backend kernels, grading + Moodle integration available. + + + ); +} + +export default function NotebookLinkPage(): JSX.Element { + return ( + + {() => } +
      + + ); +} diff --git a/src/pages/projects.module.css b/src/pages/projects.module.css new file mode 100644 index 000000000..377dbc9db --- /dev/null +++ b/src/pages/projects.module.css @@ -0,0 +1,69 @@ +.project_title { + margin-bottom: var(--ifm-spacing-sm); + margin-top: var(--ifm-spacing-md); + font-family: var(--ifm-font-family-roboto); + font-size: var(--ifm-font-size-secondary-title); + font-weight: bolder; + line-height: 150%; + text-align: start; + color: var(--ifm-color-primary-p2); +} + +.project_description { + text-align: left; + color: var(--ifm-color-primary-p2); +} + +.project_logo { + max-width: 160px; + max-height: 160px; + width: auto; + height: auto; + object-fit: contain; + display: block; +} + +.project_picture { + border-radius: 10px; + padding: var(--ifm-spacing-lg); + display: flex; + align-items: center; + justify-content: center; +} + +.project_picture_jupyter { border: solid 1px var(--ifm-color-orange-jupyter); } +.project_picture_mamba { border: solid 1px #4cae4c; } +.project_picture_condaforge { border: solid 1px var(--ifm-color-grey-condaforge); } +.project_picture_arrow { border: solid 1px black; } +.project_picture_xtensor { border: solid 1px var(--ifm-color-green-xtensor); } +.project_picture_robotics { border: solid 1px rgb(146, 95, 218); } + +@media only screen and (max-width: 996px) { + .project_picture_jupyter, + .project_picture_mamba, + .project_picture_condaforge, + .project_picture_arrow, + .project_picture_xtensor, + .project_picture_robotics { + border: none; + padding: var(--ifm-spacing-md); + } +} + +@media only screen and (min-width: 996px) { + .header_text { + font-size: 22px; + font-weight: 400; + line-height: 28px; + margin-bottom: var(--ifm-spacing-xl); + } +} + +@media only screen and (max-width: 996px) { + .header_text { + font-size: 14px; + font-weight: 400; + line-height: 20px; + margin-bottom: var(--ifm-spacing-lg); + } +} diff --git a/src/pages/projects.tsx b/src/pages/projects.tsx index b2e625c9d..c9e2daa2c 100644 --- a/src/pages/projects.tsx +++ b/src/pages/projects.tsx @@ -1,14 +1,157 @@ -import useDocusaurusContext from "@docusaurus/useDocusaurusContext"; import Layout from "@theme/Layout"; -import Projects from "@site/src/components/projects"; import BrowserOnly from "@docusaurus/BrowserOnly"; import Footer from "../components/footer/Footer"; +import Section from "../components/layout/Section"; +import SectionSeparator from "../components/layout/SectionSeparator"; +import SplitSection from "../components/layout/SplitSection"; +import Banner from "../components/layout/Banner"; +import LinkToContact from "../components/LinkToContact"; +import styles from "./projects.module.css"; + +import JupyterLogoUrl from "@site/static/img/projects/Jupyter.png"; +import MambaLogoUrl from "@site/static/img/projects/Mamba.png"; +import CondaForgeLogoUrl from "@site/static/img/projects/conda_forge.png"; +import ApacheArrowLogoUrl from "@site/static/img/projects/apache_arrow.png"; +import XtensorLogoUrl from "@site/static/img/projects/xtensor.png"; +import RobostackLogoUrl from "@site/static/img/projects/robostack.png"; + +function ProjectsContent() { + return ( + <> + {/* ── Header ────────────────────────────────────────────────────────── */} +
      +

      Working in the open.

      +

      + From interactive environments to package managers to data formats — our tools reach + millions of researchers, engineers, and students across every scientific discipline. + We build in the open so that anyone can build on what we create. +

      +
      + + + + {/* ── Jupyter ───────────────────────────────────────────────────────── */} + + Jupyter logo +
    + } + > +
    Jupyter
    +
    +

    QuantStack is one of the main organizations behind the Jupyter project. We co-founded JupyterLab and JupyterLite — the browser-native Jupyter that runs without a server — and drive major features including real-time collaboration, the visual debugger, and AI integration.

    +

    We also maintain Voilà, xeus, JupyterGIS, and JupyterCAD. JupyterLab reaches over 10 million users worldwide; JupyterLite serves hundreds of thousands of students on minimal infrastructure.

    +
    + + + {/* ── Mamba ─────────────────────────────────────────────────────────── */} + + Mamba logo + + } + > +
    Mamba
    +
    +

    We created Mamba, the fast, reliable drop-in replacement for the conda package manager. Mamba delivers dramatically faster dependency solving, better error messages, and full compatibility with the conda ecosystem.

    +

    Mamba now serves 5 million downloads per month and is the package manager of choice for a large part of the scientific Python community.

    +
    +     + + {/* ── Conda-forge ───────────────────────────────────────────────────── */} + + conda-forge logo + + } + > +
    Conda-forge & emscripten-forge
    +
    +

    We are one of the key organizations supporting conda-forge, the community-led collection of recipes and build infrastructure for the conda/mamba package manager. Conda-forge delivers over 1 billion package downloads per month and is the reference source for the scientific computing ecosystem.

    +

    We also built emscripten-forge, the package forge that brings the full multilingual scientific computing stack to WebAssembly — the backbone of JupyterLite and notebook.link.

    +
    +     + + {/* ── Apache Arrow & Parquet ────────────────────────────────────────── */} + + Apache Arrow logo + + } + > +
    Apache Arrow & Parquet
    +
    +

    QuantStack is home to principal maintainers of Apache Arrow's C++ core — the in-memory columnar format that underpins most of the modern data ecosystem, from pandas to Spark to DuckDB.

    +

    We also maintain Apache Parquet, the dominant columnar storage format for analytics workloads, and provide commercial support and custom development across the Arrow ecosystem.

    +
    +     + + {/* ── Xtensor & Xsimd ──────────────────────────────────────────────── */} + + xtensor logo + + } + > +
    xtensor & xsimd
    +
    +

    We authored xtensor, a multi-dimensional array library for C++ with a NumPy-style API supporting lazy broadcasting, universal functions, and language bindings for Python, R, and Julia.

    +

    We also created xsimd, a unified API for SIMD operations that has seen wide adoption: Apache Arrow, Firefox, Krita, and Pythran all depend on it for high-performance computing.

    +
    +     + + {/* ── Robotics ──────────────────────────────────────────────────────── */} + + RoboStack logo + + } + > +
    Robotics
    +
    +

    We created RoboStack, the first multi-platform distribution of ROS as conda packages, enabling robotics development on Linux, macOS, and Windows without system dependencies.

    +

    We maintain jupyter-ros, a JupyterLab-based development environment integrating ROS with the Jupyter ecosystem.

    +
    +     + + {/* ── CTA ───────────────────────────────────────────────────────────── */} + } + > + Support retainer, funded development, or a custom engineering engagement — + you work directly with the upstream maintainers of the tools your stack depends on. + + + ); +} export default function ProjectsPage(): JSX.Element { - const { siteConfig } = useDocusaurusContext(); return ( - {() => } + {() => }