diff --git a/products/statement-generator/src/components/FAQAccordion.tsx b/products/statement-generator/src/components/FAQAccordion.tsx index f01c86f8..f5304866 100644 --- a/products/statement-generator/src/components/FAQAccordion.tsx +++ b/products/statement-generator/src/components/FAQAccordion.tsx @@ -21,12 +21,14 @@ const useStyles = makeStyles(({ palette }) => color: palette.primary.darker, boxShadow: 'none', border: 'none', - position: 'static', // when position is 'relative' or not specified a vertical line appears above the accordion (unclear why) + position: 'static', + '& a': { + color: palette.primary.darker, + }, }, accordionSummary: { fontSize: '20px', lineHeight: '24px', - color: palette.primary.darker, }, expandIcon: { marginLeft: '0', diff --git a/products/statement-generator/src/components/LinkAsText.tsx b/products/statement-generator/src/components/LinkAsText.tsx index 80052bb3..56cfb63a 100644 --- a/products/statement-generator/src/components/LinkAsText.tsx +++ b/products/statement-generator/src/components/LinkAsText.tsx @@ -1,26 +1,15 @@ import React from 'react'; import { makeStyles, createStyles, Link } from '@material-ui/core'; -const useStyles = makeStyles(() => +const useStyles = makeStyles(({ palette }) => createStyles({ linkAsText: { - color: '#25003F', - '&:visited': { - color: '#25003F', // Same color for visited links - }, - '&:hover': { - color: '#25003F', // Same color on hover - }, + color: palette.common.black, }, }) ); -interface LinkAsTextProps { - link: string; - label?: string; -} - -export default function LinkAsText({ link, label }: LinkAsTextProps) { +export default function LinkAsText({ link }: any) { const classes = useStyles(); return ( <> @@ -30,9 +19,8 @@ export default function LinkAsText({ link, label }: LinkAsTextProps) { className={classes.linkAsText} href={link} target="_blank" - rel="noopener noreferrer" > - {label || link} + {link}