135 lines
5.6 KiB
PHP
135 lines
5.6 KiB
PHP
@extends('client.raffles.layouts.app')
|
|
@section('content')
|
|
<div class="services-banner">
|
|
<img src="{{ asset($page->banner) }}" width="1425" height="356" alt="events ">
|
|
|
|
</div>
|
|
<section class="section ">
|
|
<div class="flex flex-col gap-5 justify-center items-center text-center">
|
|
<h2 class="text-60 md:text-30 text-sec">Events</h2>
|
|
<div class="title-line mx-auto"></div>
|
|
|
|
|
|
</div>
|
|
</section>
|
|
<div class="py-20 container events">
|
|
<div class="sm:block flex justify-between items-center mb-40 mt-40">
|
|
<h2 class="ld-fh-element inline-block relative mt-10 mb-0 section-heading-sec">
|
|
Upcoming Events
|
|
</h2>
|
|
|
|
</div>
|
|
|
|
<div class="swiper swiper-events mt-40 mb-40">
|
|
<div class="swiper-wrapper">
|
|
@foreach ($upcomingEvents as $event)
|
|
<a href="" class="swiper-slide">
|
|
<div class="event-block relative w-full">
|
|
<div class="w-full rounded-30">
|
|
<img src="{{ asset($event->image) }}" alt="">
|
|
</div>
|
|
<div class="flex items-center gap-20 py-20 px-20 bg-white rounded-30">
|
|
<div>
|
|
<h4 class="text-16 text-ter">Start</h4>
|
|
<h4 class="text-18 font-bold text-black">{{ $event->start_date }}</h4>
|
|
</div>
|
|
<div>
|
|
<h3 class="text-16 text-black">{{ $event->title }}</h3>
|
|
<p class="text-14 p-0 m-0 text-grey">{{ $event->short_description }} </p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
@endforeach
|
|
</div>
|
|
<!-- Pagination -->
|
|
<!-- <div class="swiper-pagination"></div> -->
|
|
<!-- Navigation Buttons -->
|
|
<div class="swiper-button-next"></div>
|
|
<div class="swiper-button-prev"></div>
|
|
</div>
|
|
|
|
|
|
<!-- past events -->
|
|
|
|
<div class="sm:block flex justify-between items-center mb-40 mt-40">
|
|
<h2 class="ld-fh-element inline-block relative mt-10 mb-0 section-heading-sec">
|
|
Past Events
|
|
</h2>
|
|
|
|
</div>
|
|
|
|
<div class="swiper swiper-events mt-40">
|
|
<div class="swiper-wrapper">
|
|
@foreach ($previousEvents as $event)
|
|
<a href="" class="swiper-slide">
|
|
<div class="event-block relative w-full">
|
|
<div class="w-full rounded-30">
|
|
<img src="{{ asset($event->image) }}" alt="">
|
|
</div>
|
|
<div class="flex items-center gap-20 py-20 px-20 bg-white rounded-30">
|
|
<div>
|
|
<h4 class="text-16 text-ter">Start</h4>
|
|
<h4 class="text-18 font-bold text-black">{{ $event->start_date }}</h4>
|
|
</div>
|
|
<div>
|
|
<h3 class="text-16 text-black">{{ $event->title }}</h3>
|
|
<p class="text-14 p-0 m-0 text-grey">{{ $event->short_description }} </p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</a>
|
|
@endforeach
|
|
|
|
</div>
|
|
<!-- Pagination -->
|
|
<!-- <div class="swiper-pagination"></div> -->
|
|
<!-- Navigation Buttons -->
|
|
<div class="swiper-button-next"></div>
|
|
<div class="swiper-button-prev"></div>
|
|
</div>
|
|
|
|
|
|
<!-- Blog -->
|
|
|
|
<div class=" flex flex-col gap-20 justify-center items-center mb-40 mt-40">
|
|
<h2 class="ld-fh-element inline-block relative mt-10 mb-0 section-heading-sec">
|
|
Blog
|
|
</h2>
|
|
<p class="text-18 text-center">Our blog
|
|
features articles written by experts in the field, providing valuable information to help you achieve
|
|
your goals.</p>
|
|
</p>
|
|
|
|
</div>
|
|
|
|
<div class="swiper swiper-events mt-40 mb-20">
|
|
<div class="swiper-wrapper">
|
|
@foreach ($blogs as $blog)
|
|
<a href="{{ route('blog.single', $blog->slug) }}"
|
|
class="swiper-slide flex flex-col gap-20 p-10 blog-post">
|
|
<div class="w-100percent h-210 overflow-hidden rounded-16">
|
|
<img class="w-full h-full object-cover rounded-16" src="{{ asset($blog->image) }}"
|
|
alt="">
|
|
</div>
|
|
<div>
|
|
<span class="bg-gray text-sec rounded-30 text-10 py-5 px-10 mt-10">20 min read</span>
|
|
<h2 class="text-20 text-ter pt-10">{{ $blog->title }}</h2>
|
|
</div>
|
|
<div class="flex flex-col gap-10">
|
|
<p class="text-14 text-black">{{ $blog->short_description }}</p>
|
|
</div>
|
|
</a>
|
|
@endforeach
|
|
</div>
|
|
<!-- Pagination -->
|
|
<!-- <div class="swiper-pagination"></div> -->
|
|
<!-- Navigation Buttons -->
|
|
<div class="swiper-button-next"></div>
|
|
<div class="swiper-button-prev"></div>
|
|
</div>
|
|
|
|
</div>
|
|
@endsection
|