style(content): change font family for inline code

hendraaagil · Aug 12, 2022 · 18ea815 · 18ea815 · vercel · Aug 12, 2022
1 parent 080d003
commit 18ea815
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 0 deletions.
diff --git a/src/components/blog/MarkdownComponent.js b/src/components/blog/MarkdownComponent.js
@@ -31,6 +31,7 @@ const MarkdownComponent = ({ markdownContent }) => {
     <ReactMarkdown
       remarkPlugins={[gfm]}
       rehypePlugins={[rehypePrism]}
+      className="article-container"
       components={{
         a: ({ children, href }) => (
           <Link

diff --git a/src/pages/_app.js b/src/pages/_app.js
@@ -7,6 +7,7 @@ import { AnimatePresence, motion } from 'framer-motion';
 import SEO from 'next-seo.config';
 import theme from '@/styles/theme';
 import GlobalStyle from '@/styles/style';
+import '@/styles/css/globals.css';
 import '@/styles/css/nprogress.css';
 import '@/styles/css/prism-one-dark.css';
 

diff --git a/src/styles/css/globals.css b/src/styles/css/globals.css
@@ -0,0 +1,5 @@
+.article-container > p > code {
+  font-family: 'Fira Code', SFMono-Regular, Menlo, Monaco, Consolas,
+    'Liberation Mono', 'Courier New', monospace;
+  font-weight: 500;
+}