You've already forked framexEngine-pro
Firts up
This commit is contained in:
155
app/views/blocks/blog-list/blog-list-4.php
Normal file
155
app/views/blocks/blog-list/blog-list-4.php
Normal file
@@ -0,0 +1,155 @@
|
||||
|
||||
<section>
|
||||
<!-- Container -->
|
||||
<div class="mx-auto w-full max-w-7xl px-5 py-16 md:px-10 md:py-20">
|
||||
<div class="text-center mb-12">
|
||||
<!-- Title -->
|
||||
<h2 class="mb-4 mt-6 text-3xl font-bold md:text-5xl">
|
||||
The latest and greatest news
|
||||
</h2>
|
||||
<p class="text-gray-500 mt-2">
|
||||
Lorem ipsum dolor sit amet elit ut aliquam
|
||||
</p>
|
||||
<!-- Buttons -->
|
||||
<div class="my-10 md:my-20 flex flex-col md:flex-row justify-center gap-3">
|
||||
<button class="px-4 py-2 bg-gray-100 font-semibold rounded-full">
|
||||
Engaging Articles
|
||||
</button>
|
||||
<button class="px-4 py-2 bg-black text-white font-semibold rounded-full">
|
||||
Product Updates
|
||||
</button>
|
||||
<button class="px-4 py-2 bg-gray-100 font-semibold rounded-full">
|
||||
Reflex Workflows
|
||||
</button>
|
||||
<button class="px-4 py-2 bg-gray-100 font-semibold rounded-full">
|
||||
Artificial Intelligence
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Blog Content -->
|
||||
<div class="max-w-6xl mx-auto">
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-6">
|
||||
<!-- Blog Item -->
|
||||
<div class=" bg-gray-50 rounded-lg overflow-hidden">
|
||||
<div class="relative h-80">
|
||||
<img class="h-80 w-full object-cover" src="<?= image() ?>" alt="" />
|
||||
<a class="absolute bottom-5 right-5 btn btn-secondary ">
|
||||
Product Updates
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="p-4 flex justify-between items-center">
|
||||
<div>
|
||||
<h2 class="text-lg font-semibold mt-2">
|
||||
Here is the title for this News
|
||||
</h2>
|
||||
<p>Lorem ipsum dolor sit amet elit ut aliquam</p>
|
||||
</div>
|
||||
|
||||
<button class="cursor-pointer h-14 w-14">
|
||||
<svg class="h-14 w-14" width="60" height="60" viewBox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M30.0001 52.5001C42.4265 52.5001 52.5001 42.4265 52.5001 30.0001C52.5001 17.5736 42.4265 7.5 30.0001 7.5C17.5736 7.5 7.5 17.5736 7.5 30.0001C7.5 42.4265 17.5736 52.5001 30.0001 52.5001Z" fill="black" stroke="black" stroke-width="2" stroke-miterlimit="10" />
|
||||
<path d="M31.4297 37.9454L39.375 30L31.4297 22.0547" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
|
||||
<path d="M20.625 30H39.3751" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Blog Item -->
|
||||
<div class="relative bg-gray-50 rounded-lg overflow-hidden">
|
||||
<div class="relative h-80">
|
||||
<img class="h-80 w-full object-cover" src="<?= image() ?>" alt="" />
|
||||
<a class="absolute bottom-5 right-5 btn btn-secondary ">
|
||||
Product Updates
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="p-4 flex justify-between items-center">
|
||||
<div>
|
||||
<h2 class="text-lg font-semibold mt-2">
|
||||
Here is the title for this News
|
||||
</h2>
|
||||
<p>Lorem ipsum dolor sit amet elit ut aliquam</p>
|
||||
</div>
|
||||
|
||||
<button class="cursor-pointer h-14 w-14">
|
||||
<svg class="h-14 w-14" width="60" height="60" viewBox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M30.0001 52.5001C42.4265 52.5001 52.5001 42.4265 52.5001 30.0001C52.5001 17.5736 42.4265 7.5 30.0001 7.5C17.5736 7.5 7.5 17.5736 7.5 30.0001C7.5 42.4265 17.5736 52.5001 30.0001 52.5001Z" fill="black" stroke="black" stroke-width="2" stroke-miterlimit="10" />
|
||||
<path d="M31.4297 37.9454L39.375 30L31.4297 22.0547" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
|
||||
<path d="M20.625 30H39.3751" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-3 gap-6">
|
||||
<!-- Blog Item -->
|
||||
<div class="bg-gray-50 rounded-lg overflow-hidden">
|
||||
<div class="relative h-72">
|
||||
<img class="h-72 w-full object-cover" src="<?= image() ?>" alt="" />
|
||||
<a class="absolute bottom-5 right-5 btn btn-secondary ">
|
||||
Product Updates
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="p-4">
|
||||
<h2 class="text-lg font-semibold mt-2">
|
||||
Here is the title for this News
|
||||
</h2>
|
||||
<p class="text-gray-500">
|
||||
We make every expression of Hero Spirits with precision and
|
||||
passion
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Blog Item -->
|
||||
<div class=" bg-gray-50 rounded-lg overflow-hidden">
|
||||
<div class="relative h-72">
|
||||
<img class="h-72 w-full object-cover" src="<?= image() ?>" alt="" />
|
||||
<a class="absolute bottom-5 right-5 btn btn-secondary ">
|
||||
Product Updates
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="p-4">
|
||||
<h2 class="text-lg font-semibold mt-2">
|
||||
Here is the title for this News
|
||||
</h2>
|
||||
<p class="text-gray-500">
|
||||
We make every expression of Hero Spirits with precision and
|
||||
passion
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Blog Item -->
|
||||
<div class="bg-gray-50 rounded-lg overflow-hidden">
|
||||
<div class="relative h-72">
|
||||
<img class="h-72 w-full object-cover" src="<?= image() ?>" alt="" />
|
||||
<a class="absolute bottom-5 right-5 btn btn-secondary ">
|
||||
Product Updates
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="p-4">
|
||||
<h2 class="text-lg font-semibold mt-2">
|
||||
Here is the title for this News
|
||||
</h2>
|
||||
<p class="text-gray-500">
|
||||
We make every expression of Hero Spirits with precision and
|
||||
passion
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Button -->
|
||||
<div class="mt-10 md:mt-20 text-center">
|
||||
<button class="px-6 py-2 bg-black text-white rounded-lg">
|
||||
Load More
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
Reference in New Issue
Block a user