Merge remote-tracking branch 'origin/dev' into fix/input-misalignment

Author: TylerAPfledderer

.all-contributorsrc

@@ -10422,6 +10422,16 @@
       "contributions": [
         "ideas"
       ]
+    },
+    {
+      "login": "z0rats",
+      "name": "Alex",
+      "avatar_url": "https://avatars.githubusercontent.com/u/32142853?v=4",
+      "profile": "http://t.me/mevsinternet",
+      "contributions": [
+        "doc",
+        "bug"
+      ]
     }
   ],
   "contributorsPerLine": 7,

.storybook/i18next.ts

@@ -1,5 +1,6 @@
 import i18n, { Resource } from "i18next"
 import { initReactI18next } from "gatsby-plugin-react-i18next"
+import fs from "fs"
 
 export const baseLocales = {
   en: { title: "English", left: "En" },
@@ -9,7 +10,13 @@ export const baseLocales = {
 }
 
 // Only i18n files named in this array are being exposed to Storybook. Add filenames as necessary.
-const ns = ["common", "page-about", "page-upgrades", "page-developers-index"]
+const ns = [
+  "common",
+  "glossary",
+  "page-about",
+  "page-upgrades",
+  "page-developers-index",
+]
 const supportedLngs = Object.keys(baseLocales)
 
 /**
@@ -19,11 +26,22 @@ const supportedLngs = Object.keys(baseLocales)
 const resources: Resource = ns.reduce((acc, n) => {
   supportedLngs.forEach((lng) => {
     if (!acc[lng]) acc[lng] = {}
-    acc[lng] = {
-      translation: {
-        ...acc[lng].translation,
-        ...require(`../src/intl/${lng}/${n}.json`),
-      },
+    try {
+      acc[lng] = {
+        translation: {
+          ...acc[lng].translation,
+
+          ...require(`../src/intl/${lng}/${n}.json`),
+        },
+      }
+    } catch {
+      acc[lng] = {
+        translation: {
+          ...acc[lng].translation,
+
+          ...require(`../src/intl/en/${n}.json`),
+        },
+      }
     }
   })
   return acc

README.md

@@ -1630,6 +1630,7 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d
     </tr>
     <tr>
       <td align="center" valign="top" width="14.28%"><a href="https://github.com/LadyDhaga"><img src="https://avatars.githubusercontent.com/u/106376368?v=4?s=100" width="100px;" alt="chinaman123"/><br /><sub><b>chinaman123</b></sub></a><br /><a href="#ideas-LadyDhaga" title="Ideas, Planning, & Feedback">🤔</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="http://t.me/mevsinternet"><img src="https://avatars.githubusercontent.com/u/32142853?v=4?s=100" width="100px;" alt="Alex"/><br /><sub><b>Alex</b></sub></a><br /><a href="https://github.com/ethereum/ethereum-org-website/commits?author=z0rats" title="Documentation">📖</a> <a href="https://github.com/ethereum/ethereum-org-website/issues?q=author%3Az0rats" title="Bug reports">🐛</a></td>
     </tr>
   </tbody>
 </table>

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")

gatsby-ssr.tsx

@@ -18,21 +18,5 @@ export const onRenderBody = ({ setHeadComponents }: RenderBodyArgs) => {
       crossOrigin="anonymous"
       key="interFont"
     />,
-    <link
-      rel="preload"
-      href="/fonts/Inter-Regular.woff"
-      as="font"
-      type="font/woff"
-      crossOrigin="anonymous"
-      key="interFont"
-    />,
-    <link
-      rel="preload"
-      href="/fonts/IBMPlexMono-Regular.woff2"
-      as="font"
-      type="font/woff2"
-      crossOrigin="anonymous"
-      key="interFont"
-    />,
   ])
 }

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": "[email protected]: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",

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,47 +84,29 @@ 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 = {
   solid: variantSolid,
   outline: variantOutline,
   ghost: variantGhost,
   link: variantLink,
-  icon: variantIcon,
 }
 
 export const Button = defineStyleConfig({