diff --git a/.all-contributorsrc b/.all-contributorsrc index 152202b57cb..883b484ef57 100644 --- a/.all-contributorsrc +++ b/.all-contributorsrc @@ -10404,6 +10404,24 @@ "content", "bug" ] + }, + { + "login": "gunal-123", + "name": "Gunal", + "avatar_url": "https://avatars.githubusercontent.com/u/103403219?v=4", + "profile": "https://github.com/gunal-123", + "contributions": [ + "content" + ] + }, + { + "login": "LadyDhaga", + "name": "chinaman123", + "avatar_url": "https://avatars.githubusercontent.com/u/106376368?v=4", + "profile": "https://github.com/LadyDhaga", + "contributions": [ + "ideas" + ] } ], "contributorsPerLine": 7, diff --git a/README.md b/README.md index 095f13c3d8a..4316c68ff6a 100644 --- a/README.md +++ b/README.md @@ -1626,6 +1626,10 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d Akamig
Akamig
πŸ–‹ Peace Ojemeh
Peace Ojemeh
πŸ–‹ woseK
woseK
πŸ–‹ πŸ› + Gunal
Gunal
πŸ–‹ + + + chinaman123
chinaman123
πŸ€” diff --git a/gatsby-browser.tsx b/gatsby-browser.tsx index bfb9a18f2c4..87ef1ba9de5 100644 --- a/gatsby-browser.tsx +++ b/gatsby-browser.tsx @@ -7,11 +7,6 @@ import Prism from "prism-react-renderer/prism" ;(typeof global !== "undefined" ? global : window).Prism = Prism -// FormatJS Polyfill imports - Used for intl number formatting -import "@formatjs/intl-locale/polyfill" -import "@formatjs/intl-numberformat/polyfill" -import "@formatjs/intl-numberformat/locale-data/en" - // Default languages included: // https://github.com/FormidableLabs/prism-react-renderer/blob/master/src/vendor/prism/includeLangs.js require("prismjs/components/prism-solidity") diff --git a/gatsby-ssr.tsx b/gatsby-ssr.tsx index 8f49e56c4b4..6a715f45f15 100644 --- a/gatsby-ssr.tsx +++ b/gatsby-ssr.tsx @@ -18,21 +18,5 @@ export const onRenderBody = ({ setHeadComponents }: RenderBodyArgs) => { crossOrigin="anonymous" key="interFont" />, - , - , ]) } diff --git a/package.json b/package.json index 4f4b262e17d..397fa9ba297 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "ethereum-org-website", - "version": "7.19.1", + "version": "7.19.2", "description": "Website of ethereum.org", "main": "index.js", "repository": "git@github.com:ethereum/ethereum-org-website.git", @@ -15,8 +15,6 @@ "@docsearch/react": "^3.3.3", "@emotion/react": "^11.9.3", "@emotion/styled": "^11.9.3", - "@formatjs/intl-locale": "^2.4.14", - "@formatjs/intl-numberformat": "^6.1.4", "@mdx-js/mdx": "^1.6.5", "@mdx-js/react": "^1.6.5", "algoliasearch": "^4.3.0", diff --git a/src/@chakra-ui/gatsby-plugin/components/Button.ts b/src/@chakra-ui/gatsby-plugin/components/Button.ts index fb9ca7f8a08..0e124f058cf 100644 --- a/src/@chakra-ui/gatsby-plugin/components/Button.ts +++ b/src/@chakra-ui/gatsby-plugin/components/Button.ts @@ -10,17 +10,15 @@ import { defineStyle, defineStyleConfig } from "@chakra-ui/react" */ const ICON_SELECTOR = "& svg" -const getBaseColor = (isSecondary: boolean) => - !isSecondary ? "primary.base" : "body.base" - -const baseStyle = defineStyle((props) => ({ +const baseStyle = defineStyle({ borderRadius: "base", border: "1px", - color: getBaseColor(props.isSecondary), + color: "primary.base", lineHeight: "1.6", transitionProperty: "common", transitionDuration: "normal", whiteSpace: "normal", + p: "unset", _focusVisible: { outline: "4px solid", outlineColor: "primary.hover", @@ -33,7 +31,16 @@ const baseStyle = defineStyle((props) => ({ _hover: { color: "primary.hover", }, -})) + "&[data-secondary='true']": { + color: "body.base", + }, + "&.chakra-link": { + textDecoration: "none", + _hover: { + textDecoration: "none", + }, + }, +}) const variantSolid = defineStyle({ color: "background.base", @@ -68,7 +75,6 @@ const variantGhost = { const variantLink = defineStyle({ borderColor: "transparent", - color: "primary.base", fontWeight: 700, textDecor: "underline", py: 0, @@ -78,39 +84,22 @@ const variantLink = defineStyle({ }, }) -/** - * @deprecated This is no longer needed. Styling for just the icon is not - * unique compared to the variants used for text (as of the new DS) - */ -const variantIcon = defineStyle({ - appearance: "none", - background: "inherit", - padding: "initial", - border: 0, - color: "inherit", - boxShadow: "none", - _hover: { - color: "primary.base", - boxShadow: "none", - }, -}) - const sizes = { - md: { - py: "2 !important", - px: "4 !important", + md: defineStyle({ + py: "2", + px: "4", [ICON_SELECTOR]: { fontSize: "2xl", }, - }, - sm: { + }), + sm: defineStyle({ fontSize: "xs", - py: "1.5 !important", - px: "2 !important", + py: "1.5", + px: "2", [ICON_SELECTOR]: { fontSize: "md", }, - }, + }), } const variants = { @@ -118,7 +107,6 @@ const variants = { outline: variantOutline, ghost: variantGhost, link: variantLink, - icon: variantIcon, } export const Button = defineStyleConfig({ diff --git a/src/@chakra-ui/gatsby-plugin/components/Link.ts b/src/@chakra-ui/gatsby-plugin/components/Link.ts index 932020b40e9..769ff0c4677 100644 --- a/src/@chakra-ui/gatsby-plugin/components/Link.ts +++ b/src/@chakra-ui/gatsby-plugin/components/Link.ts @@ -4,13 +4,22 @@ import { defineMergeStyles, linkDefaultTheme } from "./components.utils" export const Link = defineStyleConfig({ baseStyle: defineMergeStyles(linkDefaultTheme.baseStyle, { color: "primary.base", - textDecoration: "underline", - _focus: { - boxShadow: "none", - }, + textDecor: "underline", + textUnderlineOffset: "3px", _focusVisible: { boxShadow: "none", - outline: "auto", + outline: "2px solid", + outlineColor: "primary.hover", + outlineOffset: "2px", + borderRadius: "sm", + }, + _hover: { + color: "primary.hover", + }, + "&[data-inline-link]": { + _visited: { + color: "primary.visited", + }, }, }), }) diff --git a/src/assets/translation-program/pageviews-dark.png b/src/assets/translation-program/pageviews-dark.png deleted file mode 100644 index 7d52f668b76..00000000000 Binary files a/src/assets/translation-program/pageviews-dark.png and /dev/null differ diff --git a/src/assets/translation-program/pageviews-light.png b/src/assets/translation-program/pageviews-light.png deleted file mode 100644 index 040a9205e98..00000000000 Binary files a/src/assets/translation-program/pageviews-light.png and /dev/null differ diff --git a/src/assets/translation-program/pageviews_dark.png b/src/assets/translation-program/pageviews_dark.png new file mode 100644 index 00000000000..7d6e0a7a0d7 Binary files /dev/null and b/src/assets/translation-program/pageviews_dark.png differ diff --git a/src/assets/translation-program/pageviews_light.png b/src/assets/translation-program/pageviews_light.png new file mode 100644 index 00000000000..82f7a6abe27 Binary files /dev/null and b/src/assets/translation-program/pageviews_light.png differ diff --git a/src/components/ActionCard.tsx b/src/components/ActionCard.tsx index e0761396237..045115715c4 100644 --- a/src/components/ActionCard.tsx +++ b/src/components/ActionCard.tsx @@ -13,7 +13,7 @@ import { } from "@chakra-ui/react" import { GatsbyImage, IGatsbyImageData } from "gatsby-plugin-image" -import Link from "./Link" +import { BaseLink } from "./Link" const linkBoxFocusStyles: BoxProps = { borderRadius: "base", @@ -111,7 +111,7 @@ const ActionCard: React.FC = ({ lineHeight={1.4} > > & AvatarProps @@ -44,7 +44,7 @@ const Avatar = forwardRef((props, ref) => { return ( ((props, ref) => { return ( + +/** + * Story taken from DismissableBanner component + */ +const dismissableBannerStoryPageKey = "dismissableBannerStoryPageKey" +const bannerText = "This is a dismissable banner" + +export const DismissableBannerStory: StoryObj = { + play: () => { + localStorage.setItem(dismissableBannerStoryPageKey, "false") + }, + render: () => { + const children =
{bannerText}
+ return ( + + ) + }, +} diff --git a/src/components/BaseStories/Link.stories.tsx b/src/components/BaseStories/Link.stories.tsx new file mode 100644 index 00000000000..11028957721 --- /dev/null +++ b/src/components/BaseStories/Link.stories.tsx @@ -0,0 +1,69 @@ +import * as React from "react" +import { Box, Center, ListItem, Text, UnorderedList } from "@chakra-ui/react" +import { Meta, StoryObj } from "@storybook/react" +import Link from "../Link" + +type LinkType = typeof Link + +const meta = { + title: "Molecules / Navigation / Links", + component: Link, + decorators: [ + (Story) => ( +
+ +
+ ), + ], +} satisfies Meta + +export default meta + +type Story = StoryObj + +const MockParagraph = ({ to }: { to?: string }) => ( + + Text body normal. Ethereum is open access to digital money and data-friendly + services for everyone – no matter your background or location. It's a{" "} + community-built technology behind the cryptocurrency + ether (ETH) and thousands of applications you can use today. + +) + +export const InternalLink: Story = { + args: { + to: "#", + }, + render: (args) => , +} + +export const ExternalLink: Story = { + args: { + to: "https://example.com", + }, + render: (args) => , +} + +export const LinkList: Story = { + render: () => ( + + + Text body normal. Ethereum is open access to digital money and + data-friendly services for everyone – no matter your background or + location. It's a community-built technology behind the cryptocurrency + ether (ETH) and thousands of applications you can use today. + + + {Array.from({ length: 9 }).map((_, idx) => ( + + {`List Item ${idx % 2 === 0 ? "External" : "Internal"} ${ + idx + 1 + }`} + + ))} + + + ), +} diff --git a/src/components/Breadcrumbs/index.tsx b/src/components/Breadcrumbs/index.tsx index 70495d94252..81df5a7106c 100644 --- a/src/components/Breadcrumbs/index.tsx +++ b/src/components/Breadcrumbs/index.tsx @@ -7,7 +7,7 @@ import { BreadcrumbProps, } from "@chakra-ui/react" -import Link from "../Link" +import { BaseLink } from "../Link" export interface IProps extends BreadcrumbProps { slug: string @@ -92,9 +92,10 @@ const Breadcrumbs: React.FC = ({ m={0} > = () => { const tooltipContent = ( {" "} - coingecko.com + + coingecko.com + ) diff --git a/src/components/Button/Button.stories.tsx b/src/components/Button/Button.stories.tsx index e5b41e303f7..b1a70d0e3df 100644 --- a/src/components/Button/Button.stories.tsx +++ b/src/components/Button/Button.stories.tsx @@ -1,10 +1,13 @@ import * as React from "react" -import { HStack, IconButton, ThemingProps, VStack } from "@chakra-ui/react" +import { HStack, ThemingProps, Text, VStack } from "@chakra-ui/react" import { getThemingArgTypes } from "@chakra-ui/storybook-addon" import { Meta, StoryObj } from "@storybook/react" -import { MdExpandMore, MdChevronRight } from "react-icons/md" -import Button from "." +import { MdExpandMore, MdChevronRight, MdNightlight } from "react-icons/md" import theme from "../../@chakra-ui/gatsby-plugin/theme" +import ButtonLink from "../ButtonLink" +import IconButton from "../IconButton" +import Translation from "../Translation" +import Button from "." type ButtonType = typeof Button @@ -45,15 +48,12 @@ export const StyleVariants: Story = { }, render: (args) => ( - {variants.map((variant, idx) => { - if (args.isSecondary && variant === "solid") return - return ( - - - ) +const ButtonLink: React.FC = (props) => { + return = ({ = ({ - + ) } diff --git a/src/components/Nav/index.tsx b/src/components/Nav/index.tsx index f58a6c785b2..da0e3db1fb9 100644 --- a/src/components/Nav/index.tsx +++ b/src/components/Nav/index.tsx @@ -1,12 +1,13 @@ import React, { FC, useRef } from "react" -import { Icon, IconButton, Flex, Text, Box } from "@chakra-ui/react" +import { Icon, Flex, Box, HStack, useDisclosure } from "@chakra-ui/react" import { MdWbSunny, MdBrightness2, MdLanguage } from "react-icons/md" import Menu from "./Menu" import MobileNavMenu from "./Mobile" import ButtonLink from "../ButtonLink" -import Link from "../Link" +import Link, { BaseLink } from "../Link" import Search from "../Search" +import IconButton from "../IconButton" import { EthHomeIcon } from "../icons" import { useNav } from "./useNav" @@ -25,9 +26,9 @@ const Nav: FC = ({ path }) => { t, toggleColorMode, linkSections, - searchRef, mobileNavProps, } = useNav({ path }) + const searchModalDisclosure = useDisclosure() const navWrapperRef = useRef(null) @@ -51,7 +52,7 @@ const Nav: FC = ({ path }) => { width="full" maxW="container.2xl" > - = ({ path }) => { textDecor="none" > - + {/* Desktop */} - + - - } - variant="icon" - size="sm" - fontSize="2xl" - ms={{ xl: 2 }} - _hover={{ color: "primary.base" }} - onClick={toggleColorMode} + + {/* Mobile */} + - - - - - {t("languages")} - {" "} - {i18n.language.toUpperCase()} - - + + : } + aria-label={ + isDarkTheme + ? "Switch to Light Theme" + : "Switch to Dark Theme" + } + variant="ghost" + isSecondary + px={1.5} + onClick={toggleColorMode} + > + } + variant="ghost" + isSecondary + px={1.5} + > + {t("languages")} {i18n.language.toUpperCase()} + + - {/* Mobile */} - {shouldShowSubNav && ( @@ -123,11 +121,12 @@ const Nav: FC = ({ path }) => { px={8} > {ednLinks.map((link, idx) => ( - = ({ path }) => { fill: "currentColor", }, }} + _visited={{}} sx={{ svg: { fill: "currentColor", @@ -143,7 +143,7 @@ const Nav: FC = ({ path }) => { }} > {link.text} - + ))} )} diff --git a/src/components/Nav/useNav.ts b/src/components/Nav/useNav.ts index a6226f3e17a..2599316415a 100644 --- a/src/components/Nav/useNav.ts +++ b/src/components/Nav/useNav.ts @@ -278,11 +278,6 @@ export const useNav = ({ path }: { path: string }) => { setIsMenuOpen((prev) => !prev) } - const searchRef = useRef(null) - - const toggleSearch = (): void => { - searchRef.current?.click() - } const shouldShowSubNav = path.includes("/developers/") const splitPath = path.split("/") const fromPageParameter = @@ -304,7 +299,6 @@ export const useNav = ({ path }: { path: string }) => { isDarkTheme, toggleMenu, toggleTheme: changeColorMode, - toggleSearch, linkSections: mobileLinkSections, fromPageParameter, } @@ -316,7 +310,6 @@ export const useNav = ({ path }: { path: string }) => { isDarkTheme, ednLinks, linkSections, - searchRef, shouldShowSubNav, fromPageParameter, mobileNavProps, diff --git a/src/components/RandomAppList.tsx b/src/components/RandomAppList.tsx index 97f1703ffd2..26ea36eee1a 100644 --- a/src/components/RandomAppList.tsx +++ b/src/components/RandomAppList.tsx @@ -1,7 +1,7 @@ import React, { useEffect, useState } from "react" import { shuffle } from "lodash" -import Link from "./Link" +import InlineLink from "./Link" import Translation from "./Translation" import { TranslationKey } from "../utils/translations" @@ -63,7 +63,7 @@ const RandomAppList: React.FC = () => {
    {randomAppList.map((item, idx) => (
  • - {item.name} + {item.name} ,
    • ))} diff --git a/src/components/ReleaseBanner.tsx b/src/components/ReleaseBanner.tsx index dbd98d70856..c7d00ddf119 100644 --- a/src/components/ReleaseBanner.tsx +++ b/src/components/ReleaseBanner.tsx @@ -6,7 +6,7 @@ import { Box, Center, CloseButton } from "@chakra-ui/react" // Components import BannerNotification from "./BannerNotification" import Emoji from "./Emoji" -import Link from "./Link" +import InlineLink from "./Link" import Translation from "./Translation" // Utils @@ -105,9 +105,9 @@ const ReleaseBanner: React.FC = ({ storageKey }) => { id={"london-upgrade-banner-released" as TranslationKey} /> - + - + @@ -122,9 +122,9 @@ const ReleaseBanner: React.FC = ({ storageKey }) => { {zeroPad(seconds, 2)}! - + - + diff --git a/src/components/RollupProductDevDoc.tsx b/src/components/RollupProductDevDoc.tsx index 47b053d87f6..4dd64a43ea0 100644 --- a/src/components/RollupProductDevDoc.tsx +++ b/src/components/RollupProductDevDoc.tsx @@ -10,7 +10,7 @@ import { } from "@chakra-ui/react" // Components -import Link from "./Link" +import InlineLink from "./Link" import Translation from "./Translation" // Data @@ -70,19 +70,19 @@ const RollupProductDevDoc: React.FC = ({ rollupType }) => { )} - + - + - + - + - + - + diff --git a/src/components/Search/index.tsx b/src/components/Search/index.tsx index e5d3ccb0090..a15afb7ac1c 100644 --- a/src/components/Search/index.tsx +++ b/src/components/Search/index.tsx @@ -3,10 +3,8 @@ import React from "react" import { useTranslation, useI18next } from "gatsby-plugin-react-i18next" import { MdSearch } from "react-icons/md" import { - IconButton, forwardRef, Portal, - useDisclosure, IconButtonProps, useToken, useMediaQuery, @@ -14,6 +12,7 @@ import { } from "@chakra-ui/react" import { useDocSearchKeyboardEvents } from "@docsearch/react" import { DocSearchHit } from "@docsearch/react/dist/esm/types" +import Button from "../Button" import SearchButton from "./SearchButton" import SearchModal from "./SearchModal" import { sanitizeHitUrl } from "../../utils/url" @@ -27,142 +26,145 @@ import { trackCustomEvent } from "../../utils/matomo" export const SearchIconButton = forwardRef( (props, ref) => ( - } - fontSize="2xl" - variant="icon" - _hover={{ svg: { fill: "primary.base" } }} - {...props} - /> + ) ) -const Search = forwardRef<{}, "button">((_, ref) => { - const searchButtonRef = React.useRef(null) - const { isOpen, onClose, onOpen } = useDisclosure() +interface IProps { + isOpen: boolean + onOpen: () => void + onClose: () => void +} - const mergedButtonRefs = useMergeRefs(ref, searchButtonRef) +const Search = forwardRef( + ({ isOpen, onOpen, onClose }, ref) => { + const searchButtonRef = React.useRef(null) - useDocSearchKeyboardEvents({ - isOpen, - onOpen, - onClose, - searchButtonRef, - }) - const { t } = useTranslation() - const { language } = useI18next() - const appId = process.env.GATSBY_ALGOLIA_APP_ID || "" - const apiKey = process.env.GATSBY_ALGOLIA_SEARCH_KEY || "" - const indexName = - process.env.GATSBY_ALGOLIA_BASE_SEARCH_INDEX_NAME || "ethereumorg" + const mergedButtonRefs = useMergeRefs(ref, searchButtonRef) - // Check for the breakpoint with theme token - const xlBp = useToken("breakpoints", "xl") - const [isLargerThanXl] = useMediaQuery(`(min-width: ${xlBp})`) + useDocSearchKeyboardEvents({ + isOpen, + onOpen, + onClose, + searchButtonRef, + }) + const { t } = useTranslation() + const { language } = useI18next() + const appId = process.env.GATSBY_ALGOLIA_APP_ID || "" + const apiKey = process.env.GATSBY_ALGOLIA_SEARCH_KEY || "" + const indexName = + process.env.GATSBY_ALGOLIA_BASE_SEARCH_INDEX_NAME || "ethereumorg" - return ( - <> - {isLargerThanXl ? ( - { - onOpen() - trackCustomEvent({ - eventCategory: "nav bar", - eventAction: "click", - eventName: "search open", - }) - }} - translations={{ - buttonText: t("search"), - buttonAriaLabel: t("search"), - }} - /> - ) : ( - { - onOpen() - trackCustomEvent({ - eventCategory: "nav bar", - eventAction: "click", - eventName: "search open", - }) - }} - ref={mergedButtonRefs} - aria-label={t("aria-toggle-search-button")} - size="sm" - /> - )} - - {isOpen && ( - - items.map((item: DocSearchHit) => { - const newItem: DocSearchHit = structuredClone(item) - newItem.url = sanitizeHitUrl(item.url) - newItem._highlightResult.hierarchy.lvl0.value = - sanitizeHitTitle(item._highlightResult.hierarchy.lvl0.value) - return newItem + // Check for the breakpoint with theme token + const xlBp = useToken("breakpoints", "xl") + const [isLargerThanXl] = useMediaQuery(`(min-width: ${xlBp})`) + + return ( + <> + {isLargerThanXl ? ( + { + onOpen() + trackCustomEvent({ + eventCategory: "nav bar", + eventAction: "click", + eventName: "search open", }) - } - placeholder={t("search-ethereum-org")} + }} translations={{ - searchBox: { - resetButtonTitle: t("clear"), - resetButtonAriaLabel: t("clear"), - cancelButtonText: t("close"), - cancelButtonAriaLabel: t("close"), - }, - footer: { - selectText: t("docsearch-to-select"), - selectKeyAriaLabel: t("docsearch-to-select"), - navigateText: t("docsearch-to-navigate"), - navigateUpKeyAriaLabel: t("up"), - navigateDownKeyAriaLabel: t("down"), - closeText: t("docsearch-to-close"), - closeKeyAriaLabel: t("docsearch-to-close"), - searchByText: t("docsearch-search-by"), - }, - errorScreen: { - titleText: t("docsearch-error-title"), - helpText: t("docsearch-error-help"), - }, - startScreen: { - recentSearchesTitle: t("docsearch-start-recent-searches-title"), - noRecentSearchesText: t("docsearch-start-no-recent-searches"), - saveRecentSearchButtonTitle: t( - "docsearch-start-save-recent-search" - ), - removeRecentSearchButtonTitle: t( - "docsearch-start-remove-recent-search" - ), - favoriteSearchesTitle: t("docsearch-start-favorite-searches"), - removeFavoriteSearchButtonTitle: t( - "docsearch-start-remove-favorite-search" - ), - }, - noResultsScreen: { - noResultsText: t("docsearch-no-results-text"), - suggestedQueryText: t("docsearch-no-results-suggested-query"), - reportMissingResultsText: t("docsearch-no-results-missing"), - reportMissingResultsLinkText: t( - "docsearch-no-results-missing-link" - ), - }, + buttonText: t("search"), + buttonAriaLabel: t("search"), + }} + /> + ) : ( + { + onOpen() + trackCustomEvent({ + eventCategory: "nav bar", + eventAction: "click", + eventName: "search open", + }) }} + ref={mergedButtonRefs} + aria-label={t("aria-toggle-search-button")} /> )} - - - ) -}) + + {isOpen && ( + + items.map((item: DocSearchHit) => { + const newItem: DocSearchHit = structuredClone(item) + newItem.url = sanitizeHitUrl(item.url) + newItem._highlightResult.hierarchy.lvl0.value = + sanitizeHitTitle(item._highlightResult.hierarchy.lvl0.value) + return newItem + }) + } + placeholder={t("search-ethereum-org")} + translations={{ + searchBox: { + resetButtonTitle: t("clear"), + resetButtonAriaLabel: t("clear"), + cancelButtonText: t("close"), + cancelButtonAriaLabel: t("close"), + }, + footer: { + selectText: t("docsearch-to-select"), + selectKeyAriaLabel: t("docsearch-to-select"), + navigateText: t("docsearch-to-navigate"), + navigateUpKeyAriaLabel: t("up"), + navigateDownKeyAriaLabel: t("down"), + closeText: t("docsearch-to-close"), + closeKeyAriaLabel: t("docsearch-to-close"), + searchByText: t("docsearch-search-by"), + }, + errorScreen: { + titleText: t("docsearch-error-title"), + helpText: t("docsearch-error-help"), + }, + startScreen: { + recentSearchesTitle: t( + "docsearch-start-recent-searches-title" + ), + noRecentSearchesText: t("docsearch-start-no-recent-searches"), + saveRecentSearchButtonTitle: t( + "docsearch-start-save-recent-search" + ), + removeRecentSearchButtonTitle: t( + "docsearch-start-remove-recent-search" + ), + favoriteSearchesTitle: t("docsearch-start-favorite-searches"), + removeFavoriteSearchButtonTitle: t( + "docsearch-start-remove-favorite-search" + ), + }, + noResultsScreen: { + noResultsText: t("docsearch-no-results-text"), + suggestedQueryText: t("docsearch-no-results-suggested-query"), + reportMissingResultsText: t("docsearch-no-results-missing"), + reportMissingResultsLinkText: t( + "docsearch-no-results-missing-link" + ), + }, + }} + /> + )} + + + ) + } +) export default Search diff --git a/src/components/SideNav.tsx b/src/components/SideNav.tsx index 607db71910e..75c286c4607 100644 --- a/src/components/SideNav.tsx +++ b/src/components/SideNav.tsx @@ -5,7 +5,7 @@ import { motion } from "framer-motion" import { MdExpandMore } from "react-icons/md" import { useTranslation } from "gatsby-plugin-react-i18next" -import Link, { IProps as ILinkProps } from "./Link" +import Link, { BaseLink, IProps as ILinkProps } from "./Link" import Translation from "./Translation" import docLinks from "../data/developer-docs-links.yaml" @@ -50,16 +50,17 @@ const LinkContainer: React.FC<{ children: ReactNode }> = ({ children }) => { const SideNavLink: React.FC = ({ children, ...props }) => { return ( - {children} - + ) } diff --git a/src/components/SideNavMobile.tsx b/src/components/SideNavMobile.tsx index 33a8f374eac..738b7c2c368 100644 --- a/src/components/SideNavMobile.tsx +++ b/src/components/SideNavMobile.tsx @@ -4,7 +4,7 @@ import { Box, Center, HStack, Icon } from "@chakra-ui/react" import { motion, AnimatePresence } from "framer-motion" import { MdExpandMore } from "react-icons/md" -import Link, { IProps as ILinkProps } from "./Link" +import { BaseLink, IProps as ILinkProps } from "./Link" import Translation from "./Translation" import { isLang } from "../utils/languages" import { @@ -65,7 +65,7 @@ const LinkContainer: React.FC<{ children: ReactNode }> = ({ children }) => { const SideNavLink: React.FC = ({ children, ...props }) => { return ( - = ({ children, ...props }) => { {...props} > {children} - + ) } diff --git a/src/components/SkipLink.tsx b/src/components/SkipLink.tsx index 1e7d1c83d30..dd75752c590 100644 --- a/src/components/SkipLink.tsx +++ b/src/components/SkipLink.tsx @@ -2,7 +2,7 @@ import React from "react" import { Box } from "@chakra-ui/react" import Translation from "./Translation" -import Link from "../components/Link" +import { BaseLink } from "../components/Link" export interface IProps { hrefId: string @@ -11,7 +11,7 @@ export interface IProps { export const SkipLink: React.FC = ({ hrefId }) => { return ( - = ({ hrefId }) => { _focus={{ position: "static" }} > - + ) } diff --git a/src/components/StablecoinAccordion/index.tsx b/src/components/StablecoinAccordion/index.tsx index 9fa31944498..b0b8b9cf0f0 100644 --- a/src/components/StablecoinAccordion/index.tsx +++ b/src/components/StablecoinAccordion/index.tsx @@ -13,7 +13,7 @@ import { MdArrowForward } from "react-icons/md" import ButtonLink from "../ButtonLink" import CardList from "../CardList" import InfoBanner from "../InfoBanner" -import Link from "../Link" +import InlineLink, { BaseLink } from "../Link" import Translation from "../Translation" import { AccordionCustomItem, @@ -69,7 +69,7 @@ const StepBox = ( = () => {

    {" "} - + - +

    @@ -220,9 +220,9 @@ const StablecoinAccordion: React.FC = () => {

    {" "} - + - +

    @@ -243,9 +243,9 @@ const StablecoinAccordion: React.FC = () => {

    {" "} - + - +

    diff --git a/src/components/StablecoinBoxGrid.tsx b/src/components/StablecoinBoxGrid.tsx index d2f2836f7af..daf135a9056 100644 --- a/src/components/StablecoinBoxGrid.tsx +++ b/src/components/StablecoinBoxGrid.tsx @@ -1,7 +1,7 @@ import React, { useState } from "react" import { Box, Flex, Heading, useColorModeValue } from "@chakra-ui/react" import { useI18next } from "gatsby-plugin-react-i18next" -import Link, { navigate } from "./Link" +import InlineLink, { navigate } from "./Link" import Emoji from "./Emoji" import Translation from "./Translation" import { isMobile } from "../utils/isMobile" @@ -232,7 +232,7 @@ const GridItem: React.FC = ({
      {links.map((link, idx) => (
    • - = ({ }} > {link.text} - +
      • ))}
    diff --git a/src/components/Staking/StakingComparison.tsx b/src/components/Staking/StakingComparison.tsx index 23daa4dba0b..021201b7d15 100644 --- a/src/components/Staking/StakingComparison.tsx +++ b/src/components/Staking/StakingComparison.tsx @@ -1,7 +1,7 @@ import React from "react" import { Box, Flex, Heading, Text, useTheme } from "@chakra-ui/react" -import Link from "../Link" +import InlineLink from "../Link" import Translation from "../Translation" import { MatomoEventOptions, trackCustomEvent } from "../../utils/matomo" @@ -146,14 +146,14 @@ const StakingComparison: React.FC = ({ page, className }) => { - { trackCustomEvent(matomo) }} to={to} > - +     ) diff --git a/src/components/Staking/StakingStatsBox.tsx b/src/components/Staking/StakingStatsBox.tsx index c4312b5f4df..1da614cbac1 100644 --- a/src/components/Staking/StakingStatsBox.tsx +++ b/src/components/Staking/StakingStatsBox.tsx @@ -6,7 +6,7 @@ import { Code, Flex, Icon, Spinner, Text, VStack } from "@chakra-ui/react" // Import components import Translation from "../Translation" import Tooltip from "../Tooltip" -import Link from "../Link" +import InlineLink from "../Link" // Import utilities import { Lang } from "../../utils/languages" import { getData } from "../../utils/cache" @@ -175,7 +175,7 @@ const StakingStatsBox: React.FC = () => { {" "} - Beaconcha.in + Beaconcha.in @@ -194,7 +194,7 @@ const StakingStatsBox: React.FC = () => { {" "} - Beaconcha.in + Beaconcha.in @@ -213,7 +213,9 @@ const StakingStatsBox: React.FC = () => { {" "} - Beaconcha.in + + Beaconcha.in + diff --git a/src/components/StatsBoxGrid/GridItem.tsx b/src/components/StatsBoxGrid/GridItem.tsx index 1948fbe243b..8722ac63ce7 100644 --- a/src/components/StatsBoxGrid/GridItem.tsx +++ b/src/components/StatsBoxGrid/GridItem.tsx @@ -5,7 +5,7 @@ import { kebabCase } from "lodash" import { ResponsiveContainer, AreaChart, Area, XAxis, YAxis } from "recharts" import Tooltip from "../Tooltip" import Translation from "../Translation" -import Link from "../Link" +import InlineLink from "../Link" import StatErrorMessage from "../StatErrorMessage" import StatLoadingMessage from "../StatLoadingMessage" import { Metric, ranges } from "./useStatsBoxGrid" @@ -14,7 +14,7 @@ import { Direction } from "../../types" const tooltipContent = (metric: Metric) => (
    {" "} - {metric.apiProvider} + {metric.apiProvider}
    ) diff --git a/src/components/TableOfContents/TableOfContentsLink.tsx b/src/components/TableOfContents/TableOfContentsLink.tsx index 956d1e13cd4..2520c5cd31c 100644 --- a/src/components/TableOfContents/TableOfContentsLink.tsx +++ b/src/components/TableOfContents/TableOfContentsLink.tsx @@ -1,7 +1,7 @@ import React from "react" import { Link as GatsbyLink } from "gatsby" import { SystemStyleObject, cssVar } from "@chakra-ui/react" -import CustomLink from "../Link" +import CustomLink, { BaseLink } from "../Link" import { getCustomId, Item, trimmedTitle } from "./utils" export interface IPropsTableOfContentsLink { @@ -47,7 +47,7 @@ const Link: React.FC = ({ } return ( - = ({ display="inline-block" position="relative" color="textTableOfContents" + fontWeight="normal" mb="0.5rem !important" width={{ base: "100%", lg: "auto" }} _hover={{ @@ -84,7 +85,7 @@ const Link: React.FC = ({ }} > {trimmedTitle(item.title)} - + ) } diff --git a/src/components/TitleCardList.tsx b/src/components/TitleCardList.tsx index 575c5e21eae..77e81e5e6d0 100644 --- a/src/components/TitleCardList.tsx +++ b/src/components/TitleCardList.tsx @@ -1,6 +1,6 @@ import React from "react" import { GatsbyImage, IGatsbyImageData } from "gatsby-plugin-image" -import Link from "./Link" +import { BaseLink } from "./Link" import Translation from "./Translation" import { TranslationKey } from "../utils/translations" import { @@ -106,11 +106,8 @@ const TitleCardList: React.FC = ({ return isLink ? ( = ({ )} = ({ tutorial }) => { {hasSource && ( - {frontmatter.source} + + {frontmatter.source} + )} {published && ( diff --git a/src/components/UpcomingEventsList.tsx b/src/components/UpcomingEventsList.tsx index 3cceae3d350..2e6389889c3 100644 --- a/src/components/UpcomingEventsList.tsx +++ b/src/components/UpcomingEventsList.tsx @@ -5,7 +5,7 @@ import { Box } from "@chakra-ui/react" // Components import EventCard from "./EventCard" import InfoBanner from "./InfoBanner" -import Link from "./Link" +import InlineLink from "./Link" import Translation from "./Translation" import Button from "./Button" @@ -103,9 +103,9 @@ const UpcomingEventsList: React.FC = () => { return ( {" "} - + - + ) } diff --git a/src/components/UpgradeBannerNotification.tsx b/src/components/UpgradeBannerNotification.tsx index 80abba80d47..38ae5d825d7 100644 --- a/src/components/UpgradeBannerNotification.tsx +++ b/src/components/UpgradeBannerNotification.tsx @@ -2,16 +2,16 @@ import React from "react" import { Box } from "@chakra-ui/react" import BannerNotification from "./BannerNotification" import Emoji from "./Emoji" -import Link from "./Link" +import InlineLink from "./Link" const UpgradeBannerNotification: React.FC = () => ( We've deprecated our use of 'Eth1' and 'Eth2' terms.{" "} - + Read the full announcement - + ) diff --git a/src/components/UpgradeTableOfContents.tsx b/src/components/UpgradeTableOfContents.tsx index 81a9c46fd13..5a449d8c27e 100644 --- a/src/components/UpgradeTableOfContents.tsx +++ b/src/components/UpgradeTableOfContents.tsx @@ -1,6 +1,6 @@ import React, { useRef } from "react" import { Box, List, ListItem } from "@chakra-ui/react" -import Link from "./Link" +import { BaseLink } from "./Link" import { Item as TableOfContentsItem } from "./TableOfContents" const customIdRegEx = /^.+(\s*\{#([A-Za-z0-9\-_]+?)\}\s*)$/ @@ -50,7 +50,7 @@ const TableOfContentsLink: React.FC<{ item: Item }> = (props) => { } return ( - = (props) => { // `li :last-child` global selector wants to override this without `!important` mb="0.5rem !important" color="text300" + fontWeight="normal" + _visited={{}} > {trimmedTitle(item.title)} - + ) } @@ -113,7 +115,6 @@ function UpgradeTableOfContents(props: { ps={4} pe={1} fontSize="xl" - fontWeight="normal" lineHeight="1.6" styleType="none" > diff --git a/src/components/icons/Icons.stories.tsx b/src/components/icons/Icons.stories.tsx new file mode 100644 index 00000000000..b79e85f726a --- /dev/null +++ b/src/components/icons/Icons.stories.tsx @@ -0,0 +1,208 @@ +import { Box, Center, StackDivider, VStack } from "@chakra-ui/react" +import { Meta, StoryObj } from "@storybook/react" +import * as React from "react" +import { EthHomeIcon } from "./EthHomeIcon" +import { FeedbackGlyphIcon } from "./FeedbackGlyphIcon" +import { FeedbackThumbsUpIcon } from "./FeedbackThumbsUpIcon" +import { HighlightDarkIcon } from "./HighlightDarkIcon" +import { HighlightIcon } from "./HighlightIcon" +import { + CorrectIcon, + IncorrectIcon, + StarConfettiIcon, + TrophyIcon, +} from "./quiz" +import { + DappnodeIcon, + DecentralizationGlyphIcon, + DecentralizationEthGlyphIcon, + DownloadGlyphIcon, + EarthGlyphIcon, + HardwareGlyphIcon, + MegaphoneGlyphIcon, + PrivacyGlyphIcon, + SovereigntyGlyphIcon, + VoteGlyphIcon, +} from "./run-a-node" +import { + AbyssGlyphIcon, + AnkrGlyphIcon, + AuditedIcon, + AvadoGlyphIcon, + BattleTestedIcon, + BloxstakingGlyphIcon, + BugBountyIcon, + CautionProductGlyphIcon, + StakingDappnodeGlyphIcon, + DefaultOpenSourceGlyphIcon, + DockerGlyphIcon, + EconomicalIcon, + EthpoolGlyphIcon, + GreenCheckProductGlyphIcon, + KilnGlyphIcon, + LidoGlyphIcon, + LiquidityTokenIcon, + MultiClientIcon, + OpenSourceStakingIcon, + PermissionlessIcon, + RocketPoolGlyphIcon, + SelfCustodyIcon, + StafiGlyphIcon, + StakefishGlyphIcon, + StakewiseGlyphIcon, + StakingGlyphCentralizedIcon, + StakingGlyphCloudIcon, + StakingGlyphCPUIcon, + StakingGlyphEtherCircleIcon, + StakingGlyphTokenWalletIcon, + StereumGlyphIcon, + TrustlessIcon, + UnknownProductGlyphIcon, + WagyuGlyphIcon, + WarningProductGlyphIcon, + AllnodesGlyphIcon, +} from "./staking" +import { + BrowserIcon, + BuyCryptoIcon, + ConnectDappsIcon, + DesktopIcon, + EIP1559Icon, + ENSSupportIcon, + ERC20SupportIcon, + FilterBurgerIcon, + FrameIcon, + GasFeeCustomizationIcon, + HardwareIcon, + HardwareSupportIcon, + Layer2Icon, + MobileIcon, + MultisigIcon, + NFTSupportIcon, + NonCustodialIcon, + OpenSourceWalletIcon, + RPCImportingIcon, + SocialRecoverIcon, + StakingIcon, + SwapIcon, + WalletConnectIcon, + WithdrawCryptoIcon, +} from "./wallets" + +export default { + component: VStack, +} as Meta + +const iconsDefinitions = [ + CorrectIcon, + IncorrectIcon, + StarConfettiIcon, + TrophyIcon, + DappnodeIcon, + DecentralizationGlyphIcon, + DecentralizationEthGlyphIcon, + DownloadGlyphIcon, + EarthGlyphIcon, + HardwareGlyphIcon, + MegaphoneGlyphIcon, + PrivacyGlyphIcon, + SovereigntyGlyphIcon, + VoteGlyphIcon, + AbyssGlyphIcon, + AllnodesGlyphIcon, + AnkrGlyphIcon, + AuditedIcon, + AvadoGlyphIcon, + BattleTestedIcon, + BloxstakingGlyphIcon, + BugBountyIcon, + CautionProductGlyphIcon, + StakingDappnodeGlyphIcon, + DefaultOpenSourceGlyphIcon, + DockerGlyphIcon, + EconomicalIcon, + EthpoolGlyphIcon, + GreenCheckProductGlyphIcon, + KilnGlyphIcon, + LidoGlyphIcon, + LiquidityTokenIcon, + MultiClientIcon, + OpenSourceStakingIcon, + PermissionlessIcon, + RocketPoolGlyphIcon, + SelfCustodyIcon, + StafiGlyphIcon, + StakefishGlyphIcon, + StakewiseGlyphIcon, + StakingGlyphCentralizedIcon, + StakingGlyphCloudIcon, + StakingGlyphCPUIcon, + StakingGlyphEtherCircleIcon, + StakingGlyphTokenWalletIcon, + StereumGlyphIcon, + TrustlessIcon, + UnknownProductGlyphIcon, + WagyuGlyphIcon, + WarningProductGlyphIcon, + BrowserIcon, + BuyCryptoIcon, + ConnectDappsIcon, + DesktopIcon, + EIP1559Icon, + ENSSupportIcon, + ERC20SupportIcon, + FilterBurgerIcon, + FrameIcon, + GasFeeCustomizationIcon, + HardwareIcon, + HardwareSupportIcon, + Layer2Icon, + MobileIcon, + MultisigIcon, + NFTSupportIcon, + NonCustodialIcon, + OpenSourceWalletIcon, + RPCImportingIcon, + SocialRecoverIcon, + StakingIcon, + SwapIcon, + WalletConnectIcon, + WithdrawCryptoIcon, + EthHomeIcon, + FeedbackGlyphIcon, + FeedbackThumbsUpIcon, + HighlightDarkIcon, + HighlightIcon, +] + +iconsDefinitions.sort((a, b) => + (a?.displayName || "") > (b?.displayName || "") ? 1 : -1 +) +const items = iconsDefinitions.map((IconDef) => ( + +
    + +
    +
    {IconDef.displayName}
    +     +)) + +export const IconsList: StoryObj = { + render: () => { + return ( + } + spacing={4} + align="stretch" + > + {items} + + ) + }, +} diff --git a/src/content/bridges/index.md b/src/content/bridges/index.md index 1a1a345243b..7f6a5664ab4 100644 --- a/src/content/bridges/index.md +++ b/src/content/bridges/index.md @@ -30,7 +30,7 @@ Bridges exist to connect blockchains, allowing the transfer of information and t Bridges enable: -- the cross-chain transfer of assets and information +- the cross-chain transfer of assets and information. - dapps to access the strengths of various blockchains – thus enhancing their capabilities (as protocols now have more design space for innovation). - users to access new platforms and leverage the benefits of different chains. - developers from different blockchain ecosystems to collaborate and build new platforms for the users. diff --git a/src/content/developers/docs/design-and-ux/index.md b/src/content/developers/docs/design-and-ux/index.md index 19179d25fc6..e78458e2569 100644 --- a/src/content/developers/docs/design-and-ux/index.md +++ b/src/content/developers/docs/design-and-ux/index.md @@ -24,6 +24,7 @@ This is a curated list of user research done in web3 that may help with design a - [CRADL: Crypto Research and Design Lab](https://project-cradl.notion.site/Crypto-Research-and-Design-Lab-50a7127f34ed4c88ad95c7cedf7fbe36) - [CRADL: UX in Cryptocurrency](https://docs.google.com/presentation/d/1s2OPSH5sMJzxRYaJSSRTe8W2iIoZx0PseIV-WeZWD1s/edit?usp=sharing) - [CRADL: Onboarding to Cryptocurrency](https://docs.google.com/presentation/d/1R9nFuzA-R6SxaGCKhoMbE4Vxe0JxQSTiHXind3LVq_w/edit?usp=sharing) +- [ConSensys: The State of Web3 perception around the world 2023](https://consensys.io/insight-report/web3-and-crypto-global-survey-2023) - [Staking survey: Key trends, takeaways, and predictions - Eth Staker](https://lookerstudio.google.com/u/0/reporting/cafcee00-e1af-4148-bae8-442a88ac75fa/page/p_ja2srdhh2c?s=hmbTWDh9hJo) - [Survey: The state of Defi 2023](https://stateofdefi.org/) - [Usability and user satisfaction survey - Ethereum.org](https://lookerstudio.google.com/reporting/0a189a7c-a890-40db-a5c6-009db52c81c9) diff --git a/src/content/developers/docs/networks/index.md b/src/content/developers/docs/networks/index.md index a86d106fb2c..549a4e9ec29 100644 --- a/src/content/developers/docs/networks/index.md +++ b/src/content/developers/docs/networks/index.md @@ -63,6 +63,7 @@ The Sepolia network uses a permissioned validator set. It's fairly new, meaning - [Alchemy Sepolia faucet](https://sepoliafaucet.com/) - [Infura Sepolia faucet](https://www.infura.io/faucet) - [Chainstack Sepolia faucet](https://faucet.chainstack.com/sepolia-faucet) +- [Testnet Faucet | Sepolia](https://testnet-faucet.com/sepolia/) #### Goerli _(long-term support)_ {#goerli} diff --git a/src/content/developers/docs/nodes-and-clients/archive-nodes/index.md b/src/content/developers/docs/nodes-and-clients/archive-nodes/index.md index 2fd4502a919..90c1b99bfc1 100644 --- a/src/content/developers/docs/nodes-and-clients/archive-nodes/index.md +++ b/src/content/developers/docs/nodes-and-clients/archive-nodes/index.md @@ -38,7 +38,7 @@ The main benefit of state archive is a quick access to queries about historical - _What was ETH balance of account 0x1337... at block 15537393?_ - _What is the balance of token 0x in contract 0x at block 1920000?_ -As explained above, a full node would need to generate this data by EVM execution which uses the CPU and takes time. Archive nodes access them on the disk and serves responses immediately. This is useful feature for certain parts of infrastracture, for example: +As explained above, a full node would need to generate this data by EVM execution which uses the CPU and takes time. Archive nodes access them on the disk and serve responses immediately. This is a useful feature for certain parts of infrastructure, for example: - Service providers like block explorers - Researchers @@ -52,7 +52,7 @@ There are various free [services](/developers/docs/nodes-and-clients/nodes-as-a- Archive node in this context means data served by user facing execution layer clients as they handle the state database and provide JSON-RPC endpoints. Configuration options, sync time and database size may vary by client. For details, please refer to the documentation provided by your client. -Before starting your own archive node, learn about the differences between the clients and especially the various [hardware requirements](/developers/docs/nodes-and-clients/run-a-node/#requirements). Most clients are not optimized for this feature and their archives requires more than 12TB of space. In contrast, implementations like Erigon can store the same data in under 3TB which makes them the most effective way of running an archive node. +Before starting your own archive node, learn about the differences between the clients and especially the various [hardware requirements](/developers/docs/nodes-and-clients/run-a-node/#requirements). Most clients are not optimized for this feature and their archives require more than 12TB of space. In contrast, implementations like Erigon can store the same data in under 3TB which makes them the most effective way of running an archive node. ## Recommended practices @@ -63,7 +63,7 @@ Apart from general [recommendations for running a node](developers/docs/nodes-an Always make sure to verify hardware requirements for a given mode in a client's documentation. The biggest requirement for archive nodes is the disk space. Depending on client, it varies from 3TB to 12TB. Even if HDD might be considered a better solution for large amounts of data, syncing it and constantly updating the head of the chain will require SSD drives. [SATA](https://www.cleverfiles.com/help/sata-hard-drive.html) drives are good enough but it should be a reliable quality, at least [TLC](https://blog.synology.com/tlc-vs-qlc-ssds-what-are-the-differences). Disks can be fitted into a desktop computer or a server with enough slots. Such dedicated devices are ideal for running high uptime node. It's totally possible to run it on a laptop but the portability will come at an additional cost. -All of the data needs to be fit in one volume, therefore disks have to be joined, e.g. with [RAID0](https://en.wikipedia.org/wiki/Standard_RAID_levels#RAID_0) or [LVM](https://web.mit.edu/rhel-doc/5/RHEL-5-manual/Deployment_Guide-en-US/ch-lvm.html). It might be also worth considering using [ZFS](https://en.wikipedia.org/wiki/ZFS) as it supports "Copy-on-write" which ensures data is correctly written to the disk without any low level errors. +All of the data needs to fit in one volume, therefore disks have to be joined, e.g. with [RAID0](https://en.wikipedia.org/wiki/Standard_RAID_levels#RAID_0) or [LVM](https://web.mit.edu/rhel-doc/5/RHEL-5-manual/Deployment_Guide-en-US/ch-lvm.html). It might be also worth considering using [ZFS](https://en.wikipedia.org/wiki/ZFS) as it supports "Copy-on-write" which ensures data is correctly written to the disk without any low level errors. For more stability and security in preventing accidental database corruption, especially in a professional setup, consider using [ECC memory](https://en.wikipedia.org/wiki/ECC_memory) if your system supports it. The size of RAM is generally advised to be the same as for a full node but more RAM can help speed up the synchronization. diff --git a/src/content/developers/tutorials/a-developers-guide-to-ethereum-part-one/index.md b/src/content/developers/tutorials/a-developers-guide-to-ethereum-part-one/index.md index 0a5f2ff252a..b99407bc637 100644 --- a/src/content/developers/tutorials/a-developers-guide-to-ethereum-part-one/index.md +++ b/src/content/developers/tutorials/a-developers-guide-to-ethereum-part-one/index.md @@ -182,7 +182,7 @@ Now you’re ready to surf the chain! That’s not a thing people say. I just ma First things first, a sanity check: ```python -In [5]: w3.isConnected() +In [5]: w3.is_connected() Out[5]: True ``` diff --git a/src/content/developers/tutorials/the-graph-fixing-web3-data-querying/index.md b/src/content/developers/tutorials/the-graph-fixing-web3-data-querying/index.md index 64d4f0d08bc..682d50a3d2d 100644 --- a/src/content/developers/tutorials/the-graph-fixing-web3-data-querying/index.md +++ b/src/content/developers/tutorials/the-graph-fixing-web3-data-querying/index.md @@ -169,7 +169,7 @@ The schema is the GraphQL data definition. It will allow you to define which ent - BigInt - BigDecimal -You can also use entities as type to define relationships. In our example we define a 1-to-many relationship from player to bets. The ! means the value can't be empty. The full documentation can be seen [here](https://thegraph.com/docs/define-a-subgraph#the-graphql-schema). +You can also use entities as type to define relationships. In our example we define a 1-to-many relationship from player to bets. The ! means the value can't be empty. The full documentation can be seen [here](https://thegraph.com/docs/en/developing/creating-a-subgraph/#the-subgraph-manifest). ```graphql type Bet @entity { @@ -198,7 +198,7 @@ Then we create a new Bet entity. The id for this will be `event.transaction.hash Lastly we can update the Player entity with all the data. Arrays cannot be pushed to directly, but need to be updated as shown here. We use the id to reference the bet. And `.save()` is required at the end to store an entity. -The full documentation can be seen here: https://thegraph.com/docs/define-a-subgraph#writing-mappings. You can also add logging output to the mapping file, see [here](https://thegraph.com/docs/assemblyscript-api#api-reference). +The full documentation can be seen here: https://thegraph.com/docs/en/developing/creating-a-subgraph/#writing-mappings. You can also add logging output to the mapping file, see [here](https://thegraph.com/docs/assemblyscript-api#api-reference). ```typescript import { Bet, Player } from "../generated/schema" @@ -295,24 +295,21 @@ But we're missing one last piece of the puzzle and that's the server. You can ei ### Graph Explorer: The hosted service {#graph-explorer-the-hosted-service} -The easiest way is to use the hosted service. Follow the instructions [here](https://thegraph.com/docs/deploy-a-subgraph) to deploy a subgraph. For many projects you can actually find existing subgraphs in the [explorer](https://thegraph.com/explorer/). +The easiest way is to use the hosted service. Follow the instructions [here](https://thegraph.com/docs/en/deploying/deploying-a-subgraph-to-hosted/) to deploy a subgraph. For many projects you can actually find existing subgraphs in the [explorer](https://thegraph.com/explorer/). ![The Graph-Explorer](./thegraph-explorer.png) ### Running your own node {#running-your-own-node} -Alternatively you can run your own node. Docs [here](https://github.com/graphprotocol/graph-node#quick-start). One reason to do this might be using a network that's not supported by the hosted service. Currently supported are Mainnet, Kovan, Rinkeby, Ropsten, Goerli, PoA-Core, xDAI and Sokol. +Alternatively you can run your own node. Docs [here](https://github.com/graphprotocol/graph-node#quick-start). One reason to do this might be using a network that's not supported by the hosted service. The currently supported networks [can be found here](https://thegraph.com/docs/en/developing/supported-networks/). ## The decentralized future {#the-decentralized-future} -GraphQL supports streams as well for newly incoming events. This is not yet fully supported by The Graph, but it will be released soon. +GraphQL supports streams as well for newly incoming events. These are supported on the graph through [Substreams](https://thegraph.com/docs/en/substreams/) which are currently in open beta. -One missing aspect though is still decentralization. The Graph has future plans for eventually becoming a fully decentralized protocol. Those are two great articles explaining the plan in more detail: - -- https://thegraph.com/blog/the-graph-network-in-depth-part-1 -- https://thegraph.com/blog/the-graph-network-in-depth-part-2 +In [2021](https://thegraph.com/blog/mainnet-migration/) The Graph began its transition to a decentralized indexing network. You can read more about the architecture of this decentralized indexing network [here](https://thegraph.com/docs/en/network/explorer/). Two key aspects are: -1. Users will be paying the indexers for queries. -2. Indexers will be staking Graph Tokens (GRT). +1. Users pay the indexers for queries. +2. Indexers stake Graph Tokens (GRT). diff --git a/src/content/guides/how-to-create-an-ethereum-account/index.md b/src/content/guides/how-to-create-an-ethereum-account/index.md index 261bf78f1bc..99033cff74e 100644 --- a/src/content/guides/how-to-create-an-ethereum-account/index.md +++ b/src/content/guides/how-to-create-an-ethereum-account/index.md @@ -18,9 +18,9 @@ A wallet is an app that helps you manage your Ethereum account. It uses your key Find a wallet -If you are new, you can select the β€œNew to crypto” filter on the "find a wallet" page to identify wallets that should include all necessary features suitable for beginners. +If you are new, you can select the β€œNew to crypto” filter on the "find a wallet" page to identify wallets that should include all necessary features suitable for beginners. -![filter selection on 'find a wallet' page](./wallet-box.png) +![Filter selection on 'find a wallet' page](./wallet-box.png) There are also other profile filters to cater to your needs. These are examples of commonly used wallets - you should do your own research before trusting any software. @@ -51,7 +51,7 @@ Once you have saved your seed phrase you should see your wallet dashboard with y ### Are my wallet and my Ethereum account the same? -No. The wallet is a management tool that helps you to manage accounts. A single wallet might give access to several accounts, and a single account can be accessed by multiple wallets. The seed phrase is used to create accounts that are then controlled by the wallet. +No. The wallet is a management tool that helps you to manage accounts. A single wallet might give access to several accounts, and a single account can be accessed by multiple wallets. The seed phrase is used to create accounts that are then controlled by the wallet. You can think of the accounts as leaves on a tree that all 'grow' from a single seed phrase. Each unique seed will grow an entirely different tree of accounts. diff --git a/src/content/staking/pools/index.md b/src/content/staking/pools/index.md index 9e6138e5abd..3d4fd413f35 100644 --- a/src/content/staking/pools/index.md +++ b/src/content/staking/pools/index.md @@ -26,7 +26,7 @@ In addition to the benefits we outlined in our [intro to staking](/staking/), st - + diff --git a/src/content/staking/withdrawals/index.md b/src/content/staking/withdrawals/index.md index 547521402f6..a37863a2e46 100644 --- a/src/content/staking/withdrawals/index.md +++ b/src/content/staking/withdrawals/index.md @@ -194,7 +194,7 @@ eventCategory="FAQ" eventAction="I operate a validator. Where can I find more information on enabling withdrawals?" eventName="read more"> -Validator operators are recommended to visit the Staking Launchpad Withdrawals page where you'll find more details about how to prepare your validator for withdrawals. prepared, timing of events, and more details about how withdrawals function. +Validator operators are recommended to visit the Staking Launchpad Withdrawals page where you'll find more details about how to prepare your validator for withdrawals, timing of events, and more details about how withdrawals function. To try out your setup on a testnet first, visit the the Goerli Testnet Staking Launchpad to get started. @@ -214,5 +214,5 @@ No. Once a validator has exited and its full balance has been withdrawn, any add - [EIP-4895: Beacon chain push withdrawals as operations](https://eips.ethereum.org/EIPS/eip-4895) - [Ethereum Cat Herders - Shanghai](https://www.ethereumcatherders.com/shanghai_upgrade/index.html) - [PEEPanEIP #94: Staked ETH Withdrawal (Testing) with Potuz & Hsiao-Wei Wang](https://www.youtube.com/watch?v=G8UstwmGtyE) -- [PEEPanEIP#68: EIP-4895: Beacon chain push withdrawals as operations with Alex stokes](https://www.youtube.com/watch?v=CcL9RJBljUs) +- [PEEPanEIP#68: EIP-4895: Beacon chain push withdrawals as operations with Alex Stokes](https://www.youtube.com/watch?v=CcL9RJBljUs) - [Understanding Validator Effective Balance](https://www.attestant.io/posts/understanding-validator-effective-balance/) diff --git a/src/data/community-events.json b/src/data/community-events.json index eacdf5c9c0d..122345cfee9 100644 --- a/src/data/community-events.json +++ b/src/data/community-events.json @@ -286,5 +286,32 @@ "description": "Three days of building bridges between web3 builders, creators, traditional businesses, financial experts, and policymakers.", "startDate": "2023-9-15", "endDate": "2023-9-17" + }, + { + "title": "ETH LONDON Hackathon 2023", + "to": "https://www.encode.club/eth-london", + "sponsor": null, + "location": "London, UK", + "description": "Join us for the ETH London Hackathon, 27th-29th October 2023, an exciting and innovative event focusing on Ethereum technology. Network with industry leaders, showcase your skills, and innovate in the thriving Ethereum space.", + "startDate": "2023-10-27", + "endDate": "2023-10-29" + }, + { + "title": "Devconnect Istanbul", + "to": "https://devconnect.org", + "sponsor": null, + "location": "Istanbul, Turkey", + "description": "Devconnect is a week-long gathering of independent Ethereum events. There is no \"main\" event. Instead, different teams host events, each with a unique focus, ranging from beginner-friendly to expert level. Throughout the week, there will also be an official Devconnect coworking space. It aims to bring together Ethereum's builders, researchers, and community in one place.", + "startDate": "2023-11-13", + "endDate": "2023-11-19" + }, + { + "title": "Ethereum Costa Rica Day", + "to": "http://ethereum.cr", + "sponsor": null, + "location": "Costa Rica", + "description": "Full day of learning about Ethereum, onboarding new users and builders.", + "startDate": "2023-11-25", + "endDate": "2023-11-25" } ] diff --git a/src/intl/en/page-learn.json b/src/intl/en/page-learn.json index b9a77482ebf..933ab556ab4 100644 --- a/src/intl/en/page-learn.json +++ b/src/intl/en/page-learn.json @@ -11,7 +11,7 @@ "hero-subtitle": "Your educational guide to the world of Ethereum. Learn how Ethereum works and how to connect to it. This page includes technical and non-technical articles, guides, and resources.", "hero-button-lets-get-started": "Let's get started", "what-is-crypto-1": "You may have heard about cryptocurrencies, blockchains and Bitcoin. The links below will help you learn what they are and how they relate to Ethereum.", - "what-is-crypto-2": "Cryptocurrencies, such as Bitcoin, enable anyone to transfer money globally. Ethereum does too, but it can also run code that enables people to create apps and organizations. It’s both resilient and flexible: any computer program can run on Ethereum. Learn more and find out how to get started:", + "what-is-crypto-2": "Cryptocurrencies, such as bitcoin, enable anyone to transfer money globally. Ethereum does too, but it can also run code that enables people to create apps and organizations. It’s both resilient and flexible: any computer program can run on Ethereum. Learn more and find out how to get started:", "what-is-ethereum-card-title": "What is Ethereum?", "what-is-ethereum-card-description": "If you are new, start here to learn why Ethereum matters.", "what-is-ethereum-card-image-alt": "Illustration of a person peering into a bazaar, meant to represent Ethereum.", diff --git a/src/pages-conditional/dapps.tsx b/src/pages-conditional/dapps.tsx index 1bfd696a404..5cd37baa41a 100644 --- a/src/pages-conditional/dapps.tsx +++ b/src/pages-conditional/dapps.tsx @@ -31,7 +31,7 @@ import Callout from "../components/Callout" import CalloutBanner from "../components/CalloutBanner" import ProductCard from "../components/ProductCard" import GhostCard from "../components/GhostCard" -import Link from "../components/Link" +import InlineLink, { BaseLink } from "../components/Link" import InfoBanner from "../components/InfoBanner" import DocLink from "../components/DocLink" import Emoji from "../components/Emoji" @@ -272,8 +272,8 @@ const StepBoxContainer = (props: ChildOnlyProp) => ( /> ) -const StepBox = (props: ComponentPropsWithRef) => ( - ) => ( + {" "} - + - + @@ -1517,9 +1517,9 @@ const DappsPage = ({ - + - +     diff --git a/src/pages-conditional/eth.tsx b/src/pages-conditional/eth.tsx index aca87cbd5a8..2f5e568dff9 100644 --- a/src/pages-conditional/eth.tsx +++ b/src/pages-conditional/eth.tsx @@ -22,7 +22,7 @@ import CardList from "../components/CardList" import EthPriceCard from "../components/EthPriceCard" import EthVideo from "../components/EthVideo" import InfoBanner from "../components/InfoBanner" -import Link from "../components/Link" +import InlineLink from "../components/Link" import HorizontalCard from "../components/HorizontalCard" import PageMetadata from "../components/PageMetadata" import FeedbackCard from "../components/FeedbackCard" @@ -412,9 +412,9 @@ const EthPage = (props: PageProps) => { {" "} {" "} - + - + @@ -447,9 +447,9 @@ const EthPage = (props: PageProps) => { {" "} - + - + ) => { - + - {" "} + {" "} – - + - {" "} + {" "} – - + - {" "} + {" "} – - + - {" "} + {" "} – diff --git a/src/pages-conditional/what-is-ethereum.tsx b/src/pages-conditional/what-is-ethereum.tsx index 298e9b48a95..6d15b6de954 100644 --- a/src/pages-conditional/what-is-ethereum.tsx +++ b/src/pages-conditional/what-is-ethereum.tsx @@ -24,7 +24,7 @@ import Button from "../components/Button" import PageMetadata from "../components/PageMetadata" import Tooltip from "../components/Tooltip" import Tabs from "../components/Tabs" -import Link from "../components/Link" +import InlineLink from "../components/Link" import { Banner, BannerBody, @@ -283,9 +283,9 @@ const WhatIsEthereumPage = ({ const tooltipContent = ({ apiUrl, apiProvider, ariaLabel }) => (
    {" "} - + {apiProvider} - +
    ) @@ -737,16 +737,16 @@ const WhatIsEthereumPage = ({ - + Europol Spotlight - Cryptocurrencies - Tracing the evolution of criminal finances.pdf - {" "} + {" "} EN (1.4 MB) - + Chainalysis (2021), The 2021 Crypto Crime report - {" "} + {" "} EN @@ -785,22 +785,22 @@ const WhatIsEthereumPage = ({ - + - {" "} + {" "} - + - {" "} + {" "} - + - {" "} + {" "} diff --git a/src/pages/404.tsx b/src/pages/404.tsx index 7550a9d5e2c..f4fc0ebffa9 100644 --- a/src/pages/404.tsx +++ b/src/pages/404.tsx @@ -2,7 +2,7 @@ import React from "react" import { graphql, PageProps } from "gatsby" import { Box, Flex } from "@chakra-ui/react" -import Link from "../components/Link" +import InlineLink from "../components/Link" import Translation from "../components/Translation" const NotFoundPage = (props: PageProps) => ( @@ -13,9 +13,9 @@ const NotFoundPage = (props: PageProps) => (

    {" "} - + - + .

    diff --git a/src/pages/assets.tsx b/src/pages/assets.tsx index ee7d7d8952b..8281dd631b8 100644 --- a/src/pages/assets.tsx +++ b/src/pages/assets.tsx @@ -17,7 +17,7 @@ import { // Components import AssetDownload from "../components/AssetDownload" -import Link from "../components/Link" +import InlineLink from "../components/Link" import PageMetadata from "../components/PageMetadata" import Translation from "../components/Translation" import FeedbackCard from "../components/FeedbackCard" @@ -85,19 +85,19 @@ const AssetsPage = ({ data }: PageProps) => {
    - + - +
    - + - +
    - + - +
    diff --git a/src/pages/bug-bounty.tsx b/src/pages/bug-bounty.tsx index 35c76867642..440f8011f5a 100644 --- a/src/pages/bug-bounty.tsx +++ b/src/pages/bug-bounty.tsx @@ -16,7 +16,7 @@ import Translation from "../components/Translation" import Card from "../components/Card" import Leaderboard from "../components/Leaderboard" import BugBountyCards from "../components/BugBountyCards" -import Link from "../components/Link" +import InlineLink from "../components/Link" import Emoji from "../components/Emoji" import CardList from "../components/CardList" import Breadcrumbs from "../components/Breadcrumbs" @@ -526,13 +526,13 @@ const BugBountiesPage = ({ title={t("page-upgrades-bug-bounty-ledger-title")} description={t("page-upgrades-bug-bounty-ledger-desc")} > - + - +
    - + - +
    @@ -540,16 +540,16 @@ const BugBountiesPage = ({ - + Ben Edgington's{" "} - + - + Vitalik Buterin's{" "} - + @@ -650,9 +650,9 @@ const BugBountiesPage = ({ > - + SECURITY.md - + - + Deposit Contract Specifications - +
    - + Deposit Contract Source Code - +     @@ -695,9 +695,9 @@ const BugBountiesPage = ({ {" "} - + - + @@ -863,9 +863,9 @@ const BugBountiesPage = ({ - + - + @@ -878,7 +878,9 @@ const BugBountiesPage = ({ {" "} - bounty@ethereum.org + + bounty@ethereum.org + diff --git a/src/pages/contributing/translation-program/acknowledgements.tsx b/src/pages/contributing/translation-program/acknowledgements.tsx index 620b56f22f5..a04405ea849 100644 --- a/src/pages/contributing/translation-program/acknowledgements.tsx +++ b/src/pages/contributing/translation-program/acknowledgements.tsx @@ -21,7 +21,7 @@ import type { Context } from "../../../types" // Components import ActionCard from "../../../components/ActionCard" import Breadcrumbs from "../../../components/Breadcrumbs" -import Link from "../../../components/Link" +import InlineLink from "../../../components/Link" import PageMetadata from "../../../components/PageMetadata" import Translation from "../../../components/Translation" import TranslationLeaderboard from "../../../components/TranslationLeaderboard" @@ -98,9 +98,9 @@ const TranslatorAcknowledgements = ({ {" "} - + - + . @@ -241,9 +241,9 @@ const TranslatorAcknowledgements = ({ {" "} - + - + diff --git a/src/pages/contributing/translation-program/contributors.tsx b/src/pages/contributing/translation-program/contributors.tsx index 8c1a1650e47..e4540018307 100644 --- a/src/pages/contributing/translation-program/contributors.tsx +++ b/src/pages/contributing/translation-program/contributors.tsx @@ -17,7 +17,7 @@ import type { Context } from "../../../types" // Components import Breadcrumbs from "../../../components/Breadcrumbs" -import Link from "../../../components/Link" +import InlineLink from "../../../components/Link" import Translation from "../../../components/Translation" import PageMetadata from "../../../components/PageMetadata" @@ -110,9 +110,9 @@ const Contributors = ({ {" "} - + - + . {" "} - + - + . diff --git a/src/pages/developers/index.tsx b/src/pages/developers/index.tsx index 5a17c9ce64f..5b973b595a9 100644 --- a/src/pages/developers/index.tsx +++ b/src/pages/developers/index.tsx @@ -16,7 +16,7 @@ import { import Card, { IProps as ICardProps } from "../../components/Card" import Callout from "../../components/Callout" -import Link from "../../components/Link" +import InlineLink from "../../components/Link" import Translation from "../../components/Translation" import ButtonLink from "../../components/ButtonLink" import PageMetadata from "../../components/PageMetadata" @@ -293,9 +293,9 @@ const DevelopersPage = ({

    {" "} - + - +

    - + - +

    - + - +

    - + - +

    - + - +

    - + - +

    - + - +

    @@ -378,65 +378,65 @@ const DevelopersPage = ({

    - + - +

    - + - +

    - + - +

    - + - +

    - + - +

    - + - +

    - + - +

    - + - +

    - + - +

    @@ -445,90 +445,90 @@ const DevelopersPage = ({

    - + - +

    - + - +

    - + - +

    - + - +

    - + - +

    - + - +

    - + - +

    - + - +

    - + - +

    - + - +

    - + - +

    - + - +

    - + - +

    - + - +

    diff --git a/src/pages/developers/tutorials.tsx b/src/pages/developers/tutorials.tsx index e356d2b40d0..45783c58d6b 100644 --- a/src/pages/developers/tutorials.tsx +++ b/src/pages/developers/tutorials.tsx @@ -18,7 +18,7 @@ import { FaGithub } from "react-icons/fa" // Components import Translation from "../../components/Translation" import ButtonLink from "../../components/ButtonLink" -import Link from "../../components/Link" +import InlineLink, { BaseLink } from "../../components/Link" import Modal from "../../components/Modal" import PageMetadata from "../../components/PageMetadata" import TutorialTags from "../../components/TutorialTags" @@ -219,9 +219,9 @@ const TutorialsPage = ({ {" "} - + - + @@ -393,10 +393,11 @@ const TutorialsPage = ({ {filteredTutorials.map((tutorial) => { return ( ) => { title={t("page-get-eth-dex")} description={t("page-get-eth-dex-desc")} > - + - + - + - + {" "} - + - + {" "} - + - + @@ -272,9 +272,9 @@ const GetETHPage = ({ data }: PageProps) => { {" "} - + - + @@ -346,9 +346,9 @@ const GetETHPage = ({ data }: PageProps) => { - + - + ) => { {" "} - + - + . {" "} - + - + . @@ -105,7 +105,7 @@ const LanguagesPage = ({ location }: PageProps) => { position="absolute" insetInlineEnd={1} aria-label={t("clear")} - variant="icon" + variant="ghost" _hover={{ svg: { fill: "primary" } }} /> ) @@ -150,7 +150,7 @@ const LanguagesPage = ({ location }: PageProps) => { fontSize={{ base: "md", md: "xl" }} > ) => { {" "} - + - + . diff --git a/src/pages/layer-2.tsx b/src/pages/layer-2.tsx index 7e5dc5a78a8..678e1b8679e 100644 --- a/src/pages/layer-2.tsx +++ b/src/pages/layer-2.tsx @@ -33,7 +33,7 @@ import FeedbackCard from "../components/FeedbackCard" import InfoBanner from "../components/InfoBanner" import Layer2Onboard from "../components/Layer2/Layer2Onboard" import Layer2ProductCard from "../components/Layer2ProductCard" -import Link from "../components/Link" +import InlineLink from "../components/Link" import OrderedList from "../components/OrderedList" import PageHero from "../components/PageHero" import PageMetadata from "../components/PageMetadata" @@ -391,7 +391,7 @@ const Layer2Page = ({ data }: PageProps) => { const tooltipContent = (metric: ToolTipContentMetric): JSX.Element => (
    {" "} - {metric.apiProvider} + {metric.apiProvider}
    ) @@ -525,9 +525,9 @@ const Layer2Page = ({ data }: PageProps) => { /> {" "} - + - + @@ -563,9 +563,9 @@ const Layer2Page = ({ data }: PageProps) => { - + - + @@ -650,7 +650,7 @@ const Layer2Page = ({ data }: PageProps) => { {title} {description} - {childSentence} + {childSentence} ) @@ -770,14 +770,14 @@ const Layer2Page = ({ data }: PageProps) => { - + - + - + - + @@ -837,14 +837,14 @@ const Layer2Page = ({ data }: PageProps) => { - + - + - + - + @@ -858,17 +858,17 @@ const Layer2Page = ({ data }: PageProps) => { - + - + {" "} - + - + @@ -882,33 +882,33 @@ const Layer2Page = ({ data }: PageProps) => { - + - {" "} + {" "} - Vitalik Buterin - + - {" "} + {" "} - Vitalik Buterin - + - {" "} + {" "} - Lex Clips - + - {" "} + {" "} - Finematics - + - {" "} + {" "} - BarnabΓ© Monnot diff --git a/src/pages/learn/index.tsx b/src/pages/learn/index.tsx index a4472c3a5ef..06b52b44cc1 100644 --- a/src/pages/learn/index.tsx +++ b/src/pages/learn/index.tsx @@ -21,7 +21,7 @@ import { useI18next, useTranslation } from "gatsby-plugin-react-i18next" import ButtonLink from "../../components/ButtonLink" import DocLink from "../../components/DocLink" import FeedbackCard from "../../components/FeedbackCard" -import Link from "../../components/Link" +import InlineLink from "../../components/Link" import OriginalCard, { IProps as IOriginalCardProps, } from "../../components/Card" @@ -349,9 +349,9 @@ const LearnPage = ({ data }: PageProps) => { {" "} - + - + . @@ -474,34 +474,34 @@ const LearnPage = ({ data }: PageProps) => { mb={0} > - + - + - + - + - + - + - + - + - + - + - + - + @@ -674,41 +674,41 @@ const LearnPage = ({ data }: PageProps) => { - + - {" "} + {" "} - + - {" "} + {" "} - + - {" "} + {" "} - + - {" "} + {" "} {" "} - + - {" "} + {" "} @@ -719,41 +719,41 @@ const LearnPage = ({ data }: PageProps) => { - + - {" "} + {" "} - + - {" "} + {" "} - + - {" "} + {" "} - + - {" "} + {" "} - + - {" "} + {" "} diff --git a/src/pages/roadmap/vision.tsx b/src/pages/roadmap/vision.tsx index f82c95e3a89..9857f3e54d0 100644 --- a/src/pages/roadmap/vision.tsx +++ b/src/pages/roadmap/vision.tsx @@ -16,7 +16,7 @@ import { import Translation from "../../components/Translation" import Card from "../../components/Card" -import Link from "../../components/Link" +import InlineLink from "../../components/Link" import Trilemma from "../../components/Trilemma" import PageHero, { IContent as IPageHeroContent, @@ -168,29 +168,29 @@ const VisionPage = ({ - + - + - + - + - + - + - + - + - + - + @@ -238,9 +238,9 @@ const VisionPage = ({ {" "} - + - {" "} + {" "}

    {" "} @@ -251,24 +251,24 @@ const VisionPage = ({ {" "} - + - {" "} + {" "} {" "} - + - + {" "} - + - + @@ -282,15 +282,15 @@ const VisionPage = ({ {" "} - + - + {" "} - + - + diff --git a/src/pages/run-a-node.tsx b/src/pages/run-a-node.tsx index 8979e0b4b30..902934de94f 100644 --- a/src/pages/run-a-node.tsx +++ b/src/pages/run-a-node.tsx @@ -40,7 +40,7 @@ import Translation from "../components/Translation" import ExpandableCard from "../components/ExpandableCard" import ExpandableInfo from "../components/ExpandableInfo" import Emoji from "../components/Emoji" -import Link from "../components/Link" +import InlineLink from "../components/Link" import ButtonLink from "../components/ButtonLink" import FeedbackCard from "../components/FeedbackCard" import Button from "../components/Button" @@ -519,9 +519,9 @@ const RunANodePage = ({ data }: PageProps) => { - + - + ) => { - + - + - + - +
  • @@ -821,23 +821,23 @@ const RunANodePage = ({ data }: PageProps) => {

    • - + - {" "} + {" "} -{" "}
    • - + - +
    • - + - {" "} + {" "} -{" "} @@ -885,9 +885,9 @@ const RunANodePage = ({ data }: PageProps) => { {" "} -{" "} - + - +

      @@ -898,27 +898,27 @@ const RunANodePage = ({ data }: PageProps) => {
      • - + - {" "} + {" "} -{" "}
      • - + - {" "} + {" "} -{" "}
      • - + - {" "} + {" "} -{" "} diff --git a/src/pages/stablecoins.tsx b/src/pages/stablecoins.tsx index 38d58f02826..4cebc1f5c28 100644 --- a/src/pages/stablecoins.tsx +++ b/src/pages/stablecoins.tsx @@ -24,7 +24,7 @@ import FeedbackCard from "../components/FeedbackCard" import GhostCard from "../components/GhostCard" import HorizontalCard from "../components/HorizontalCard" import InfoBanner from "../components/InfoBanner" -import Link from "../components/Link" +import InlineLink from "../components/Link" import PageHero from "../components/PageHero" import PageMetadata from "../components/PageMetadata" import ProductList from "../components/ProductList" @@ -40,7 +40,7 @@ import { getImage } from "../utils/image" const tooltipContent = (
        {" "} - coingecko.com + coingecko.com
        ) @@ -390,9 +390,9 @@ const StablecoinsPage = ({ data }: PageProps) => {

      {" "} - + - + @@ -456,14 +456,14 @@ const StablecoinsPage = ({ data }: PageProps) => {
      • - + - +
      • - + - +
      @@ -674,9 +674,9 @@ const StablecoinsPage = ({ data }: PageProps) => { {" "} - + - + diff --git a/src/pages/staking/deposit-contract.tsx b/src/pages/staking/deposit-contract.tsx index 8dca380e3cc..74deed294d2 100644 --- a/src/pages/staking/deposit-contract.tsx +++ b/src/pages/staking/deposit-contract.tsx @@ -20,7 +20,7 @@ import CardList from "../../components/CardList" import CopyToClipboard from "../../components/CopyToClipboard" import Emoji from "../../components/Emoji" import InfoBanner from "../../components/InfoBanner" -import Link from "../../components/Link" +import InlineLink from "../../components/Link" import PageMetadata from "../../components/PageMetadata" import Translation from "../../components/Translation" import Tooltip from "../../components/Tooltip" @@ -328,9 +328,9 @@ const DepositContractPage = ({

      {" "} - + - +

      )} - - + )}
      {" "} - + - +
      diff --git a/src/pages/staking/index.tsx b/src/pages/staking/index.tsx index 5024ba30eeb..3182304d717 100644 --- a/src/pages/staking/index.tsx +++ b/src/pages/staking/index.tsx @@ -14,7 +14,7 @@ import { import { List as ButtonDropdownList } from "../../components/ButtonDropdown" import ButtonLink from "../../components/ButtonLink" import Card from "../../components/Card" -import Link from "../../components/Link" +import InlineLink from "../../components/Link" import PageHero from "../../components/PageHero" import PageMetadata from "../../components/PageMetadata" import Translation from "../../components/Translation" @@ -121,7 +121,7 @@ const ColorH3 = (props: { color: string; id: TranslationKey }) => ( const StyledButtonLink = (props: { to: string; id: TranslationKey }) => { return ( - + ) @@ -328,9 +328,9 @@ const StakingPage = ({ - + - + @@ -346,7 +346,9 @@ const StakingPage = ({ key={idx} description={description} > - {to && linkText && {linkText}} + {to && linkText && ( + {linkText} + )} ) )} @@ -612,74 +614,74 @@ const StakingPage = ({

      {tocItems.further.title}

      • - + - {" "} + {" "} -{" "}
      • - + - {" "} + {" "} -{" "}
      • - + - {" "} + {" "} -{" "}
      • - + - {" "} + {" "} -{" "}
      • - + - {" "} + {" "} -{" "}
      • - + - +
      • - + - +
      • - + - +
      • - + - +
      • - + - +
      diff --git a/src/pages/studio.tsx b/src/pages/studio.tsx index 7527c364246..11a0902d00e 100644 --- a/src/pages/studio.tsx +++ b/src/pages/studio.tsx @@ -2,7 +2,7 @@ import React from "react" import { graphql } from "gatsby" import { Box, Container, Divider, Heading, useToken } from "@chakra-ui/react" -import Link from "../components/Link" +import InlineLink from "../components/Link" import Emoji from "../components/Emoji" import ButtonLink from "../components/ButtonLink" @@ -34,7 +34,7 @@ const StudioRedirectPage = () => {

      Ethereum Studio is no longer actively maintained. We'd like to thank - the Superblocks + the Superblocks team and the many open source contributors who generously helped support this project.

      @@ -42,14 +42,14 @@ const StudioRedirectPage = () => { You can find the source code for this project here:
      • - + Web IDE - +
      • - + API server - +

      @@ -73,9 +73,9 @@ const StudioRedirectPage = () => {

      We recommend using Remix as an alternative web IDE for your Solidity development. Additionally, we encourage you to consider{" "} - + setting up a local development environment - + . Check out our developer portal for tools, documentation, and more.

      diff --git a/src/templates/docs.tsx b/src/templates/docs.tsx index 67e4e1a80e3..3b68fd8911a 100644 --- a/src/templates/docs.tsx +++ b/src/templates/docs.tsx @@ -29,7 +29,7 @@ import FeedbackCard from "../components/FeedbackCard" import CrowdinContributors from "../components/FileContributorsCrowdin" import GitHubContributors from "../components/FileContributorsGitHub" import InfoBanner from "../components/InfoBanner" -import Link from "../components/Link" +import InlineLink from "../components/Link" import { mdxTableComponents } from "../components/Table" import PageMetadata from "../components/PageMetadata" import TableOfContents, { @@ -192,7 +192,7 @@ const BackToTop = (props: ChildOnlyProp) => ( // Note: you must pass components to MDXProvider in order to render them in markdown files // https://www.gatsbyjs.com/plugins/gatsby-plugin-mdx/#mdxprovider const components = { - a: Link, + a: InlineLink, h1: H1, h2: H2, h3: H3, diff --git a/src/templates/event.tsx b/src/templates/event.tsx index 8b4799d196a..4939bf6c199 100644 --- a/src/templates/event.tsx +++ b/src/templates/event.tsx @@ -18,7 +18,7 @@ import { import ButtonLink from "../components/ButtonLink" import InfoBanner from "../components/InfoBanner" -import Link from "../components/Link" +import InlineLink from "../components/Link" import ExpandableCard from "../components/ExpandableCard" import PageMetadata from "../components/PageMetadata" import { type Item as ItemTableOfContents } from "../components/TableOfContents" @@ -135,7 +135,7 @@ const HeroContainer = (props: ChildOnlyProp) => ( // Note: you must pass components to MDXProvider in order to render them in markdown files // https://www.gatsbyjs.com/plugins/gatsby-plugin-mdx/#mdxprovider const components = { - a: Link, + a: InlineLink, h1: H1, h2: H2, h3: H3, diff --git a/src/templates/roadmap.tsx b/src/templates/roadmap.tsx index d02fd8beda1..3ec84468ea9 100644 --- a/src/templates/roadmap.tsx +++ b/src/templates/roadmap.tsx @@ -26,7 +26,7 @@ import DocLink from "../components/DocLink" import Contributors from "../components/Contributors" import InfoBanner from "../components/InfoBanner" import UpgradeStatus from "../components/UpgradeStatus" -import Link from "../components/Link" +import InlineLink from "../components/Link" import { mdxTableComponents } from "../components/Table" import Logo from "../components/Logo" import MeetupList from "../components/MeetupList" @@ -117,7 +117,7 @@ const TitleCard = (props: ChildOnlyProp) => ( // Note: you must pass components to MDXProvider in order to render them in markdown files // https://www.gatsbyjs.com/plugins/gatsby-plugin-mdx/#mdxprovider const components = { - a: Link, + a: InlineLink, h1: H1, h2: H2, h3: H3, diff --git a/src/templates/staking.tsx b/src/templates/staking.tsx index 97a893d6fc8..7f1a1ba1f78 100644 --- a/src/templates/staking.tsx +++ b/src/templates/staking.tsx @@ -27,7 +27,7 @@ import DocLink from "../components/DocLink" import Contributors from "../components/Contributors" import InfoBanner from "../components/InfoBanner" import UpgradeStatus from "../components/UpgradeStatus" -import Link from "../components/Link" +import InlineLink from "../components/Link" import { mdxTableComponents } from "../components/Table" import Logo from "../components/Logo" import MeetupList from "../components/MeetupList" @@ -286,7 +286,7 @@ const TableContainer = (props: BoxProps) => ( // Note: you must pass components to MDXProvider in order to render them in markdown files // https://www.gatsbyjs.com/plugins/gatsby-plugin-mdx/#mdxprovider const components = { - a: Link, + a: InlineLink, h1: Header1, h2: H2, h3: H3, diff --git a/src/templates/static.tsx b/src/templates/static.tsx index c5e1493dd57..135914c2b81 100644 --- a/src/templates/static.tsx +++ b/src/templates/static.tsx @@ -21,7 +21,7 @@ import Callout from "../components/Callout" import Contributors from "../components/Contributors" import FeedbackCard from "../components/FeedbackCard" import InfoBanner from "../components/InfoBanner" -import Link from "../components/Link" +import InlineLink from "../components/Link" import { mdxTableComponents } from "../components/Table" import Logo from "../components/Logo" import MeetupList from "../components/MeetupList" @@ -96,6 +96,7 @@ const Header1 = (props: ChildOnlyProp) => ( a: { display: "none", }, + position: "inherit !important", }} {...props} /> @@ -168,7 +169,7 @@ const CardContainer = (props: ChildOnlyProp) => ( // Note: you must pass components to MDXProvider in order to render them in markdown files // https://www.gatsbyjs.com/plugins/gatsby-plugin-mdx/#mdxprovider const components = { - a: Link, + a: InlineLink, h1: Header1, h2: Header2, h3: Header3, @@ -180,7 +181,7 @@ const components = { ...mdxTableComponents, MeetupList, RandomAppList, - Link, + Link: InlineLink, Logo, ButtonLink, Contributors, diff --git a/src/templates/tutorial.tsx b/src/templates/tutorial.tsx index e2a9af7b2f9..a775b100ffe 100644 --- a/src/templates/tutorial.tsx +++ b/src/templates/tutorial.tsx @@ -23,7 +23,7 @@ import TutorialMetadata from "../components/TutorialMetadata" import FileContributors from "../components/FileContributors" import InfoBanner from "../components/InfoBanner" import EnvWarningBanner from "../components/EnvWarningBanner" -import Link from "../components/Link" +import InlineLink from "../components/Link" import { mdxTableComponents } from "../components/Table" import PageMetadata from "../components/PageMetadata" import TableOfContents, { @@ -197,7 +197,7 @@ const KBD = (props) => { // Note: you must pass components to MDXProvider in order to render them in markdown files // https://www.gatsbyjs.com/plugins/gatsby-plugin-mdx/#mdxprovider const components = { - a: Link, + a: InlineLink, h1: H1, h2: H2, h3: H3, diff --git a/src/templates/upgrade.tsx b/src/templates/upgrade.tsx index b7d3766e99f..ac00c85ce9f 100644 --- a/src/templates/upgrade.tsx +++ b/src/templates/upgrade.tsx @@ -31,7 +31,7 @@ import Card from "../components/Card" import Contributors from "../components/Contributors" import InfoBanner from "../components/InfoBanner" import UpgradeStatus from "../components/UpgradeStatus" -import Link from "../components/Link" +import InlineLink, { BaseLink } from "../components/Link" import { mdxTableComponents } from "../components/Table" import BeaconChainActions from "../components/BeaconChainActions" import ShardChainsList from "../components/ShardChainsList" @@ -207,7 +207,7 @@ const P = (props: TextProps) => ( // https://www.gatsbyjs.com/plugins/gatsby-plugin-mdx/#mdxprovider const components = { - a: Link, + a: InlineLink, h1: MDXH1, h2: H2, h3: H3, @@ -286,7 +286,7 @@ const Image = chakra(GatsbyImage, { const MoreContent = (props: ChildOnlyProp & { to: string }) => ( ( // Note: you must pass components to MDXProvider in order to render them in markdown files // https://www.gatsbyjs.com/plugins/gatsby-plugin-mdx/#mdxprovider const components = { - a: Link, + a: InlineLink, h1: H1, h2: H2, h3: H3, @@ -399,9 +399,9 @@ const UseCasePage = ({
      {" "} - + - +
      @@ -438,7 +438,7 @@ const UseCasePage = ({