Merge pull request #8982 from ethereum/dev

Deploy v6.14.1

.all-contributorsrc

@@ -9774,6 +9774,15 @@
         "doc",
         "translation"
       ]
+    },
+    {
+      "login": "Marcelixoo",
+      "name": "Marcelo T. dos Santos",
+      "avatar_url": "https://avatars.githubusercontent.com/u/29285152?v=4",
+      "profile": "http://marcelixoo.com",
+      "contributions": [
+        "code"
+      ]
     }
   ],
   "contributorsPerLine": 7,

README.md

@@ -1534,6 +1534,9 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d
       <td align="center"><a href="https://github.com/theSamPadilla"><img src="https://avatars.githubusercontent.com/u/35386211?v=4?s=100" width="100px;" alt="Sam Padilla"/><br /><sub><b>Sam Padilla</b></sub></a><br /><a href="https://github.com/ethereum/ethereum-org-website/commits?author=theSamPadilla" title="Documentation">📖</a></td>
       <td align="center"><a href="https://chenquan.me"><img src="https://avatars.githubusercontent.com/u/20042193?v=4?s=100" width="100px;" alt="Chen Quan"/><br /><sub><b>Chen Quan</b></sub></a><br /><a href="https://github.com/ethereum/ethereum-org-website/commits?author=terasum" title="Documentation">📖</a> <a href="#translation-terasum" title="Translation">🌍</a></td>
     </tr>
+    <tr>
+      <td align="center"><a href="http://marcelixoo.com"><img src="https://avatars.githubusercontent.com/u/29285152?v=4?s=100" width="100px;" alt="Marcelo T. dos Santos"/><br /><sub><b>Marcelo T. dos Santos</b></sub></a><br /><a href="https://github.com/ethereum/ethereum-org-website/commits?author=Marcelixoo" title="Code">💻</a></td>
+    </tr>
   </tbody>
 </table>
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ethereum-org-website",
-  "version": "6.14.0",
+  "version": "6.14.1",
   "description": "Website of ethereum.org",
   "main": "index.js",
   "repository": "[email protected]:ethereum/ethereum-org-website.git",

src/@chakra-ui/gatsby-plugin/foundations/shadows.ts

@@ -10,6 +10,7 @@ const shadows = {
       "0 14px 66px rgba(0,0,0,.07), 0 10px 17px rgba(0,0,0,.03), 0 4px 7px rgba(0,0,0,.05)",
     dark: "0 14px 66px hsla(0,0%,96.1%,.07), 0 10px 17px hsla(0,0%,96.1%,.03), 0 4px 7px hsla(0,0%,96.1%,.05)",
   },
+  tableBoxHover: "0px 8px 17px rgba(0, 0, 0, 0.15)",
   tableItemBox: {
     light: "0 1px 1px rgba(0, 0, 0, 0.1)",
     dark: "0 1px 1px hsla(0,0%,100%,.1)",

src/components/Banners/PostMergeBanner.tsx

@@ -1,35 +1,30 @@
 import React from "react"
-import styled from "@emotion/styled"
 import BannerNotification from "../BannerNotification"
 import Translation from "../Translation"
 
 import { TranslationKey } from "../../utils/translations"
-
-const StyledBannerNotification = styled(BannerNotification)`
-  display: flex;
-  z-index: 1;
-  justify-content: center;
-  p {
-    max-width: 100ch;
-    margin: 0;
-    padding: 0;
-  }
-  a {
-    text-decoration: underline;
-  }
-  text-align: center;
-`
+import { Center, Text } from "@chakra-ui/react"
 
 export interface IProps {
   translationString: TranslationKey
 }
 
 const PostMergeBanner: React.FC<IProps> = ({ translationString }) => (
-  <StyledBannerNotification shouldShow={true}>
-    <p>
+  <Center
+    as={BannerNotification}
+    shouldShow={true}
+    zIndex={1}
+    textAlign="center"
+    sx={{
+      a: {
+        "text-decoration": "underline",
+      },
+    }}
+  >
+    <Text maxW="100ch" m={0} p={0}>
       <Translation id={translationString} />
-    </p>
-  </StyledBannerNotification>
+    </Text>
+  </Center>
 )
 
 export default PostMergeBanner

src/components/Breadcrumbs.tsx

@@ -1,12 +1,17 @@
 import React from "react"
-import { Box, UnorderedList, ListItem } from "@chakra-ui/react"
+import {
+  Breadcrumb,
+  BreadcrumbItem,
+  BreadcrumbLink,
+  BreadcrumbProps,
+} from "@chakra-ui/react"
 import { useIntl } from "react-intl"
 
 import Link from "./Link"
-import { isLang, supportedLanguages } from "../utils/languages"
+import { isLang } from "../utils/languages"
 import { isTranslationKey, translateMessageId } from "../utils/translations"
 
-export interface IProps {
+export interface IProps extends BreadcrumbProps {
   slug: string
   startDepth?: number
 }
@@ -49,50 +54,46 @@ const Breadcrumbs: React.FC<IProps> = ({
   })
 
   return (
-    <Box
-      aria-label="Breadcrumb"
+    <Breadcrumb
       dir="auto"
-      {...restProps}
-      as="nav"
-      marginBottom={8}
-      listStyleType="none"
       position="relative"
-      zIndex={1}
+      zIndex="1"
+      mb={8}
+      sx={{
+        // TODO: Move this to `listProps` upon upgrading `@chakra-ui/react`
+        // to at least v2.4.2
+        ol: {
+          m: 0,
+          lineHeight: 1,
+        },
+      }}
+      {...restProps}
     >
-      <UnorderedList
-        display="flex"
-        flexWrap="wrap"
-        listStyleType="none"
-        margin={0}
-      >
-        {crumbs.map((crumb, idx) => (
-          <ListItem
+      {crumbs.map((crumb, idx) => {
+        const isCurrentPage = slug === crumb.fullPath
+        return (
+          <BreadcrumbItem
             key={idx}
-            margin={0}
-            marginRight={2}
+            isCurrentPage={isCurrentPage}
+            color="textTableOfContents"
             fontSize="sm"
-            lineHeight="140%"
             letterSpacing="wider"
+            lineHeight="140%"
+            m={0}
           >
-            <Link
+            <BreadcrumbLink
+              as={Link}
               to={crumb.fullPath}
-              isPartiallyActive={slug === crumb.fullPath}
-              textDecoration="none"
-              color="textTableOfContents"
+              isPartiallyActive={isCurrentPage}
               _hover={{ color: "primary", textDecor: "none" }}
               _active={{ color: "primary" }}
             >
               {crumb.text}
-            </Link>
-            {idx < crumbs.length - 1 && (
-              <Box as="span" marginLeft={2} color="textTableOfContents">
-                /
-              </Box>
-            )}
-          </ListItem>
-        ))}
-      </UnorderedList>
-    </Box>
+            </BreadcrumbLink>
+          </BreadcrumbItem>
+        )
+      })}
+    </Breadcrumb>
   )
 }