adding capability of inline code snippets

Author: prateekbh

package.json

@@ -1,7 +1,7 @@
 {
   "private": true,
   "name": "blog",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "license": "MIT",
   "scripts": {
     "start": "per-env",

src/routes/blog/formatted-code-block.js

@@ -2,12 +2,16 @@ import { h } from 'preact';
 import { useState } from 'preact/hooks';
 
 import { vs } from 'react-syntax-highlighter/dist/esm/styles/prism';
+import style from './style.css';
 
 export function FormattedCodeBlock(props) {
 	const [component, setComponent] = useState(null);
 	if (component) {
 		return component;
 	}
+	if (!props.class) {
+		return (<code class={style.inline}>{props.children}</code>);
+	}
 	throw new Promise(resolve => {
 		let language = null;
 		const highlighter = import('react-syntax-highlighter/dist/esm/prism-light');
@@ -29,6 +33,10 @@ export function FormattedCodeBlock(props) {
 				language = 'typescript';
 				languageSyntax = import('react-syntax-highlighter/dist/esm/languages/prism/typescript');
 				break;
+			default:
+				language = 'markdown';
+				languageSyntax = import('react-syntax-highlighter/dist/esm/languages/prism/markdown');
+				break;
 		}
 		Promise.all([highlighter, languageSyntax]).then(values => {
 			const [SyntaxHighlighter, languageHighlighter] = values.map(m => m ? m.default: null);

src/routes/blog/style.css

@@ -25,7 +25,7 @@
   text-decoration: underline;
 }
 
-.blogbody code {
+.blogbody pre code {
   display: block;
   max-width: 100%;
   color: rgb(57, 58, 52);
@@ -39,6 +39,14 @@
   line-height: 1.2em;
   tab-size: 4;
   hyphens: none;
+  overflow-x: scroll;
+}
+
+code.inline {
+  display: inline;
+  max-width: none;
+  background: #ddd;
+  padding: 0px 4px;
 }
 
 .blogbody pre pre {