docs.html

---
title: Documentation
layout: doc
permalink: /docs/
description: The official documentation center for Hyperspace projects.
---
<style>
    .doc-cards {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        grid-auto-rows: 1fr;
    }

    .doc-card {
        box-shadow: var(--theme-shadow);
        margin: 4px;
        padding: 8px;
        border-radius: 2px;
        text-align: center;
        transition: box-shadow 0.25s;
    }

    .doc-card:hover {
        box-shadow: var(--theme-shadow-big);
        transition: box-shadow 0.25s;
    }

    .doc-card .fa {
        font-size: 2.5em;
    }

    .doc-card small {
        color: #888888;
    }

    .doc-cards a {
        color: black;
    }

    @media(max-width: 768px) {
        .doc-cards {
            grid-template-columns: repeat(1, 1fr);
        }
    }
</style>
<div class="section">
    <p>Welcome to the official documentation center for Hyperspace! Select a document to read from the docs list or search for a topic.</p>
</div>
<div class="section">
    <h2>Release Notes</h2>
    <p>You can access the release notes for our current projects here.</p>
    {% for note in site.releases %}
    <div>
        <a href="{{ note.url }}"><h4>{{ note.title }}</h4></a>
        <p style="margin-bottom: 0;">{{ note.description }}</div>
    </div>
    {% endfor %}
</div>
<!-- <div class="doc-cards">
    {% for note in site.releases %}
    <a href="{{ note.url }}">
        <div class="doc-card">
            <p><i class="fa fa-book-open"></i></p>
            <h4>{{ note.title }}</h4>
            <p>{{ note.description }}</p>
        </div>
    </a>
    {% endfor %}
</div> -->