---
import AppLayout from "components/AppLayout/AppLayout.astro";
---

<AppLayout
  pretitle="Guide to"
  title="Rich Text Editor"
  description="Having troubles using the Rich Text Editor? Looking for tips and advanced techniques? You've come to the right place!">
  <div class="prose">
    <h2>Add indentation / spaces between words</h2>

    <p>
      By default, additional spaces are collapsed. This means that if multiple spaces are adjacent,
      only one space is preserved. To create spaces that will not be collapsed, you can use tabs
      instead. Simply press the <kbd>Tab</kbd> key a few times on your keyboard to create additional
      spaces between words. Be mindful of the use of these spaces.
    </p>

    <h2>Add space between paragraph/elements</h2>

    <p>
      By default, empty paragraphs are not displayed. This is why adding empty paragraph (by
      pressing <kbd>Enter</kbd>) will not result in additional space between elements. In order to
      add empty space, put your carret at the end of the paragraph and press <kbd>Shift</kbd>+<kbd>
        Enter
      </kbd> to create a linebreak.
    </p>
  </div>
</AppLayout>