DPO3DPKRT-811/invalid use of 'auto' for 'color' CSS properties (#598)

Smithsonian · Jun 7, 2024 · b52df5a · b52df5a
1 parent 8f28c6f
commit b52df5a
Show file tree

Hide file tree

Showing 7 changed files with 11 additions and 10 deletions.
diff --git a/client/src/components/controls/IndentedReadOnlyRow.tsx b/client/src/components/controls/IndentedReadOnlyRow.tsx
@@ -20,7 +20,7 @@ const useStyles = makeStyles(({ palette, spacing }) => ({
         backgroundColor: ({ required, error }: IndentedReadOnlyRowProps) => (error ? fade(palette.error.light, 0.3) : required ? palette.primary.light : palette.secondary.light)
     },
     label: {
-        color: 'auto',
+        color: palette.primary.dark,
         gridColumnStart: 2,
         gridColumnEnd: 3
     },

diff --git a/client/src/components/controls/LabelTooltipText.tsx b/client/src/components/controls/LabelTooltipText.tsx
@@ -3,7 +3,7 @@ import { makeStyles } from '@material-ui/core/styles';
 import { Typography, TypographyProps, Tooltip, PropTypes } from '@material-ui/core';
 import { HelpOutline } from '@material-ui/icons';
 
-const useStyles = makeStyles(({ spacing }) => ({
+const useStyles = makeStyles(({ palette, spacing }) => ({
     container: {
         display: 'flex',
         padding: ({ padding }: LabelTooltipTextProps ) => padding ? padding : '0px 10px',
@@ -14,7 +14,7 @@ const useStyles = makeStyles(({ spacing }) => ({
         //backgroundColor: ({ required, error }: LabelTooltipTextProps ) => (error ? fade(palette.error.light, 0.3) : required ? palette.primary.light : palette.secondary.light)
     },
     label: {
-        color: 'auto'
+        color: palette.primary.dark
     },
     loading: {
         position: 'absolute',

diff --git a/client/src/components/shared/FieldType.tsx b/client/src/components/shared/FieldType.tsx
@@ -21,7 +21,7 @@ const useStyles = makeStyles(({ palette, spacing }) => ({
         backgroundColor: ({ required, error }: FieldTypeProps) => (error ? fade(palette.error.light, 0.3) : required ? '0' : palette.primary.light)
     },
     label: {
-        color: 'auto'
+        color: palette.primary.dark
     },
     loading: {
         position: 'absolute',

diff --git a/client/src/pages/Ingestion/components/Metadata/Scene/SceneDataForm.tsx b/client/src/pages/Ingestion/components/Metadata/Scene/SceneDataForm.tsx
@@ -38,13 +38,13 @@ const useStyles = makeStyles(({ typography, palette }) => ({
     },
     tableCell: {
         border: 'none',
-        padding: '1px 10px'
+        padding: '1px 10px',
     },
     tableRow: {
         height: '26.5px'
     },
     blueRow: {
-        backgroundColor: palette.primary.light
+        backgroundColor: palette.primary.light,
     },
     yellowRow: {
         backgroundColor: palette.secondary.light

diff --git a/client/src/pages/Repository/components/DetailsView/DetailsTab/CaptureDataDetails.tsx b/client/src/pages/Repository/components/DetailsView/DetailsTab/CaptureDataDetails.tsx
@@ -53,7 +53,7 @@ export const useStyles = makeStyles(({ palette, typography, breakpoints }) => ({
         fontSize: '0.8rem'
     },
     labelText: {
-        color: 'auto',
+        color: palette.primary.dark,
         fontSize: '0.8rem'
     },
     select: {

diff --git a/client/src/pages/Repository/components/DetailsView/DetailsTab/ModelDetails.tsx b/client/src/pages/Repository/components/DetailsView/DetailsTab/ModelDetails.tsx
@@ -64,7 +64,7 @@ export const useStyles = makeStyles(({ palette, typography }) => createStyles({
     detailsContainer: {
     },
     label: {
-        color: 'auto'
+        color: palette.primary.dark
     },
     input: {
         width: 'fit-content',
@@ -248,7 +248,7 @@ function SelectField(props: SelectFieldProps): React.ReactElement {
     return (
         <div style={{ display: 'grid', gridTemplateColumns: '120px calc(100% - 120px)', gridColumnGap: 5, padding: '3px 10px 3px 10px', height: 20 }}>
             <div style={{ gridColumnStart: 1, gridColumnEnd: 2 }}>
-                <Typography style={{ color: 'auto' }} variant='caption'>
+                <Typography style={{ color: 'black' }} variant='caption'>
                     {label}
                 </Typography>
             </div>

diff --git a/client/src/pages/Repository/components/DetailsView/DetailsTab/SceneDetails.tsx b/client/src/pages/Repository/components/DetailsView/DetailsTab/SceneDetails.tsx
@@ -34,7 +34,8 @@ export const useStyles = makeStyles(({ palette }) => ({
             '&:not(:last-child)': {
                 borderBottom: '1px solid #D8E5EE'
             }
-        }
+        },
+        color: palette.primary.dark
     }
 }));