forked from hero/www_hero_project
add blog
This commit is contained in:
@@ -8,29 +8,30 @@
|
||||
{% endif %}
|
||||
|
||||
<body>
|
||||
|
||||
<div class="md:grid md:grid-cols-2 md:gap-8 relative mt-4 lg:mt-16 items-center container mx-auto pt-0 lg:pt-16">
|
||||
<div class="relative lg:ml-8 my-8 w-full md:w-auto">
|
||||
<h3 class="text-base not-italic leading-6 text-gray-600">FEATURED POST</h3>
|
||||
<a href={{featured.permalink}} class="">
|
||||
<h2
|
||||
class="mt-8 text-2xl main-title sm:text-3xl md:text-4xl lg:text-5xl fw-500 leading-snug font-normal mb-4 md:mb-10 ">
|
||||
<div class="lg:grid lg:grid-cols-2 lg:gap-8 relative mt-12 pt-6 lg:pt-16 px-6 lg:px-0 lg:mt-10 items-center py-10 container mx-auto flex flex-col-reverse lg:flex-row">
|
||||
<!-- Image Section (Will be displayed first on small screens) -->
|
||||
<div class="relative lg:mt-0 max-w-full order-1 lg:order-2">
|
||||
<img class="relative mx-auto mt-10 lg:mt-16 rounded-lg max-h-64 py-0" src="{{featured.permalink}}{{featured.extra.imgPath}}" alt="" />
|
||||
</div>
|
||||
<!-- Text Content Section (Will be displayed first on larger screens) -->
|
||||
<div class="relative w-full md:w-auto mx-3 lg:mx-12 order-2 lg:order-1">
|
||||
<h3 class="text-base not-italic font-medium leading-6 text-indigo-400 mb-4">FEATURED POST</h3>
|
||||
<a href="{{featured.permalink}}">
|
||||
<h2 class="text-2xl main-title lg:text-3xl fw-500 leading-snug font-semibold">
|
||||
{{ featured.title }}
|
||||
</h2>
|
||||
<p class="mt-4 text-base font-light text-gray-50 text-left">
|
||||
{{ featured.description }}
|
||||
</p>
|
||||
</a>
|
||||
<h4 class="text-sm not-italic font-light leading-6 text-gray-600">
|
||||
{{ featured.date | date(format="%B %e, %Y", timezone="America/Chicago")}} -
|
||||
<h4 class="mt-2 mb-6 lg:mb-10 text-sm not-italic font-light leading-6 text-gray-200">
|
||||
{{ featured.date | date(format="%B %e, %Y", timezone="America/Chicago")}}
|
||||
</h4>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="mx-4 relative lg:mt-0 max-w-full">
|
||||
<img class="relative mx-auto md:w-auto rounded md:max-w-full max-h-80" src={{featured.permalink}}{{featured.extra.imgPath}} alt="" />
|
||||
<a href="#" class="rounded-md mt-6 lg:mt-12 bg-indigo-500 px-3.5 py-2.5 font-semibold text-white shadow-sm text-sm hover:bg-indigo-400 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-400">Read More</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr class="mt-6">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<hr class="mt-6 container mx-auto">
|
||||
<br>
|
||||
<br>
|
||||
</body>
|
||||
|
Reference in New Issue
Block a user