Detailed changes
@@ -3,7 +3,7 @@
The Agent Panel provides you with a way to interact with LLMs.
You can use it for various tasks, such as generating code, asking questions about your code base, and general inquiries such as emails and documentation.
-To open the Agent Panel, use the `agent: new thread` action in [the Command Palette](../getting-started.md#command-palette) or click the ✨ (sparkles) icon in the status bar.
+To open the Agent Panel, use the `agent: new thread` action in [the Command Palette](./getting-started.md#command-palette) or click the ✨ (sparkles) icon in the status bar.
If you're using the Agent Panel for the first time, you'll need to [configure at least one LLM provider](./configuration.md).
@@ -1,18 +1,19 @@
# CSS
-CSS support is available natively in Zed.
+Zed has built-in support for CSS.
- Tree-sitter: [tree-sitter/tree-sitter-css](https://github.com/tree-sitter/tree-sitter-css)
- Language Servers:
- [microsoft/vscode-html-languageservice](https://github.com/microsoft/vscode-html-languageservice)
- [tailwindcss-language-server](https://github.com/tailwindlabs/tailwindcss-intellisense)
-<!--
-TBD: Document CSS
-TBD: Document [Tailwind CSS](./tailwindcss.md)
--->
+## Tailwind CSS
-## See also:
+Zed also supports [Tailwind CSS](./tailwindcss.md) out-of-the-box for languages and frameworks like JavaScript, Astro, Svelte, and more.
+
+<!-- TBD: Document CS -->
+
+## Recommended Reading
- [HTML](./html.md)
- [TypeScript](./typescript.md)
@@ -5,9 +5,7 @@ HTML support is available through the [HTML extension](https://github.com/zed-in
- Tree-sitter: [tree-sitter/tree-sitter-html](https://github.com/tree-sitter/tree-sitter-html)
- Language Server: [microsoft/vscode-html-languageservice](https://github.com/microsoft/vscode-html-languageservice)
-This extension is automatically installed.
-
-If you do not want to use the HTML extension, you can add the following to your settings:
+This extension is automatically installed, but if you do not want to use it, you can add the following to your settings:
```json
{
@@ -19,9 +17,9 @@ If you do not want to use the HTML extension, you can add the following to your
## Formatting
-By default Zed uses [Prettier](https://prettier.io/) for formatting HTML
+By default Zed uses [Prettier](https://prettier.io/) for formatting HTML.
-You can disable `format_on_save` by adding the following to your Zed settings:
+You can disable `format_on_save` by adding the following to your Zed `settings.json`:
```json
"languages": {
@@ -31,11 +29,11 @@ You can disable `format_on_save` by adding the following to your Zed settings:
}
```
-You can still trigger formatting manually with {#kb editor::Format} or by opening the command palette ( {#kb commandPalette::Toggle} and selecting `Format Document`.
+You can still trigger formatting manually with {#kb editor::Format} or by opening [the Command Palette](..//getting-started.md#command-palette) ({#kb command_palette::Toggle}) and selecting "Format Document".
### LSP Formatting
-If you prefer you can use `vscode-html-language-server` instead of Prettier for auto-formatting by adding the following to your Zed settings:
+To use the `vscode-html-language-server` language server auto-formatting instead of Prettier, add the following to your Zed settings:
```json
"languages": {
@@ -45,7 +43,7 @@ If you prefer you can use `vscode-html-language-server` instead of Prettier for
}
```
-You can customize various [formatting options](https://code.visualstudio.com/docs/languages/html#_formatting) for `vscode-html-language-server` via Zed settings.json:
+You can customize various [formatting options](https://code.visualstudio.com/docs/languages/html#_formatting) for `vscode-html-language-server` via your Zed `settings.json`:
```json
"lsp": {
@@ -66,7 +64,7 @@ You can customize various [formatting options](https://code.visualstudio.com/doc
}
```
-## See also:
+## See also
- [CSS](./css.md)
- [JavaScript](./javascript.md)
@@ -7,7 +7,10 @@ JavaScript support is available natively in Zed.
## Code formatting
-Formatting on save is enabled by default for JavaScript, using TypeScript's built-in code formatting. But many JavaScript projects use other command-line code-formatting tools, such as [Prettier](https://prettier.io/). You can use one of these tools by specifying an _external_ code formatter for JavaScript in your settings. See [the configuration docs](../configuring-zed.md) for more information.
+Formatting on save is enabled by default for JavaScript, using TypeScript's built-in code formatting.
+But many JavaScript projects use other command-line code-formatting tools, such as [Prettier](https://prettier.io/).
+You can use one of these tools by specifying an _external_ code formatter for JavaScript in your settings.
+See [the configuration docs](../configuring-zed.md) for more information.
For example, if you have Prettier installed and on your `PATH`, you can use it to format JavaScript files by adding the following to your `settings.json`:
@@ -34,12 +37,12 @@ In JSX strings, the [`tailwindcss-language-server`](./tailwindcss.md) is used pr
## JSDoc
-Zed supports JSDoc syntax in JavaScript and TypeScript comments that match the JSDoc syntax. Zed uses [tree-sitter/tree-sitter-jsdoc](https://github.com/tree-sitter/tree-sitter-jsdoc) for parsing and highlighting JSDoc.
+Zed supports JSDoc syntax in JavaScript and TypeScript comments that match the JSDoc syntax.
+Zed uses [tree-sitter/tree-sitter-jsdoc](https://github.com/tree-sitter/tree-sitter-jsdoc) for parsing and highlighting JSDoc.
## ESLint
-You can configure Zed to format code using `eslint --fix` by running the ESLint
-code action when formatting:
+You can configure Zed to format code using `eslint --fix` by running the ESLint code action when formatting:
```json
{
@@ -7,7 +7,7 @@ Svelte support is available through the [Svelte extension](https://github.com/ze
## Extra theme styling configuration
-You can modify how certain styles such as directives and modifiers appear in attributes:
+You can modify how certain styles, such as directives and modifiers, appear in attributes:
```json
"syntax": {
@@ -24,7 +24,7 @@ You can modify how certain styles such as directives and modifiers appear in att
## Inlay Hints
-Zed sets the following initialization options for inlay hints:
+When inlay hints is enabled in Zed, to make the language server send them back, Zed sets the following initialization options:
```json
"inlayHints": {
@@ -51,9 +51,7 @@ Zed sets the following initialization options for inlay hints:
}
```
-to make the language server send back inlay hints when Zed has them enabled in the settings.
-
-Use
+To override these settings, use the following:
```json
"lsp": {
@@ -72,6 +70,4 @@ Use
}
```
-to override these settings.
-
-See https://github.com/microsoft/vscode/blob/main/extensions/typescript-language-features/package.json for more information.
+See [the TypeScript language server `package.json`](https://github.com/microsoft/vscode/blob/main/extensions/typescript-language-features/package.json) for more information.
@@ -12,7 +12,7 @@ TBD: Document the difference between Language servers
## Language servers
-By default Zed uses [vtsls](https://github.com/yioneko/vtsls) for TypeScript, TSX and JavaScript files.
+By default Zed uses [vtsls](https://github.com/yioneko/vtsls) for TypeScript, TSX, and JavaScript files.
You can configure the use of [typescript-language-server](https://github.com/typescript-language-server/typescript-language-server) per language in your settings file:
```json
@@ -65,12 +65,9 @@ Prettier will also be used for TypeScript files by default. To disable this:
## Inlay Hints
-Zed sets the following initialization options to make the language server send back inlay hints
-(that is, when Zed has inlay hints enabled in the settings).
+Zed sets the following initialization options to make the language server send back inlay hints (that is, when Zed has inlay hints enabled in the settings).
-You can override these settings in your Zed settings file.
-
-When using `typescript-language-server`:
+You can override these settings in your Zed `settings.json` when using `typescript-language-server`:
```json
{