diff --git a/.vscodeignore b/.vscodeignore index a3f018c6..92c746d9 100644 --- a/.vscodeignore +++ b/.vscodeignore @@ -2,7 +2,7 @@ */** !node_modules/** !.vscodeignore -!images/icon.png +!images/** !lib/* !CHANGELOG.md !LICENSE diff --git a/CHANGELOG.md b/CHANGELOG.md index 1cfaee0d..0285a520 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,10 @@ ## [Unreleased] +### Changed + +- Update toolbar icon to match VS Code outline style ([#105](https://github.com/marp-team/marp-vscode/pull/105)) + ## v0.11.1 - 2019-11-17 ### Added diff --git a/README.md b/README.md index bc2740cb..bd2b53a5 100644 --- a/README.md +++ b/README.md @@ -10,7 +10,7 @@ We will enhance your VS Code as the slide deck writer. Mark `marp: true`, and write your deck!

- +

See the documentation of [Marpit Markdown](https://marpit.marp.app/markdown) and [the features of Marp Core](https://github.com/marp-team/marp-core#features) about how to write. @@ -33,10 +33,10 @@ marp: true Start writing! ``` -It also can toggle by opening the quick picker from toolbar icon and selecting **"Toggle Marp preview for current Markdown"**. (`markdown.marp.toggleMarpPreview`). +It also can toggle by opening the quick picker from toolbar icon and selecting **"Toggle Marp preview for current Markdown"**. (`markdown.marp.toggleMarpPreview`).

- Toggle Marp preview + Toggle Marp preview

## Features @@ -49,10 +49,10 @@ Marp for VS Code can preview your Marp Markdown with the same way as [a native M We have integrated [Marp CLI][marp-cli] to export your deck into several formats. -To export the content of active Markdown editor, open the quick pick from Marp icon on toolbar and select **"Export slide deck..."**. (`markdown.marp.export`) +To export the content of active Markdown editor, open the quick pick from Marp icon on toolbar and select **"Export slide deck..."**. (`markdown.marp.export`)

- Export slide deck + Export slide deck

You can also execute command from the Command Palette (F1 or Ctrl/Cmd+Shift+P). @@ -109,7 +109,7 @@ theme: your-theme Markdown preview will reload updated theme CSS automatically when you edited the registered local CSS file. It's very useful for creating your own theme.

- Use custom theme + Use custom theme

### Outline view for each slide @@ -117,7 +117,7 @@ Markdown preview will reload updated theme CSS automatically when you edited the We extend [a native outline view](https://code.visualstudio.com/docs/languages/markdown#_outline-view) to support slide pages in Marp Markdown.

- Outline view for each slide + Outline view for each slide

> ℹ️ Please choose `Sort By: Position` from context menu of its panel if you see incorrect slide order. @@ -127,7 +127,7 @@ We extend [a native outline view](https://code.visualstudio.com/docs/languages/m You can fold the content of slide in editor while editing Marp Markdown.

- Slide folding in editor + Slide folding in editor

### Enable HTML in Marp Markdown diff --git a/images/custom-theme.gif b/docs/custom-theme.gif similarity index 100% rename from images/custom-theme.gif rename to docs/custom-theme.gif diff --git a/docs/example.md b/docs/example.md new file mode 100644 index 00000000..f221720c --- /dev/null +++ b/docs/example.md @@ -0,0 +1,31 @@ +--- +marp: true +theme: uncover +_class: invert +--- + +![w:160](https://marp.app/assets/marp-logo.svg) + +# **Marp for VS Code** + +## Create slide deck written in [Marp] Markdown on VS Code + +We will enhance your VS Code as the slide deck writer. Mark `marp: true`, and write your deck! + +[marp]: https://marp.app/ + +--- + +## Usage + +Marp preview for Markdown document will be enabled when `marp: true` is written in front-matter. + +```markdown +--- +marp: true +--- + +# Your slide deck + +Start writing! +``` diff --git a/images/export.gif b/docs/export.gif similarity index 100% rename from images/export.gif rename to docs/export.gif diff --git a/images/fold.gif b/docs/fold.gif similarity index 100% rename from images/fold.gif rename to docs/fold.gif diff --git a/images/outline.png b/docs/outline.png similarity index 100% rename from images/outline.png rename to docs/outline.png diff --git a/docs/screenshot.png b/docs/screenshot.png new file mode 100644 index 00000000..565302de Binary files /dev/null and b/docs/screenshot.png differ diff --git a/images/toggle.gif b/docs/toggle.gif similarity index 100% rename from images/toggle.gif rename to docs/toggle.gif diff --git a/images/icon-dark.svg b/images/icon-dark.svg new file mode 100644 index 00000000..d556c3ff --- /dev/null +++ b/images/icon-dark.svg @@ -0,0 +1 @@ + diff --git a/images/icon-light.svg b/images/icon-light.svg new file mode 100644 index 00000000..99796269 --- /dev/null +++ b/images/icon-light.svg @@ -0,0 +1 @@ + diff --git a/images/screenshot.png b/images/screenshot.png deleted file mode 100644 index 99acefa7..00000000 Binary files a/images/screenshot.png and /dev/null differ diff --git a/package.json b/package.json index 9f016ceb..0457bae5 100644 --- a/package.json +++ b/package.json @@ -56,8 +56,8 @@ "command": "markdown.marp.showQuickPick", "title": "Show quick pick of Marp commands...", "icon": { - "dark": "./images/icon.png", - "light": "./images/icon.png" + "dark": "./images/icon-dark.svg", + "light": "./images/icon-light.svg" } }, {