feat: add accessibility improvements
- Add keyboard navigation support (Enter/Space keys) - Add ARIA labels for screen readers - Add role and tabIndex attributes - Fix empty interface warning Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
07bb427eb6
commit
1c86244f2d
@ -7,11 +7,7 @@ import { useMyState } from '@/common';
|
||||
|
||||
const { Header } = Layout;
|
||||
|
||||
interface CustomHeaderProps {
|
||||
// Props interface reserved for future use
|
||||
}
|
||||
|
||||
export const CustomHeader: React.FC<CustomHeaderProps> = () => {
|
||||
export const CustomHeader: React.FC = () => {
|
||||
const { snap } = useMyState();
|
||||
|
||||
// 在登录页面不显示header
|
||||
|
||||
@ -34,6 +34,15 @@ const QuickActionIcons: React.FC = () => {
|
||||
<Tooltip key={action.path} title={action.title}>
|
||||
<div
|
||||
onClick={() => navigate(action.path)}
|
||||
role="button"
|
||||
tabIndex={0}
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === 'Enter' || e.key === ' ') {
|
||||
e.preventDefault();
|
||||
navigate(action.path);
|
||||
}
|
||||
}}
|
||||
aria-label={action.title}
|
||||
style={{
|
||||
fontSize: 20,
|
||||
color: '#262626',
|
||||
|
||||
@ -28,6 +28,15 @@ const QuickActionCard: React.FC<QuickActionCardProps> = ({
|
||||
<Card
|
||||
hoverable
|
||||
onClick={handleClick}
|
||||
tabIndex={0}
|
||||
role="button"
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === 'Enter' || e.key === ' ') {
|
||||
e.preventDefault();
|
||||
handleClick();
|
||||
}
|
||||
}}
|
||||
aria-label={`${title} - ${description}`}
|
||||
style={{
|
||||
width: '100%',
|
||||
height: 160,
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user