-
Notifications
You must be signed in to change notification settings - Fork 135
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* Wayfinding Homepage * add table of contents * More updates * Add descriptions + SEP-6, SEP-24 wayfinding * More wayfinding * words * playing around with formatting * fix formatting * Various edits * fix dapp section * update Hubble language * update anchor tools * quick link nit * update descriptions * Reformatting x2 * lil fix to build * trigger a new container build * freshen up display of wayfinding boxes * custom component for the "navigating the docs" section * move wayfinding boxes component into homepage folder * use similar styles for wayfinding and navigating "boxes" * developer resources section * improve some docs contribution translation stuff * some fiddling around * add a pathfinding table custom component * apply pathfinding tables to index page * include drop downs * heading fixes * words * fix link * fix poor contrast on wayfinding boxes * rename explore and learn more link functions * give me some space * implement design notes - padding and semibold * expanded by default * style tweaks for badge displays in tables * add a check to ensure only tables are rendered as tables * remove expandable details elements from homepage * prolog -> preface * fix a broken link --------- Co-authored-by: Elliot Voris <[email protected]>
- Loading branch information
1 parent
c9e3724
commit dcddc98
Showing
15 changed files
with
743 additions
and
241 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,148 @@ | ||
| import React, { type ReactNode } from 'react' | ||
| import Heading from '@theme/Heading'; | ||
| import Link from '@docusaurus/Link'; | ||
| import clsx from 'clsx'; | ||
| import { exploreLink, partitionBoxes, type NavigatingDocsItem as DeveloperResourcesItem } from '@site/src/components/Homepage/NavigatingTheDocs' | ||
| import Translate, { translate } from '@docusaurus/Translate' | ||
| import styles from './styles.module.css' | ||
|
|
||
| const DeveloperResourcesBoxes: DeveloperResourcesItem[] = [ | ||
| { | ||
| title: translate({ | ||
| message: 'Stellar Developer Discord', | ||
| id: 'component.Homepage.DeveloperResources.Discord.Title', | ||
| }), | ||
| description: ( | ||
| <Translate | ||
| id='component.Homepage.DeveloperResources.Discord.Description' | ||
| description='Long description of what kind of developer resource this is.'> | ||
| Ask questions and engage with other Stellar devs. | ||
| </Translate> | ||
| ), | ||
| link: exploreLink('https://discord.gg/st7Mxd58BV'), | ||
| }, | ||
| { | ||
| title: translate({ | ||
| message: 'Developer Site', | ||
| id: 'component.Homepage.DeveloperResources.DeveloperSite.Title', | ||
| }), | ||
| description: ( | ||
| <Translate | ||
| id='component.Homepage.DeveloperResources.DeveloperSite.Description' | ||
| description='Long description of what kind of developer resource this is.'> | ||
| Get the latest news and insights about building on Stellar. | ||
| </Translate> | ||
| ), | ||
| link: exploreLink('https://stellar.org/developers'), | ||
| }, | ||
| { | ||
| title: translate({ | ||
| message: 'Stellar Stack Exchange', | ||
| id: 'component.Homepage.DeveloperResources.StackExchange.Title', | ||
| }), | ||
| description: ( | ||
| <Translate | ||
| id='component.Homepage.DeveloperResources.StackExchange.Description' | ||
| description='Long description of what kind of developer resource this is.'> | ||
| A question and answer site for Stellar developers; if you can’t find what you’re looking for in the docs, try searching the Stack Exchange to see if your question has been addressed. If it hasn't, feel free to ask! | ||
| </Translate> | ||
| ), | ||
| link: exploreLink('https://stellar.stackexchange.com/'), | ||
| }, | ||
| { | ||
| title: translate({ | ||
| message: 'Stellar Developers Google Group', | ||
| id: 'component.Homepage.DeveloperResources.GoogleGroup.Title', | ||
| }), | ||
| description: ( | ||
| <Translate | ||
| id='component.Homepage.DeveloperResources.GoogleGroup.Description' | ||
| description='Long description of what kind of developer resource this is.'> | ||
| Discuss Core Advancement Proposals (CAPs) and Stellar Ecosystem Proposals (SEPs), talk about the development of Stellar Core and Horizon, and stay informed about important network upgrades. | ||
| </Translate> | ||
| ), | ||
| link: exploreLink('https://groups.google.com/g/stellar-dev'), | ||
| }, | ||
| ] | ||
|
|
||
| function DeveloperResourcesFeature({title, description, link}) { | ||
| return ( | ||
| <div className='col col--6 padding--md'> | ||
| <div className={clsx(styles.DeveloperResourcesFeature, 'padding--lg')}> | ||
| <Heading as="h3" className='text--semibold'>{title}</Heading> | ||
| <p>{description}</p> | ||
| <Link className='button button--outline button--primary' {...link.props} /> | ||
| </div> | ||
| </div> | ||
| ) | ||
| } | ||
|
|
||
| function DocsContribution() { | ||
| return ( | ||
| <> | ||
| <Heading as="h3" className='text--semibold'> | ||
| <Translate | ||
| id='component.Homepage.DocsContribution.Heading'> | ||
| Contribute to the docs and leave feedback | ||
| </Translate> | ||
| </Heading> | ||
| <p> | ||
| <Translate | ||
| id='component.Homepage.DocsContribution.Paragraph1' | ||
| values={{ | ||
| githubRepoLink: ( | ||
| <Link to="https://github.com/stellar/stellar-docs"> | ||
| <Translate | ||
| id='component.Homepage.DocsContribution.DocsGithubLink' | ||
| description='Label for the link to the Stellar docs repository on Github'> | ||
| Stellar Docs GitHub Repo | ||
| </Translate> | ||
| </Link> | ||
| ) | ||
| }}> | ||
| {'Stellar’s Developer Documentation is open-source, and contributions to the docs are encouraged. You can file an issue or pull request to add new content, suggest revisions to existing content, submit suggestions, report bugs, and more in the {githubRepoLink}.'} | ||
| </Translate> | ||
| </p> | ||
| <p> | ||
| <Translate | ||
| id='component.Homepage.DocsContribution.Paragraph2' | ||
| values={{ | ||
| githubOrgLink: ( | ||
| <Link to="https://github.com/stellar"> | ||
| <Translate | ||
| id='component.Homepage.DocsContribution.StellarRepos' | ||
| description='Label for the link to the Stellar organization profile on Github'> | ||
| Stellar repos | ||
| </Translate> | ||
| </Link> | ||
| ) | ||
| }}> | ||
| {'Also, feel free to leave any additional feedback by filing issues in the various other {githubOrgLink}.'} | ||
| </Translate> | ||
| </p> | ||
| </> | ||
| ) | ||
| } | ||
|
|
||
| export default function DeveloperResources() { | ||
| const partitionedBoxes = partitionBoxes(DeveloperResourcesBoxes); | ||
|
|
||
| return ( | ||
| <section className='margin-vert--lg'> | ||
| {partitionedBoxes.map((twoBoxes) => ( | ||
| <div className='row'> | ||
| {twoBoxes.map((props, idx) => ( | ||
| <DeveloperResourcesFeature key={idx} {...props} /> | ||
| ))} | ||
| </div> | ||
| ))} | ||
| <div className='row'> | ||
| <div className='col padding--md'> | ||
| <div className={clsx(styles.DeveloperResourcesFeature, 'padding--lg')}> | ||
| <DocsContribution /> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </section> | ||
| ) | ||
| } |
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,5 @@ | ||
| .DeveloperResourcesFeature { | ||
| border-radius: var(--ifm-global-radius); | ||
| background-color: var(--ifm-background-surface-color); | ||
| height: 100%; | ||
| } |
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,160 @@ | ||
| import React, { type ReactNode } from 'react'; | ||
| import Heading from '@theme/Heading'; | ||
| import Link from '@docusaurus/Link'; | ||
| import Translate, { translate } from '@docusaurus/Translate'; | ||
| import clsx from 'clsx'; | ||
| import styles from './styles.module.css' | ||
|
|
||
| export type NavigatingDocsItem = { | ||
| title: string; | ||
| description: ReactNode; | ||
| link: ReactNode; | ||
| } | ||
|
|
||
| export const exploreLink = (target: string) => ( | ||
| <Link to={target}> | ||
| <Translate | ||
| id='component.Homepage.ExploreButton.Text' | ||
| description='The text that will be displayed on the "Explore" buttons'> | ||
| Explore | ||
| </Translate> | ||
| </Link> | ||
| ) | ||
|
|
||
| export const partitionBoxes = (boxesArray: NavigatingDocsItem[]): NavigatingDocsItem[][] => { | ||
| return boxesArray.reduce((acc, item, i, arr) => { | ||
| if (i % 2 === 0) { | ||
| acc.push(arr.slice(i, i + 2)) | ||
| } | ||
| return acc | ||
| }, []) | ||
| } | ||
|
|
||
| const NavigatingDocsBoxes: NavigatingDocsItem[] = [ | ||
| { | ||
| title: translate({ | ||
| message: 'Build', | ||
| id: 'component.Homepage.NavigatingTheDocs.Build.Title', | ||
| }), | ||
| description: ( | ||
| <Translate | ||
| id='component.Homepage.NavigatingTheDocs.Build.Description' | ||
| description='Long description of what kind of information this section of the docs.'> | ||
| Contains tutorials and how-to guides for writing smart contracts, building applications, interacting with the network, and more. | ||
| </Translate> | ||
| ), | ||
| link: exploreLink('/docs/build'), | ||
| }, | ||
| { | ||
| title: translate({ | ||
| message: 'Learn', | ||
| id: 'component.Homepage.NavigatingTheDocs.Learn.Title', | ||
| }), | ||
| description: ( | ||
| <Translate | ||
| id='component.Homepage.NavigatingTheDocs.Learn.Description' | ||
| description='Long description of what kind of information this section of the docs.'> | ||
| Find all informational and conceptual content here. Learn about Stellar fundamentals like how accounts and transactions function, dive deeper into the functionality of each operation, discover how fees work, and more. | ||
| </Translate> | ||
| ), | ||
| link: exploreLink('/docs/learn/fundamentals'), | ||
| }, | ||
| { | ||
| title: translate({ | ||
| message: 'Tokens', | ||
| id: 'component.Homepage.NavigatingTheDocs.Tokens.Title', | ||
| }), | ||
| description: ( | ||
| <Translate | ||
| id='component.Homepage.NavigatingTheDocs.Tokens.Description' | ||
| description='Long description of what kind of information this section of the docs.'> | ||
| Information on how to issue assets on the Stellar network and create custom smart contract tokens. | ||
| </Translate> | ||
| ), | ||
| link: exploreLink('/docs/tokens'), | ||
| }, | ||
| { | ||
| title: translate({ | ||
| message: 'Data', | ||
| id: 'component.Homepage.NavigatingTheDocs.Data.Title', | ||
| }), | ||
| description: ( | ||
| <Translate | ||
| id='component.Homepage.NavigatingTheDocs.Data.Description' | ||
| description='Long description of what kind of information this section of the docs.'> | ||
| Discover various data availability options: RPC, Hubble, Horizon, Galexie, and data indexers. | ||
| </Translate> | ||
| ), | ||
| link: exploreLink('/docs/data'), | ||
| }, | ||
| { | ||
| title: translate({ | ||
| message: 'Tools', | ||
| id: 'component.Homepage.NavigatingTheDocs.Tools.Title', | ||
| }), | ||
| description: ( | ||
| <Translate | ||
| id='component.Homepage.NavigatingTheDocs.Tools.Description' | ||
| description='Long description of what kind of information this section of the docs.'> | ||
| Learn about all the available tools for building on, interacting with, or just watching the Stellar network. Also, find information on how to use the Anchor Platform or Stellar Disbursement Platform. | ||
| </Translate> | ||
| ), | ||
| link: exploreLink('/docs/tools'), | ||
| }, | ||
| { | ||
| title: translate({ | ||
| message: 'Networks', | ||
| id: 'component.Homepage.NavigatingTheDocs.Networks.Title', | ||
| }), | ||
| description: ( | ||
| <Translate | ||
| id='component.Homepage.NavigatingTheDocs.Networks.Description' | ||
| description='Long description of what kind of information this section of the docs.'> | ||
| Information about deployed networks (Mainnet, Testnet, and Futurenet), current software versions, resource limitations, and fees. | ||
| </Translate> | ||
| ), | ||
| link: exploreLink('/docs/networks'), | ||
| }, | ||
| { | ||
| title: translate({ | ||
| message: 'Validators', | ||
| id: 'component.Homepage.NavigatingTheDocs.Validators.Title', | ||
| }), | ||
| description: ( | ||
| <Translate | ||
| id='component.Homepage.NavigatingTheDocs.Validators.Description' | ||
| description='Long description of what kind of information this section of the docs.'> | ||
| Everything you'll need to know if you want to run, operate, and maintain a core validator node on the Stellar network. | ||
| </Translate> | ||
| ), | ||
| link: exploreLink('/docs/validators'), | ||
| }, | ||
| ] | ||
|
|
||
| function NavigatingDocsFeature({title, description, link}) { | ||
| return ( | ||
| <div className='col col--6 padding--md'> | ||
| <div className={clsx(styles.NavigatingDocsFeature, 'padding--lg')}> | ||
| <Heading as="h3" className='text--semibold'>{title}</Heading> | ||
| <p>{description}</p> | ||
| <Link className='button button--outline button--primary' {...link.props} /> | ||
| </div> | ||
| </div> | ||
| ) | ||
| } | ||
|
|
||
| export default function NavigatingTheDocs() { | ||
| const partitionedBoxes = partitionBoxes(NavigatingDocsBoxes) | ||
|
|
||
| return ( | ||
| <section className='margin-vert--lg'> | ||
| {partitionedBoxes.map((twoBoxes) => ( | ||
| <div className='row'> | ||
| {twoBoxes.map((props, idx) => ( | ||
| <NavigatingDocsFeature key={idx} {...props} /> | ||
| ))} | ||
| </div> | ||
| ))} | ||
| </section> | ||
| ) | ||
| } |
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,5 @@ | ||
| .NavigatingDocsFeature { | ||
| border-radius: var(--ifm-global-radius); | ||
| background-color: var(--ifm-background-surface-color); | ||
| height: 100%; | ||
| } |
Oops, something went wrong.