forked from gatsbyjs/gatsby
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(www): Ecosystem landing page (gatsbyjs#9442)
* feat(www): prepare featured items forEcosystem * feat(www): add new icons for Ecosystem * feat(www): Ecosystem content * feat(www): create Ecosystem mobile styles * feat(www): add new variant of Button * feat(www): Ecosystem desktop styles * feat(www): add thumbnail to featured starters * fix(www): fix button label * fix(www): fix typo * refactor(www): prettify svg code * refactor(www): remove unnecessary destructuring * fix(www): use slug to pick up featured starters * refactor(www): remove unnecessary spreading to a new object * fix(www): fix stylelint errors * fix(www): use gatsby-transformer-yaml to pull featured Ecosystem items * feat(www): add backkground icons to test it * refactor(www): remove unnecessary destructuring in Button * fix(www): remove unnecessary infos * fix(www): remove background * feat(www): add function preventing too long description of featured items * fix(www): add border to starter thumbnails * fix(www): refine Tablet styles * fix(www): fix desktop section height on FF * fix(www): change Ecosystem sections headers * fix(www): remove unused imports
- Loading branch information
1 parent
5229a19
commit 0f81323
Showing
16 changed files
with
716 additions
and
85 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,4 @@ | ||
import PluginsIcon from "!raw-loader!./plugins-ecosystem.svg" | ||
import StartersIcon from "!raw-loader!./starters.svg" | ||
|
||
export { PluginsIcon, StartersIcon } |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,73 @@ | ||
import React from "react" | ||
import PropTypes from "prop-types" | ||
import styled from "react-emotion" | ||
|
||
import EcosystemSection from "./ecosystem-section" | ||
|
||
import presets, { colors } from "../../utils/presets" | ||
|
||
const EcosystemBoardRoot = styled("div")` | ||
display: flex; | ||
flex-direction: column; | ||
${presets.Tablet} { | ||
flex-direction: row; | ||
flex-wrap: wrap; | ||
height: calc( | ||
100vh - (${presets.bannerHeight} + ${presets.headerHeight} + 1px) | ||
); | ||
padding: 2rem 1rem 1rem; | ||
} | ||
` | ||
|
||
const EcosystemBoard = ({ | ||
icons: { plugins: PluginsIcon, starters: StartersIcon }, | ||
starters, | ||
plugins, | ||
background, | ||
}) => { | ||
return ( | ||
<EcosystemBoardRoot> | ||
<EcosystemSection | ||
title="Plugins" | ||
description="With 429 plugins, lorem ipsum sunt we need some proper copy here pulling in data from your favorite source is only a few mouseclicks away." | ||
subTitle="Featured Plugins" | ||
icon={PluginsIcon} | ||
links={[ | ||
{ label: "Browse Plugins", to: "/plugins/" }, | ||
{ | ||
label: "Plugin Authoring", | ||
to: "/docs/plugin-authoring/", | ||
secondary: true, | ||
}, | ||
{ label: "Plugin Docs", to: "/docs/plugins/", secondary: true }, | ||
]} | ||
featuredItems={plugins} | ||
/> | ||
<EcosystemSection | ||
title="Starters" | ||
description="Starters are boilerplate Gatsby sites maintained by the community which give you a headstart for your Gatsby project." | ||
subTitle="Featured Starters" | ||
icon={StartersIcon} | ||
links={[ | ||
{ label: "Browse Starters", to: "/starters/" }, | ||
{ label: "Starter Docs", to: "/docs/starters/", secondary: true }, | ||
]} | ||
featuredItems={starters} | ||
/> | ||
<EcosystemSection | ||
title="External Resources" | ||
description="More awesome Gatsby content, created by the community." | ||
links={[{ label: "Browse Resources", to: "/docs/awesome-gatsby/" }]} | ||
/> | ||
</EcosystemBoardRoot> | ||
) | ||
} | ||
|
||
EcosystemBoard.propTypes = { | ||
icons: PropTypes.object, | ||
starters: PropTypes.array, | ||
plugins: PropTypes.array, | ||
} | ||
|
||
export default EcosystemBoard |
Oops, something went wrong.