egullickson/motovaultpro
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: remove colored hover fills from icon buttons (refs #51)
All checks were successful
Deploy to Staging / Build Images (pull_request) Successful in 2m53s
Details
Deploy to Staging / Deploy to Staging (pull_request) Successful in 38s
Details
Deploy to Staging / Verify Staging (pull_request) Successful in 6s
Details
Deploy to Staging / Notify Staging Ready (pull_request) Successful in 6s
Details
Deploy to Staging / Notify Staging Failure (pull_request) Has been skipped
Details

Browse Source 
Changed icon button hover behavior to match VehicleCard pattern:
- Removed background color fills on hover (was primary.main/error.main)
- Icons now use default MUI IconButton gray ripple on hover
- Edit icons use text.secondary color (matches VehicleCard)
- Delete icons use error.main color (matches VehicleCard)

Affected files:
- DocumentsPage.tsx
- FuelLogsList.tsx
- MaintenanceRecordsList.tsx
- MaintenanceSchedulesList.tsx

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Eric Gullickson
2026-01-18 12:21:44 -06:00
parent 5ad5ea12e6
commit 48aea409d8
4 changed files with 3 additions and 78 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
frontend/src/features/documents/pages/DocumentsPage.tsx
View File

@@ -232,15 +232,6 @@ export const DocumentsPage: React.FC = () => {
color: 'text.secondary',
minWidth: isMobile ? 48 : 'auto',
minHeight: isMobile ? 48 : 'auto',
'&:hover': {
backgroundColor: 'primary.main',
color: 'white',
},
...(isMobile && {
border: '1px solid',
borderColor: 'divider',
borderRadius: 2,
}),
}}
title="View Details"
>
@@ -253,15 +244,6 @@ export const DocumentsPage: React.FC = () => {
color: 'text.secondary',
minWidth: isMobile ? 48 : 'auto',
minHeight: isMobile ? 48 : 'auto',
'&:hover': {
backgroundColor: 'primary.main',
color: 'white',
},
...(isMobile && {
border: '1px solid',
borderColor: 'divider',
borderRadius: 2,
}),
}}
title="Edit"
>
@@ -274,15 +256,6 @@ export const DocumentsPage: React.FC = () => {
color: 'error.main',
minWidth: isMobile ? 48 : 'auto',
minHeight: isMobile ? 48 : 'auto',
'&:hover': {
backgroundColor: 'error.main',
color: 'white',
},
...(isMobile && {
border: '1px solid',
borderColor: 'error.main',
borderRadius: 2,
}),
}}
title="Delete"
>

14
frontend/src/features/fuel-logs/components/FuelLogsList.tsx
View File

@@ -208,15 +208,9 @@ export const FuelLogsList: React.FC<FuelLogsListProps> = ({ logs, onEdit, onDele
size={isMobile ? 'medium' : 'small'}
onClick={() => onEdit(log)}
sx={{
color: 'primary.main',
'&:hover': { backgroundColor: 'primary.main', color: 'white' },
color: 'text.secondary',
minWidth: isMobile ? 48 : 'auto',
minHeight: isMobile ? 48 : 'auto',
...(isMobile && {
border: '1px solid',
borderColor: 'primary.main',
borderRadius: 2
})
}}
>
<Edit fontSize={isMobile ? 'medium' : 'small'} />
@@ -228,14 +222,8 @@ export const FuelLogsList: React.FC<FuelLogsListProps> = ({ logs, onEdit, onDele
onClick={() => handleDeleteClick(log)}
sx={{
color: 'error.main',
'&:hover': { backgroundColor: 'error.main', color: 'white' },
minWidth: isMobile ? 48 : 'auto',
minHeight: isMobile ? 48 : 'auto',
...(isMobile && {
border: '1px solid',
borderColor: 'error.main',
borderRadius: 2
})
}}
>
<Delete fontSize={isMobile ? 'medium' : 'small'} />

20
frontend/src/features/maintenance/components/MaintenanceRecordsList.tsx
View File

@@ -157,18 +157,9 @@ export const MaintenanceRecordsList: React.FC<MaintenanceRecordsListProps> = ({
size={isMobile ? 'medium' : 'small'}
onClick={() => onEdit(record)}
sx={{
color: 'primary.main',
color: 'text.secondary',
minWidth: 44,
minHeight: 44,
'&:hover': {
backgroundColor: 'primary.main',
color: 'white',
},
...(isMobile && {
border: '1px solid',
borderColor: 'primary.main',
borderRadius: 2,
}),
}}
>
<Edit fontSize={isMobile ? 'medium' : 'small'} />
@@ -182,15 +173,6 @@ export const MaintenanceRecordsList: React.FC<MaintenanceRecordsListProps> = ({
color: 'error.main',
minWidth: 44,
minHeight: 44,
'&:hover': {
backgroundColor: 'error.main',
color: 'white',
},
...(isMobile && {
border: '1px solid',
borderColor: 'error.main',
borderRadius: 2,
}),
}}
>
<Delete fontSize={isMobile ? 'medium' : 'small'} />

20
frontend/src/features/maintenance/components/MaintenanceSchedulesList.tsx
View File

@@ -257,18 +257,9 @@ export const MaintenanceSchedulesList: React.FC<MaintenanceSchedulesListProps> =
size={isMobile ? 'medium' : 'small'}
onClick={() => onEdit(schedule)}
sx={{
color: 'primary.main',
color: 'text.secondary',
minWidth: 44,
minHeight: 44,
'&:hover': {
backgroundColor: 'primary.main',
color: 'white',
},
...(isMobile && {
border: '1px solid',
borderColor: 'primary.main',
borderRadius: 2,
}),
}}
>
<Edit fontSize={isMobile ? 'medium' : 'small'} />
@@ -282,15 +273,6 @@ export const MaintenanceSchedulesList: React.FC<MaintenanceSchedulesListProps> =
color: 'error.main',
minWidth: 44,
minHeight: 44,
'&:hover': {
backgroundColor: 'error.main',
color: 'white',
},
...(isMobile && {
border: '1px solid',
borderColor: 'error.main',
borderRadius: 2,
}),
}}
>
<Delete fontSize={isMobile ? 'medium' : 'small'} />