IDE 2019.1 Plugin and UI Theme Transition #43
Milestone
Comments
arcticicestudio
added a commit
that referenced
this issue
Apr 22, 2019
arcticicestudio
added a commit
that referenced
this issue
Apr 22, 2019
The icons are defined by the IntelliJ Platform SDK for plugins (1). References: (1) https://www.jetbrains.org/intellij/sdk/docs/basics/plugin_structure/plugin_icon_file.html GH-43
arcticicestudio
added a commit
that referenced
this issue
Apr 22, 2019
Next to the UI theme the IntelliJ Platform SDK allows to bundle a color scheme (1). References: (1) http://www.jetbrains.org/intellij/sdk/docs/reference_guide/ui_themes/themes_extras.html GH-43
arcticicestudio
added a commit
that referenced
this issue
Apr 22, 2019
arcticicestudio
added a commit
that referenced
this issue
Apr 22, 2019
As of IntelliJ IDEA 2019.1 (1) it is finally possible to theme the IDE UI (2). "Nord JetBrains" transformed into a IDE UI (3) and editor theme (4) plugin using the IntelliJ Platform SDK (5) through JetBrain's DevKit (6) >>> Workflow "Nord JetBrains" now follows the official workflow documentation (7) to 1. Customize the UI icons and Controls (8) 2. Bundle the already existing editor color theme (4) 3. Build, debug and test the theme plugin (9) 4. Deploy and publish the theme plugin (10) The IntelliJ SDK provides a lot of tools to develop plugins by enabling the internal mode (11) that allows to show e.g. the "LaF Defaults" (12). The plugin is represented by a plugin icon (13) that is also available as of the the IntelliJ Platform version 2019.1. The "Nord JetBrains" plugin tries to follow the IntelliJ Platform UI Guidelines (14). >>> Project Renaming In GH-31 the project was renamed from `nord-intellij-idea-syntax` to `nord-jetbrains-editor` where the `editor` post-fix word was used to keep the namespace open for the possibility that JetBrains introduces a official UI theme API someday. This is now finally the case so the project was renamed to `nord-jetbrains` to clarify the theme is a full JetBrain Platform SDK plugin that provides a UI and editor theme and is also compatible with all current IDEs. The renaming was handled in subtask GH-44. >>> Minimum IntelliJ Platform SDK Version Requirement Since "Nord JetBrains" is a plugin instead of only a editor theme file (`.icls`), that can also be imported manually, the minimum version of IntelliJ is now "2019.1". >>> Documentation Changes The install instructions have been updated to match the installation method through the official builtin Plugin Marketplace (15). >>> No More Custom Compilation Scripts Since the plugin is now provided through the official Plugin Marketplace (15) it is not necessary anymore to compile the plugin manually. The IntelliJ Platform SDK allows to run and debug and plugin from within the IDE (16) and can be deployed/compiled using the builtin functions (10). References: (1) https://blog.jetbrains.com/idea/2019/03/intellij-idea-2019-1-is-released-theme-customization-java-12-switch-expressions-debug-inside-docker-containers-and-more (2) https://blog.jetbrains.com/idea/2019/03/brighten-up-your-day-add-color-to-intellij-idea (3) http://www.jetbrains.org/intellij/sdk/docs/reference_guide/ui_themes/themes_intro.html (4) http://www.jetbrains.org/intellij/sdk/docs/reference_guide/ui_themes/themes_extras.html (5) http://www.jetbrains.org/intellij/sdk/docs/welcome.html (6) http://www.jetbrains.org/intellij/sdk/docs/basics/getting_started/using_dev_kit.html (7) http://www.jetbrains.org/intellij/sdk/docs/reference_guide/ui_themes/themes.html#custom-ui-theme-workflow (8) http://www.jetbrains.org/intellij/sdk/docs/reference_guide/ui_themes/themes_customize.html (9) http://www.jetbrains.org/intellij/sdk/docs/basics/getting_started/running_and_debugging_a_plugin.html (10) https://www.jetbrains.org/intellij/sdk/docs/basics/getting_started/deploying_plugin.html (11) http://www.jetbrains.org/intellij/sdk/docs/reference_guide/internal_actions/enabling_internal.html (12) http://www.jetbrains.org/intellij/sdk/docs/reference_guide/internal_actions/internal_ui_lafd.html (13) https://www.jetbrains.org/intellij/sdk/docs/basics/plugin_structure/plugin_icon_file.html (14) https://jetbrains.github.io/ui (15) https://plugins.jetbrains.com/marketplace (16) https://www.jetbrains.org/intellij/sdk/docs/basics/getting_started/running_and_debugging_a_plugin.html GH-43
arcticicestudio
added a commit
that referenced
this issue
Apr 22, 2019
Also added new documentation assets like screenshots, removed outdated ones and added new install instructions. GH-43
arcticicestudio
added a commit
that referenced
this issue
Apr 23, 2019
The UI theme file is now located in the "src" folder in the project root while the editor scheme has been moved into a new "themes" subfolder. This ensures the project layout matches the documentation of the IntelliJ Plugin SDK. The project module definition file has also been updated to match the plugin SDK. GH-43
arcticicestudio
added a commit
that referenced
this issue
Oct 6, 2021
"Nord Jetbrains" is a project that exists for a long and therefore has code which reflects the history and changes made to the JetBrains products. This includes the editor scheme [1] which is responsible for language syntax highlighting, but before JetBrains officially supported UI themes [2] it also defined XML keys for some UI elements which were possible to be styled. Some of them are the `TAB_SELECTED` and `TAB_SELECTED_INACTIVE` keys [4] which, as the name suggests, were used for the visual appearance (back- and foreground color) of tabs, e.g. the ones for the editor. After official UI themes were introduced and this project added support for it [3] I thought that the XML keys from the editor scheme are not used anymore and I left them for some backwards compatibility. Anyway, it seems like these keys are still used even when a theme plugin provides a UI theme (JSON). This resulted in conflicts between the XML and JSON keys and caused me hours of unnecessary debugging the UI theme while the root cause was that the XML keys took precedence. Users also often reported issues, e.g. #99 [5], which I was not able to fix due to this mix of keys. After digging into the open sourced code of the JetBrains products I was finally able to get more insights about the logic how these are handled. Next to this the UI theme API also evolved a lot and supports all styles which were only supported by the XML keys before. Therefore the XML keys have finally been removed, starting with the ones for tabs (`TAB_*`). The scope is to... 1. improve the style of tool window tabs (the ones that are "merged" with the header of a pinned/docked panel/window) in a way that makes the active tab more distinguishable in active & inactive status. 1.1 The selected and active tab now use the special "brightened comment" color as background to stand out from the underlying header bar that uses the currently brightest color `nord3` from the "Polar Night" palette. 1.2 The bottom stripe of selected but inactive tabs now also use the special "brightened comment" color to distinguish itself from the tab background. 2. improve the style of editor tabs regarding the visual alignment with tool window tabs and element states, e.g. when being hovered. 2.1 Selected (active) and unselected tabs now use `nord3` as background color for better visibility. 2.2 The bottom stripe of selected but inactive tabs now use the special "brightened comment" color to distinguish itself from the tab background. 3. make use of the new `DefaultTabs` UI theme key group in order to unify the style of all tab elements across the UI. This allows to remove redundant keys from element specific keys, e.g. the ones from `EditorTabs` that are almost duplicates of the `HeaderTab` key group. 4. remove deprecated XML keys: 4.1 `TAB_SELECTED` - Replaced by the UI key `ui.DefaultTabs.background`. 4.2 `TAB_SELECTED_INACTIVE` - Replaced by the UI key `ui.DefaultTabs.inactiveUnderlineColor`. 4.3 `TAB_UNDERLINE` - Replaced by the UI key `ui.DefaultTabs.underlineColor`. 4.4 `TAB_UNDERLINE_INACTIVE` - Not styled anymore. [1]: https://plugins.jetbrains.com/docs/intellij/themes-extras.html?from=jetbrains.org [2]: https://blog.jetbrains.com/idea/2019/03/brighten-up-your-day-add-color-to-intellij-idea [3]: #43 [4]: https://github.com/arcticicestudio/nord-jetbrains/blob/ae716da0e52a512c3803fb4f42ab3b3c68370548/resources/themes/nord.xml#L5042-L5053 [5]: #99
arcticicestudio
added a commit
that referenced
this issue
Oct 6, 2021
"Nord Jetbrains" is a project that exists for a long and therefore has code which reflects the history and changes made to the JetBrains products. This includes the editor scheme [1] which is responsible for language syntax highlighting, but before JetBrains officially supported UI themes [2] it also defined XML keys for some UI elements which were possible to be styled. Some of them are the `TAB_SELECTED` and `TAB_SELECTED_INACTIVE` keys [4] which, as the name suggests, were used for the visual appearance (back- and foreground color) of tabs, e.g. the ones for the editor. After official UI themes were introduced and this project added support for it [3] I thought that the XML keys from the editor scheme are not used anymore and I left them for some backwards compatibility. Anyway, it seems like these keys are still used even when a theme plugin provides a UI theme (JSON). This resulted in conflicts between the XML and JSON keys and caused me hours of unnecessary debugging the UI theme while the root cause was that the XML keys took precedence. Users also often reported issues, e.g. #99 [5], which I was not able to fix due to this mix of keys. After digging into the open sourced code of the JetBrains products I was finally able to get more insights about the logic how these are handled. Next to this the UI theme API also evolved a lot and supports all styles which were only supported by the XML keys before. Therefore the XML keys have finally been removed, starting with the ones for tabs (`TAB_*`). The scope is to... 1. improve the style of tool window tabs (the ones that are "merged" with the header of a pinned/docked panel/window) in a way that makes the active tab more distinguishable in active & inactive status. 1.1 The selected and active tab now use the special "brightened comment" color as background to stand out from the underlying header bar that uses the currently brightest color `nord3` from the "Polar Night" palette. 1.2 The bottom stripe of selected but inactive tabs now also use the special "brightened comment" color to distinguish itself from the tab background. 2. improve the style of editor tabs regarding the visual alignment with tool window tabs and element states, e.g. when being hovered. 2.1 Selected (active) and unselected tabs now use `nord3` as background color for better visibility. 2.2 The bottom stripe of selected but inactive tabs now use the special "brightened comment" color to distinguish itself from the tab background. 3. make use of the new `DefaultTabs` UI theme key group in order to unify the style of all tab elements across the UI. This allows to remove redundant keys from element specific keys, e.g. the ones from `EditorTabs` that are almost duplicates of the `HeaderTab` key group. 4. remove deprecated XML keys: 4.1 `TAB_SELECTED` - Replaced by the UI key `ui.DefaultTabs.background`. 4.2 `TAB_SELECTED_INACTIVE` - Replaced by the UI key `ui.DefaultTabs.inactiveUnderlineColor`. 4.3 `TAB_UNDERLINE` - Replaced by the UI key `ui.DefaultTabs.underlineColor`. 4.4 `TAB_UNDERLINE_INACTIVE` - Not styled anymore. [1]: https://plugins.jetbrains.com/docs/intellij/themes-extras.html?from=jetbrains.org [2]: https://blog.jetbrains.com/idea/2019/03/brighten-up-your-day-add-color-to-intellij-idea [3]: #43 [4]: https://github.com/arcticicestudio/nord-jetbrains/blob/ae716da0e52a512c3803fb4f42ab3b3c68370548/resources/themes/nord.xml#L5042-L5053 [5]: #99 Co-authored-by: Sven Greb <[email protected]> Closes GH-185
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
As of IntelliJ IDEA 2019.1 it is finally possible to theme the IDE UI 🎉
This means Nord JetBrains Editor will transform into a IDE UI and editor theme plugin using the IntelliJ Platform SDK through JetBrain's DevKit.
Workflow
Nord JetBrains Editor will follow the official workflow documentation to
The IntelliJ SDK provides a lot of tools to develop plugins by enabling the internal mode that will allow to show e.g. the LaF Defaults.
The plugin will be represented by a plugin icon that is also available as of the the IntelliJ Platform version 2019.1.
The Nord JetBrains plugin will try to follow the IntelliJ Platform UI Guidelines.
Project Renaming
In #31 the project was renamed from
nord-intellij-idea-syntaxtonord-jetbrains-editorwhere theeditorpost-fix word was used to keep the namespace open for the possibility that JetBrains introduces a official UI theme API someday.This is now finally the case so the project will be renamed to
nord-jetbrainsto clarify the theme is a full JetBrain Platform SDK plugin that provides a UI and editor theme and is also compatible with all current IDEs.The renaming will be handled in subtask #44.
Minimum IntelliJ Platform SDK Version Requirement
Since Nord JetBrains will be a plugin instead of only a editor theme file (
.icls), that can also be imported manually, the minimum version of IntelliJ will be 2019.1.Documentation Changes
The install instructions will be updated to match the installation method through the official builtin Plugin Marketplace.
No More Custom Compilation Scripts
Since the plugin is now provided through the official Plugin Marketplace it is not necessary anymore to compile the plugin manually.
The IntelliJ Platform SDK allows to run and debug and plugin from within the IDE and can be deployed/compiled using the builtin functions.
The text was updated successfully, but these errors were encountered: