)
diff --git a/src/components/FeedbackCard.tsx b/src/components/FeedbackCard.tsx
index 0c0de4eb010..563a7f652f8 100644
--- a/src/components/FeedbackCard.tsx
+++ b/src/components/FeedbackCard.tsx
@@ -69,7 +69,7 @@ const FeedbackCard = ({ prompt, isArticle, ...props }: FeedbackCardProps) => {
dir={dir}
>
-
{getTitle(feedbackSubmitted)}
+
{getTitle(feedbackSubmitted)}
{feedbackSubmitted && (
{t("feedback-widget-thank-you-subtitle")}{" "}
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
index 369e652c882..9277aa72eca 100644
--- a/src/components/Footer.tsx
+++ b/src/components/Footer.tsx
@@ -323,6 +323,7 @@ const Footer = ({ lastDeployLocaleTimestamp }: FooterProps) => {
variant="outline"
isSecondary
onClick={() => scrollIntoView("body")}
+ data-testid="footer-go-to-top"
>
diff --git a/src/components/Hero/ContentHero/ContentHero.stories.tsx b/src/components/Hero/ContentHero/ContentHero.stories.tsx
index a6767b46b31..785017be34c 100644
--- a/src/components/Hero/ContentHero/ContentHero.stories.tsx
+++ b/src/components/Hero/ContentHero/ContentHero.stories.tsx
@@ -5,6 +5,8 @@ import { langViewportModes } from "@/storybook/modes"
import ContentHeroComponent, { ContentHeroProps } from "."
+import heroImg from "@/public/images/upgrades/merge.png"
+
const meta = {
title: "Organisms / Layouts / Hero",
component: ContentHeroComponent,
@@ -55,9 +57,7 @@ export const ContentHero: StoryObj = {
return (
, "header">
+export type ContentHeroProps = Omit<
+ CommonHeroProps,
+ "header" | "blurDataURL"
+> & {
+ blurDataURL?: CommonHeroProps["blurDataURL"]
+}
const ContentHero = (props: ContentHeroProps) => {
const { breadcrumbs, heroImg, buttons, title, description, blurDataURL } =
props
+ if (blurDataURL) heroImg.blurDataURL = blurDataURL
+
return (
-
-
-
-
+
+
+
+
+
+
+
+
{title}
+ {typeof description === "string" ? (
+
{description}
+ ) : (
+ description
+ )}
+ {buttons && (
+
+ {buttons.map((button, idx) => {
+ if (!button) return
+ // If it's a React element, render it directly
+ if (typeof button === "object" && "type" in button) {
+ return
{button as ReactElement}
+ }
+ // Otherwise, render as button props
+ return
+ })}
+
+ )}
-
-
-
- {title}
- {typeof description === "string" ? (
- {description}
- ) : (
- description
- )}
- {buttons && (
-
- {buttons.map((button, idx) => {
- if (!button) return
- // If it's a React element, render it directly
- if (typeof button === "object" && "type" in button) {
- return {button as ReactElement}
- }
- // Otherwise, render as button props
- return
- })}
-
- )}
-
- {/* TODO:
- * Add conditional Big Stat box here
- */}
-
+ {/* TODO:
+ * Add conditional Big Stat box here
+ */}
)
diff --git a/src/components/Homepage/LanguageMorpher.tsx b/src/components/Homepage/LanguageMorpher.tsx
index 12e91344664..09a44ff10fe 100644
--- a/src/components/Homepage/LanguageMorpher.tsx
+++ b/src/components/Homepage/LanguageMorpher.tsx
@@ -11,9 +11,12 @@ import {
MOBILE_LANGUAGE_BUTTON_NAME,
} from "@/lib/constants"
+import { useIsClient } from "@/hooks/useIsClient"
import { useMediaQuery } from "@/hooks/useMediaQuery"
const LanguageMorpher = () => {
+ const isClient = useIsClient()
+
const handleMobileClick = () => {
;(document.getElementById(HAMBURGER_BUTTON_ID) as HTMLButtonElement).click()
setTimeout(
@@ -36,10 +39,14 @@ const LanguageMorpher = () => {
const [isLarge] = useMediaQuery([`(min-width: ${screens.md})`])
+ // Use fallback value during SSR to prevent hydration mismatch
+ // Default to false (mobile) during SSR, then use actual value on client
+ const isLargeScreen = isClient && isLarge
+
return (