Here is a snippet of the Next.js code I am working on:
import ReactMarkdown from 'react-markdown'
import gfm from 'remark-gfm'
import styles from './content.module.css'
return (
<article className={styles.markdownbody}> // here
<ReactMarkdown remarkPlugins={[gfm]}>
{props.markdown}
</ReactMarkdown>
</article>
)
Below is a portion of my CSS stylesheet:
.markdown-body {
color-scheme: dark;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
margin: 0;
color: #e6edf3;
background-color: #0d1117;
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";
font-size: 16px;
line-height: 1.5;
word-wrap: break-word;
}
I have tried using className as styles.markdownbody, styles.markdown_body, styles.markdownBody, styles.markdown-body but it's not working. Any suggestions on what it should be?
The different attempts I've made with classname are not producing the desired outcome.