diff --git a/README.md b/README.md index 79a878a..e7ff631 100644 --- a/README.md +++ b/README.md @@ -22,6 +22,7 @@ There currently is a few configurable settings in the extension | `jsannotations.hideDiagnostics` | Hide red squiggles under invalid parameters | false | | `jsannotations.fontWeight` | Annotation styling of font-weight CSS property | "400" | | `jsannotations.fontStyle` | Font style for annotations. | "italic" | +| `jsannotations.borderRadius` | Annotation styling of border-radius CSS property in pixels | "5" | ## Themable Colors @@ -30,6 +31,7 @@ JS Annotations provides a single themable color being the color of what the anno | Name | Description | |------|-------------| | `jsannotations.annotationForeground` | Specifies the foreground color for the annotations | +| `jsannotations.annotationBackground` | Specifies the background color for the annotations | ## Contributors 👨‍💻 👩‍💻 diff --git a/package.json b/package.json index 6b33647..b0c28b9 100644 --- a/package.json +++ b/package.json @@ -79,6 +79,11 @@ ], "description": "Annotation styling of font-style CSS property" }, + "jsannotations.borderRadius": { + "type": "number", + "default": 5, + "description": "Annotation styling of border-radius CSS property in pixels" + }, "jsannotations.showFirstSpace": { "type": "boolean", "description": "Show leading whitespace for first parameter", @@ -96,6 +101,15 @@ "light": "#444", "highContrast": "#444" } + }, + { + "id": "jsannotations.annotationBackground", + "description": "Specifies the background color for the annotations", + "defaults": { + "dark": "#FFFFFF10", + "light": "#00000010", + "highContrast": "#00000010" + } } ], "keybindings": [ diff --git a/src/annotationProvider.ts b/src/annotationProvider.ts index 03c72ef..267b4ec 100644 --- a/src/annotationProvider.ts +++ b/src/annotationProvider.ts @@ -1,18 +1,23 @@ -import { DecorationInstanceRenderOptions, DecorationOptions, Range, ThemeColor, workspace } from "vscode"; +import { DecorationInstanceRenderOptions, DecorationOptions, DecorationRenderOptions, Range, ThemeColor, workspace } from "vscode"; export class Annotations { public static paramAnnotation(message: string, range: Range): DecorationOptions { + const getConfiguration = (section: string): string => + workspace.getConfiguration("jsannotations").get(section); + return { range, renderOptions: { before: { + backgroundColor: new ThemeColor("jsannotations.annotationBackground"), + borderRadius: getConfiguration("borderRadius") + "px", color: new ThemeColor("jsannotations.annotationForeground"), contentText: message, - fontStyle: workspace.getConfiguration("jsannotations").get("fontStyle"), - fontWeight: workspace.getConfiguration("jsannotations").get("fontWeight"), + fontStyle: getConfiguration("fontStyle"), + fontWeight: getConfiguration("fontWeight") } - } as DecorationInstanceRenderOptions + } as DecorationRenderOptions } as DecorationOptions; }