<div class="relative w-full first:mb-8 pt-8 px-8 md:px-0 max-w-6xl">

    <div class="w-full md:flex relative blog-title">
        <div class="flex-1"></div>
        <div class="flex-2">
            <div class="text-block md:px-8">
                <h1>{{ $page->version->name }}</h1>
            </div>
        </div>
    </div>

    <div class="w-full md:flex relative blog-author">
        <div class="flex-1"></div>
        <div class="flex-2 flex">
            <div class="text-block flex flex-col md:px-8 py-1">
                <div class="flex items-center">
                    <div class="text-xs"><fa-icon icon="fas fa-clock"></fa-icon></div>
                    @if ($page->first_published_at) 
                        <div class="pl-1">{{ $page->first_published_at->format('j F Y') }}</div>
                    @else 
                        <div class="pl-1 font-semibold italics">DRAFT</div>
                    @endif
                </div>
                <div class="italic">{{ $page->author }}</div>
            </div>
        </div>
    </div>

    @if ($page->tags && false === 'Create a page that can parse news based on blog tags') 
        <div class="w-full md:flex relative mt-1 blog-tags">
            <div class="flex-1"></div>
            <div class="flex-2">
                <div class="text-block md:px-8 flex items-center">
                    @foreach ($page->tags as $tag)
                        <a href="/blogs/tags/{{ $tag->id }}" class="tag px-2">{{ $tag->name }}</a>
                    @endforeach
                </div>
            </div>
        </div>
    @endif
</div>
