feat: apply RichText to content sections and experience cards
ExperienceCard description switches from a plain <p> to RichText so rich-text HTML from PocketBase renders correctly. BioSection and IntroSection drop the prose class overrides — RichText handles typography consistently.
This commit is contained in:
@@ -50,10 +50,10 @@ describe('ExperienceCard', () => {
|
|||||||
expect(company).toHaveClass('opacity-80');
|
expect(company).toHaveClass('opacity-80');
|
||||||
});
|
});
|
||||||
|
|
||||||
it('description paragraph has text-base and max-w-[700px]', () => {
|
it('description renders via RichText with rich-text class', () => {
|
||||||
render(<ExperienceCard {...DEFAULT_PROPS} />);
|
render(<ExperienceCard {...DEFAULT_PROPS} />);
|
||||||
const desc = screen.getByText('Built scalable frontend systems.');
|
const desc = screen.getByText('Built scalable frontend systems.');
|
||||||
expect(desc).toHaveClass('text-base', 'max-w-[700px]');
|
expect(desc.closest('.rich-text')).toBeInTheDocument();
|
||||||
});
|
});
|
||||||
|
|
||||||
it('card has brutal-border class (from Card component)', () => {
|
it('card has brutal-border class (from Card component)', () => {
|
||||||
|
|||||||
@@ -1,4 +1,4 @@
|
|||||||
import { Card } from '$shared/ui';
|
import { Card, RichText } from '$shared/ui';
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
/**
|
/**
|
||||||
@@ -36,7 +36,7 @@ export function ExperienceCard({ title, company, period, description, className
|
|||||||
</div>
|
</div>
|
||||||
<span className="brutal-border px-4 py-2 bg-blue text-cream text-sm self-start">{period}</span>
|
<span className="brutal-border px-4 py-2 bg-blue text-cream text-sm self-start">{period}</span>
|
||||||
</div>
|
</div>
|
||||||
<p className="text-base max-w-[700px]">{description}</p>
|
<RichText html={description} />
|
||||||
</Card>
|
</Card>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -14,5 +14,5 @@ export default async function BioSection() {
|
|||||||
notFound();
|
notFound();
|
||||||
}
|
}
|
||||||
|
|
||||||
return <RichText html={data.content} className="prose prose-lg max-w-none" />;
|
return <RichText html={data.content} />;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -14,5 +14,5 @@ export default async function IntroSection() {
|
|||||||
notFound();
|
notFound();
|
||||||
}
|
}
|
||||||
|
|
||||||
return <RichText html={data.content} className="prose prose-lg max-w-none" />;
|
return <RichText html={data.content} />;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user