Article html structure layout

content.twig

<article>
        <section class="top-pointer">
            <ul>
                <li class="category">cate</li>
                <li>
                    <ul>
                        <li>Previous Article</li>
                        <li>Next Article</li>
                    </ul>
                </li>
            </ul>
        </section>
        <section class="title">
            <header>
                <h3>{{ post.title }}</h3>
            </header>
        </section>
        {% if post.post_excerpt %}
            <section class="excerpt">
                {{ post.post_excerpt }}
            </section>
        {% endif %}
        <section class="meta-data">
            <div class="author-name">
                {{ post.author.first_name }} {{ post.author.last_name }}
            </div>
            <ul>
                <li>
                    date in cats
                </li>
                <li>
                    <ul>
                        social share
                    </ul>
                </li>
            </ul>
        </section>
        <section class="main-content">
            {% if post.thumbnail %}
                <div class="featured-image">
                    <img src="{{ post.thumbnail.src }}"
                         class="my-thumb-class"
                         alt="Image for {{ post.title }}"/>
                    {% if post.thumbnail.caption %}
                        <p>{{ post.thumbnail.caption }}</p>
                    {% endif %}
                </div>
            {% endif %}
            <div class="content">
                {{ post.content }}
            </div>
            <footer>
                <div class="foot-note">
                    foot notes
                </div>
                <div class="share-article">
                    share article
                </div>
                <section class="article-nav-link">
                    <ul>
                        <li>
                            Back to cat nam
                        </li>
                        <li>
                            <ul>
                                <li>Previous article</li>
                                <li>Next article</li>
                            </ul>
                        </li>
                    </ul>
                </section>
            </footer>
        </section>
    </article>