add accessibility text for SEO and screen readers in new UI components

This commit is contained in:
2026-05-01 16:48:38 +08:00
parent cab45fef93
commit c13cc437ae
6 changed files with 18 additions and 0 deletions

View File

@@ -192,6 +192,9 @@ function Advantages() {
animate={isMainInView ? { opacity: 1 } : { opacity: 0 }}
transition={{ duration: 0.8, ease: "easeOut" }}
>
<h2 style={{ position: 'absolute', width: '1px', height: '1px', padding: 0, margin: '-1px', overflow: 'hidden', clip: 'rect(0,0,0,0)', whiteSpace: 'nowrap', border: 0 }}>
Omega脂肪酸
</h2>
<Stack
position="relative"

View File

@@ -50,6 +50,9 @@ function Hero1() {
justifyContent={"center"}
pt={`${headerHeight}px`}
>
<h1 style={{ position: 'absolute', width: '1px', height: '1px', padding: 0, margin: '-1px', overflow: 'hidden', clip: 'rect(0,0,0,0)', whiteSpace: 'nowrap', border: 0 }}>
</h1>
{/* Global keyframes for all animations */}
<style>
{`

View File

@@ -12,6 +12,9 @@ function Hero2() {
justifyContent={"center"}
>
<h2 style={{ position: 'absolute', width: '1px', height: '1px', padding: 0, margin: '-1px', overflow: 'hidden', clip: 'rect(0,0,0,0)', whiteSpace: 'nowrap', border: 0 }}>
</h2>
<Stack gap={0}>
<Stack
position="relative"

View File

@@ -76,6 +76,9 @@ function Info() {
overflow="hidden"
justifyItems={'center'}
>
<h2 style={{ position: 'absolute', width: '1px', height: '1px', padding: 0, margin: '-1px', overflow: 'hidden', clip: 'rect(0,0,0,0)', whiteSpace: 'nowrap', border: 0 }}>
</h2>
<Stack alignItems={'center'} gap={{ base: 4, sm: 4, md: 6, lg: 8, xl: 8 }}>
<MotionImage
src='/images/new/info_title.webp'

View File

@@ -36,6 +36,9 @@ function OilInfo() {
animate={isMainInView ? { opacity: 1 } : { opacity: 0 }}
transition={{ duration: 0.8, ease: "easeOut" }}
>
<h2 style={{ position: 'absolute', width: '1px', height: '1px', padding: 0, margin: '-1px', overflow: 'hidden', clip: 'rect(0,0,0,0)', whiteSpace: 'nowrap', border: 0 }}>
調 調
</h2>
<MotionSimpleGrid
columns={{ base: 1, sm: 1, md: 2 }}

View File

@@ -125,6 +125,9 @@ function Truth() {
animate={isMainInView ? { opacity: 1 } : { opacity: 0 }}
transition={{ duration: 0.5, ease: "easeOut" }}
>
<h2 style={{ position: 'absolute', width: '1px', height: '1px', padding: 0, margin: '-1px', overflow: 'hidden', clip: 'rect(0,0,0,0)', whiteSpace: 'nowrap', border: 0 }}>
HKTVmall有售
</h2>
<MotionText
className='font-melle font-xbold'