diff --git a/content/docs/ports/jetbrains/development/build-deploy.png b/content/docs/ports/jetbrains/development/build-deploy.png new file mode 100644 index 00000000..81b767fb Binary files /dev/null and b/content/docs/ports/jetbrains/development/build-deploy.png differ diff --git a/content/docs/ports/jetbrains/development/devkit-plugin.png b/content/docs/ports/jetbrains/development/devkit-plugin.png new file mode 100644 index 00000000..615b8ae0 Binary files /dev/null and b/content/docs/ports/jetbrains/development/devkit-plugin.png differ diff --git a/content/docs/ports/jetbrains/development/github-clone.png b/content/docs/ports/jetbrains/development/github-clone.png new file mode 100644 index 00000000..a603447a Binary files /dev/null and b/content/docs/ports/jetbrains/development/github-clone.png differ diff --git a/content/docs/ports/jetbrains/development/ide-props.png b/content/docs/ports/jetbrains/development/ide-props.png new file mode 100644 index 00000000..9f077d0b Binary files /dev/null and b/content/docs/ports/jetbrains/development/ide-props.png differ diff --git a/content/docs/ports/jetbrains/development/index.mdx b/content/docs/ports/jetbrains/development/index.mdx new file mode 100644 index 00000000..7b4ee9e7 --- /dev/null +++ b/content/docs/ports/jetbrains/development/index.mdx @@ -0,0 +1,177 @@ +import Button from "atoms/core/Button"; +import Link from "atoms/core/Link"; +import { Image, ShrinkedWidth, SpaceBox } from "atoms/core/mdx-elements"; +import { Kbd } from "atoms/core/html-elements"; +import { ReactComponent as WindowCode } from "assets/images/illustrations/window-code.svg"; +import { ROUTE_DOCS_PORTS_JETBRAINS_INSTALLATION } from "config/routes/mappings"; + +import WIPNotice from "../../../../shared/docs/wip-notice"; + +export const frontmatter = { + title: "Plugin Development", + subline: "Learn how to customize the theme to fit your needs, preview changes and export the plugin." +}; + + + + + + + + + + + + + +This page documents how to develop the theme plugin — from requirements to the deployment and local installation steps. + +# Requirements + +Download and install [IntelliJ][jb-intellij] with a minimal version of [2019.1 or higher][jb-whatsnew-2019.1]. + + + +To develop IntelliJ platform plugins the [DevKit][jb-docs-sdk-devkit] plugin (bundled by default) must be enabled. + + + +# Setup + +## Download + +Clone the [_Nord JetBrains_ repository from GitHub][gh-repo] to any path: + +```sh +git clone https://github.com/arcticicestudio/nord-jetbrains.git +``` + +To get the project without [Git][] download the project as `.zip` archive file from the GitHub repository or click on the download button below. Afterwards extract the archive to any path. + + + +Screenshot showing the GitHub repository web UI to download the project repository + Download the project repository from GitHub + + +Both methods will use the `develop` branch to work with the latest development state. + +Import the project use IntelliJ's Open... wizard from the welcome screen and browse to the path of the cloned/extracted repository. + +# Development + +## Workflow + +_Nord JetBrains_ follows the [official workflow documentation][jb-docs-sdk-ui-theme-workflow] to + +1. [Customize the UI icons and Controls][jb-docs-sdk-ui-theme-customize] +2. [Bundle the already existing editor color theme][jb-docs-sdk-editor-theme] +3. [Build, debug and test the theme plugin][jb-docs-sdk-test-build] +4. [Deploy and publish the theme plugin][jb-docs-sdk-deployment] + +For details about the general UI design pattern please refer to the [JetBrains UI guidelines][jb-ui_guidelines]. + +## Theme Preview + +IntelliJ comes with a builtin function to preview the currently opened platform plugin project. +Open the [`nord.theme.json`][gh-repo-tree-dev-ui-theme] file and click on the _play_ icon to apply the current state of the UI theme. + +Screenshot showing the UI theme preview icon bar when the theme definition file is opened + UI theme preview icon bar when the theme definition file is opened + + +To apply changes made while the preview is enabled click on the _double play_ icon and disable the preview again using using the _stop_ icon. + +Screenshot showing the enabled UI theme preview icon bar when the theme definition file is opened + UI theme preview icon bar when enabled + + +## Visual Testing + +The IntelliJ SDK provides a lot of tools to develop plugins by [enabling the internal mode][jb-docs-sdk-internal_mode] that will allow to show e.g. the [LaF Defaults][jb-docs-sdk-internal_mode_laf]. + +To enable the _internal mode_ open the [advanced IDE properties][jb-docs-ide_props] and add the following key-value pair: + +```properties +idea.is.internal=true +``` + +Restart IntelliJ to enable the new property. + +Screenshot showing the menu entry to edit the IDE properties + Menu entry to edit the IDE properties + + +# Deployment + +IntelliJ comes with builtin tools to build and deploy plugins. + +1. Go to **Build** and **Build Project** to copy the project files to the `/out` folder and generate required metadata. +2. Again go to **Build** and choose **Select All Plugin Modules For Deployment** to generate the JAR file. + +Screenshot showing the menu entries for builtin tools to build and deploy platform plugins + Menu entries for builtin tools to build and deploy platform plugins + + +# Local Installation + +A generated JAR file can be locally installed to use the theme without uploading it to the JetBrains plugin repository. +Go to [Settings / Preferences][jb-docs-sett_prefs] ➜ **Plugins**, click on the gear icon and select „Install Plugin From Disk...“. + +Screenshot showing the menu to install plugins locally + Local plugin installation + + +Select the plugin JAR file and restart IntelliJ. + +Follow the Installation & Activation Guide for more details how to enable the UI theme and editor color scheme. + + + +[gh-repo-tree-dev-ui-theme]: https://github.com/arcticicestudio/nord-jetbrains/blob/develop/src/nord.theme.json +[gh-repo]: https://github.com/arcticicestudio/nord-jetbrains +[git]: https://git-scm.com +[jb-docs-ide_props]: https://www.jetbrains.com/help/idea/tuning-the-ide.html +[jb-docs-sdk-deployment]: https://www.jetbrains.org/intellij/sdk/docs/basics/getting_started/deploying_plugin.html +[jb-docs-sdk-devkit]: https://www.jetbrains.org/intellij/sdk/docs/basics/getting_started/using_dev_kit.html +[jb-docs-sdk-editor-theme]: http://www.jetbrains.org/intellij/sdk/docs/reference_guide/ui_themes/themes_extras.html +[jb-docs-sdk-internal_mode_laf]: http://www.jetbrains.org/intellij/sdk/docs/reference_guide/internal_actions/internal_ui_lafd.html +[jb-docs-sdk-internal_mode]: http://www.jetbrains.org/intellij/sdk/docs/reference_guide/internal_actions/enabling_internal.html +[jb-docs-sdk-test-build]: http://www.jetbrains.org/intellij/sdk/docs/basics/getting_started/running_and_debugging_a_plugin.html +[jb-docs-sdk-ui-theme-customize]: http://www.jetbrains.org/intellij/sdk/docs/reference_guide/ui_themes/themes_customize.html +[jb-docs-sdk-ui-theme-workflow]: http://www.jetbrains.org/intellij/sdk/docs/reference_guide/ui_themes/themes.html#custom-ui-theme-workflow +[jb-docs-sett_prefs]: https://www.jetbrains.com/help/idea/settings-preferences-dialog.html +[jb-intellij]: https://www.jetbrains.com/idea +[jb-ui_guidelines]: https://jetbrains.github.io/ui +[jb-whatsnew-2019.1]: https://www.jetbrains.com/idea/whatsnew/#v2019-1 diff --git a/content/docs/ports/jetbrains/development/install-local.png b/content/docs/ports/jetbrains/development/install-local.png new file mode 100644 index 00000000..90587e02 Binary files /dev/null and b/content/docs/ports/jetbrains/development/install-local.png differ diff --git a/content/docs/ports/jetbrains/development/intellij-splash-screen.png b/content/docs/ports/jetbrains/development/intellij-splash-screen.png new file mode 100644 index 00000000..3f82a2d4 Binary files /dev/null and b/content/docs/ports/jetbrains/development/intellij-splash-screen.png differ diff --git a/content/docs/ports/jetbrains/development/ui-theme-preview-enabled.png b/content/docs/ports/jetbrains/development/ui-theme-preview-enabled.png new file mode 100644 index 00000000..c3b8eee1 Binary files /dev/null and b/content/docs/ports/jetbrains/development/ui-theme-preview-enabled.png differ diff --git a/content/docs/ports/jetbrains/development/ui-theme-preview.png b/content/docs/ports/jetbrains/development/ui-theme-preview.png new file mode 100644 index 00000000..7f566d66 Binary files /dev/null and b/content/docs/ports/jetbrains/development/ui-theme-preview.png differ diff --git a/content/docs/ports/jetbrains/installation/index.mdx b/content/docs/ports/jetbrains/installation/index.mdx new file mode 100644 index 00000000..77afd329 --- /dev/null +++ b/content/docs/ports/jetbrains/installation/index.mdx @@ -0,0 +1,83 @@ +import Link from "atoms/core/Link"; +import { Banner, Image, ShrinkedWidth, SpaceBox } from "atoms/core/mdx-elements"; +import { Code, Kbd } from "atoms/core/html-elements"; +import { ReactComponent as Plugin } from "assets/images/illustrations/plugin.svg"; + +import WIPNotice from "../../../../shared/docs/wip-notice"; + +export const frontmatter = { + title: "Installation & Activation", + subline: "Get up and running in one click with the official JetBrains Plugin Repository." +}; + + + + + + + + + + + + + + + Users with currently installed versions less or equal to 0.4.0 must reinstall the plugin! + + } + variant="warn" +> + As of version 0.5.0 the{" "} + + plugin XML ID + {" "} + changed to better fit the package hierarchy naming scheme. + This means plugin versions less or equal to 0.4.0 (old ID) won't receive updates automatically. + +To update to the latest version and re-enable auto updates again it is **required to uninstall and install the plugin once**! + + + +Thanks to the [official JetBrains Plugin Repository][jb-plug-repo-nord], _Nord JetBrains_ can be installed for all supported products with one click. + +Go to [Settings / Preferences][jb-docs-sett_prefs] ➜ **Plugins**, switch to the **Marketplace** tab and search for `Nord`. + + + +Click on the Install button and restart the IDE to finish the installation. + + + +## Activation + +_Nord JetBrains_ provides a UI theme and editor color scheme and allows both to be used individually. + +### UI Theme + +Beginning with the 2019.1 JetBrain product releases, [custom UI Themes][jb-docs-sdk-ui_theme] are available for all supported IDEs. + +To activate Nord's UI theme go to [Settings / Preferences][jb-docs-sett_prefs] ➜ **Appearance & Behavior** ➜ **Appearance**, select `Nord` from the _Theme_ drop-down menu and Apply the change. + + + +### Editor Color Scheme + +Using a custom [color scheme][jb-docs-color_fonts] is a feature that has been supported almost since the first JetBrains product versions. + +To activate Nord's editor color scheme go to [Settings / Preferences][jb-docs-sett_prefs] ➜ **Editor** ➜ **Color Theme**, select `Nord` from the _Scheme_ drop-down menu and Apply the change. + + + + + +[jb-docs-color_fonts]: https://www.jetbrains.com/help/idea/configuring-colors-and-fonts.html +[jb-docs-sdk-ui_theme]: https://www.jetbrains.org/intellij/sdk/docs/reference_guide/ui_themes/themes_intro.html +[jb-docs-sett_prefs]: https://www.jetbrains.com/help/idea/settings-preferences-dialog.html +[jb-plug-repo-nord]: https://plugins.jetbrains.com/plugin/10321-nord +[jb-plug-repo]: https://plugins.jetbrains.com diff --git a/content/docs/ports/jetbrains/installation/ui-plugins-installed.png b/content/docs/ports/jetbrains/installation/ui-plugins-installed.png new file mode 100644 index 00000000..57410e12 Binary files /dev/null and b/content/docs/ports/jetbrains/installation/ui-plugins-installed.png differ diff --git a/content/docs/ports/jetbrains/installation/ui-plugins-marketplace.png b/content/docs/ports/jetbrains/installation/ui-plugins-marketplace.png new file mode 100644 index 00000000..65479a72 Binary files /dev/null and b/content/docs/ports/jetbrains/installation/ui-plugins-marketplace.png differ diff --git a/content/docs/ports/jetbrains/installation/ui-settings-appearance.png b/content/docs/ports/jetbrains/installation/ui-settings-appearance.png new file mode 100644 index 00000000..398f4c67 Binary files /dev/null and b/content/docs/ports/jetbrains/installation/ui-settings-appearance.png differ diff --git a/content/docs/ports/jetbrains/installation/ui-settings-color-scheme.png b/content/docs/ports/jetbrains/installation/ui-settings-color-scheme.png new file mode 100644 index 00000000..d7f50082 Binary files /dev/null and b/content/docs/ports/jetbrains/installation/ui-settings-color-scheme.png differ