Merge pull request #14986 from ethereum/dev

Release candidate 9.6.0

Author: corwintines

.all-contributorsrc

@@ -12697,6 +12697,24 @@
       "contributions": [
         "content"
       ]
+    },
+    {
+      "login": "jenish-thapa",
+      "name": "Jenish Thapa",
+      "avatar_url": "https://avatars.githubusercontent.com/u/141203631?v=4",
+      "profile": "https://github.com/jenish-thapa",
+      "contributions": [
+        "ideas"
+      ]
+    },
+    {
+      "login": "iusx",
+      "name": "iusx",
+      "avatar_url": "https://avatars.githubusercontent.com/u/57232813?v=4",
+      "profile": "https://jiangxue.org/~ritsu",
+      "contributions": [
+        "code"
+      ]
     }
   ],
   "contributorsPerLine": 7,

README.md

@@ -1942,6 +1942,8 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d
       <td align="center" valign="top" width="14.28%"><a href="https://github.com/itzVarsha"><img src="https://avatars.githubusercontent.com/u/138134029?v=4?s=100" width="100px;" alt="Varshitha"/><br /><sub><b>Varshitha</b></sub></a><br /><a href="#maintenance-itzVarsha" title="Maintenance">🚧</a></td>
       <td align="center" valign="top" width="14.28%"><a href="https://alexandriaroberts.dev/"><img src="https://avatars.githubusercontent.com/u/31341867?v=4?s=100" width="100px;" alt="Alexandria Roberts"/><br /><sub><b>Alexandria Roberts</b></sub></a><br /><a href="https://github.com/ethereum/ethereum-org-website/commits?author=alexandriaroberts" title="Code">💻</a></td>
       <td align="center" valign="top" width="14.28%"><a href="https://github.com/colinlyguo"><img src="https://avatars.githubusercontent.com/u/102356659?v=4?s=100" width="100px;" alt="colin"/><br /><sub><b>colin</b></sub></a><br /><a href="#content-colinlyguo" title="Content">🖋</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://github.com/jenish-thapa"><img src="https://avatars.githubusercontent.com/u/141203631?v=4?s=100" width="100px;" alt="Jenish Thapa"/><br /><sub><b>Jenish Thapa</b></sub></a><br /><a href="#ideas-jenish-thapa" title="Ideas, Planning, & Feedback">🤔</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://jiangxue.org/~ritsu"><img src="https://avatars.githubusercontent.com/u/57232813?v=4?s=100" width="100px;" alt="iusx"/><br /><sub><b>iusx</b></sub></a><br /><a href="https://github.com/ethereum/ethereum-org-website/commits?author=iusx" title="Code">💻</a></td>
     </tr>
   </tbody>
 </table>

src/components/CentralizedExchanges/index.tsx

@@ -84,7 +84,7 @@ const CentralizedExchanges = ({
       <p className="mb-8 max-w-screen-md text-center">
         {t("page-get-eth-exchanges-intro")}
       </p>
-      <div className="w-full max-w-screen-sm">
+      <div className="relative z-50 w-full max-w-screen-sm">
         <Select
           instanceId="eth-exchange-region"
           aria-label={t("page-get-eth-exchanges-header")}
@@ -93,6 +93,7 @@ const CentralizedExchanges = ({
           placeholder={placeholderString}
           isSearchable
           variant="outline"
+          className="z-50"
         />
       </div>
       {!hasSelectedCountry && (

src/components/DocsNav.tsx

@@ -1,30 +1,29 @@
+import { FaChevronLeft, FaChevronRight } from "react-icons/fa"
+
 import { TranslationKey } from "@/lib/types"
 import type { DeveloperDocsLink } from "@/lib/interfaces"
 
-import Emoji from "@/components/Emoji"
+import { BaseLink } from "@/components/ui/Link"
 
 import { cn } from "@/lib/utils/cn"
 import { trackCustomEvent } from "@/lib/utils/matomo"
 
 import docLinks from "@/data/developer-docs-links.yaml"
 
-import { Stack } from "./ui/flex"
-import { LinkBox, LinkOverlay } from "./ui/link-box"
-
 import { useRtlFlip } from "@/hooks/useRtlFlip"
 import { useTranslation } from "@/hooks/useTranslation"
 import { usePathname } from "@/i18n/routing"
 
 const TextDiv = ({ children, className, ...props }) => (
-  <Stack
+  <div
     className={cn(
-      "h-full max-w-[166px] justify-between gap-0 break-words p-4",
+      "flex h-full w-full flex-col justify-center break-words p-4",
       className
     )}
     {...props}
   >
     {children}
-  </Stack>
+  </div>
 )
 
 type DocsArrayProps = {
@@ -40,43 +39,45 @@ type CardLinkProps = {
 
 const CardLink = ({ docData, isPrev, contentNotTranslated }: CardLinkProps) => {
   const { t } = useTranslation("page-developers-docs")
-  const { isRtl } = useRtlFlip()
+  const { twFlipForRtl } = useRtlFlip()
 
   return (
-    <LinkBox
+    <BaseLink
+      href={docData.href}
       className={cn(
-        "flex w-full flex-1 items-center no-underline",
-        "h-[82px] rounded-sm border bg-background",
-        isPrev ? "justify-start" : "justify-end"
+        "group flex w-full items-center rounded-sm border border-primary bg-background !no-underline",
+        isPrev ? "justify-start" : "justify-end",
+        "hover:border-primary-hover"
       )}
+      rel={isPrev ? "prev" : "next"}
+      onClick={() => {
+        trackCustomEvent({
+          eventCategory: "next/previous article DocsNav",
+          eventAction: "click",
+          eventName: isPrev ? "previous" : "next",
+        })
+      }}
     >
-      <div className={cn("h-full p-4", isPrev ? "order-[0]" : "order-1")}>
-        <Emoji
-          text={isPrev ? ":point_left:" : ":point_right:"}
-          className={cn(
-            "text-5xl",
-            !contentNotTranslated && isRtl ? "-scale-x-100" : ""
-          )}
-        />
+      <div
+        className={cn(
+          "p-4",
+          isPrev ? "order-0" : "order-1",
+          !contentNotTranslated && twFlipForRtl
+        )}
+      >
+        {isPrev ? (
+          <FaChevronLeft className="text-xl group-hover:fill-primary-hover" />
+        ) : (
+          <FaChevronRight className="text-xl group-hover:fill-primary-hover" />
+        )}
       </div>
-      <TextDiv className={cn(!isPrev ? "pe-0 text-end" : "ps-0")}>
-        <p className="uppercase text-body">{t(isPrev ? "previous" : "next")}</p>
-        <LinkOverlay
-          href={docData.href}
-          onClick={() => {
-            trackCustomEvent({
-              eventCategory: "next/previous article DocsNav",
-              eventAction: "click",
-              eventName: isPrev ? "previous" : "next",
-            })
-          }}
-          className={cn("underline", isPrev ? "text-start" : "text-end")}
-          rel={isPrev ? "prev" : "next"}
-        >
-          {t(docData.id)}
-        </LinkOverlay>
+      <TextDiv className={cn(isPrev ? "ps-0" : "pe-0 text-end")}>
+        <p className="btn-txt !m-0 text-lg text-primary group-hover:text-primary-hover">
+          {t(isPrev ? "previous" : "next")}
+        </p>
+        <p className="!mb-0 text-sm no-underline">{t(docData.id)}</p>
       </TextDiv>
-    </LinkBox>
+    </BaseLink>
   )
 }
 
@@ -89,11 +90,11 @@ const DocsNav = ({ contentNotTranslated }: DocsNavProps) => {
   // Construct array of all linkable documents in order recursively
   const docsArray: DocsArrayProps[] = []
   const getDocs = (links: Array<DeveloperDocsLink>): void => {
+    // If object has 'items' key
     for (const item of links) {
-      // If object has 'items' key
+      // And if item has a 'to' key
+      // Add 'to' path and 'id' to docsArray
       if (item.items) {
-        // And if item has a 'to' key
-        // Add 'to' path and 'id' to docsArray
         item.href && docsArray.push({ href: item.href, id: item.id })
         // Then recursively add sub-items
         getDocs(item.items)
@@ -128,7 +129,7 @@ const DocsNav = ({ contentNotTranslated }: DocsNavProps) => {
       className={cn(
         "flex flex-col-reverse md:flex-row lg:flex-col-reverse xl:flex-row",
         "mt-8 justify-between gap-4",
-        "items-center md:items-start"
+        "items-stretch"
       )}
       aria-label="Paginate to document"
     >
@@ -139,15 +140,15 @@ const DocsNav = ({ contentNotTranslated }: DocsNavProps) => {
           isPrev
         />
       ) : (
-        <div className="hidden flex-grow xl:block"></div>
+        <div className="hidden flex-grow xl:block" />
       )}
       {nextDoc ? (
         <CardLink
           docData={nextDoc}
           contentNotTranslated={contentNotTranslated}
         />
       ) : (
-        <div className="hidden flex-grow xl:block"></div>
+        <div className="hidden flex-grow xl:block" />
       )}
     </nav>
   )