fixing colors for links and buttons

Author: ahmedmustafamo

packages/react-renderer-demo/src/components/common/doc-link.js

@@ -16,6 +16,7 @@ export const NextLinkComposed = React.forwardRef(function NextLinkComposed(props
     <NextLink
       style={{
         textDecoration: 'none',
+        color: 'inherit'
       }}
       href={to}
       prefetch={prefetch}
@@ -94,7 +95,7 @@ const DocLink = React.forwardRef(function Link(props, ref) {
     return <NextLinkComposed className={className} ref={ref} {...nextjsProps} {...other} />;
   }
 
-  return <MuiLink sx={{ textDecoration: 'none' }} component={NextLinkComposed} className={className} ref={ref} {...nextjsProps} {...other} />;
+  return <MuiLink component={NextLinkComposed} className={className} ref={ref} {...nextjsProps} {...other} />;
 });
 
 DocLink.propTypes = {

packages/react-renderer-demo/src/components/component-example.js

@@ -251,7 +251,7 @@ const ComponentExample = ({ variants, schema, activeMapper, component, schemaVar
         onClick={() => push(`${pathname}?mapper=${mapper}${activeSchema ? `&schema=${activeSchema}` : ''}`)}
         className={clsx(classes.tab, { active: activeMapper === mapper })}
         label={
-          <DocLink href={`${pathname}?mapper=${mapper}${activeSchema ? `&schema=${activeSchema}` : ''}`}>
+          <DocLink style={{ textDecoration: 'none', color: 'inherit' }} href={`${pathname}?mapper=${mapper}${activeSchema ? `&schema=${activeSchema}` : ''}`}>
             <a href={`${pathname}?mapper=${mapper}${activeSchema ? `&schema=${activeSchema}` : ''}`} className={classes.tabLink}>
               {title}
             </a>