-
Notifications
You must be signed in to change notification settings - Fork 35
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add a supporters section to the frontpage #226
Changes from 3 commits
cbb4b0e
9fe451f
fe170d9
fd03545
227cb09
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,217 @@ | ||
import React from "react"; | ||
import Link from "@docusaurus/Link"; | ||
import useBaseUrl from "@docusaurus/useBaseUrl"; | ||
import ThemedImage from "@theme/ThemedImage"; | ||
import styles from "./styles.module.css"; | ||
|
||
/* data of supporters */ | ||
const financial = []; | ||
|
||
const infrastructure = [ | ||
{ | ||
name: "Anaconda", | ||
link: "https://www.anaconda.com/", | ||
light: "img/supporters/anaconda_light.svg", | ||
dark: "img/supporters/anaconda_dark.svg", | ||
width: 250, | ||
}, | ||
{ | ||
name: "Netlify", | ||
link: "https://www.netlify.com/", | ||
light: "img/supporters/netlify_light.svg", | ||
dark: "img/supporters/netlify_dark.svg", | ||
width: 250, | ||
}, | ||
{ | ||
name: "Zulip", | ||
link: "https://zulip.com", | ||
light: "img/supporters/zulip.svg", | ||
dark: "img/supporters/zulip.svg", | ||
width: 250, | ||
}, | ||
]; | ||
|
||
const developer = [ | ||
{ | ||
name: "Anaconda", | ||
link: "https://www.anaconda.com/", | ||
light: "img/supporters/anaconda_light.svg", | ||
dark: "img/supporters/anaconda_dark.svg", | ||
width: 250, | ||
}, | ||
// { | ||
// name: "IOOS Integrated Ocean Observing System", | ||
// link: "https://ioos.noaa.gov/", | ||
// light: "img/supporters/ioos.png", | ||
// dark: "img/supporters/ioos.png", | ||
// width: 150, | ||
// }, | ||
{ | ||
name: "NVIDIA", | ||
link: "https://www.nvidia.com/", | ||
light: "img/supporters/nvidia_light.svg", | ||
dark: "img/supporters/nvidia_dark.svg", | ||
width: 250, | ||
}, | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. @jakirkham is it okay to also mention y'all here? |
||
// { | ||
// name: "Voltron Data", | ||
// link: "https://voltrondata.com/", | ||
// light: "img/supporters/voltron_light.svg", | ||
// dark: "img/supporters/voltron_dark.svg", | ||
// width: 250, | ||
// }, | ||
Comment on lines
+56
to
+62
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. @mariusvniekerk is it okay to also mention y'all here? If that's the case, could you also add that info to |
||
{ | ||
name: "Quansight Labs", | ||
link: "https://labs.quansight.org/", | ||
light: "img/supporters/quansightlabs_light.svg", | ||
dark: "img/supporters/quansightlabs_dark.svg", | ||
width: 250, | ||
}, | ||
{ | ||
name: "QuantStack", | ||
link: "https://quantstack.net/", | ||
light: "img/supporters/quantstack_light.svg", | ||
dark: "img/supporters/quantstack_dark.svg", | ||
width: 250, | ||
}, | ||
jaimergp marked this conversation as resolved.
Show resolved
Hide resolved
|
||
{ | ||
name: "Prefix.dev", | ||
link: "https://prefix.dev/", | ||
light: "img/supporters/prefix_light.svg", | ||
dark: "img/supporters/prefix_dark.svg", | ||
width: 250, | ||
}, | ||
jaimergp marked this conversation as resolved.
Show resolved
Hide resolved
|
||
{ | ||
name: "QuantCo", | ||
link: "https://www.quantco.com/", | ||
light: "img/supporters/quantco_light.svg", | ||
dark: "img/supporters/quantco_dark.svg", | ||
width: 210, | ||
}, | ||
]; | ||
|
||
export default function Supporters() { | ||
return ( | ||
<div className={[styles.supporters, styles.section_padding].join(" ")}> | ||
<div className={styles.supporters_conda_org}> | ||
<h1 className={styles.gradient_text}>Supporters</h1> | ||
<p> | ||
If you like the conda community and want to support our mission, | ||
please consider making a{" "} | ||
<Link to="https://opencollective.com/conda">donation</Link> to support | ||
our efforts. | ||
</p> | ||
</div> | ||
<div className={styles.fiscal_sponsor}> | ||
<Link to="https://numfocus.org/"> | ||
<div className={styles.numfocus_card}> | ||
<ThemedImage | ||
className={styles.image} | ||
alt="NumFOCUS Logo" | ||
sources={{ | ||
light: useBaseUrl("/img/supporters/numfocus.svg"), | ||
dark: useBaseUrl("/img/supporters/numfocus.svg"), | ||
}} | ||
width="100%" | ||
/> | ||
</div> | ||
</Link> | ||
<div className={styles.about_numfocus}> | ||
<h3> | ||
conda is a <span className="gradient_text">fiscally sponsored</span>{" "} | ||
project of NumFOCUS. | ||
</h3> | ||
<p> | ||
A nonprofit dedicated to supporting the open source scientific | ||
computing community. | ||
</p> | ||
</div> | ||
</div> | ||
<div className={styles.other_supporters}> | ||
{financial.length > 0 ? ( | ||
<div className={styles.supporters_card}> | ||
<div className={styles.supporters_conda_org}> | ||
<h2> | ||
<span className="gradient_text">Financial</span> Support | ||
</h2> | ||
</div> | ||
<div className={styles.card}> | ||
{financial.map(({ name, link, light, dark, width }, index) => ( | ||
<Link to={link} key={index}> | ||
<div className={styles.card_wrapper}> | ||
<ThemedImage | ||
className={styles.image} | ||
alt={`${name} logo`} | ||
title={`Go to ${name}'s website`} | ||
sources={{ | ||
light: useBaseUrl(`${light}`), | ||
dark: useBaseUrl(`${dark}`), | ||
}} | ||
width={width} | ||
/> | ||
</div> | ||
</Link> | ||
))} | ||
</div> | ||
</div> | ||
) : null} | ||
{infrastructure.length > 0 ? ( | ||
<div className={styles.supporters_card}> | ||
<div className={styles.supporters_conda_org}> | ||
<h2> | ||
<span className="gradient_text">Infrastructure</span> Support | ||
</h2> | ||
</div> | ||
<div className={styles.card}> | ||
{infrastructure.map( | ||
({ name, link, light, dark, width }, index) => ( | ||
<Link key={index} to={link}> | ||
<div className={styles.card_wrapper}> | ||
<ThemedImage | ||
className={styles.image} | ||
alt={`${name} logo`} | ||
title={`Go to ${name}'s website`} | ||
sources={{ | ||
light: useBaseUrl(`${light}`), | ||
dark: useBaseUrl(`${dark}`), | ||
}} | ||
width={width} | ||
/> | ||
</div> | ||
</Link> | ||
), | ||
)} | ||
</div> | ||
</div> | ||
) : null} | ||
{developer.length > 0 ? ( | ||
<div className={styles.supporters_card}> | ||
<div className={styles.supporters_conda_org}> | ||
<h2> | ||
<span className="gradient_text">Developer</span> Support | ||
</h2> | ||
</div> | ||
<div className={styles.card}> | ||
{developer.map(({ name, link, light, dark, width }, index) => ( | ||
<Link key={index} to={link}> | ||
<div className={styles.card_wrapper}> | ||
<ThemedImage | ||
className={styles.image} | ||
alt={`${name} logo`} | ||
title={`Go to ${name}'s website`} | ||
sources={{ | ||
light: useBaseUrl(`${light}`), | ||
dark: useBaseUrl(`${dark}`), | ||
}} | ||
width={width} | ||
/> | ||
</div> | ||
</Link> | ||
))} | ||
</div> | ||
</div> | ||
) : null} | ||
</div> | ||
</div> | ||
); | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,177 @@ | ||
.supporters { | ||
display: flex; | ||
justify-content: center; | ||
align-items: center; | ||
flex-wrap: wrap; | ||
gap: 1.5em; | ||
} | ||
|
||
.section_padding { | ||
padding: 3rem 6rem; | ||
} | ||
|
||
.supporters_conda_org { | ||
display: flex; | ||
flex-direction: column; | ||
justify-content: center; | ||
align-items: center; | ||
text-align: center; | ||
width: 100%; | ||
} | ||
|
||
.supporters_conda_org h1 { | ||
font-weight: 700; | ||
font-size: 50px; | ||
line-height: 70px; | ||
} | ||
|
||
.supporters_conda_org h2 { | ||
font-weight: 700; | ||
font-size: 32px; | ||
line-height: 30px; | ||
} | ||
|
||
.supporters_conda_org p { | ||
font-size: 18px; | ||
font-weight: 500; | ||
text-align: justify; | ||
padding: 10px; | ||
} | ||
|
||
.fiscal_sponsor { | ||
display: flex; | ||
flex-direction: row; | ||
width: 80%; | ||
align-items: center; | ||
justify-content: center; | ||
} | ||
|
||
.fiscal_sponsor a { | ||
background: none; | ||
color: var(--theme-card-link-color); | ||
} | ||
|
||
.numfocus_card { | ||
background: var(--theme-card); | ||
width: 100%; | ||
display: flex; | ||
align-items: center; | ||
justify-content: center; | ||
border-radius: 15px; | ||
padding: 3em 5em; | ||
transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1); | ||
} | ||
|
||
.numfocus_card:hover { | ||
transform: scale(0.9); | ||
} | ||
|
||
.about_numfocus { | ||
display: flex; | ||
align-items: center; | ||
justify-content: center; | ||
flex-direction: column; | ||
padding: 0 2em; | ||
width: 50%; | ||
} | ||
|
||
.other_supporters { | ||
display: flex; | ||
flex-direction: column; | ||
margin-top: 2rem; | ||
} | ||
|
||
.card { | ||
display: grid; | ||
grid-template-columns: repeat(3, 1fr); | ||
gap: 1em; | ||
margin: 1.5rem; | ||
} | ||
|
||
.card_wrapper { | ||
background: var(--theme-card); | ||
display: flex; | ||
height: 100%; | ||
justify-content: center; | ||
align-items: center; | ||
border-radius: 10px; | ||
padding: 2.25rem; | ||
transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1); | ||
} | ||
|
||
.card_wrapper a { | ||
background: none; | ||
color: var(--theme-card-link-color); | ||
} | ||
|
||
.card_wrapper:hover { | ||
transform: scale(0.9); | ||
} | ||
|
||
@media screen and (max-width: 1050px) { | ||
.section_padding { | ||
padding: 3rem; | ||
} | ||
|
||
.fiscal_sponsor { | ||
flex-direction: column; | ||
width: 100%; | ||
} | ||
|
||
.numfocus_card { | ||
margin-bottom: 2em; | ||
width: 100%; | ||
align-self: center; | ||
} | ||
|
||
.about_numfocus { | ||
align-self: center; | ||
text-align: center; | ||
padding: 0; | ||
width: 100%; | ||
} | ||
|
||
.card { | ||
grid-template-columns: repeat(2, 1fr); | ||
} | ||
} | ||
|
||
@media screen and (max-width: 650px) { | ||
.section_padding { | ||
padding: 2rem; | ||
} | ||
|
||
.supporters_conda_org h1 { | ||
font-size: 28px; | ||
line-height: 26px; | ||
} | ||
|
||
.numfocus_card { | ||
padding: 2em 3em; | ||
} | ||
|
||
.card { | ||
grid-template-columns: repeat(1, 1fr); | ||
} | ||
} | ||
|
||
@media screen and (max-width: 490px) { | ||
.section_padding { | ||
padding: 1rem; | ||
} | ||
|
||
.supporters_conda_org h1 { | ||
font-size: 24px; | ||
line-height: 22px; | ||
} | ||
|
||
.supporters_conda_org p { | ||
font-size: 16px; | ||
} | ||
} | ||
|
||
.gradient_text { | ||
background: var(--gradient-text); | ||
background-clip: text; | ||
-webkit-text-fill-color: transparent; | ||
} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@ocefpaf is it okay to also mention IOOS here? And if that's the case, should that info also show up in
steering.csv
?