a11y: fix CSS foundation - contrast, overflow, focus ring, reduced motion

This commit is contained in:
TypoGenie
2026-02-18 23:22:04 +02:00
parent 3b8e80c3a3
commit 7d5af9e39c
7 changed files with 58 additions and 26 deletions

View File

@@ -85,7 +85,7 @@ const FontList: React.FC<{ fonts: string[] }> = ({ fonts }) => {
};
return (
<div className="flex items-center gap-2 text-sm text-zinc-500">
<div className="flex items-center gap-2 text-sm text-zinc-400">
<span className="hidden md:inline">Fonts:</span>
<div className="flex gap-2 flex-wrap">
{fonts.map((font, index) => (
@@ -391,7 +391,7 @@ export const Preview: React.FC<PreviewProps> = ({
<ZoomControl zoom={uiZoom} onZoomChange={onZoomChange} />
<div className="h-4 w-px bg-zinc-800 hidden sm:block" />
<div className="flex items-center gap-4">
<span className="text-zinc-500 text-sm hidden sm:inline">Format: {paperSize}</span>
<span className="text-zinc-400 text-sm hidden sm:inline">Format: {paperSize}</span>
<motion.button
ref={saveButtonRef}
onClick={handleSave}