mirror of https://github.com/sgoudham/carbon.git
move gatsby-remark-embed-carbon package to new repo
https://github.com/carbon-app/gatsby-remark-embed-carbonmain
parent
4535d5f937
commit
bb823c0450
@ -1,58 +0,0 @@
|
||||
# gatsby-remark-embed-carbon
|
||||
> Embed Carbon screenshots in your markdown files
|
||||
|
||||
## Getting started
|
||||
|
||||
1. Install plugin to your site:
|
||||
|
||||
```bash
|
||||
yarn add gatsby-remark-embed-carbon
|
||||
```
|
||||
|
||||
2. Add `gatsby-remark-embed-carbon` to your `gatsby-transformer-remark` plugins in `gatsby-config.js`:
|
||||
|
||||
```js
|
||||
plugins: [
|
||||
{
|
||||
resolve: 'gatsby-transformer-remark',
|
||||
options: {
|
||||
plugins: ['gatsby-remark-embed-carbon']
|
||||
}
|
||||
}
|
||||
];
|
||||
```
|
||||
|
||||
## Configuration
|
||||
|
||||
```js
|
||||
plugins: [
|
||||
{
|
||||
resolve: 'gatsby-transformer-remark',
|
||||
options: {
|
||||
plugins: [
|
||||
{
|
||||
resolve: 'gatsby-remark-embed-carbon',
|
||||
options: {
|
||||
width: '100%', // default is '1024px'
|
||||
height: '600px' // default is '473px'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
```
|
||||
|
||||
## Example
|
||||
Add a carbon screenshot directly in your markdown file:
|
||||
|
||||
```md
|
||||
# Blog Post
|
||||
|
||||
This link will get replaced with a Carbon iframe:
|
||||
|
||||
https://carbon.now.sh/?bg=red
|
||||
```
|
||||
|
||||
## Thanks
|
||||
This project was completely inspired by (copied from) @garetmckinley's [`gatsby-remark-embed-spotify`](https://github.com/garetmckinley/gatsby-remark-embed-spotify) :star:
|
@ -1,22 +0,0 @@
|
||||
const visit = require('unist-util-visit')
|
||||
|
||||
module.exports = ({ markdownAST }, { width = '1024px', height = '473px' } = {}) => {
|
||||
visit(markdownAST, 'text', node => {
|
||||
const { value } = node
|
||||
const match = /https:\/\/carbon\.now\.sh\/{0,1}(.*)/.exec(value)
|
||||
if (match) {
|
||||
const url = match[1]
|
||||
node.type = 'html'
|
||||
node.value = `<iframe
|
||||
src="https://carbon.now.sh/embed${url}"
|
||||
width="${width}"
|
||||
height="${height}"
|
||||
frameborder="0"
|
||||
style="transform:scale(0.7); border: 0; overflow:hidden;"
|
||||
sandbox="allow-scripts allow-same-origin">
|
||||
</iframe>`
|
||||
}
|
||||
})
|
||||
|
||||
return markdownAST
|
||||
}
|
@ -1,17 +0,0 @@
|
||||
{
|
||||
"name": "gatsby-remark-embed-carbon",
|
||||
"version": "0.0.1",
|
||||
"description": "Gatsby Remark Plugin for Embedding Carbon screenshots",
|
||||
"main": "index.js",
|
||||
"license": "MIT",
|
||||
"keywords": [
|
||||
"gatsby",
|
||||
"gatsby-plugin",
|
||||
"remark",
|
||||
"carbon"
|
||||
],
|
||||
"dependencies": {
|
||||
"unist-util-visit": "^1.1.3"
|
||||
},
|
||||
"scripts": {}
|
||||
}
|
@ -1,22 +0,0 @@
|
||||
# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
|
||||
# yarn lockfile v1
|
||||
|
||||
|
||||
unist-util-is@^2.1.2:
|
||||
version "2.1.2"
|
||||
resolved "https://registry.yarnpkg.com/unist-util-is/-/unist-util-is-2.1.2.tgz#1193fa8f2bfbbb82150633f3a8d2eb9a1c1d55db"
|
||||
integrity sha512-YkXBK/H9raAmG7KXck+UUpnKiNmUdB+aBGrknfQ4EreE1banuzrKABx3jP6Z5Z3fMSPMQQmeXBlKpCbMwBkxVw==
|
||||
|
||||
unist-util-visit-parents@^2.0.0:
|
||||
version "2.0.1"
|
||||
resolved "https://registry.yarnpkg.com/unist-util-visit-parents/-/unist-util-visit-parents-2.0.1.tgz#63fffc8929027bee04bfef7d2cce474f71cb6217"
|
||||
integrity sha512-6B0UTiMfdWql4cQ03gDTCSns+64Zkfo2OCbK31Ov0uMizEz+CJeAp0cgZVb5Fhmcd7Bct2iRNywejT0orpbqUA==
|
||||
dependencies:
|
||||
unist-util-is "^2.1.2"
|
||||
|
||||
unist-util-visit@^1.1.3:
|
||||
version "1.4.0"
|
||||
resolved "https://registry.yarnpkg.com/unist-util-visit/-/unist-util-visit-1.4.0.tgz#1cb763647186dc26f5e1df5db6bd1e48b3cc2fb1"
|
||||
integrity sha512-FiGu34ziNsZA3ZUteZxSFaczIjGmksfSgdKqBfOejrrfzyUy5b7YrlzT1Bcvi+djkYDituJDy2XB7tGTeBieKw==
|
||||
dependencies:
|
||||
unist-util-visit-parents "^2.0.0"
|
Loading…
Reference in New Issue