Merge pull request #232 from timlrx/fix/copy-code-block
Fix/copy code block
This commit is contained in:
Timothy
GitHub
commit
1ef1e5bda2
@ -24,6 +24,7 @@ Feature request? Check the past discussions to see if it has been brough up prev
|
||||
- [Aloisdg's cookbook](https://tambouille.vercel.app/) - with pictures and recipes!
|
||||
- [GautierArcin's demo with next translate](https://tailwind-nextjs-starter-blog-seven.vercel.app/) - includes translation of mdx posts, [source code](https://github.com/GautierArcin/tailwind-nextjs-starter-blog/tree/demo/next-translate)
|
||||
- [David Levai's digital garden](https://davidlevai.com/) - customized design and added email subscriptions
|
||||
- [Thinh's Corner](https://thinhcorner.com/) - [customized layout](https://github.com/Th1nhNg0/th1nhng0.vercel.app/blob/5e73a420828d82f01e7147512a2c3273c4ec19f8/layouts/PostLayout.js) with sticky side table of contents
|
||||
|
||||
Using the template? Feel free to create a PR and add your blog to this list.
|
||||
|
||||
@ -106,6 +107,8 @@ You can start editing the page by modifying `pages/index.js`. The page auto-upda
|
||||
|
||||
`tailwind.config.js` and `css/tailwind.css` - contain the tailwind stylesheet which can be modified to change the overall look and feel of the site.
|
||||
|
||||
`css/prism.css` - controls the styles associated with the code blocks. Feel free to customize it and use your preferred prismjs theme e.g. [prism themes](https://github.com/PrismJS/prism-themes).
|
||||
|
||||
`components/social-icons` - to add other icons, simply copy an svg file from [Simple Icons](https://simpleicons.org/) and map them in `index.js`. Other icons uses [heroicons](https://heroicons.com/).
|
||||
|
||||
`components/MDXComponents.js` - pass your own JSX code or React component by specifying it over here. You can then call them directly in the `.mdx` or `.md` file. By default, a custom link and image component is passed.
|
||||
|
||||
@ -14,7 +14,7 @@ const Pre = (props) => {
|
||||
}
|
||||
const onCopy = () => {
|
||||
setCopied(true)
|
||||
navigator.clipboard.writeText(textInput.current.innerText)
|
||||
navigator.clipboard.writeText(textInput.current.textContent)
|
||||
setTimeout(() => {
|
||||
setCopied(false)
|
||||
}, 2000)
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
---
|
||||
title: 'Introducing Tailwind Nextjs Starter Blog'
|
||||
date: '2021-01-12'
|
||||
lastmod: '2021-08-08'
|
||||
lastmod: '2021-09-08'
|
||||
tags: ['next-js', 'tailwind', 'guide']
|
||||
draft: false
|
||||
summary: 'Looking for a performant, out of the box template, with all the best in web technology to support your blogging needs? Checkout the Tailwind Nextjs Starter Blog template.'
|
||||
@ -29,6 +29,8 @@ Feature request? Check the past discussions to see if it has been brough up prev
|
||||
- [My personal blog](https://www.timlrx.com) - modified to auto-generate blog posts with dates
|
||||
- [Aloisdg's cookbook](https://tambouille.vercel.app/) - with pictures and recipes!
|
||||
- [GautierArcin's demo with next translate](https://tailwind-nextjs-starter-blog-seven.vercel.app/) - includes translation of mdx posts, [source code](https://github.com/GautierArcin/tailwind-nextjs-starter-blog/tree/demo/next-translate)
|
||||
- [David Levai's digital garden](https://davidlevai.com/) - customized design and added email subscriptions
|
||||
- [Thinh's Corner](https://thinhcorner.com/) - [customized layout](https://github.com/Th1nhNg0/th1nhng0.vercel.app/blob/5e73a420828d82f01e7147512a2c3273c4ec19f8/layouts/PostLayout.js) with sticky side table of contents
|
||||
|
||||
Using the template? Feel free to create a PR and add your blog to this list.
|
||||
|
||||
@ -111,6 +113,8 @@ You can start editing the page by modifying `pages/index.js`. The page auto-upda
|
||||
|
||||
`tailwind.config.js` and `css/tailwind.css` - contain the tailwind stylesheet which can be modified to change the overall look and feel of the site.
|
||||
|
||||
`css/prism.css` - controls the styles associated with the code blocks. Feel free to customize it and use your preferred prismjs theme e.g. [prism themes](https://github.com/PrismJS/prism-themes).
|
||||
|
||||
`components/social-icons` - to add other icons, simply copy an svg file from [Simple Icons](https://simpleicons.org/) and map them in `index.js`. Other icons uses [heroicons](https://heroicons.com/).
|
||||
|
||||
`components/MDXComponents.js` - pass your own JSX code or React component by specifying it over here. You can then call them directly in the `.mdx` or `.md` file. By default, a custom link and image component is passed.
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
---
|
||||
title: 'New features in v1'
|
||||
date: 2021-08-07T15:32:14Z
|
||||
date: 2021-09-08T15:32:14Z
|
||||
tags: ['next-js', 'tailwind', 'guide']
|
||||
draft: false
|
||||
summary: 'An overview of the new features released in v1 - code block copy, multiple authors, frontmatter layout and more'
|
||||
@ -38,6 +38,9 @@ Tailwind includes great default color palettes that can be used for theming your
|
||||
|
||||
Migrating from v1? You can revert to the previous theme by setting `primary` to `colors.sky` (Tailwind 2.2.2 and above, otherwise `colors.lightBlue`) and changing gray to `colors.coolGray`.
|
||||
|
||||
From v1.1.2+, you can also customize the style of your code blocks easily by modifying the `css/prism.css` stylesheet. Token classnames are compatible with prismjs
|
||||
so you can copy and adapt token styles from a prismjs stylesheet e.g. [prism themes](https://github.com/PrismJS/prism-themes).
|
||||
|
||||
## Xdm MDX compiler
|
||||
|
||||
We switched the MDX bundler from [next-mdx-remote](https://github.com/hashicorp/next-mdx-remote) to [mdx-bundler](https://github.com/kentcdodds/mdx-bundler).
|
||||
|
||||
6
package-lock.json
generated
6
package-lock.json
generated
@ -8243,9 +8243,9 @@
|
||||
}
|
||||
},
|
||||
"rehype-prism-plus": {
|
||||
"version": "0.1.0",
|
||||
"resolved": "https://registry.npmjs.org/rehype-prism-plus/-/rehype-prism-plus-0.1.0.tgz",
|
||||
"integrity": "sha512-fiWlSvK0txQnCqqJ4suI/WG/LIqNKXyG8gTujEe1KCX8suITmo6c9wVKd8Q00QrkKL8Q6KdbMWqK0AKz28ICjQ==",
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/rehype-prism-plus/-/rehype-prism-plus-1.0.0.tgz",
|
||||
"integrity": "sha512-CCMaW3n40FqBfAnl/hEyQqecRNETDTlWJ6SH6SEQhA8Fy2uJp58gK2VeYO1BOmwrliVckEliOVwt19RikRdV4A==",
|
||||
"requires": {
|
||||
"hast-util-to-html": "^8.0.1",
|
||||
"hast-util-to-string": "^2.0.0",
|
||||
|
||||
@ -29,7 +29,7 @@
|
||||
"reading-time": "1.3.0",
|
||||
"rehype-autolink-headings": "^6.0.0",
|
||||
"rehype-katex": "^6.0.0",
|
||||
"rehype-prism-plus": "^0.1.0",
|
||||
"rehype-prism-plus": "^1.0.0",
|
||||
"rehype-slug": "^5.0.0",
|
||||
"remark-footnotes": "^4.0.0",
|
||||
"remark-gfm": "^2.0.0",
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user