[typhoon] page-toc plugin support

[Sogl]

How? What styles and templates I need to add?

Like in Grav Learn:

[Sogl]

That's how I did it. I use inherited Typhoon theme.

In partials/toc.html.twig:

{% if config.get('plugins.page-toc.active') or attribute(page.header, 'page-toc').active %}
    {% set table_of_contents = toc(page.content) %}
    {% if table_of_contents is not empty %}
    <div class="page-toc prose bg-gray-100 dark:bg-gray-800" x-data="{ open: true }" 
:class="{'toc-closed': !open}">
      <span class="toc-toggle" @click="open=!open">{{ svg_icon('tabler/chevron-up.svg', '')|raw }}</span>
      <h5>{{ 'THEME_TYPHOON.BLOG.TOC'|t }}</h5>
      {{ table_of_contents|raw }}
    </div>
    {% endif %}
{% endif %}

In css/site.css:

.page-toc {
    float: right;
    width: 300px;
    padding: 0.5rem 0.75rem;
    margin-left: 1.5rem;
    margin-right: 0;
    margin-bottom: 1rem;
    margin-top: 10px;
    font-size: .8rem;
    overflow: hidden;
}
.page-toc.toc-closed {
    height: 40px;
    margin-bottom: 0.5rem;
}

.page-toc.toc-closed .toc-toggle .icon-tabler-chevron-up {
    transform: rotate(180deg);
}

.page-toc h5 {
    margin: 0 0 1rem;
    font-weight: 500;
    font-size: 1rem;
}

.page-toc .toc-toggle {
    font-size: 1.2rem;
    display: block;
    float: right;
    margin-top: -8px;
    margin-right: -10px;
    padding: 5px 10px;
    line-height: 1;
    color: #667189;
    cursor: pointer;
}

.page-toc ul {
    margin-left: 1rem;
    margin-bottom: 0;
    padding-left: 0;
    --tw-prose-bullets: #808CA1;
}

.page-toc li {
    margin-top: 0;
    list-style: decimal;
    color: #808ba1;
}

@media (max-width: 600px) {
    .page-toc {
        float: none;
        width: 100%;
        margin-top: 0.5rem;
        margin-left: 0;
        margin-bottom: 0;
    }
}

in templates/post.html.twig:

...
    {% block items %}

      {% include 'partials/toc.html.twig' %}

      <article class="magic-content {{ prose_style }} max-w-none my-6">
...

White color scheme:

Dark color scheme:

[rhukster]

Looks good!

[Sogl]

Will this be integrated in the next theme version?