These are the strings a user meets everywhere, mostly sr-only: the dialog and
sheet close buttons, pagination labels, carousel arrows, the breadcrumb ellipsis
and both colour-mode toggles. nav aria-label='pagination' became a real key too —
a screen reader announces it, so it is user-facing.
Logo alt text keeps the product name and translates only around it
('Logótipo Officer'). Arrow-button insets became logical (-start-12/-end-12).
The three 'useX must be used within <Y>' Errors are deliberately untouched:
never-translate, per the doc's list.
21 lines
528 B
TypeScript
21 lines
528 B
TypeScript
import { useTranslation } from '@/components/locales';
|
|
|
|
type SvgLogoProps = {
|
|
size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
};
|
|
|
|
export function OfficerIconLogo({ size = 'xl' }: SvgLogoProps) {
|
|
const { t } = useTranslation();
|
|
const config = sizeConfig[size];
|
|
|
|
return <img src="/officer-logo.svg" alt={t('logo.icon')} style={{ width: config.width, height: 'auto' }} />;
|
|
}
|
|
|
|
const sizeConfig = {
|
|
xs: { width: '120px' },
|
|
sm: { width: '200px' },
|
|
md: { width: '400px' },
|
|
lg: { width: '600px' },
|
|
xl: { width: '800px' },
|
|
};
|