@hestia-earth/guide v0.0.16

Hestia Guide

This repository contains the raw content of the guide written in Markdown language.

Every file under src/content will be automatically deployed to https://www-dev.hestia.earth/guide?branc= for testing.

Note: only lower chars, dashes (-) and numbers are allowed in the filenames.

Writing Guidelines

1. Create a new file under src/content and make sure the filename only uses lowercase letters, numbers and dashes.
2. Add the file to the src/index.yaml file, defining the structure of the menu.

3. Start the file with a header level 1 using #. Example:

   # This is the header
   
   This is the content.
   
   ## This is a sub-header

The header level 1 will be automatically used as Title for the Guide page, so please try to keep it short, and do not use special characters.

The second line (omitting the blank lines) will be used as abstract.

Example: if you are adding a page called "Signing in" under "HESTIA 101":

• add src/content/hestia-101/signin.md file;
• add a new entry - id: signin under the pages array for hestia-101 in src/index.yaml file.

This will automatically:

• show the page under "HESTIA 101" menu
• show the page as item number N in the menu (depending on the page index in the yaml file)
• match the page with the url hestia-101-signin
• the title of the page will be used also in the menu

Adding metadata

It is possible to add a list of metadata, using the following format:

/<name of metadata> ~Title~

These metadata must be added at the end of the file, one per line. The list of metadata is:

Example:

# This is the title

This is the content of the page.

/author ~John Doe~
/tag ~Hestia~
/tag ~Beginners~

Adding collapsible groups

Collapsible blocks (hides the content with a toggle icon) can be added using html code as following:

<div class="collapsibles">
  <div class="collapsible-group">
    <div class="collapsible-header">
      <span>First collapsible header</span>
    </div>
    <div class="collapsible-content">First collapsible content</div>
  </div>

  <div class="collapsible-group">
    <div class="collapsible-header">
      <span>Second collapsible header</span>
    </div>
    <div class="collapsible-content">Second collapsible content</div>
  </div>
</div>

Adding step-by-step content

Step by step content (title including a step number and a content):

<div class="step">
  <div class="step--header">
    <div>1</div>
    <div>This is the first step</div>
  </div>
  <div class="step--image">
    <img src="/assets/step-1.png" />
  </div>
  <div class="step--content">
    <p>Content goes here</p>
  </div>
</div>

Note: the steps--image is optional.

Adding images or videos

To add an image or a video to a page:

• add the file under the src/assets folder. Note: you can use sub-directories to organise the files.
• make sure to use a simple name, without special characters. So only letters and numbers, dashes or underscores.
• in the content of the page, use:

![Text to describe the image](/assets/<path_to_the_file.png|.mpg>)