From d43d323ea48fc5fe93b01314e97f09a901731c12 Mon Sep 17 00:00:00 2001 From: Florence Haudin Date: Thu, 26 Jun 2025 10:53:41 +0200 Subject: [PATCH] Add a new page for fundable projects. --- docusaurus.config.ts | 7 + src/components/footer/Footer.tsx | 10 + src/components/fundable/IconContainer.tsx | 26 + src/components/fundable/LargeProjectCard.tsx | 29 + .../fundable/LargeProjectCardPage.tsx | 80 + src/components/fundable/MenuSideBar.tsx | 48 + src/components/fundable/ProgressBar.tsx | 25 + src/components/fundable/ProjectCategory.tsx | 22 + src/components/fundable/SmallProjectCard.tsx | 63 + .../EmscriptenForgePackageRequests.md | 5 + .../JupyterGISRasterProcessing.md | 8 + .../JupyterGISToolsForPythonAPI.md | 3 + .../JupyterLabParquetFileViewer.md | 0 .../descriptions/NbconvertModernization.md | 5 + src/components/fundable/index.tsx | 48 + src/components/fundable/projectsDetails.ts | 102 + src/components/fundable/styles.module.css | 152 + src/css/custom.css | 23 + src/pages/fundable.tsx | 14 + .../EmscriptenForgePackageRequests.tsx | 5 + .../fundable/JupyterGISRasterProcessing.tsx | 5 + .../fundable/JupyterGISToolsForPythonAPI.tsx | 5 + src/pages/fundable/NbconvertModernization.tsx | 5 + static/img/avatars/QuantStack.html | 73 + .../avatars/QuantStack_files/logo-website.svg | 127 + static/img/avatars/QuantStack_files/main.js | 1964 +++++ .../avatars/QuantStack_files/runtime~main.js | 1352 ++++ .../img/avatars/QuantStack_files/styles.css | 6669 +++++++++++++++++ static/img/icons/Empty.png | Bin 0 -> 6710 bytes static/img/icons/Empty.svg | 55 + static/img/icons/Globe.png | Bin 0 -> 21351 bytes static/img/icons/Globe.svg | 50 + static/img/icons/JupyterGIS.png | Bin 0 -> 85139 bytes static/img/icons/JupyterGIS.svg | 55 + static/img/icons/Python.png | Bin 0 -> 15281 bytes static/img/icons/Python.svg | 52 + static/img/icons/Tools.svg | 49 + static/img/icons/empty.png | Bin 0 -> 6161 bytes static/img/icons/empty.svg | 52 + static/rss.xml | 2 +- static/rss_all.xml | 2 +- 41 files changed, 11190 insertions(+), 2 deletions(-) create mode 100644 src/components/fundable/IconContainer.tsx create mode 100644 src/components/fundable/LargeProjectCard.tsx create mode 100644 src/components/fundable/LargeProjectCardPage.tsx create mode 100644 src/components/fundable/MenuSideBar.tsx create mode 100644 src/components/fundable/ProgressBar.tsx create mode 100644 src/components/fundable/ProjectCategory.tsx create mode 100644 src/components/fundable/SmallProjectCard.tsx create mode 100644 src/components/fundable/descriptions/EmscriptenForgePackageRequests.md create mode 100644 src/components/fundable/descriptions/JupyterGISRasterProcessing.md create mode 100644 src/components/fundable/descriptions/JupyterGISToolsForPythonAPI.md create mode 100644 src/components/fundable/descriptions/JupyterLabParquetFileViewer.md create mode 100644 src/components/fundable/descriptions/NbconvertModernization.md create mode 100644 src/components/fundable/index.tsx create mode 100644 src/components/fundable/projectsDetails.ts create mode 100644 src/components/fundable/styles.module.css create mode 100644 src/pages/fundable.tsx create mode 100644 src/pages/fundable/EmscriptenForgePackageRequests.tsx create mode 100644 src/pages/fundable/JupyterGISRasterProcessing.tsx create mode 100644 src/pages/fundable/JupyterGISToolsForPythonAPI.tsx create mode 100644 src/pages/fundable/NbconvertModernization.tsx create mode 100644 static/img/avatars/QuantStack.html create mode 100644 static/img/avatars/QuantStack_files/logo-website.svg create mode 100644 static/img/avatars/QuantStack_files/main.js create mode 100644 static/img/avatars/QuantStack_files/runtime~main.js create mode 100644 static/img/avatars/QuantStack_files/styles.css create mode 100644 static/img/icons/Empty.png create mode 100644 static/img/icons/Empty.svg create mode 100644 static/img/icons/Globe.png create mode 100644 static/img/icons/Globe.svg create mode 100644 static/img/icons/JupyterGIS.png create mode 100644 static/img/icons/JupyterGIS.svg create mode 100644 static/img/icons/Python.png create mode 100644 static/img/icons/Python.svg create mode 100644 static/img/icons/Tools.svg create mode 100644 static/img/icons/empty.png create mode 100644 static/img/icons/empty.svg diff --git a/docusaurus.config.ts b/docusaurus.config.ts index fabc5e3b5..372f57df1 100644 --- a/docusaurus.config.ts +++ b/docusaurus.config.ts @@ -110,6 +110,13 @@ const config: Config = { className: "custom_navbar_item", label: "Blog", position: "left", + }, + { + to: "/fundable/", + className: "custom_navbar_item", + label: "Fundable projects", + position: "right", + className:"fundable_projects" }, { to: "/contact/", diff --git a/src/components/footer/Footer.tsx b/src/components/footer/Footer.tsx index 3bff55f91..80960ac69 100644 --- a/src/components/footer/Footer.tsx +++ b/src/components/footer/Footer.tsx @@ -65,6 +65,16 @@ export default function Footer() { +
+ +
diff --git a/src/components/fundable/IconContainer.tsx b/src/components/fundable/IconContainer.tsx new file mode 100644 index 000000000..80714af8e --- /dev/null +++ b/src/components/fundable/IconContainer.tsx @@ -0,0 +1,26 @@ +import styles from "./styles.module.css"; +import Link from "@docusaurus/Link"; +import GHPicture from "@site/static/img/socialmedias/GH.svg"; +import LinkedInPicture from "@site/static/img/socialmedias/LinkedIn.svg"; +import BlueskyPicture from "@site/static/img/socialmedias/Bluesky.svg"; +import MastodonPicture from "@site/static/img/socialmedias/Mastodon.svg"; + +export default function IconContainer({ project }) { + const icons = project.icons + return ( + + +
+ {icons.map((Icon, index) => ( +
+ +
+ ))} +
+ ); + + +} diff --git a/src/components/fundable/LargeProjectCard.tsx b/src/components/fundable/LargeProjectCard.tsx new file mode 100644 index 000000000..800d87d2e --- /dev/null +++ b/src/components/fundable/LargeProjectCard.tsx @@ -0,0 +1,29 @@ +import styles from "./styles.module.css"; +import React from "react"; + +export default function LargeProjectCard({ project }) { + return ( +
+
+
+
+
+ {project.category} +
+
{project.title}
+
+
+
+
+
+
Overview
+
+ +
+
+
+ +
+
+ ); +} diff --git a/src/components/fundable/LargeProjectCardPage.tsx b/src/components/fundable/LargeProjectCardPage.tsx new file mode 100644 index 000000000..09a218185 --- /dev/null +++ b/src/components/fundable/LargeProjectCardPage.tsx @@ -0,0 +1,80 @@ +import { useHistory, useLocation } from "@docusaurus/router"; +import { useEffect } from "react"; +import styles from "./styles.module.css"; +import LargeProjectCard from "./LargeProjectCard"; +import { getCategoryFromProjectTitle } from "."; +import FundableProjects from "."; +import Layout from "@theme/Layout"; +import { Route } from 'react-router-dom'; + + +export default function LargeProjectCardPage() { + const location = useLocation(); + const history = useHistory(); + + useEffect(() => { + if (location.state?.fromFundable) { + window.scrollTo({ top: location.state.scrollY ?? 0, behavior: 'auto' }); + } + }, []); + + const handleOverlayClick = () => { + const scrollY = location.state?.scrollY; + setTimeout(() => { + if (scrollY !== undefined) { + window.scrollTo({ top: scrollY, behavior: 'auto' }); + } + }, 0); + history.replace('/fundable'); + }; + + const handleClose = () => { + const scrollY = location.state?.scrollY; + if (location.state?.fromFundable) { + history.replace('/fundable'); + + setTimeout(() => { + if (scrollY !== undefined) { + window.scrollTo({ top: scrollY, behavior: 'auto' }); + } + }, 0); + } else { + history.goBack(); + } + } + return ( + + + { + const { shortTitle } = match.params; /* extract the dynamic part from the url i.e. the shortTitle*/ + const projectsByCategory = getCategoryFromProjectTitle(shortTitle); + console.log('projectsByCategory:', projectsByCategory); + const project = projectsByCategory.find((project) => project.shortTitle.replace(/\s+/g, '') === shortTitle); + if (!project) return null; + + return ( +
+
e.stopPropagation()} + > +
+
+ ); + }} + /> + + ) +} \ No newline at end of file diff --git a/src/components/fundable/MenuSideBar.tsx b/src/components/fundable/MenuSideBar.tsx new file mode 100644 index 000000000..3cd22a23d --- /dev/null +++ b/src/components/fundable/MenuSideBar.tsx @@ -0,0 +1,48 @@ +// src/components/ScrollSidebar.js +import React, { useEffect, useState } from 'react'; +import styles from "./styles.module.css"; + +const sections = [ + { id: 'jupyter-ecosystem', label: 'Jupyter Ecosystem' }, + { id: 'project-management', label: 'Project Management' }, +]; + +export default function MenuSideBar() { + const [activeSectionId, setActiveSectionId] = useState(null); + + useEffect(() => { + const handleScroll = () => { + const scrollPosition = window.scrollY + 200; + for (const section of sections) { + const element = document.getElementById(section.id); + if (element && element.offsetTop <= scrollPosition) { + setActiveSectionId(section.id); + } + } + }; + window.addEventListener('scroll', handleScroll); + handleScroll(); + return () => window.removeEventListener('scroll', handleScroll); + }, []); + + return ( +
+ +
+ ); +} diff --git a/src/components/fundable/ProgressBar.tsx b/src/components/fundable/ProgressBar.tsx new file mode 100644 index 000000000..d43bff8f1 --- /dev/null +++ b/src/components/fundable/ProgressBar.tsx @@ -0,0 +1,25 @@ +import React from "react"; + +export default function ProgressBar({ value = 0, color = '#4caf50' }) { + return ( + +
+ +
+
+ ); +} diff --git a/src/components/fundable/ProjectCategory.tsx b/src/components/fundable/ProjectCategory.tsx new file mode 100644 index 000000000..964a89eb8 --- /dev/null +++ b/src/components/fundable/ProjectCategory.tsx @@ -0,0 +1,22 @@ +import styles from "./styles.module.css"; +import { SmallProjectCard } from "./SmallProjectCard"; + + +export default function ProjectCategory({ projectCategoryName, projectCategory }) { + return ( +
+

{projectCategoryName }

+
+
    + {projectCategory.map((project) => ( +
  • +
    + +
    +
    • + ))} +
+
+
+ ); +} \ No newline at end of file diff --git a/src/components/fundable/SmallProjectCard.tsx b/src/components/fundable/SmallProjectCard.tsx new file mode 100644 index 000000000..ab4199eab --- /dev/null +++ b/src/components/fundable/SmallProjectCard.tsx @@ -0,0 +1,63 @@ +import styles from "./styles.module.css"; +import ProgressBar from "./ProgressBar"; +import { useHistory } from "@docusaurus/router"; +import IconContainer from "./IconContainer"; + +export function SmallProjectCard({ project }) { +const history = useHistory(); + + function openDialog() { + const shortTitle = project.shortTitle.replace(/\s+/g, ''); + + history.push({ + pathname: `/fundable/${shortTitle}`, + state: { fromFundable: true, scrollY: window.scrollY, }, + }); + } + + + return ( +
+
+
+
+ {project.title} +
+
+
+
+
+
+
+ {project.catchUpPhrase} + +
+
+ Indicative Price: {project.price} +
+ +
+ Shareable between {project.maxNbOfFunders} funder(s). +
+
+ Currently this project is supported by {project.currentNbOfFunders} funder(s). +
+
+ Financed at {project.currentFundingPercentage} % +
+
+ +
+
+
+
+
+ +
+ ) +} \ No newline at end of file diff --git a/src/components/fundable/descriptions/EmscriptenForgePackageRequests.md b/src/components/fundable/descriptions/EmscriptenForgePackageRequests.md new file mode 100644 index 000000000..d645aeeca --- /dev/null +++ b/src/components/fundable/descriptions/EmscriptenForgePackageRequests.md @@ -0,0 +1,5 @@ +Emscripten-forge is a conda package distribution specifically designed for WebAssembly. When combined with JupyterLite and the jupyterlite-xeus extension, it enables easy deployment of JupyterLite with a preconfigured conda environment that includes essential packages like NumPy, Pandas, Matplotlib, and more. + +While the number of available emscripten-forge packages is growing quickly, many packages are still missing from the ecosystem. + +We will be working on adding new packages upon request. \ No newline at end of file diff --git a/src/components/fundable/descriptions/JupyterGISRasterProcessing.md b/src/components/fundable/descriptions/JupyterGISRasterProcessing.md new file mode 100644 index 000000000..42923c7aa --- /dev/null +++ b/src/components/fundable/descriptions/JupyterGISRasterProcessing.md @@ -0,0 +1,8 @@ +Similar to QGIS, JupyterGIS currently offers a set of vector processing and conversion tools such as buffer creation, centroid calculation, and convex hull generation. These capabilities are powered by a GDAL WebAssembly (WASM) build running in the browser. + +We will work on extending support to raster processing tools using the same underlying technology. Planned features (non-exhaustive and subject to request needs) include: + +- Clipping by extent +- Clipping by mask layer +- Generating contours +- Polygonizing raster data \ No newline at end of file diff --git a/src/components/fundable/descriptions/JupyterGISToolsForPythonAPI.md b/src/components/fundable/descriptions/JupyterGISToolsForPythonAPI.md new file mode 100644 index 000000000..f541335bf --- /dev/null +++ b/src/components/fundable/descriptions/JupyterGISToolsForPythonAPI.md @@ -0,0 +1,3 @@ +JupyterGIS currently supports several vector processing and conversion tools such as buffer creation, centroid computation, and convex hull generation, similar to what QGIS offers. These features are powered by a GDAL WebAssembly (WASM) build and are currently available only through the JupyterGIS user interface. + +We plan to extend these capabilities to the JupyterGIS Python API, enabling users to access the same processing tools programmatically, just as they would via the UI. This functionality will be implemented using the GDAL Python bindings. \ No newline at end of file diff --git a/src/components/fundable/descriptions/JupyterLabParquetFileViewer.md b/src/components/fundable/descriptions/JupyterLabParquetFileViewer.md new file mode 100644 index 000000000..e69de29bb diff --git a/src/components/fundable/descriptions/NbconvertModernization.md b/src/components/fundable/descriptions/NbconvertModernization.md new file mode 100644 index 000000000..f972c9cb5 --- /dev/null +++ b/src/components/fundable/descriptions/NbconvertModernization.md @@ -0,0 +1,5 @@ +Conversion of Jupyter notebooks to PDF currently relies on nbconvert in the backend, which in turns uses a headless browser for producing the PDF. We propose to directly perform the PDF conversion in the user's browser, which will simplify the architecture and make it function with JupyterLite. + +Nbconvert heavily relies on Jinja2 templates for conversion to different formats. + +We will utilize a JavaScript implementation of Jinja2 covering the required features of Jinja to produce a frontend version of nbconvert that does not require Python but still provides a good coverage of the nbconvert features, including the use of custom templates. \ No newline at end of file diff --git a/src/components/fundable/index.tsx b/src/components/fundable/index.tsx new file mode 100644 index 000000000..5216fe821 --- /dev/null +++ b/src/components/fundable/index.tsx @@ -0,0 +1,48 @@ +import styles from "./styles.module.css"; +import { fundableProjectsDetails } from "./projectsDetails"; +import ProjectCategory from "./ProjectCategory"; +import MenuSidebar from "./MenuSideBar"; + +export function getCategoryFromProjectTitle(title: string) { + for (const [categoryName, projectsByCategory] of Object.entries(fundableProjectsDetails)) { + const project = projectsByCategory.find((project) => project.shortTitle.replace(/\s+/g, '').replace(/\s+/g, '') === title); + if (project) { + return projectsByCategory; + } + } + return null; +} + +export default function FundableProjects() { + return ( +
+
+ +
+
+ +
+
+

Check out our projects available for funding!

+ +
+ +
+
+ +
+
+
+
+
+ + + ); +} diff --git a/src/components/fundable/projectsDetails.ts b/src/components/fundable/projectsDetails.ts new file mode 100644 index 000000000..cc4ab36b6 --- /dev/null +++ b/src/components/fundable/projectsDetails.ts @@ -0,0 +1,102 @@ +import NbconvertModernizationMD from "@site/src/components/fundable/descriptions/NbconvertModernization.md" +import JupyterGISRasterProcessingMD from "@site/src/components/fundable/descriptions/JupyterGISRasterProcessing.md" +import JupyterGISToolsForPythonAPIMD from "@site/src/components/fundable/descriptions/JupyterGISToolsForPythonAPI.md" +import EmscriptenForgePackageRequestsMD from "@site/src/components/fundable/descriptions/EmscriptenForgePackageRequests.md" +import JupyterLabParquetFileViewerMD from "@site/src/components/fundable/descriptions/JupyterLabParquetFileViewer.md" +import JupyterGISIcon from "/img/icons/JupyterGIS.svg"; +import ToolsIcon from "/img/icons/Tools.svg"; +import PythonIcon from "/img/icons/Python.svg"; +import GlobeIcon from "/img/icons/Globe.svg"; +import Empty from "/img/icons/Empty.svg"; + +export const fundableProjectsDetails = { + jupyterEcosystem: [ + { + category: "Jupyter Ecosystem", + title: "Modernize nbconvert", + shortTitle: "NbconvertModernization", + catchUpPhrase: "HELP US TO MODERNIZE OF NBCONVERT", + description: NbconvertModernizationMD, + optionA: "This is option A", + optionB: "This is option B", + customOption: "This is custom option", + icons: [Empty, Empty,Empty, Empty, Empty], + price: "15000 €", + maxNbOfFunders: 3, + currentNbOfFunders: 2, + currentFundingPercentage: 65, + note: "Note: Costs and features can be further adapted following discussion with the funding organization. Open-source under relevant licenses. The funding organization will be credited in communication about the project.", + repoLink: "https://github.com/jupyter/nbconvert" + }, + { + category: "Jupyter Ecosystem", + title: "Raster processing tools in JupyterGIS", + shortTitle: "JupyterGIS Raster Processing", + catchUpPhrase: "HELP US TO ENHANCE TOOLS AVAILABLE IN JUPYTERGIS", + description: JupyterGISRasterProcessingMD, + optionA: "This is option A", + optionB: "This is option B", + customOption: "This is custom option", + icons: [JupyterGISIcon, ToolsIcon, PythonIcon, GlobeIcon, Empty], + price: "15000 €", + maxNbOfFunders: 4, + currentNbOfFunders: 2, + currentFundingPercentage: 45, + note: "Note: Costs and features can be further adapted following discussion with the funding organization. Open-source under relevant licenses. The funding organization will be credited in communication about the project.", + repoLink: "https://github.com/geojupyter/jupytergis" + }, + { + category: "Jupyter Ecosystem", + title: "Bringing processing tools to the JupyterGIS Python API", + shortTitle: "JupyterGIS Tools For Python API", + catchUpPhrase: "HELP US TO ENHANCE JUPYTERGIS PYTHON API", + description: JupyterGISToolsForPythonAPIMD, + optionA: "This is option A", + optionB: "This is option B", + customOption: "This is custom option", + icons: [JupyterGISIcon, ToolsIcon, PythonIcon, GlobeIcon, Empty], + price: "10000 €", + maxNbOfFunders: 2, + currentNbOfFunders: 0, + currentFundingPercentage: 15, + note: "Note: Costs and features can be further adapted following discussion with the funding organization. Open-source under relevant licenses. The funding organization will be credited in communication about the project.", + repoLink: "https://github.com/geojupyter/jupytergis" + }, + { + category: "Jupyter Ecosystem", + title: "Parquet File Viewer For JupyterLab", + shortTitle: "Parquet File Viewer", + catchUpPhrase: "HELP US TO DEVELOP A PARQUET FILE VIEWER", + description: JupyterLabParquetFileViewerMD, + optionA: "This is option A", + optionB: "This is option B", + customOption: "This is custom option", + icons: [Empty, Empty,Empty, Empty, Empty], + price: "10000 €", + maxNbOfFunders: 2, + currentNbOfFunders: 0, + currentFundingPercentage: 15, + note: "Note: Costs and features can be further adapted following discussion with the funding organization. Open-source under relevant licenses. The funding organization will be credited in communication about the project.", + repoLink: "https://github.com/jupyterlab/jupyterlab" + } + ], + packageManagement: [ + { + category: "Package Management", + title: "Package requests for emscripten-forge", + shortTitle: "Emscripten Forge Package Requests", + catchUpPhrase: "HELP US TO DEVELOP EMSCRIPTEN FORGE ECOSYSTEM", + description: EmscriptenForgePackageRequestsMD, + optionA: "This is option A", + optionB: "This is option B", + customOption: "This is custom option", + icons: [Empty, Empty,Empty, Empty, Empty], + price: "dependant on the package request", + maxNbOfFunders: 3, + currentNbOfFunders: 1, + currentFundingPercentage: 33, + note: "Note: Costs and features can be further adapted following discussion with the funding organization. Open-source under relevant licenses. The funding organization will be credited in communication about the project.", + repoLink: "https://github.com/mamba-org/mamba" + }], +} + diff --git a/src/components/fundable/styles.module.css b/src/components/fundable/styles.module.css new file mode 100644 index 000000000..e856655a9 --- /dev/null +++ b/src/components/fundable/styles.module.css @@ -0,0 +1,152 @@ +.small_project_card { + border: solid 0.5px; + width: 1020px; + height: 400px; + /*margin: var(--ifm-spacing-xl) 0;*/ + padding: 30px 60px ; + margin-bottom: var(--ifm-spacing-xl); +} + +.category_header { + font-family: var(--ifm-font-family-rubik-one); + font-style: normal; + font-weight: 400; + line-height: 20px; + text-align: center; + margin-bottom: var(--ifm-spacing-xl); + color: var(--ifm-color-secondary-s3); + padding: 20px 0; + text-align: left; +} + +.project_title { + color: var(--ifm-text-color-main-title); + font-family: var(--ifm-font-family-bebas-neue); + font-size: 32px; + font-style: normal; + font-weight: 600; + /*line-height: 150%; /* 72px */ + letter-spacing: 2.112px; + text-align: left; + padding: 0; +} + +.project_catch_up_phrase { + font-family: var(--ifm-font-family-roboto); + font-size: 16px; + font-style: normal; + font-weight: 600; + line-height: 24px; /* 150% */ + letter-spacing: 0.15px; + color: var(--ifm-color-secondary-s3); + padding: 10px 0 +} + +.modal_overlay { + position: fixed; + top: 0; + left: 0; + right: 0; + bottom: 0; + background-color: rgba(0, 0, 0, 0.3); + z-index: 1000; +} + +.modal_content { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + background-color: white; + border: 1px solid #ccc; + box-shadow: 0 8px 16px rgba(0,0,0,0.2); + border-radius: 20px; + z-index: 4000; +} + +.large_project_card { + width: 1000px; + height: 600px; + padding: 40px; + border-radius: 8px; +} + +.large_project_card_section_title { + font-family: var(--ifm-font-family-roboto); + font-size: 16px; + font-style: normal; + font-weight: 500; + line-height: 24px; /* 150% */ + letter-spacing: 0.15px; + } + + .large_project_card_text p { + font-family: var(--ifm-font-family-roboto); + font-size: 14px; + font-style: normal; + font-weight: 500; + line-height: 24px; /* 150% */ + letter-spacing: 0.15px; + color: var(--ifm-text-color-on-primary-p1); + text-align: justify; +} + +.large_project_card_text_container { + background-color: lightgray; +} + +.icon_container { + display: flex; + gap: 10px; +} + +.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; +} + +.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 .indicator { + background-color: #D9D9D9; /* Customize to match your theme */ +} + + +@media only screen and (max-width: 996px) { + /*Mobile*/ + .category_header { + font-size: 20px; +} +} + +@media only screen and (min-width: 996px) { + /*Desktop*/ + .category_header { + /*font-size: var(--ifm-font-size-secondary-title);*/ + font-size: 28px; +} +} \ No newline at end of file diff --git a/src/css/custom.css b/src/css/custom.css index df057e164..71f79cbdd 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -18,6 +18,8 @@ --ifm-color-secondary-s1: #a0c9ff; --ifm-color-secondary-s2: #002646; + --ifm-color-secondary-s3: #00497F; + --ifm-color-neutral-n1: #605e58; --ifm-color-neutral-n2: #371300; @@ -559,6 +561,20 @@ a.menu__link:active { background-color: white; } +.fundable_projects { + background-color: var(--ifm-color-blue-jupyter); + color: white; + border-radius: 4px; + font-style: normal; + margin: var(--ifm-navbar-item-padding-vertical) 20px; +} + +.fundable_projects:hover { + background-color: var(--ifm-color-primary-p1); + color: var(--ifm-color-blue-jupyter) +} + + .custom_navbar_item { font-family: var(--ifm-font-family-roboto); width: 117px; @@ -684,3 +700,10 @@ ul.row { flex-wrap: wrap; margin: 0 0; } + +.custom-progress-bar::-webkit-progress-value { + background-color: var(--ifm-color-primary-p1); +} +.custom-progress-bar::-webkit-progress-bar { + background-color: #eee; +} \ No newline at end of file diff --git a/src/pages/fundable.tsx b/src/pages/fundable.tsx new file mode 100644 index 000000000..8bb5a9295 --- /dev/null +++ b/src/pages/fundable.tsx @@ -0,0 +1,14 @@ +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 ( + + +