docs: add table & task lists docs

This commit is contained in:
ammarahm-ed
2023-06-07 14:47:52 +05:00
committed by Abdullah Atta
parent 7f9c24e061
commit 31ff047a34
28 changed files with 129 additions and 2 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 56 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 47 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 30 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 30 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 31 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 48 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 58 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 55 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 67 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 61 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 50 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.9 KiB

View File

@@ -1,5 +1,7 @@
# Markdown shortcuts
![Markdown editing](/markdown-editing.gif)
The following markdown shortcuts are supported in the editor.
| Shortcut | Block |

View File

@@ -1 +0,0 @@
# Outline lists

View File

@@ -1 +1,100 @@
# Tables
![Table](/table-example-22.png)
Tables in Notesnook provide all the basic to advanced functionality. On the left size are the `Row properties` and `Insert a new row` buttons while on top of the table are `Table properties` and `Insert a new column` buttons.
The first row of a table is always a header however you can always delete this row.
## Insert a table
1. Click on the ![Toolbar plus](/toolbar-plus.png) and select the table block.
2. Select the size of the table grid.
![Create a table](/create-table.png)
## Resizing table columns
Table columns on desktop and web apps are resizable.
1. Hover on the seperator between two columns, it will turn green
2. Click and hold the move to resize the column
![Resize a table](/resize-table.gif)
> info
>
> Tablec column resizing is not supported on mobile editor yet.
## Insert a row
1. Click on a cell below which you want to insert a new row.
2. Click on the `Insert row below` button to insert a new row.
![Insert row table](/insert-row-table.gif)
## Delete a row
1. Click on the cell of the row you want to delete
2. Click on the cell properties button and select `Delete row`
![Insert row table](/table-row-delete.png)
## Move row
1. Click on the cell of the row you move.
2. Click on the cell properties button and select `Move row up` to move the row up or `Move row down` to move the row down.
![Move table row](/table-move-row.gif)
## Insert a column
1. Click on a cell after which you want to insert a new column.
2. Click on the `Insert column right` button to insert a new column.
![Move table row](/table-insert-column.gif)
## Delete a column
1. Click on the cell of the column you want to delete
2. Click on the table properties button and select `Delete column`
![Delete table column](/table-delete-column.png)
## Move column
1. Click on the cell of the column you move.
2. Click on the table properties button on top and select `Move column right` to move the column right or `Move column left` to move the column right.
![Move table row](/table-move-column.gif)
## Merge cells
1. Drag and select the cells you want to merge
2. Click on table properties on top of table and select `Merge cells`
![Merge table cells](/table-merge-cells.gif)
## Split cells
1. Double click to select the cell you want to split
2. Click on table properties on top of table and select `Split cells`
![Slipt table cells](/table-split-cell.gif)
## Cell Properties
1. Select the cell you want to customize
2. Click on table properties button on top
3. Select Cell properties
4. You can now change cell background, text color and border color.
![Cell properties](/cell-properties.png)
## Delete table
1. Select the table
2. Click on table properties button top.
3. Select `Delete table` from drop down menu
![Delete table](/delete-table.png)

View File

@@ -1 +1,23 @@
# Task lists
Manage your task in Notesnook with ease using task lists.
## Adding a title to a task list
When you add a task list to a note, a header is added on top of each task list. You can add a title to the task list.
![task header title](/task-header-title.png)
## Sort completed tasks
Sort completed tasks at the bottom of task list by clicking on the ![sort completed task icon](/sort-task-icon.png) button on the task list header.
## Clear completed tasks
Clear completed tasks by clicking on the ![Clear completed task button](/sort-task-icon.png) button on the task list header.
## Moving tasks with drag and drop
You can move tasks and change the order by drag and drop using the drag handle at the start of each task item.
![Moving tasks](/drag-drop.gif)

View File

@@ -2,12 +2,16 @@
The editor toolbar has all the basic tools for rich formatting of your notes. It also let's you add various blocks to your notes like task lists, images, videos etc.
![Toolbar](/toolbar-editor.png)
## Adding blocks
1. Focus inside the note where you want to insert a block.
2. Click on the ![Toolbar plus](/toolbar-plus.png) button on the toolbar.
3. Select the block you want to insert, for example a task list.
![Toolbar](/toolbar-blocks.png)
## Customzing toolbar
One of the great features of the editor is the ability to customize the editor toolbar to fit your own needs. There's usually many tools in an editor toolbar and being able to hide the tools you never use and just keep what you use more frequently on top helps focus on your note taking.
@@ -16,6 +20,8 @@ One of the great features of the editor is the ability to customize the editor t
To customize the toolbar go to `Settings` > `Editor Settings` and click on `Configure Toolbar`.
![Configure editor toolbar](/config-toolbar-desktop.png)
# [Mobile](#/tab/mobile)
To customize the toolbar go to `Settings` > `Customization` > `Editor` and click on `Configure Toolbar`.

View File

@@ -28,7 +28,6 @@ navigation:
- path: editor/personalizing-editor.md
- path: editor/markdown-shortcuts.md
- path: editor/toolbar.md
- path: editor/outline-lists.md
- path: editor/tables.md
- path: editor/task-lists.md
- path: importing-notes