v0.0.1: Actually done

README.md

@@ -1,130 +1,109 @@
 # Obsidian Simple Columns
-Easily display your notes side-by-side using a simple tag syntax.
+Display your text side-by-side with a simple syntax.
 
-## Example
-```markdown
-## Text outside of columns
-This is text coming before a column block. It will take up the full width of the page, like it usually does.
+This plugin provides a way to structure your notes into columns that can be displayed horizontally in both directions with custom width ratios in the Reading View.
 
-[begin]
-## First column
-This is text that is being displayed on the left.
+## Installation
+1. Download the archive from [Releases](https://github.com/hiimsergey/obsidian-simple-columns/releases/latest) and extract it to `path/to/vault/.obsidian/plugins/`.
+2. Restart Obsidian.
+3. Enable it under **Settings > Community Plugins > Simple Columns**.
 
-[col]
-- Second column
-- This is text that is being displayed in the middle.
+## Overview
+```md
+...
+
+[begin]
+In publishing and graphic design, _**Lorem ipsum**_ (/ˌlɔː.rəm ˈɪp.səm/) is a placeholder text commonly used to demonstrate the visual form of a document or a typeface without relying on meaningful content. _Lorem ipsum_ may be used as a placeholder before the final copy is available. It is also used to temporarily replace text in a process called greeking, which allows designers to consider the form of a webpage or publication, without the meaning of the text influencing the design.
 
 [col]
-This is the third column. It is displayed on the right.
-You can add as many columns as possible.
+_Lorem ipsum_ is typically a corrupted version of _De finibus bonorum et malorum_, a 1st-century BC text by the Roman statesman and philosopher Cicero, with words altered, added, and removed to make it nonsensical and improper Latin. The first two words themselves are a truncation of _dolorem ipsum_ ("pain itself").
 
 [end]
 
-This text is outside of the columns blocks. It will take up the full page width again.
+...
 ```
 
-## Syntax
-
-### Flexible amount of blocks
-You can arrange more and more columns by adding more `[col]` tags between `[begin]` and `[end]` as well as making multiple blocks:
-
-```markdown
-outside
-
-[begin]
-column one
-
-[col]
-column two
-
-[end]
+![screenshot](example_1.png)
 
-outside
+- Between `[begin]` and `[end]` should be the text you want to be displayed in columns.
+    - Everything before `[begin]` and after `[end]` is processed normally.
+- A `[col]` between your paragraphs marks the end of a column and the start of a new one.
+- You can write as many `[col]` tags as you like, as long as they are between `[begin]` and `[end]`.
+- You can write as many `[begin]` and `[end]` blocks in your note, as long as you follow these syntax rules, otherwise the note won't be processed correctly.
 
+## RTL arrangement
+```md
 [begin]
+## First block
 
 [col]
-column one
+## Second block
 
 [col]
-column two
+## Third block
 
-[end]
+[end] rtl
 ```
 
-You can also declare blocks in other blocks for further division:
+![screenshot](example_2.png)
 
-```markdown
-this text takes up the whole width
+By appending `rtl` to the `[end]` tag of your block, the columns will be put side-by-side in reversed order.
 
-[begin]
-this text takes up the first half
+This is useful if your language is written right-to-left.
 
+You can configure to have blocks processed like that by default by enabling the **RTL by default** setting. To process the blocks left-to-right, simply write `ltr` after the `[end]` tag. *Note: The setting will come into effect after switching into Reading View again.*
+
+## Wrap columns
+```md
 [begin]
-this text takes up the first quarter
+## 1st long text ...
 
 [col]
-this text takes up the second quarter
+## 2nd long text ...
 
-[end]
+[col]
+## 3rd long text ...
 
 [col]
-this text takes up the second half
+## 4th long text ...
 
-[end]
+[col]
+...
+
+[end] wrap
 ```
 
-### Custom width ratio
-Some columns can take up more space that the others. Just add a number after a tag:
+![screenshot](example_3.png)
+
+By appending `wrap` to the `[end]` tag of your block, the columns won't be strictly displayed on one level and can wrap over to the next one if you have too many blocks. Their individual widths won't sink below 40%.
 
-```markdown
-These columns will have a width ratio of 1:2:1.
+That way you don't have to write countless `[begin]`-`[end]`-pairs if you want to write your text in a kind of grid.
 
+You can make this the default behavior by enabling the **Wrap blocks by default** setting. *Note: The setting will come into effect after switching into Reading View again.*
+
+## Resize columns
+```md
 [begin]
-first column
+column with normal width
 
-[col]2
-second column with twice as much space as the others
+[col] 2
+column twice as wide
 
-[col]
-third column
+[col] 3
+column thrice as wide, like really wide
 
 [end]
 ```
 
-### Arrange blocks Right-to-Left
-By default the first column starts on the left and new ones appear on the right. There is a **Default column arrangement** setting but you can also set it for each block individually. Add a keyword at the end of the `[col]` tag:
+![screenshot](example_4.png)
 
-```markdown
-[begin]2
-- first column
-- on the right
+By appending a number to a `[begin]` or `[col]` tag, you set the width ratio of your blocks. The three blocks in the example above will be processed with the width ratio of 1:2:3.
 
-[col]
-- second column
-- on the left
-
-[end]rl
+## Exclude mobile devices from rendering
+You can prevent block rendering on mobile devices by disabling the **Render blocks on mobile** setting. That way, the `[begin]`, `[col]` and `[end]` tags will disappear from Reading View, but the text won't be shown side-by-side.
 
-outside text
-
-[begin]
-- first column
-- on the left
+This is useful if you access a synced vault from the desktop on narrow screens.
 
-[col]3
-- second column
-- on the right
-
-[end]lr
-
-[begin]
-- first column
-- uses setting value
-
-[col]
-- second column
-- uses setting value
-
-[end]
-```
+# Coming soon (eventually)
+- Apply columns in exported PDFs (right now they look like the normal document)
+- delete unnecessary elements from the DOM (technical issue, no change in user experience)

esbuild.config.mjs

@@ -15,7 +15,7 @@ const context = await esbuild.context({
 	banner: {
 		js: banner,
 	},
-	entryPoints: ["src/main.ts"],
+	entryPoints: ["main.ts"],
 	bundle: true,
 	external: [
 		"obsidian",