diff --git a/plugins/catalog/src/components/CatalogPage/CatalogPage.tsx b/plugins/catalog/src/components/CatalogPage/CatalogPage.tsx index 2a3746b707..8c9313ca66 100644 --- a/plugins/catalog/src/components/CatalogPage/CatalogPage.tsx +++ b/plugins/catalog/src/components/CatalogPage/CatalogPage.tsx @@ -25,7 +25,13 @@ import { } from '@backstage/core'; import CatalogLayout from './CatalogLayout'; import { rootRoute as scaffolderRootRoute } from '@backstage/plugin-scaffolder'; -import { Button, Link, makeStyles, Typography } from '@material-ui/core'; +import { + Button, + Link, + makeStyles, + Typography, + withStyles, +} from '@material-ui/core'; import Edit from '@material-ui/icons/Edit'; import GitHub from '@material-ui/icons/GitHub'; import Star from '@material-ui/icons/Star'; @@ -113,6 +119,12 @@ export const CatalogPage: FC<{}> = () => { const styles = useStyles(); + const YellowStar = withStyles({ + root: { + color: '#f3ba37', + }, + })(Star); + const actions = [ (rowData: Entity) => { const location = findLocationForEntityMeta(rowData.metadata); @@ -152,7 +164,7 @@ export const CatalogPage: FC<{}> = () => { (rowData: Entity) => { const isStarred = isStarredEntity(rowData); return { - icon: isStarred ? Star : StarOutline, + icon: isStarred ? YellowStar : StarOutline, tooltip: isStarred ? 'Remove from favorites' : 'Add to favorites', onClick: () => toggleStarredEntity(rowData), };