@extends('frontend.layouts.main')

@section('section')
    <section class="featured-news-area">
        <div class="container">
            <div class="row">
                <div class="col-lg-7 col-md-7">
                    @foreach ($latestPosts->take(1) as $post)
                        <div class="single-featured-news-box">
                            <div class="news-image">
                                <a href="{{ route('post.view', $post->slug) }}">
                                    <img src="{{ asset($post->post_image) }}" alt="{{ $post->title }}" />
                                </a>
                            </div>
                            <div class="news-content">
                                <span>
                                    <a href="{{ $post->category ? route('category', $post->category->slug) : '#' }}"
                                        target="_blank">
                                        {{ $post->category ? $post->category->name : 'Uncategorized' }}
                                    </a>
                                </span>
                                <h3><a href="{{ route('post.view', $post->slug) }}"
                                        target="_blank">{{ Str::limit($post->title, 70) }}</a>
                                </h3>
                                <ul>
                                    <li><i class="icofont-calendar"></i> {{ $post->published_at->format('M d, Y') }}
                                    </li>
                                    <li><a href="{{ route('author.profile', $post->author->name) }}"><i
                                                class="icofont-user"></i>
                                            {{ $post->author ? $post->author->name : 'Admin' }}</a></li>
                                    <li><i class="icofont-eye-alt"></i> {{ $post->views }} Views</li>
                                    <li><i class="icofont-speech-comments"></i> {{ $post->comments->count() }} Comments
                                    </li>
                                    {{-- <li>5 Mins Read</li> --}}
                                </ul>
                                <p>{{ Str::limit(strip_tags($post->content), 180) }}</p>
                                <a href="{{ route('post.view', $post->slug) }}" class="read-more-btn" target="_blank">Read
                                    More</a>
                            </div>
                        </div>
                    @endforeach
                </div>
                <div class="col-lg-5 col-md-5">
                    <div class="more-featured-news">
                        <div class="section-title">
                            <h2>Latest Posts</h2>
                        </div>
                        @foreach ($latestPosts->skip(1)->take(5) as $post)
                            <div class="featured-media-news">
                                <div class="news-content">
                                    <span>
                                        <a href="{{ $post->category ? route('category', $post->category->slug) : '#' }}"
                                            target="_blank">
                                            {{ $post->category ? $post->category->name : 'Uncategorized' }}
                                        </a>
                                    </span>
                                    <h3><a href="{{ route('post.view', $post->slug) }}"
                                            target="_blank">{{ Str::limit($post->title, 70) }}</a>
                                    </h3>
                                    <ul>
                                        <li><i class="icofont-calendar"></i> {{ $post->published_at->format('M d, Y') }}
                                        </li>
                                        <li><a href="{{ route('author.profile', $post->author->name) }}"><i
                                                    class="icofont-user"></i>
                                                {{ $post->author ? $post->author->name : 'Admin' }}</a></li>
                                        <li><i class="icofont-eye-alt"></i> {{ $post->views }} Views</li>
                                        <li><i class="icofont-speech-comments"></i> {{ $post->comments->count() }} Comments
                                        </li>
                                        {{-- <li>5 Mins Read</li> --}}
                                    </ul>
                                </div>
                            </div>
                        @endforeach
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section class="popular-news-area ptb-40 pb-0">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 col-md-12">
                    <div class="section-title">
                        <h2>Most Popular</h2>
                    </div>
                    <div class="row">
                        <div class="popular-news-slides owl-carousel owl-theme owl-loaded owl-drag">
                            <div class="owl-stage-outer">
                                <div class="owl-stage">
                                    @foreach ($mostPopularPosts as $index => $post)
                                        <div class="owl-item {{ $index > 2 ? 'cloned' : '' }} {{ $index == 0 ? 'active' : '' }}"
                                            style="width: 257px; margin-right: 30px;">
                                            <div class="col-lg-12 col-md-12">
                                                <div class="single-popular-news">
                                                    <div class="news-image">
                                                        <img src="{{ asset($post->post_image) }}"
                                                            alt="{{ $post->title }}">
                                                    </div>
                                                    <div class="news-content">
                                                        <h3>{{ Str::limit($post->title, 70) }}</h3>
                                                        <span>
                                                            <i
                                                                class="icofont-calendar"></i>{{ $post->published_at->format('M d, Y') }}
                                                        </span>
                                                    </div>
                                                    <a href="{{ route('post.view', $post->slug) }}"
                                                        class="link-overlay"></a>
                                                    <div class="tags {{ 'bg-' . $loop->iteration }}">
                                                        <a
                                                            href="{{ $post->category ? route('category', $post->category->slug) : '#' }}">
                                                            {{ $post->category ? $post->category->name : 'Uncategorized' }}
                                                        </a>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    @endforeach
                                </div>
                            </div>
                            <div class="owl-nav">
                                <button type="button" role="presentation" class="owl-prev"><i
                                        class="icofont-rounded-left"></i></button>
                                <button type="button" role="presentation" class="owl-next"><i
                                        class="icofont-rounded-right"></i></button>
                            </div>
                            <div class="owl-dots disabled"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    {{-- <section class="featured-news-area">
        <div class="container">
            <div class="row">
                <div class="col-lg-7 col-md-7">
                    <div class="single-featured-news-box">
                        <div class="news-image">
                            <a href="https://templates.envytheme.com/sinmun/default/single-post-3.html"><img
                                    src="{{ asset('frontend/images/2.jpg ' ) }}"
                                    alt="image"></a>
                        </div>
                        <div class="news-content">
                            <span>Marketing</span>
                            <h3><a href="https://templates.envytheme.com/sinmun/default/single-post-2.html">As well as
                                    stopping goals for an, Cristiane Endler is opening</a></h3>
                            <ul>
                                <li>Aug 14 2024</li>
                                <li>5 Mins Read</li>
                            </ul>
                            <p>More off this less hello salamander lied porpoise much over tightly circa horse taped so
                                innocuously outside crud mightily rigorous.</p>
                            <a href="https://templates.envytheme.com/sinmun/default/single-post-2.html"
                                class="read-more-btn">Read More</a>
                        </div>
                    </div>
                </div>
                <div class="col-lg-5 col-md-5">
                    <div class="more-featured-news">
                        <div class="section-title">
                            <h2>More Featured</h2>
                        </div>
                        <div class="featured-media-news">
                            <div class="news-content">
                                <span>Marketing</span>
                                <h3><a href="https://templates.envytheme.com/sinmun/default/single-post-3.html">As well
                                        as stopping goals for an, Cristiane Endler is opening</a></h3>
                                <ul>
                                    <li>Aug 14 2024</li>
                                    <li>5 Mins Read</li>
                                </ul>
                            </div>
                        </div>
                        <div class="featured-media-news">
                            <div class="news-content">
                                <span>Marketing</span>
                                <h3><a href="https://templates.envytheme.com/sinmun/default/single-post-3.html">As well
                                        as stopping goals for an, Cristiane Endler is opening</a></h3>
                                <ul>
                                    <li>Aug 14 2024</li>
                                    <li>5 Mins Read</li>
                                </ul>
                            </div>
                        </div>
                        <div class="featured-media-news">
                            <div class="news-content">
                                <span>Marketing</span>
                                <h3><a href="https://templates.envytheme.com/sinmun/default/single-post-3.html">As well
                                        as stopping goals for an, Cristiane Endler is opening</a></h3>
                                <ul>
                                    <li>Aug 14 2024</li>
                                    <li>5 Mins Read</li>
                                </ul>
                            </div>
                        </div>
                        <div class="featured-media-news">
                            <div class="news-content">
                                <span>Marketing</span>
                                <h3><a href="https://templates.envytheme.com/sinmun/default/single-post-3.html">As well
                                        as stopping goals for an, Cristiane Endler is opening</a></h3>
                                <ul>
                                    <li>Aug 14 2024</li>
                                    <li>5 Mins Read</li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section> --}}
    <section class="ptb-40 default-news-area bg-color-none pb-0">
        <div class="container">
            <div class="section-title">
                <h2>Tranding News</h2>
            </div>
            <div class="row">
                {{-- LEFT MAIN NEWS --}}
                <div class="col-lg-6 col-md-12">
                    @if ($defaultNews->count())
                        @php $main = $defaultNews->first(); @endphp
                        <div class="single-default-news">
                            <img src="{{ asset($main->post_image) }}" alt="{{ $main->title }}">
                            <div class="news-content">
                                <ul>
                                    <li>
                                        <i class="icofont-user-suited"></i>
                                        by <a href="{{ route('author.profile', $main->author->name ?? '#') }}">
                                            {{ $main->author->name ?? 'Admin' }}
                                        </a>
                                    </li>
                                    <li><i class="icofont-calendar"></i> {{ $main->published_at->format('M d, Y') }}</li>
                                </ul>
                                <h3>
                                    <a href="{{ route('post.view', $main->slug) }}">
                                        {{ Str::limit($main->title, 70) }}
                                    </a>
                                </h3>
                            </div>
                            <div class="tags">
                                <a href="{{ $main->category ? route('category', $main->category->slug) : '#' }}">
                                    {{ $main->category->name ?? 'General' }}
                                </a>
                            </div>
                        </div>
                    @endif

                    {{-- 2 INNER LEFT NEWS --}}
                    <div class="row">
                        @foreach ($defaultNews->skip(1)->take(2) as $post)
                            <div class="col-lg-6 col-md-6">
                                <div class="single-default-inner-news">
                                    <div class="news-image">
                                        <img src="{{ asset($post->post_image) }}" alt="{{ $post->title }}">
                                    </div>
                                    <div class="news-content">
                                        <h3>{{ Str::limit($post->title, 50) }}</h3>
                                        <span><i class="icofont-calendar"></i>
                                            {{ $post->published_at->format('M d, Y') }}</span>
                                        <p>{{ Str::limit(strip_tags($post->content), 100) }}</p>
                                    </div>
                                    <a href="{{ route('post.view', $post->slug) }}" class="link-overlay"></a>
                                    <div class="tags bg-2">
                                        <a href="{{ $post->category ? route('category', $post->category->slug) : '#' }}">
                                            {{ $post->category->name ?? 'News' }}
                                        </a>
                                    </div>
                                </div>
                            </div>
                        @endforeach
                    </div>
                </div>
                {{-- RIGHT 2 NEWS --}}
                <div class="col-lg-3 col-md-12">
                    @foreach ($defaultNews->skip(3)->take(2) as $post)
                        <div class="single-default-inner-news">
                            <div class="news-image">
                                <img src="{{ asset($post->post_image) }}" alt="{{ $post->title }}">
                            </div>
                            <div class="news-content">
                                <h3>{{ Str::limit($post->title, 55) }}</h3>
                                <span><i class="icofont-calendar"></i> {{ $post->published_at->format('M d, Y') }}</span>
                                <p>{{ Str::limit(strip_tags($post->content), 100) }}</p>
                            </div>
                            <a href="{{ route('post.view', $post->slug) }}" class="link-overlay"></a>
                            <div class="tags bg-4">
                                <a href="{{ $post->category ? route('category', $post->category->slug) : '#' }}">
                                    {{ $post->category->name ?? 'News' }}
                                </a>
                            </div>
                        </div>
                    @endforeach
                </div>
                {{-- VIDEO NEWS --}}
                <div class="col-lg-3 col-md-12">
                    <div class="default-video-news p-0">
                        <h3 class="title">Video</h3>
                        <div class="single-video-news">
                            <div class="image">
                                <img src="{{ asset('frontend/images/video-1.jpg ') }}" alt="image"> <a
                                    href="https://www.youtube.com/watch?v=bk7McNUjWgw" class="popup-youtube"><i
                                        class="icofont-video-cam"></i></a>
                            </div>
                            <div class="content">
                                <h3><a href="https://templates.envytheme.com/sinmun/default/single-post-3.html">Gloost
                                        Better They Are With A Featured</a></h3>
                            </div>
                        </div>
                        <div class="single-video-news">
                            <div class="image">
                                <img src="{{ asset('frontend/images/video-2.jpg ') }}" alt="image"> <a
                                    href="https://www.youtube.com/watch?v=bk7McNUjWgw" class="popup-youtube"><i
                                        class="icofont-video-cam"></i></a>
                            </div>
                            <div class="content">
                                <h3><a href="https://templates.envytheme.com/sinmun/default/single-post-2.html">Differences
                                        between User Experience Interface</a></h3>
                            </div>
                        </div>
                        <div class="single-video-news">
                            <div class="image">
                                <img src="{{ asset('frontend/images/video-3.jpg ') }}" alt="image"> <a
                                    href="https://www.youtube.com/watch?v=bk7McNUjWgw" class="popup-youtube"><i
                                        class="icofont-video-cam"></i></a>
                            </div>
                            <div class="content">
                                <h3><a href="https://templates.envytheme.com/sinmun/default/single-post-4.html">A Guide
                                        to Avoiding Web Design Mistakes</a></h3>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    {{-- <section class="popular-news-area ptb-40">
        <div class="container">
            <div class="row">
                <div class="col-lg-3 col-md-12">
                    <div class="popular-section-ads">
                        <a href="https://templates.envytheme.com/sinmun/default/single-post-3.html"><img
                                src="{{ asset('frontend/images/2-ads.png') }}" alt="image"></a>
                    </div>
                </div>
                <div class="col-lg-9 col-md-12">
                    <div class="section-title">
                        <h2>Most Popular</h2>
                    </div>
                    <div class="row">
                        <div class="popular-news-slides owl-carousel owl-theme owl-loaded owl-drag">




                            <div class="owl-stage-outer">
                                <div class="owl-stage"
                                    style="transform: translate3d(-1148px, 0px, 0px); transition: 0.25s; width: 2870px;">
                                    <div class="owl-item cloned" style="width: 257px; margin-right: 30px;">
                                        <div class="col-lg-12 col-md-12">
                                            <div class="single-popular-news">
                                                <div class="news-image"><img src="{{ asset('frontend/images/7.jpg ') }}"
                                                        alt="image"></div>
                                                <div class="news-content">
                                                    <h3>Take the Tour to Explore the New Header Manager</h3>
                                                    <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                                </div>
                                                <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"
                                                    class="link-overlay"></a>
                                                <div class="tags bg-5"><a
                                                        href="https://templates.envytheme.com/sinmun/default/post-category-3.html">Sports</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item cloned" style="width: 257px; margin-right: 30px;">
                                        <div class="col-lg-12 col-md-12">
                                            <div class="single-popular-news">
                                                <div class="news-image"><img src="{{ asset('frontend/images/8.jpg ') }}"
                                                        alt="image"></div>
                                                <div class="news-content">
                                                    <h3>Sinmun theme is part of the big WPML family</h3>
                                                    <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                                </div>
                                                <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"
                                                    class="link-overlay"></a>
                                                <div class="tags bg-3"><a
                                                        href="https://templates.envytheme.com/sinmun/default/post-category-2.html">Sports</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item cloned" style="width: 257px; margin-right: 30px;">
                                        <div class="col-lg-12 col-md-12">
                                            <div class="single-popular-news">
                                                <div class="news-image"><img src="{{ asset('frontend/images/1.jpg ') }}"
                                                        alt="image"></div>
                                                <div class="news-content">
                                                    <h3>Copy – Paste the Style of your elements in Newspaper</h3>
                                                    <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                                </div>
                                                <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"
                                                    class="link-overlay"></a>
                                                <div class="tags bg-4"><a
                                                        href="https://templates.envytheme.com/sinmun/default/post-category-4.html">Sports</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item" style="width: 257px; margin-right: 30px;">
                                        <div class="col-lg-12 col-md-12">
                                            <div class="single-popular-news">
                                                <div class="news-image"><img src="{{ asset('frontend/images/6.jpg ') }}"
                                                        alt="image"></div>
                                                <div class="news-content">
                                                    <h3>Create the Perfect Logo for your Website</h3>
                                                    <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                                </div>
                                                <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"
                                                    class="link-overlay"></a>
                                                <div class="tags bg-2"><a
                                                        href="https://templates.envytheme.com/sinmun/default/post-category-2.html">Sports</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item active" style="width: 257px; margin-right: 30px;">
                                        <div class="col-lg-12 col-md-12">
                                            <div class="single-popular-news">
                                                <div class="news-image"><img src="{{ asset('frontend/images/7.jpg ') }}"
                                                        alt="image"></div>
                                                <div class="news-content">
                                                    <h3>Take the Tour to Explore the New Header Manager</h3>
                                                    <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                                </div>
                                                <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"
                                                    class="link-overlay"></a>
                                                <div class="tags bg-5"><a
                                                        href="https://templates.envytheme.com/sinmun/default/post-category-3.html">Sports</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item active" style="width: 257px; margin-right: 30px;">
                                        <div class="col-lg-12 col-md-12">
                                            <div class="single-popular-news">
                                                <div class="news-image"><img src="{{ asset('frontend/images/8.jpg ') }}"
                                                        alt="image"></div>
                                                <div class="news-content">
                                                    <h3>Sinmun theme is part of the big WPML family</h3>
                                                    <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                                </div>
                                                <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"
                                                    class="link-overlay"></a>
                                                <div class="tags bg-3"><a
                                                        href="https://templates.envytheme.com/sinmun/default/post-category-2.html">Sports</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item active" style="width: 257px; margin-right: 30px;">
                                        <div class="col-lg-12 col-md-12">
                                            <div class="single-popular-news">
                                                <div class="news-image"><img src="{{ asset('frontend/images/1.jpg ') }}"
                                                        alt="image"></div>
                                                <div class="news-content">
                                                    <h3>Copy – Paste the Style of your elements in Newspaper</h3>
                                                    <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                                </div>
                                                <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"
                                                    class="link-overlay"></a>
                                                <div class="tags bg-4"><a
                                                        href="https://templates.envytheme.com/sinmun/default/post-category-4.html">Sports</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item cloned" style="width: 257px; margin-right: 30px;">
                                        <div class="col-lg-12 col-md-12">
                                            <div class="single-popular-news">
                                                <div class="news-image"><img src="{{ asset('frontend/images/6.jpg ') }}"
                                                        alt="image"></div>
                                                <div class="news-content">
                                                    <h3>Create the Perfect Logo for your Website</h3>
                                                    <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                                </div>
                                                <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"
                                                    class="link-overlay"></a>
                                                <div class="tags bg-2"><a
                                                        href="https://templates.envytheme.com/sinmun/default/post-category-2.html">Sports</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item cloned" style="width: 257px; margin-right: 30px;">
                                        <div class="col-lg-12 col-md-12">
                                            <div class="single-popular-news">
                                                <div class="news-image"><img src="{{ asset('frontend/images/7.jpg ') }}"
                                                        alt="image"></div>
                                                <div class="news-content">
                                                    <h3>Take the Tour to Explore the New Header Manager</h3>
                                                    <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                                </div>
                                                <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"
                                                    class="link-overlay"></a>
                                                <div class="tags bg-5"><a
                                                        href="https://templates.envytheme.com/sinmun/default/post-category-3.html">Sports</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item cloned" style="width: 257px; margin-right: 30px;">
                                        <div class="col-lg-12 col-md-12">
                                            <div class="single-popular-news">
                                                <div class="news-image"><img src="{{ asset('frontend/images/8.jpg ') }}"
                                                        alt="image"></div>
                                                <div class="news-content">
                                                    <h3>Sinmun theme is part of the big WPML family</h3>
                                                    <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                                </div>
                                                <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"
                                                    class="link-overlay"></a>
                                                <div class="tags bg-3"><a
                                                        href="https://templates.envytheme.com/sinmun/default/post-category-2.html">Sports</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="owl-nav"><button type="button" role="presentation" class="owl-prev"><i
                                        class="icofont-rounded-left"></i></button><button type="button"
                                    role="presentation" class="owl-next"><i class="icofont-rounded-right"></i></button>
                            </div>
                            <div class="owl-dots disabled"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section> --}}

    {{-- dynamic data for technology section --}}
    {{-- <section class="technology-area pb-40">
        <div class="container">
            @php

            @endphp

            <div class="section-title">
                <h2>Technology</h2>
            </div>
            <div class="international-news-inner">
                <div class="row">
                    @foreach ($sidePostsTech as $post)
                        <div class="col-lg-4">
                            <div class="single-international-news">
                                <div class="news-image"><img src="{{ asset($post->post_image) }}"
                                        alt="{{ $post->title }}" /></div>
                                <div class="news-content">
                                    <span><i class="icofont-calendar"></i>
                                        {{ $post->published_at->format('M d, Y') }}</span>
                                    <h3><a
                                            href="{{ route('post.view', $post->slug) }}">{{ Str::limit($post->title, 70) }}</a>
                                    </h3>
                                </div>
                            </div>
                        </div>
                    @endforeach

                </div>
            </div>
        </div>
    </section> --}}

    <section class="international-news-area ptb-40">
        <div class="container">
            <div class="row">
                @php

                    $listPostsint = $international->posts;
                    $sidePostsTech = $technology->posts;
                @endphp
                <div class="col-lg-8 col-md-12">
                    <div class="section-title">
                        <h2>International</h2>
                    </div>
                    <div class="international-news-inner">
                        <div class="row">
                            @foreach ($listPostsint as $post)
                                <div class="col-lg-4">
                                    <div class="single-international-news">
                                        <div class="news-image"><img src="{{ asset($post->post_image) }}"
                                                alt="{{ $post->title }}" /></div>
                                        <div class="news-content">
                                            <span><i class="icofont-calendar"></i>
                                                {{ $post->published_at->format('M d, Y') }}</span>

                                            <h3><a
                                                    href="{{ route('post.view', $post->slug) }}">{{ Str::limit($post->title, 70) }}</a>
                                            </h3>
                                        </div>
                                    </div>
                                </div>
                            @endforeach

                        </div>
                    </div>
                    <div class="section-title">
                        <h2>Technology</h2>
                    </div>
                    <div class="international-news-inner">
                        <div class="row">
                            @foreach ($sidePostsTech as $post)
                                <div class="col-lg-4">
                                    <div class="single-international-news">
                                        <div class="news-image"><img src="{{ asset($post->post_image) }}"
                                                alt="{{ $post->title }}" /></div>
                                        <div class="news-content">
                                            <span><i class="icofont-calendar"></i>
                                                {{ $post->published_at->format('M d, Y') }}</span>
                                            <h3><a
                                                    href="{{ route('post.view', $post->slug) }}">{{ Str::limit($post->title, 70) }}</a>
                                            </h3>
                                        </div>
                                    </div>
                                </div>
                            @endforeach

                        </div>
                    </div>
                </div>

                <div class="col-lg-4 col-md-12">
                    @include('frontend.partials.features-news')

                </div>

            </div>
        </div>
    </section>
    {{-- end here category se tion for technology with dynamic data --}}

    <section class="technology-area pb-40">
        <div class="container">

            @php
                $mainPostSport = $sports->posts->first();
                $sidePostsSports = $sports->posts->skip(1)->take(3);
            @endphp

            <div class="row">
                <div class="col-lg-8">
                    <div class="section-title">
                        <h2>Sports</h2>
                    </div>
                    <div class="row">
                        <div class="col-lg-8 col-md-12">
                            <div class="single-technology-news">
                                <img src="{{ asset($mainPostSport->post_image) }}"
                                    alt="{{ asset($mainPostSport->title) }}">
                                <div class="news-content">
                                    <ul>
                                        <li><i class="icofont-user-suited"></i> by <a
                                                href="{{ route('author.profile', $mainPostSport->author->name) }}">{{ $mainPostSport->author->name }}
                                            </a></li>
                                        <li> <i
                                                class="icofont-calendar"></i>{{ $mainPostSport->published_at->format('M d, Y') }}
                                        </li>
                                        <li><i class="icofont-eye-alt"></i> {{ $mainPostSport->views }} Views</li>
                                        <li><i class="icofont-speech-comments"></i>
                                            {{ $mainPostSport->comments->count() }}
                                            Comments
                                        </li>
                                    </ul>
                                    <h3><a href="{{ route('post.view', $mainPostSport->slug) }}"
                                            target="_blank">{{ Str::limit($mainPostSport->title, 70) }}</a></h3>
                                </div>
                                <div class="tags"> <a
                                        href="{{ $mainPostSport->category ? route('category', $mainPostSport->category->slug) : '#' }}"
                                        target="_blank">
                                        {{ $mainPostSport->category ? $mainPostSport->category->name : 'Uncategorized' }}
                                    </a>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-4 col-md-12">
                            <div class="space-news-list">
                                @foreach ($sidePostsSports as $post)
                                    <div class="single-space-news">
                                        <h3><a href="{{ route('post.view', $post->slug) }}"
                                                target="_blank">{{ Str::limit($post->title, 70) }}</a></h3>
                                        <ul>
                                            <li><i class="icofont-clock-time"></i>
                                                {{ $post->published_at->diffForHumans() }}</li>
                                            <li><i class="icofont-tag"></i> <a
                                                    href="{{ $post->category ? route('category', $post->category->slug) : '#' }}"
                                                    target="_blank">
                                                    {{ $post->category ? $post->category->name : 'Uncategorized' }}
                                                </a>
                                            </li>
                                            <li><i class="icofont-speech-comments"></i> <a
                                                    href="{{ route('post.view', $post->slug) }}#comments-section"
                                                    target="_blank">{{ $post->comments->count() }}</a>
                                            </li>
                                        </ul>
                                    </div>
                                @endforeach

                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-12">
                    <div class="newsletter-box">
                        <div class="section-title">
                            <h2>Newsletter</h2>
                        </div>
                        <div class="newsletter-box-inner">
                            <h3>Subscribe To Our Mailing List To Get The New Updates!</h3>
                            <i class="icofont-email"></i>
                            <form class="newsletter-form" data-toggle="validator" novalidate="true">
                                <input type="email" class="newsletter-input" placeholder="Enter your email"
                                    name="EMAIL" required="" autocomplete="off"> <button type="submit"
                                    class="disabled" style="pointer-events: all; cursor: pointer;"><i
                                        class="icofont-paper-plane"></i></button>
                                <div id="validator-newsletter" class="form-result"></div>
                            </form>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </section>

    {{-- <section class="video-news-area ptb-40">
        <div class="container">
            <div class="section-title">
                <h2>Watch Videos</h2>
            </div>
            <div class="row">
                <div class="video-news-slides owl-carousel owl-theme owl-loaded owl-drag">



                    <div class="owl-stage-outer">
                        <div class="owl-stage"
                            style="transform: translate3d(-1719px, 0px, 0px); transition: 0.25s; width: 4011px;">
                            <div class="owl-item cloned" style="width: 543px; margin-right: 30px;">
                                <div class="col-lg-12 col-md-12">
                                    <div class="single-default-news">
                                        <img src="{{ asset('frontend/images/2.jpg ') }}" alt="image">
                                        <div class="news-content">
                                            <ul>
                                                <li><i class="icofont-user-suited"></i> by <a
                                                        href="https://templates.envytheme.com/sinmun/default/author.html">John
                                                        Smith</a></li>
                                                <li><i class="icofont-calendar"></i> March 22, 2024</li>
                                            </ul>
                                            <h3><a
                                                    href="https://templates.envytheme.com/sinmun/default/single-post-2.html">As
                                                    well as stopping goals for an, Cristiane Endler is opening.</a></h3>
                                        </div>
                                        <div class="tags"><a
                                                href="https://templates.envytheme.com/sinmun/default/post-category-1.html">Sports</a>
                                        </div>
                                        <div class="video-btn">
                                            <a href="https://www.youtube.com/watch?v=bk7McNUjWgw" class="popup-youtube"><i
                                                    class="icofont-play-alt-3"></i></a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="owl-item cloned" style="width: 543px; margin-right: 30px;">
                                <div class="col-lg-12 col-md-12">
                                    <div class="single-default-news">
                                        <img src="{{ asset('frontend/images/1.jpg ') }}" alt="image">
                                        <div class="news-content">
                                            <ul>
                                                <li><i class="icofont-user-suited"></i> by <a
                                                        href="https://templates.envytheme.com/sinmun/default/author.html">John
                                                        Smith</a></li>
                                                <li><i class="icofont-calendar"></i> March 22, 2024</li>
                                            </ul>
                                            <h3><a
                                                    href="https://templates.envytheme.com/sinmun/default/single-post-2.html">As
                                                    well as stopping goals for an, Cristiane Endler is opening.</a></h3>
                                        </div>
                                        <div class="tags"><a
                                                href="https://templates.envytheme.com/sinmun/default/post-category-1.html">Sports</a>
                                        </div>
                                        <div class="video-btn">
                                            <a href="https://www.youtube.com/watch?v=bk7McNUjWgw" class="popup-youtube"><i
                                                    class="icofont-play-alt-3"></i></a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="owl-item" style="width: 543px; margin-right: 30px;">
                                <div class="col-lg-12 col-md-12">
                                    <div class="single-default-news">
                                        <img src="{{ asset('frontend/images/6.jpg ') }}" alt="image">
                                        <div class="news-content">
                                            <ul>
                                                <li><i class="icofont-user-suited"></i> by <a
                                                        href="https://templates.envytheme.com/sinmun/default/author.html">John
                                                        Smith</a></li>
                                                <li><i class="icofont-calendar"></i> March 22, 2024</li>
                                            </ul>
                                            <h3><a
                                                    href="https://templates.envytheme.com/sinmun/default/single-post-2.html">As
                                                    well as stopping goals for an, Cristiane Endler is opening.</a></h3>
                                        </div>
                                        <div class="tags"><a
                                                href="https://templates.envytheme.com/sinmun/default/post-category-1.html">Sports</a>
                                        </div>
                                        <div class="video-btn">
                                            <a href="https://www.youtube.com/watch?v=bk7McNUjWgw" class="popup-youtube"><i
                                                    class="icofont-play-alt-3"></i></a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="owl-item active" style="width: 543px; margin-right: 30px;">
                                <div class="col-lg-12 col-md-12">
                                    <div class="single-default-news">
                                        <img src="{{ asset('frontend/images/2.jpg ') }}" alt="image">
                                        <div class="news-content">
                                            <ul>
                                                <li><i class="icofont-user-suited"></i> by <a
                                                        href="https://templates.envytheme.com/sinmun/default/author.html">John
                                                        Smith</a></li>
                                                <li><i class="icofont-calendar"></i> March 22, 2024</li>
                                            </ul>
                                            <h3><a
                                                    href="https://templates.envytheme.com/sinmun/default/single-post-2.html">As
                                                    well as stopping goals for an, Cristiane Endler is opening.</a></h3>
                                        </div>
                                        <div class="tags"><a
                                                href="https://templates.envytheme.com/sinmun/default/post-category-1.html">Sports</a>
                                        </div>
                                        <div class="video-btn">
                                            <a href="https://www.youtube.com/watch?v=bk7McNUjWgw" class="popup-youtube"><i
                                                    class="icofont-play-alt-3"></i></a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="owl-item active" style="width: 543px; margin-right: 30px;">
                                <div class="col-lg-12 col-md-12">
                                    <div class="single-default-news">
                                        <img src="{{ asset('frontend/images/1.jpg ') }}" alt="image">
                                        <div class="news-content">
                                            <ul>
                                                <li><i class="icofont-user-suited"></i> by <a
                                                        href="https://templates.envytheme.com/sinmun/default/author.html">John
                                                        Smith</a></li>
                                                <li><i class="icofont-calendar"></i> March 22, 2024</li>
                                            </ul>
                                            <h3><a
                                                    href="https://templates.envytheme.com/sinmun/default/single-post-2.html">As
                                                    well as stopping goals for an, Cristiane Endler is opening.</a></h3>
                                        </div>
                                        <div class="tags"><a
                                                href="https://templates.envytheme.com/sinmun/default/post-category-1.html">Sports</a>
                                        </div>
                                        <div class="video-btn">
                                            <a href="https://www.youtube.com/watch?v=bk7McNUjWgw" class="popup-youtube"><i
                                                    class="icofont-play-alt-3"></i></a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="owl-item cloned" style="width: 543px; margin-right: 30px;">
                                <div class="col-lg-12 col-md-12">
                                    <div class="single-default-news">
                                        <img src="{{ asset('frontend/images/6.jpg ') }}" alt="image">
                                        <div class="news-content">
                                            <ul>
                                                <li><i class="icofont-user-suited"></i> by <a
                                                        href="https://templates.envytheme.com/sinmun/default/author.html">John
                                                        Smith</a></li>
                                                <li><i class="icofont-calendar"></i> March 22, 2024</li>
                                            </ul>
                                            <h3><a
                                                    href="https://templates.envytheme.com/sinmun/default/single-post-2.html">As
                                                    well as stopping goals for an, Cristiane Endler is opening.</a></h3>
                                        </div>
                                        <div class="tags"><a
                                                href="https://templates.envytheme.com/sinmun/default/post-category-1.html">Sports</a>
                                        </div>
                                        <div class="video-btn">
                                            <a href="https://www.youtube.com/watch?v=bk7McNUjWgw" class="popup-youtube"><i
                                                    class="icofont-play-alt-3"></i></a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="owl-item cloned" style="width: 543px; margin-right: 30px;">
                                <div class="col-lg-12 col-md-12">
                                    <div class="single-default-news">
                                        <img src="{{ asset('frontend/images/2.jpg ') }}" alt="image">
                                        <div class="news-content">
                                            <ul>
                                                <li><i class="icofont-user-suited"></i> by <a
                                                        href="https://templates.envytheme.com/sinmun/default/author.html">John
                                                        Smith</a></li>
                                                <li><i class="icofont-calendar"></i> March 22, 2024</li>
                                            </ul>
                                            <h3><a
                                                    href="https://templates.envytheme.com/sinmun/default/single-post-2.html">As
                                                    well as stopping goals for an, Cristiane Endler is opening.</a></h3>
                                        </div>
                                        <div class="tags"><a
                                                href="https://templates.envytheme.com/sinmun/default/post-category-1.html">Sports</a>
                                        </div>
                                        <div class="video-btn">
                                            <a href="https://www.youtube.com/watch?v=bk7McNUjWgw" class="popup-youtube"><i
                                                    class="icofont-play-alt-3"></i></a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="owl-nav"><button type="button" role="presentation" class="owl-prev"><i
                                class="icofont-rounded-left"></i></button><button type="button" role="presentation"
                            class="owl-next"><i class="icofont-rounded-right"></i></button></div>
                    <div class="owl-dots disabled"></div>
                </div>
            </div>
        </div>
    </section> --}}

    {{-- <section class="international-news-area ptb-40">
        <div class="container">
            <div class="row">
                <div class="col-lg-8 col-md-12">
                    <div class="section-title">
                        <h2>International</h2>
                    </div>
                    <div class="international-news-inner">
                        <div class="row">
                            <div class="col-lg-6">
                                <div class="single-international-news">
                                    <div class="news-image"><img src="{{ asset('frontend/images/6.jpg ') }}"
                                            alt="image"></div>
                                    <div class="news-content">
                                        <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                        <h3><a href="https://templates.envytheme.com/sinmun/default/single-post-3.html">Gloost
                                                Better They Are With A Featured</a></h3>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-6">
                                <div class="international-news-list">
                                    <div class="media news-media align-items-center">
                                        <a href="https://templates.envytheme.com/sinmun/default/single-post-3.html">
                                            <img src="{{ asset('frontend/images/small-1.jpg ') }}" alt="image"> </a>
                                        <div class="content">
                                            <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                            <h3><a
                                                    href="https://templates.envytheme.com/sinmun/default/single-post-1.html">Introducing
                                                    the New 404 Page Templates</a></h3>
                                        </div>
                                    </div>
                                    <div class="media news-media align-items-center">
                                        <a href="https://templates.envytheme.com/sinmun/default/single-post-2.html">
                                            <img src="{{ asset('frontend/images/small-2.jpg ') }}" alt="image"> </a>
                                        <div class="content">
                                            <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                            <h3><a
                                                    href="https://templates.envytheme.com/sinmun/default/single-post-2.html">Newspaper
                                                    Theme: What’s new in v.9</a></h3>
                                        </div>
                                    </div>
                                    <div class="media news-media align-items-center">
                                        <a href="https://templates.envytheme.com/sinmun/default/single-post-3.html">
                                            <img src="{{ asset('frontend/images/small-3.jpg ') }}" alt="image"> </a>
                                        <div class="content">
                                            <span><i class="icofont-calendar"></i> March 22, 2024</span>
                                            <h3><a
                                                    href="https://templates.envytheme.com/sinmun/default/single-post-4.html">Tricks
                                                    to Boost your WordPress Site’s Traffic</a></h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-12">
                    <div class="section-title">
                        <h2>Stay Connected</h2>
                    </div>
                    <ul class="stay-connected">
                        <li>
                            <a href="https://www.facebook.com/login/" target="_blank"><i
                                    class="icofont-facebook"></i><b>10.2K</b> <span>Fans</span></a>
                        </li>
                        <li>
                            <a href="https://twitter.com/login/" target="_blank"><i
                                    class="icofont-twitter"></i><b>14.2K</b> <span>Followers</span></a>
                        </li>
                        <li>
                            <a href="https://linkedin.com/login/" target="_blank"><i
                                    class="icofont-linkedin"></i><b>11.2K</b> <span>Fans</span></a>
                        </li>
                        <li>
                            <a href="https://en.wikipedia.org/wiki/RSS" target="_blank"><i
                                    class="icofont-rss"></i><b>15.2K</b> <span>Subscriber</span></a>
                        </li>
                    </ul>
                    <div class="stay-connected-ads">
                        <a href="https://templates.envytheme.com/sinmun/default/post-category-3.html"><img
                                src="{{ asset('frontend/images/3-ads.png') }}" alt="image"></a>
                    </div>
                </div>
            </div>
        </div>
    </section> --}}

    {{-- <section class="gallery-news-area ptb-40">
        <div class="container">
            <div class="row">
                <div class="col-lg-8 col-md-12">
                    <div class="gallery-news">
                        <div class="section-title">
                            <h2>Gallery News</h2>
                        </div>
                        <div class="gallery-news-inner-slides owl-carousel owl-theme owl-loaded owl-drag">


                            <div class="owl-stage-outer">
                                <div class="owl-stage"
                                    style="transform: translate3d(-2208px, 0px, 0px); transition: 0.25s; width: 4416px;">
                                    <div class="owl-item cloned" style="width: 736px;">
                                        <div class="row align-items-center m-0">
                                            <div class="col-lg-6 col-md-6 p-0">
                                                <div class="gallery-news-content">
                                                    <h3>
                                                        <a
                                                            href="https://templates.envytheme.com/sinmun/default/single-post-2.html"><i
                                                                class="icofont-camera-alt"></i> A glance (18 June
                                                            2024)</a>
                                                    </h3>
                                                    <p>Gloost Better They Are With A Featured. New York, USA, 17 June.
                                                        Photo: John Smith</p>
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 p-0">
                                                <div class="gallery-news-image"><img
                                                        src="{{ asset('frontend/images/gallery-news1.jpg ') }}"
                                                        alt="image"></div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item cloned" style="width: 736px;">
                                        <div class="row align-items-center m-0">
                                            <div class="col-lg-6 col-md-6 p-0">
                                                <div class="gallery-news-content">
                                                    <h3>
                                                        <a
                                                            href="https://templates.envytheme.com/sinmun/default/single-post-2.html"><i
                                                                class="icofont-camera-alt"></i> A glance (18 June
                                                            2024)</a>
                                                    </h3>
                                                    <p>Gloost Better They Are With A Featured. New York, USA, 17 June.
                                                        Photo: John Smith</p>
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 p-0">
                                                <div class="gallery-news-image"><img
                                                        src="{{ asset('frontend/images/gallery-news1.jpg ') }}"
                                                        alt="image"></div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item" style="width: 736px;">
                                        <div class="row align-items-center m-0">
                                            <div class="col-lg-6 col-md-6 p-0">
                                                <div class="gallery-news-content">
                                                    <h3>
                                                        <a
                                                            href="https://templates.envytheme.com/sinmun/default/single-post-2.html"><i
                                                                class="icofont-camera-alt"></i> A glance (18 June
                                                            2024)</a>
                                                    </h3>
                                                    <p>Gloost Better They Are With A Featured. New York, USA, 17 June.
                                                        Photo: John Smith</p>
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 p-0">
                                                <div class="gallery-news-image"><img
                                                        src="{{ asset('frontend/images/gallery-news1.jpg ') }}"
                                                        alt="image"></div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item active" style="width: 736px;">
                                        <div class="row align-items-center m-0">
                                            <div class="col-lg-6 col-md-6 p-0">
                                                <div class="gallery-news-content">
                                                    <h3>
                                                        <a
                                                            href="https://templates.envytheme.com/sinmun/default/single-post-2.html"><i
                                                                class="icofont-camera-alt"></i> A glance (18 June
                                                            2024)</a>
                                                    </h3>
                                                    <p>Gloost Better They Are With A Featured. New York, USA, 17 June.
                                                        Photo: John Smith</p>
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 p-0">
                                                <div class="gallery-news-image"><img
                                                        src="{{ asset('frontend/images/gallery-news1.jpg ') }}"
                                                        alt="image"></div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item cloned" style="width: 736px;">
                                        <div class="row align-items-center m-0">
                                            <div class="col-lg-6 col-md-6 p-0">
                                                <div class="gallery-news-content">
                                                    <h3>
                                                        <a
                                                            href="https://templates.envytheme.com/sinmun/default/single-post-2.html"><i
                                                                class="icofont-camera-alt"></i> A glance (18 June
                                                            2024)</a>
                                                    </h3>
                                                    <p>Gloost Better They Are With A Featured. New York, USA, 17 June.
                                                        Photo: John Smith</p>
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 p-0">
                                                <div class="gallery-news-image"><img
                                                        src="{{ asset('frontend/images/gallery-news1.jpg ') }}"
                                                        alt="image"></div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="owl-item cloned" style="width: 736px;">
                                        <div class="row align-items-center m-0">
                                            <div class="col-lg-6 col-md-6 p-0">
                                                <div class="gallery-news-content">
                                                    <h3>
                                                        <a
                                                            href="https://templates.envytheme.com/sinmun/default/single-post-2.html"><i
                                                                class="icofont-camera-alt"></i> A glance (18 June
                                                            2024)</a>
                                                    </h3>
                                                    <p>Gloost Better They Are With A Featured. New York, USA, 17 June.
                                                        Photo: John Smith</p>
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 p-0">
                                                <div class="gallery-news-image"><img
                                                        src="{{ asset('frontend/images/gallery-news1.jpg ') }}"
                                                        alt="image"></div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="owl-nav"><button type="button" role="presentation" class="owl-prev"><i
                                        class="icofont-rounded-left"></i></button><button type="button"
                                    role="presentation" class="owl-next"><i class="icofont-rounded-right"></i></button>
                            </div>
                            <div class="owl-dots disabled"></div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-12">
                    <div class="gallery-news-list">
                        <div class="media gallery-news-media align-items-center">
                            <div class="image">
                                <img src="{{ asset('frontend/images/small-4.jpg ') }}" alt="image"> <a
                                    href="https://templates.envytheme.com/sinmun/default/single-post-3.html"><i
                                        class="icofont-ui-camera"></i></a>
                            </div>
                            <div class="content">
                                <h3>
                                    <a href="https://templates.envytheme.com/sinmun/default/single-post-3.html"><i
                                            class="icofont-camera-alt"></i> A glance (17 June 2024)</a>
                                </h3>
                            </div>
                        </div>
                        <div class="media gallery-news-media align-items-center">
                            <div class="image">
                                <img src="{{ asset('frontend/images/small-2.jpg ') }}" alt="image"> <a
                                    href="https://templates.envytheme.com/sinmun/default/single-post-3.html"><i
                                        class="icofont-ui-camera"></i></a>
                            </div>
                            <div class="content">
                                <h3>
                                    <a href="https://templates.envytheme.com/sinmun/default/single-post-2.html"><i
                                            class="icofont-camera-alt"></i> A glance (16 June 2024)</a>
                                </h3>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section> --}}

    <section class="all-category-news ptb-40">
        <div class="container">
            <div class="row">
                <div class="col-lg-8 col-md-12">
                    @include('frontend.partials.allposts')
                </div>
                <div class="col-lg-4 col-md-12">
                    @include('frontend.partials.sidebar')
                </div>

            </div>
        </div>
    </section>

    @include('frontend.partials.more-news')
@endsection
