diff --git a/package.json b/package.json index c17cbb0cfda..5054be5f722 100644 --- a/package.json +++ b/package.json @@ -114,8 +114,9 @@ }, "version": "0.0.0", "dependencies": { + "autoprefixer": "^10.4.0", "jsonfile": "^6.1.0", - "postcss": "^8.4.4", - "tailwindcss": "^3.0.1" + "postcss": "^8.4.5", + "tailwindcss": "^3.0.7" } } diff --git a/packages/freesewing.dev/package.json b/packages/freesewing.dev/package.json index fccb37d52e4..8eab04a1b19 100644 --- a/packages/freesewing.dev/package.json +++ b/packages/freesewing.dev/package.json @@ -16,12 +16,14 @@ "@mdx-js/mdx": "^2.0.0-rc.2", "@mdx-js/react": "^2.0.0-rc.2", "@mdx-js/runtime": "next", + "@tailwindcss/typography": "^0.5.0", "daisyui": "^1.16.2", "lodash.get": "^4.4.2", "lodash.orderby": "^4.6.0", "lodash.set": "^4.3.2", "next": "latest", "react-swipeable": "^6.2.0", + "rehype-highlight": "^5.0.1", "remark-gfm": "^3.0.1", "remark-jargon": "^2.19.5" }, diff --git a/packages/freesewing.dev/pages/[...mdxslug].js b/packages/freesewing.dev/pages/[...mdxslug].js index d0c2eb710bf..cc1dee6c702 100644 --- a/packages/freesewing.dev/pages/[...mdxslug].js +++ b/packages/freesewing.dev/pages/[...mdxslug].js @@ -35,6 +35,7 @@ import mdxLoader from 'shared/mdx/loader' */ import MdxWrapper from 'shared/components/wrappers/mdx' +import ThemePicker from 'shared/components/theme-picker.js' /* * The NextJS page object @@ -55,6 +56,7 @@ const MdxPage = props => { */ return ( + ) diff --git a/packages/freesewing.shared/components/mdx/highlight.js b/packages/freesewing.shared/components/mdx/highlight.js new file mode 100644 index 00000000000..429c9a9b500 --- /dev/null +++ b/packages/freesewing.shared/components/mdx/highlight.js @@ -0,0 +1,26 @@ +const names = { + js: 'javascript' +} + +const Highlight = ({ + children=[], + className='language-js', + lang='js' +}) => { + + const language = lang + ? lang + : (className === '') ? 'js' : className.split('-').pop() + + return ( +
+
+ {names[language] ? names[language] : language} +
+
{children}
+
+ ) +} + +export default Highlight + diff --git a/packages/freesewing.shared/components/elements/in-mdx.js b/packages/freesewing.shared/components/mdx/note.js similarity index 100% rename from packages/freesewing.shared/components/elements/in-mdx.js rename to packages/freesewing.shared/components/mdx/note.js diff --git a/packages/freesewing.shared/components/mdx/youtube.js b/packages/freesewing.shared/components/mdx/youtube.js new file mode 100644 index 00000000000..f0e024927e5 --- /dev/null +++ b/packages/freesewing.shared/components/mdx/youtube.js @@ -0,0 +1,31 @@ +const YouTube = (props) => { + return ( +
+