# Grid Content #8

{% tabs %}
{% tab title="Preview" %}

<figure><img src="/files/HZKVyiXLoi97NhPu6iH6" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="HTML Code" %}
{% code lineNumbers="true" %}

```html
<!-- Start - Block - Grid Content #8 -->
<div class="row row-cols-1 row-cols-lg-2 mx-0 px-0">

    <!-- Start item -->
    <div class="rui-card-item col mb-4">
        <div class="rui-card--colorized rui-rounded--lg text-center" style="background-color: #ffddd7;">
            <div class="rui-card-body">

                <!-- icon -->
                <div class=" mb-3">
                    <svg width="90px" height="90px" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="currentColor">
                        <path d="M12 21V7a2 2 0 012-2h7.4a.6.6 0 01.6.6v13.114M12 21V7a2 2 0 00-2-2H2.6a.6.6 0 00-.6.6v13.114M14 19h8M10 19H2" stroke="#000000" stroke-width="1.5" stroke-linecap="round"></path>
                        <path d="M12 21a2 2 0 012-2M12 21a2 2 0 00-2-2" stroke="#000000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
                    </svg>
                </div>
                <!-- end icon -->

                <h3 class="display-3">Get started</h3>
                <p class="text-size-lg mt-3">Check out the documentation page. Learn how to start and set up everything from scratch.</p>
                <a href="https://rosea.io" class="btn btn-lg btn-dark mt-4">Let's get started</a>
            </div>
        </div>
    </div>
    <!-- End item -->

    <!-- Start item -->
    <div class="rui-card-item col mb-4">
        <div class="rui-card--colorized rui-rounded--lg text-center" style="background-color: #feedba;">
            <div class="rui-card-body">

                <!-- icon -->
                <div class="mb-3">
                    <svg width="90px" height="90px" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="currentColor">
                        <path d="M10 15v4a2 2 0 01-2 2H4a2 2 0 01-2-2v-4a2 2 0 012-2h4a2 2 0 012 2zM16 5v4a2 2 0 01-2 2h-4a2 2 0 01-2-2V5a2 2 0 012-2h4a2 2 0 012 2zM22 15v4a2 2 0 01-2 2h-4a2 2 0 01-2-2v-4a2 2 0 012-2h4a2 2 0 012 2zM6 16v-3M12 6V3M18 16v-3" stroke="#000000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
                    </svg>
                </div>
                <!-- end icon -->

                <h3 class="display-3">Blocks Snippets</h3>
                <p class="text-size-lg mt-3">Check the theme front page blocks snippets library. Check how easy and flexible they are.</p>
                <a href="https://rosea.gitbook.io/monocolor/getting-started/front-page-blocks" class="btn btn-lg btn-dark mt-4">Code snippets library</a>
            </div>
        </div>
    </div>
    <!-- End item -->

</div>
<!-- End - Block - Grid Content #8 -->
```

{% endcode %}
{% endtab %}
{% endtabs %}

{% content-ref url="/pages/1qUbO4Fl0XGCANPYeLMK" %}
[How to add more item to blocks?](/space-moodle-theme/theme-settings/front-page-blocks/how-to-add-more-item-to-blocks.md)
{% endcontent-ref %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://rosea.gitbook.io/space-moodle-theme/theme-settings/front-page-blocks/grid-content/grid-content-8.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.