diff options
| -rw-r--r-- | CHANGELOG.md | 7 | ||||
| -rw-r--r-- | README.md | 13 | ||||
| -rw-r--r-- | package.json | 22 | ||||
| -rw-r--r-- | themes/Arc Dark-color-theme.json | 391 | ||||
| -rw-r--r-- | vsc-extension-quickstart.md | 35 |
5 files changed, 468 insertions, 0 deletions
diff --git a/CHANGELOG.md b/CHANGELOG.md new file mode 100644 index 0000000..f8c28d2 --- /dev/null +++ b/CHANGELOG.md @@ -0,0 +1,7 @@ +# Change Log +All notable changes to the "arc-dark" extension will be documented in this file. + +Check [Keep a Changelog](http://keepachangelog.com/) for recommendations on how to structure this file. + +## [Unreleased] +- Initial release diff --git a/README.md b/README.md new file mode 100644 index 0000000..7452f43 --- /dev/null +++ b/README.md @@ -0,0 +1,13 @@ +# Arc Theme for Visual Studio Code + +## An integrated color theme for one of the most popular Linux GTK themes + +This VS Code theme integrates seamlessly with the Arc theme to provide a more integrated experience. + + + +### For more information +* [Visual Studio Code's Markdown Support](http://code.visualstudio.com/docs/languages/markdown) +* [Markdown Syntax Reference](https://help.github.com/articles/markdown-basics/) + +**Enjoy!**
\ No newline at end of file diff --git a/package.json b/package.json new file mode 100644 index 0000000..02482b0 --- /dev/null +++ b/package.json @@ -0,0 +1,22 @@ +{ + "name": "arc-theme", + "displayName": "Arc Theme", + "description": "Color theme designed to match the popular Ubuntu \"Arc\" theme.", + "version": "0.0.1", + "publisher": "SolarLiner", + "engines": { + "vscode": "^1.12.0" + }, + "categories": [ + "Themes" + ], + "contributes": { + "themes": [ + { + "label": "Arc Dark", + "uiTheme": "vs-dark", + "path": "./themes/Arc Dark-color-theme.json" + } + ] + } +}
\ No newline at end of file diff --git a/themes/Arc Dark-color-theme.json b/themes/Arc Dark-color-theme.json new file mode 100644 index 0000000..e23839d --- /dev/null +++ b/themes/Arc Dark-color-theme.json @@ -0,0 +1,391 @@ +{ + "name": "Arc Dark", + "colors": { + "focusBorder": "#404552", + "foreground": "#D3DAE3", + "button.background": "#383C4A", + "button.foreground": "#FFF", + "input.background": "#393f4c", + "input.foreground": "#FFF", + "inputValidation.errorBackground": "#FC4138", + "inputValidation.infoBackground": "#4DADD4", + "inputValidation.warningBackground": "#F27835", + "sideBar.background": "#2f343f", + "sideBarSectionHeader.background": "#262b33", + "sideBarTitle.foreground": "#FFF", + "list.hoverBackground": "#0000", + "list.dropBackground": "#F08437", + "activityBar.background": "#262b33", + "editorGroup.background": "#262b33", + "editorGroup.dropBackground": "#FFFFFF0F", + "editor.background": "#2f343f", + "editor.foreground": "#CCC", + "editor.lineHighlightBackground": "#FFF1", + "editor.selectionBackground": "#88F1", + "editor.inactiveSelectionBackground": "#FFF2", + "editorLineNumber.foreground": "#FFF4", + "editorCursor.foreground": "#5294E2", + "editorGroupHeader.tabsBackground": "#2f343f", + "editorGroupHeader.noTabsBackground": "#2f343f", + "editorWidget.background": "#2f343f", + "editorHoverWidget.background": "#2f343f", + "editorHoverWidget.border": "#0004", + "tab.activeBackground": "#0000", + "tab.activeForeground": "#FFF", + "tab.border": "#0000", + "tab.inactiveBackground": "#0002", + "tab.inactiveForeground": "#CCC", + "statusBar.background": "#262b33", + "statusBar.debuggingBackground": "#F04A50", + "statusBar.noFolderBackground": "#262b33", + "statusBar.foreground": "#CCC", + "statusBarItem.activeBackground": "#0004", + "statusBarItem.hoverBackground": "#0002", + "statusBarItem.prominentBackground": "#0044", + "statusBarItem.prominentHoverBackground": "#0002", + "titleBar.activeBackground": "#2f343f", + "titleBar.activeForeground": "#CCC", + "titleBar.inactiveBackground": "#2f343f", + "titleBar.inactiveForeground": "#888", + "panelTitle.activeBorder": "#2f343f", + "notification.background": "#262a33", + "notification.foreground": "#EEE" + }, + "tokenColors": [ + { + "settings": { + "foreground": "#D4D4D4", + "background": "#1E1E1E" + } + }, + { + "scope": "emphasis", + "settings": { + "fontStyle": "italic" + } + }, + { + "scope": "strong", + "settings": { + "fontStyle": "bold" + } + }, + { + "scope": "header", + "settings": { + "foreground": "#000080" + } + }, + { + "scope": "comment", + "settings": { + "foreground": "#608b4e" + } + }, + { + "scope": "constant.language", + "settings": { + "foreground": "#569cd6" + } + }, + { + "scope": [ + "constant.numeric" + ], + "settings": { + "foreground": "#b5cea8" + } + }, + { + "scope": "constant.regexp", + "settings": { + "foreground": "#646695" + } + }, + { + "scope": "entity.name.tag", + "settings": { + "foreground": "#569cd6" + } + }, + { + "scope": "entity.name.tag.css", + "settings": { + "foreground": "#d7ba7d" + } + }, + { + "scope": "entity.other.attribute-name", + "settings": { + "foreground": "#9cdcfe" + } + }, + { + "scope": [ + "entity.other.attribute-name.class.css", + "entity.other.attribute-name.class.mixin.css", + "entity.other.attribute-name.id.css", + "entity.other.attribute-name.parent-selector.css", + "entity.other.attribute-name.pseudo-class.css", + "entity.other.attribute-name.pseudo-element.css", + "source.css.less entity.other.attribute-name.id", + "entity.other.attribute-name.attribute.scss", + "entity.other.attribute-name.scss" + ], + "settings": { + "foreground": "#d7ba7d" + } + }, + { + "scope": "invalid", + "settings": { + "foreground": "#f44747" + } + }, + { + "scope": "markup.underline", + "settings": { + "fontStyle": "underline" + } + }, + { + "scope": "markup.bold", + "settings": { + "fontStyle": "bold", + "foreground": "#569cd6" + } + }, + { + "scope": "markup.heading", + "settings": { + "fontStyle": "bold", + "foreground": "#569cd6" + } + }, + { + "scope": "markup.italic", + "settings": { + "fontStyle": "italic" + } + }, + { + "scope": "markup.inserted", + "settings": { + "foreground": "#b5cea8" + } + }, + { + "scope": "markup.deleted", + "settings": { + "foreground": "#ce9178" + } + }, + { + "scope": "markup.changed", + "settings": { + "foreground": "#569cd6" + } + }, + { + "scope": "beginning.punctuation.definition.quote.markdown", + "settings": { + "foreground": "#608b4e" + } + }, + { + "scope": "beginning.punctuation.definition.list.markdown", + "settings": { + "foreground": "#6796e6" + } + }, + { + "scope": "markup.inline.raw", + "settings": { + "foreground": "#ce9178" + } + }, + { + "scope": "meta.selector", + "settings": { + "foreground": "#d7ba7d" + } + }, + { + "name": "brackets of XML/HTML tags", + "scope": "punctuation.definition.tag", + "settings": { + "foreground": "#808080" + } + }, + { + "scope": "meta.preprocessor", + "settings": { + "foreground": "#569cd6" + } + }, + { + "scope": "meta.preprocessor.string", + "settings": { + "foreground": "#ce9178" + } + }, + { + "scope": "meta.preprocessor.numeric", + "settings": { + "foreground": "#b5cea8" + } + }, + { + "scope": "meta.structure.dictionary.key.python", + "settings": { + "foreground": "#9cdcfe" + } + }, + { + "scope": "meta.diff.header", + "settings": { + "foreground": "#569cd6" + } + }, + { + "scope": "storage", + "settings": { + "foreground": "#569cd6" + } + }, + { + "scope": "storage.type", + "settings": { + "foreground": "#569cd6" + } + }, + { + "scope": "storage.modifier", + "settings": { + "foreground": "#569cd6" + } + }, + { + "scope": "string", + "settings": { + "foreground": "#ce9178" + } + }, + { + "scope": "string.tag", + "settings": { + "foreground": "#ce9178" + } + }, + { + "scope": "string.value", + "settings": { + "foreground": "#ce9178" + } + }, + { + "scope": "string.regexp", + "settings": { + "foreground": "#d16969" + } + }, + { + "name": "JavaScript string interpolation ${}", + "scope": [ + "punctuation.definition.template-expression.begin.js", + "punctuation.definition.template-expression.begin.ts", + "punctuation.definition.template-expression.end.ts", + "punctuation.definition.template-expression.end.js" + ], + "settings": { + "foreground": "#569cd6" + } + }, + { + "scope": [ + "support.type.vendored.property-name", + "support.type.property-name", + "variable.css", + "variable.scss", + "variable.other.less" + ], + "settings": { + "foreground": "#9cdcfe" + } + }, + { + "scope": "keyword", + "settings": { + "foreground": "#569cd6" + } + }, + { + "scope": "keyword.control", + "settings": { + "foreground": "#569cd6" + } + }, + { + "scope": "keyword.operator", + "settings": { + "foreground": "#d4d4d4" + } + }, + { + "scope": [ + "keyword.operator.new", + "keyword.operator.expression", + "keyword.operator.cast", + "keyword.operator.sizeof", + "keyword.operator.logical.python" + ], + "settings": { + "foreground": "#569cd6" + } + }, + { + "scope": "keyword.other.unit", + "settings": { + "foreground": "#b5cea8" + } + }, + { + "scope": [ + "punctuation.section.embedded.begin.php", + "punctuation.section.embedded.end.php" + ], + "settings": { + "foreground": "#569cd6" + } + }, + { + "scope": "support.function.git-rebase", + "settings": { + "foreground": "#9cdcfe" + } + }, + { + "scope": "constant.sha.git-rebase", + "settings": { + "foreground": "#b5cea8" + } + }, + { + "name": "coloring of the Java import and package identifiers", + "scope": [ + "storage.modifier.import.java", + "storage.modifier.package.java" + ], + "settings": { + "foreground": "#d4d4d4" + } + }, + { + "name": "this.self", + "scope": "variable.language", + "settings": { + "foreground": "#569cd6" + } + } + ] +}
\ No newline at end of file diff --git a/vsc-extension-quickstart.md b/vsc-extension-quickstart.md new file mode 100644 index 0000000..7e23978 --- /dev/null +++ b/vsc-extension-quickstart.md @@ -0,0 +1,35 @@ +# Welcome to your VS Code Extension + +## What's in the folder + +* This folder contains all of the files necessary for your color theme extension + +* `package.json` - this is the manifest file that defines the location of the theme file and specifies the base theme of the theme + +* `themes/Arc Dark-color-theme.json` - the color theme definition file + +## Get up and running straight away + +* press `F5` to open a new window with your extension loaded +* open `File > Preferences > Color Themes` and pick your color theme +* Open a file that has a language associated. The languages' configured grammar will tokenize the text and assign 'scopes' to the tokens. To examine these scopes, invoke the `Inspect TM Scopes` command from the Commmand Palette (`Ctrl+Shift+P` or `Cmd+Shift+R` on Mac) . + +## Make changes + +* you can relaunch the extension from the debug toolbar after making changes to the files listed above +* you can also reload (`Ctrl+R` or `Cmd+R` on Mac) the VS Code window with your extension to load your changes +* When editing workbench colors, it's easiest to test the colors in the settings under `workbench.colorCustomizations`. When done, run the `Generate Color Theme From Current Settings` command to generate an updated content for the color theme definition file. + +## Adopt your theme to Visual Studio Code + +* The token colorization is done based on standard TextMate themes. Colors are matched against one or more scopes. + +To learn about what scopes are used where, check out the [TextMate documentation](https://manual.macromates.com/en/themes) +and the [Scope Naming](https://www.sublimetext.com/docs/3/scope_naming.html) documentation from Sublime. + +* A great place to examine themes is [here](https://tmtheme-editor.herokuapp.com/#!/editor/theme/Monokai). + +## Install your extension + +* To start using your extension with Visual Studio Code copy it into the `<user home>/.vscode/extensions` folder and restart Code. +* To share your extension with the world, read on https://code.visualstudio.com/docs about publishing an extension. |