Polish page QA experience issues

This commit is contained in:
Codex
2026-04-28 01:20:54 +08:00
parent 46a72f815e
commit 8697aa3fbb
2 changed files with 28 additions and 26 deletions
@@ -183,6 +183,7 @@ function ReviewCard({ item, locale }: { item: ProductReview; locale: Locale }) {
const sourceName = truncateSourceName(item.sourceName) const sourceName = truncateSourceName(item.sourceName)
return ( return (
<article className="h-full">
<a <a
href={item.reviewUrl} href={item.reviewUrl}
target="_blank" target="_blank"
@@ -206,6 +207,7 @@ function ReviewCard({ item, locale }: { item: ProductReview; locale: Locale }) {
</div> </div>
</div> </div>
</a> </a>
</article>
) )
} }
@@ -58,8 +58,8 @@ export function FaqBrowser({
const totalCount = groups.reduce((total, group) => total + group.faqs.length, 0) const totalCount = groups.reduce((total, group) => total + group.faqs.length, 0)
return ( return (
<div className="grid gap-8 lg:grid-cols-[300px,minmax(0,1fr)] lg:items-start"> <div className="grid min-w-0 gap-8 lg:grid-cols-[300px,minmax(0,1fr)] lg:items-start">
<aside className="lg:sticky lg:top-24"> <aside className="min-w-0 lg:sticky lg:top-24">
<div className="border-b border-black/10 pb-5"> <div className="border-b border-black/10 pb-5">
<div className="text-[12px] font-medium uppercase tracking-[0.24em] text-black/42"> <div className="text-[12px] font-medium uppercase tracking-[0.24em] text-black/42">
{locale === 'zh' ? '检索' : 'Find Answers'} {locale === 'zh' ? '检索' : 'Find Answers'}
@@ -122,7 +122,7 @@ export function FaqBrowser({
</div> </div>
</aside> </aside>
<div> <div className="min-w-0">
<div className="mb-5 flex flex-col justify-between gap-3 border-b border-black/10 pb-5 md:flex-row md:items-end"> <div className="mb-5 flex flex-col justify-between gap-3 border-b border-black/10 pb-5 md:flex-row md:items-end">
<div> <div>
<div className="text-[12px] font-medium uppercase tracking-[0.24em] text-black/42"> <div className="text-[12px] font-medium uppercase tracking-[0.24em] text-black/42">
@@ -167,12 +167,12 @@ export function FaqBrowser({
{group.faqs.map((faq, index) => ( {group.faqs.map((faq, index) => (
<details <details
key={faq.id} key={faq.id}
className="group px-5 py-0 transition-colors open:bg-white md:px-7" className="group min-w-0 px-5 py-0 transition-colors open:bg-white md:px-7"
open={index === 0 && !deferredQuery} open={index === 0 && !deferredQuery}
> >
<summary className="cursor-pointer list-none py-5"> <summary className="cursor-pointer list-none py-5">
<div className="flex items-start justify-between gap-6"> <div className="flex items-start justify-between gap-6">
<h4 className="max-w-[760px] text-[18px] font-medium leading-7 tracking-[-0.025em] text-text-primary"> <h4 className="min-w-0 max-w-[760px] break-words text-[18px] font-medium leading-7 tracking-[-0.025em] text-text-primary">
{faq.question} {faq.question}
</h4> </h4>
<span className="mt-0.5 inline-flex h-8 w-8 shrink-0 items-center justify-center bg-subtle text-lg leading-none text-text-muted transition group-open:rotate-45 group-open:bg-black group-open:text-white"> <span className="mt-0.5 inline-flex h-8 w-8 shrink-0 items-center justify-center bg-subtle text-lg leading-none text-text-muted transition group-open:rotate-45 group-open:bg-black group-open:text-white">