fix: reduce gauge radius to prevent arc overlap and update CTA copy
- Shrink gauge radius from 65 to 58 and adjust center to prevent the arc from overlapping the multicolor reference bar - Change CTA text from "Analyze my reviews" to "Analyze my business" across all instances (EN/ES) Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -101,10 +101,10 @@ type Tab = (typeof TABS)[number];
|
||||
|
||||
function ScoreTab() {
|
||||
const { t } = useTranslation("marketing");
|
||||
const radius = 65;
|
||||
const radius = 58;
|
||||
const stroke = 10;
|
||||
const cx = 100;
|
||||
const cy = 72;
|
||||
const cy = 68;
|
||||
const circumference = Math.PI * radius;
|
||||
const offset = circumference - (SCORE / 100) * circumference;
|
||||
|
||||
@@ -116,12 +116,11 @@ function ScoreTab() {
|
||||
{t("reportPreview.demo.businessName")}
|
||||
</span>
|
||||
|
||||
<div className="relative" style={{ width: 200, height: 82 }}>
|
||||
<div className="relative" style={{ width: 200, height: 78 }}>
|
||||
<svg
|
||||
width="200"
|
||||
height="82"
|
||||
viewBox="0 0 200 82"
|
||||
className="overflow-visible"
|
||||
height="78"
|
||||
viewBox="0 0 200 78"
|
||||
>
|
||||
<circle
|
||||
cx={cx}
|
||||
@@ -152,7 +151,7 @@ function ScoreTab() {
|
||||
</svg>
|
||||
<div className="absolute inset-0 flex flex-col items-center justify-end pb-0">
|
||||
<span
|
||||
className="text-5xl font-bold tabular-nums"
|
||||
className="text-4xl font-bold tabular-nums"
|
||||
style={{ color: SCORE_COLOR }}
|
||||
>
|
||||
{SCORE}
|
||||
|
||||
Reference in New Issue
Block a user