diff --git a/CHANGELOG.md b/CHANGELOG.md new file mode 100755 index 0000000..a2b82b9 --- /dev/null +++ b/CHANGELOG.md @@ -0,0 +1,21 @@ +# Changelog + +## 0.1.16 + +- add support for [EEx templates](https://hexdocs.pm/phoenix/templates.html), via [vscode-elixir](https://marketplace.visualstudio.com/items?itemName=mjmcloug.vscode-elixir) – thanks [@dhc02](https://github.com/dhc02) + +## 0.1.15 + +- add support for [leaf](https://github.com/vapor/leaf) files (#16) + +## 0.1.10 + +- add syntax definitions for `@apply` and `config()`: + + **Before:** + + Syntax highlighting before update + + **After:** + + Syntax highlighting after update diff --git a/README.md b/README.md new file mode 100755 index 0000000..f766281 --- /dev/null +++ b/README.md @@ -0,0 +1,50 @@ +# Tailwind CSS IntelliSense + +> [Tailwind CSS](https://tailwindcss.com/) class name completion for VS Code + +**[Get it from the VS Code Marketplace →](https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss)** + +HTML autocompletion + +## Features + +Tailwind CSS IntelliSense uses your projects Tailwind installation and configuration to provide suggestions as you type. + +It also includes features that improve the overall Tailwind experience, including improved syntax highlighting, and CSS previews. + +### HTML (including Vue, JSX, PHP etc.) + +- [Class name suggestions, including support for Emmet syntax](#class-name-suggestions-including-support-for-emmet-syntax) + - Suggestions include color previews where applicable, for example for text and background colors + - They also include a preview of the actual CSS for that class name +- [CSS preview when hovering over class names](#css-preview-when-hovering-over-class-names) + +### CSS + +- [Suggestions when using `@apply` and `config()`](#suggestions-when-using-apply-and-config) +- Suggestions when using the `@screen` directive +- [Improves syntax highlighting when using `@apply` and `config()`](#improves-syntax-highlighting-when-using-apply-and-config) + +## Examples + +#### Class name suggestions, including support for Emmet syntax + +HTML autocompletion + +#### CSS preview when hovering over class names + +HTML hover preview + +#### Suggestions when using `@apply` and `config()` + +CSS autocompletion + +#### Improves syntax highlighting when using `@apply` and `config()` + +Before: + +CSS syntax highlighting before + +After: + +CSS syntax highlighting after diff --git a/img/css-highlighting-after.png b/img/css-highlighting-after.png new file mode 100755 index 0000000..86a12fb Binary files /dev/null and b/img/css-highlighting-after.png differ diff --git a/img/css-highlighting-before.png b/img/css-highlighting-before.png new file mode 100755 index 0000000..2eeffdc Binary files /dev/null and b/img/css-highlighting-before.png differ diff --git a/img/css.gif b/img/css.gif new file mode 100755 index 0000000..e81904e Binary files /dev/null and b/img/css.gif differ diff --git a/img/html-hover.gif b/img/html-hover.gif new file mode 100755 index 0000000..94540b8 Binary files /dev/null and b/img/html-hover.gif differ diff --git a/img/html.gif b/img/html.gif new file mode 100755 index 0000000..8ffc7ff Binary files /dev/null and b/img/html.gif differ diff --git a/img/sublime/css.gif b/img/sublime/css.gif new file mode 100755 index 0000000..dae1b95 Binary files /dev/null and b/img/sublime/css.gif differ diff --git a/img/sublime/html.gif b/img/sublime/html.gif new file mode 100755 index 0000000..45d11b3 Binary files /dev/null and b/img/sublime/html.gif differ