joplin-plugin-tag-navigator 2.10.7 → 2.11.0

package/README.md

@@ -137,6 +137,7 @@ After installing the plugin, check the commands listed under `Tag Navigator` in
 - When the `Tag inheritance` setting is enabled (by default), tags are automatically inherited in three ways:
     1. **Outline/indentation inheritance**: Tags are inherited from parent items to their children based on indentation levels.
         - Example: If `#project/website` appears on a parent line, all indented child lines will also be tagged with `#project/website`
+        - Exception: four or more spaces of indent after a blank line, outside a list, is a Markdown code block. Those lines are skipped entirely when `Ignore code blocks` is on, so they neither carry nor inherit tags.
     2. **Heading inheritance**: Tags are inherited from headings to all content under that heading.
         - Example: If `## Meeting Notes #urgent` appears as a heading, all other *tagged lines* under that heading will also be tagged with `#urgent`
     3. **Top of the note inheritance**: Tags are inherited from the first 2 lines of the note.
@@ -485,33 +486,61 @@ Context expansion lets you reveal surrounding lines around search results to see
 
 ### Styling inline tags
 
-The Markdown preview pane and the Tag Navigator search panel wrap every matched tag in the class `itags-search-renderedTag` and, when the token starts with `#`, `@`, `+`, `//`, or any other character, add `itags-search-renderedTag--hash`, `--at`, `--plus`, `--slash`, `--<other char>`. You may modify their appearance in `userstyle.css` (for Markdown preview), or in the `Search: Panel style` setting (for the plugin's search panel).
+Tags are displayed on three surfaces: the search panel, the Markdown preview and the Markdown editor. Every rendered tag carries a shared class and a surface-specific one, each in a plain and a per-prefix form:
+
+| Class | Matches |
+| ----- | ------- |
+| `itags-tag`, `itags-tag--hash` / `--at` / `--plus` / `--slash` | every surface |
+| `itags-search-renderedTag` (panel, preview), `itags-editor-tag` (editor), each with the same prefix suffixes | one surface |
+
+The `Inline tags: Style` setting takes custom CSS and applies it to all three. **This is the only way to restyle tags on mobile**, where `userstyle.css` cannot be edited. Your rules override the bundled default without needing `!important`.
+
+`Search: Panel style` and `Navigation: Panel style` style those panels as a whole rather than tags.
 
 <details>
-<summary>CSS example for tag styling</summary>
+<summary>CSS examples for tag styling</summary>
+
+Style every tag on every surface:
 
 ```css
-/* optional: specify different sub-styles for each type of tag */
-.itags-search-renderedTag {
-	background-color: #a576b3ff;
-} /* global style */
+.itags-tag {
+	background-color: #a576b3;
+}
+```
+
+Give each type of tag its own colour, everywhere:
 
-.itags-search-renderedTag--at {
+```css
+.itags-tag--at {
 	background-color: #6fae4a;
-} /* type-specific style */
+}
 
-.itags-search-renderedTag--plus {
+.itags-tag--plus {
 	background-color: #ae4a6f;
 }
 
-.itags-search-renderedTag--slash {
+.itags-tag--slash {
 	background-color: #4a6fae;
 }
 ```
 
-</details>
+Style one surface differently from the others. Avoid `display: inline-block` in the editor, where it disturbs caret placement:
 
-For the Markdown editor see Rich Markdown in the [Companion plugins](#companion-plugins) section.
+```css
+/* preview and panel only */
+.itags-search-renderedTag {
+	display: inline-block;
+	margin: 2px 0;
+}
+
+/* editor only */
+.itags-editor-tag {
+	background-color: transparent;
+	border-bottom: 2px solid #7698b3;
+}
+```
+
+</details>
 
 ### Keyboard shortcuts
 
@@ -562,28 +591,6 @@ For the Markdown editor see Rich Markdown in the [Companion plugins](#companion-
 
 - The excellent [Inline Tags](https://github.com/roman-r-m/joplin-inline-tags-plugin) plugin can autocomplete tags while typing.
 - Use [YesYouKan](https://github.com/joplin/plugin-yesyoukan) to visualize kanban views generated by Tag Navigator as interactive kanban boards.
-- You can highlight tags in the Markdown editor using [Rich Markdown](https://github.com/CalebJohn/joplin-rich-markdown) (version ≥ 0.14).
-
-<details>
-<summary>Rich Markdown setup instructions</summary>
-
-- In `Joplin settings --> Rich Markdown --> Advanced Settings --> Custom classes JSON` enter:
-```
-[{"name": "rm-tag", "regex": "(?<=^|\\s)#([^\\s#'\",.()\\[\\]:;\\?\\\\]+)"}]
-```
-- In `Joplin settings --> Appearance --> Custom stylesheet for Joplin-wide app styles` add the following to the style sheet:
-```
-div.CodeMirror .cm-rm-tag {
-    background-color: #7698b3;
-    color: white !important;
-    padding: 0em 2px;
-    border-radius: 5px;
-    display: inline;
-}
-```
-- On the mobile app, since it is impossible to edit the stylesheet, one could install this [Rich Markdown fork](https://github.com/alondmnt/joplin-rich-markdown/releases/tag/v0.15-mobile-style-v4) (with predefined support for tags and checkboxes) or instead define the name of the tag class to be `"name": "searchMatch"`. This will use the same highlighting style as Joplin search results.
-
-</details>
 
 ## Motivation
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "joplin-plugin-tag-navigator",
-  "version": "2.10.7",
+  "version": "2.11.0",
   "scripts": {
     "test": "jest",
     "dist": "webpack --env joplin-plugin-config=buildMain && webpack --env joplin-plugin-config=buildExtraScripts && webpack --env joplin-plugin-config=createArchive",
@@ -16,6 +16,7 @@
     "publish"
   ],
   "devDependencies": {
+    "@codemirror/lang-markdown": "^6.5.2",
     "@codemirror/view": "^6.26.0",
     "@joplin/lib": "~2.9",
     "@types/jest": "^29.5.14",

package/publish/joplin.plugin.alondmnt.tag-navigator.json

@@ -6,7 +6,7 @@
 		"desktop",
 		"mobile"
 	],
-	"version": "2.10.7",
+	"version": "2.11.0",
 	"name": "Inline Tag Navigator",
 	"description": "Type inline tags or frontmatter in the note editor. View your tagged paragraphs and tasks / TODOs in a search panel, or in a generated note / kanban. Build a table view / database from notes and tags. Convert between Obsidian tags and Joplin tags.",
 	"author": "Alon Diament",
@@ -24,6 +24,6 @@
 	],
 	"screenshots": [],
 	"icons": {},
-	"_publish_hash": "sha256:4c7b1ed686ab21381e3d18705952a0894a335b1c5b5e40d9a66080e3b89ee887",
-	"_publish_commit": "main:f70997bfa650df7a088f43371511248861f07e7b"
+	"_publish_hash": "sha256:d91e686d0c4c180e6604b6c84ebd3584ff5b5ac4ecc660e4f4cb2075cf5f51e1",
+	"_publish_commit": "main:d741a25c27887c7c2091fd1c5076001f878406fb"
 }