mirror of https://github.com/TriliumNext/Notes
feat(docs): sidebar, table of contents, highlights list
Elian Doran
parent
19a540200e
commit
f58a90c648
Binary file not shown.
|
After Width: | Height: | Size: 50 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.9 KiB |
@ -0,0 +1,45 @@
|
|||||||
|
<html>
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<link rel="stylesheet" href="../../../style.css">
|
||||||
|
<base target="_parent">
|
||||||
|
<title data-trilium-title>Right Sidebar</title>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div class="content">
|
||||||
|
<h1 data-trilium-h1>Right Sidebar</h1>
|
||||||
|
|
||||||
|
<div class="ck-content">
|
||||||
|
<figure class="image">
|
||||||
|
<img style="aspect-ratio:1036/372;" src="Right Sidebar_image.png" width="1036"
|
||||||
|
height="372">
|
||||||
|
</figure>
|
||||||
|
<p>The right sidebar displays specific content for the current note. Currently
|
||||||
|
it includes:</p>
|
||||||
|
<ul>
|
||||||
|
<li><a class="reference-link" href="../../Note%20Types/Text/Table%20of%20contents.html">Table of contents</a>
|
||||||
|
</li>
|
||||||
|
<li><a class="reference-link" href="../../Note%20Types/Text/Highlights%20list.html">Highlights list</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<p>Note that the sidebar is not displayed if it would otherwise be empty,
|
||||||
|
for example if there are too few headings and there are no highlights.</p>
|
||||||
|
<h2>Toggling the right sidebar</h2>
|
||||||
|
<p>The sidebar can be hidden or shown by using the <code>toggleRightPane</code> keyboard
|
||||||
|
shortcut, which is not assigned by default.</p>
|
||||||
|
<h2>Relation with splits</h2>
|
||||||
|
<p>When using <a class="reference-link" href="Split%20View.html">Split View</a>,
|
||||||
|
there is a single sidebar serving all the open splits for the current
|
||||||
|
<a
|
||||||
|
href="Tabs.html">tab</a>.</p>
|
||||||
|
<p>Clicking on a note within the split view will display the sidebar for
|
||||||
|
that note. If there are no items to display in the sidebar, it will remain
|
||||||
|
closed.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 50 KiB |
@ -0,0 +1,52 @@
|
|||||||
|
<html>
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<link rel="stylesheet" href="../../../style.css">
|
||||||
|
<base target="_parent">
|
||||||
|
<title data-trilium-title>Highlights list</title>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div class="content">
|
||||||
|
<h1 data-trilium-h1>Highlights list</h1>
|
||||||
|
|
||||||
|
<div class="ck-content">
|
||||||
|
<figure class="image image-style-align-right">
|
||||||
|
<img style="aspect-ratio:250/150;" src="Highlights list_image.png" width="250"
|
||||||
|
height="150">
|
||||||
|
</figure>
|
||||||
|
<p>Similar to the <a class="reference-link" href="Table%20of%20contents.html">Table of contents</a>,
|
||||||
|
but instead of headings this feature will list highlighted text from a
|
||||||
|
text note and allow easy navigation to them. The list will be displayed
|
||||||
|
in the <a class="reference-link" href="../../Basic%20Concepts%20and%20Features/UI%20Elements/Right%20Sidebar.html">Right Sidebar</a>,
|
||||||
|
provided there is at least one highlighted text.</p>
|
||||||
|
<p>Highlighted text is defined as:</p>
|
||||||
|
<ul>
|
||||||
|
<li>Bold text.</li>
|
||||||
|
<li>Italic text.</li>
|
||||||
|
<li>Underlined text.</li>
|
||||||
|
<li>Text with a foreground color set.</li>
|
||||||
|
<li>Text with a background color/highlight set.</li>
|
||||||
|
</ul>
|
||||||
|
<h2>Interaction</h2>
|
||||||
|
<ul>
|
||||||
|
<li>Clicking on a highlighted text will scroll the document to its position.</li>
|
||||||
|
<li>Pressing the close button will dismiss the list of highlights but it can
|
||||||
|
be shown again from the <a class="reference-link" href="../../Basic%20Concepts%20and%20Features/UI%20Elements/Floating%20buttons.html">Floating buttons</a> section.</li>
|
||||||
|
</ul>
|
||||||
|
<h2>Global configuration</h2>
|
||||||
|
<p>It's possible to toggle the display of each category of highlighted text
|
||||||
|
(as defined above) in the highlights list by going to <a class="reference-link"
|
||||||
|
href="#root/_hidden/_options/_optionsTextNotes">Text Notes</a> settings
|
||||||
|
and looking for the <em>Highlights List</em> section.</p>
|
||||||
|
<h2>Per-note configuration</h2>
|
||||||
|
<p>To suppress the display of highlighted text for one specific note, use
|
||||||
|
<a
|
||||||
|
class="reference-link" href="../../Advanced%20Usage/Attributes.html">Attributes</a> to add the <code>#hideHighlightWidget</code> label.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 6.3 KiB |
@ -0,0 +1,52 @@
|
|||||||
|
<html>
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<link rel="stylesheet" href="../../../style.css">
|
||||||
|
<base target="_parent">
|
||||||
|
<title data-trilium-title>Table of contents</title>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div class="content">
|
||||||
|
<h1 data-trilium-h1>Table of contents</h1>
|
||||||
|
|
||||||
|
<div class="ck-content">
|
||||||
|
<figure class="image image-style-align-right">
|
||||||
|
<img style="aspect-ratio:243/171;" src="Table of contents_image.png" width="243"
|
||||||
|
height="171">
|
||||||
|
</figure>
|
||||||
|
<p>The table of contents appears in the <a class="reference-link" href="../../Basic%20Concepts%20and%20Features/UI%20Elements/Right%20Sidebar.html">Right Sidebar</a> automatically
|
||||||
|
when there are multiple headings in a text note.</p>
|
||||||
|
<h2>Interaction</h2>
|
||||||
|
<ul>
|
||||||
|
<li>Clicking on a heading will scroll the document to the position of the
|
||||||
|
heading.</li>
|
||||||
|
<li>Pressing the close button will dismiss the table of contents but it can
|
||||||
|
be shown again from the <a class="reference-link" href="../../Basic%20Concepts%20and%20Features/UI%20Elements/Floating%20buttons.html">Floating buttons</a> section.</li>
|
||||||
|
</ul>
|
||||||
|
<h2>Global configuration</h2>
|
||||||
|
<p>In <a class="reference-link" href="#root/_hidden/_options/_optionsTextNotes">Text Notes</a> options,
|
||||||
|
look for the <em>Table of Contents</em> section and configure the minimum
|
||||||
|
amount of headings that need to be present in the current note in order
|
||||||
|
for the table of contents to show:</p>
|
||||||
|
<ul>
|
||||||
|
<li>To always hide it, set the value to a really large number (e.g. 10000).</li>
|
||||||
|
<li>To always display it if there's at least a single heading, set the value
|
||||||
|
to 1.</li>
|
||||||
|
</ul>
|
||||||
|
<h2>Per-note configuration</h2>
|
||||||
|
<p>Use <a class="reference-link" href="../../Advanced%20Usage/Attributes.html">Attributes</a> to
|
||||||
|
configure the table of contents for a particular note:</p>
|
||||||
|
<ul>
|
||||||
|
<li><code>#toc=show</code> will show the table of contents for that note regardless
|
||||||
|
of the global settings.</li>
|
||||||
|
<li>Similarly, <code>#toc=hide</code> will always hide the table of contents
|
||||||
|
for that note.</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 6.9 KiB |
Loading…
Reference in New Issue