@extends('layouts.frontend.master')
@section('title')
    {{ __('UNIGUIDE | e-Learning website') }}
@endsection
@push('css')
    <link rel="stylesheet" href="{{asset('frontend/css/blog.css')}}">
@endpush

@section('content')

    <!-- Header Start -->
    <div class="container-fluid bg-primary py-5 mb-5 page-header uniH">
        <div class="container py-5">
            <div class="row justify-content-center">
                <div class="col-lg-10 text-center">
                    <h1 class="display-3 text-white animated slideInDown">
                        {{$blog->title}}#
                    </h1>
                    <nav aria-label="breadcrumb">
                        <ol class="breadcrumb justify-content-center">
                            <li class="breadcrumb-item">
                                <a class="text-white" href="{{route('home')}}">{{__('Home')}}</a>
                            </li>
                            <li
                                class="breadcrumb-item text-white active"
                                aria-current="page"
                            >
                                {{__('Blog')}}
                            </li>
                        </ol>
                    </nav>
                </div>
            </div>
        </div>
    </div>
    <!-- Header End -->


    <!-- Blog Start-->


    <main class="page-container">
        <section class=" py-4 py-md-4 page-history">
            <div class="inner container">
                <h1 class="title mb-2"> What is the difference between cyber security and information security?</h1>
            </div>
        </section>
        <section class="container  py-3 mb-3">

            <div class="modal fade LgImgModal" id="LgImgModal" tabindex="-1" role="dialog"
                 aria-labelledby="GalleryModal" aria-hidden="true">
                <div class="modal-dialog modal-xl modal-dialog-centered" role="document">
                    <div class="modal-content my-5">
                        <div class="modal-body p-0 position-relative">
                            <span class="loader"></span>
                            <button type="button" class="btn-close close abs-pos" data-dismiss="modal"
                                    aria-label="Close"><span>ddd</span></button>
                            <div class="img-wrap text-center position-relative"></div>
                        </div>
                    </div>
                </div>
            </div>
            <section class="explore-details  hasTheDetails   pr-md-0 py-1 py-md-4">
                <div class="row mb-3">
                    <div class="col-md-8 my-2 pr-md-4">

                        <div class="article-banner bg-white shadow">
                            <img data-class="LazyLoad" src="{{$blog->imagePath}}"
                                 alt="What is the difference between cyber security and information security?"
                                 class="mb-2 img-fluid mb-md-4">
                            <div
                                class="d-flex justify-content-between flex-md-nowrap flex-wrap px-lg-3 p-2 mb-3 bottom-info">
                                    <span class="my-1">
                                    <i class="fa fa-user  mr-1"> </i>
                                    {{$blog->title}}
                                    </span>
                                <span class="my-1">
                                    <i class="fa fa-calendar-o  mr-1"> </i>
                                    Date :
                                    <span>{{ $blog->created_at->format('d/m/Y') }}</span>
                                    </span>

                            </div>
                        </div>
                        <p dir="ltr">{!! $blog->description !!}</p>

                        @foreach($blog->blogDetails()->get() as $blogDetail)
                            <h2 dir="ltr"><span><strong><a
                                            id="t{{$loop->index}}"></a>{{$blogDetail->title}}</strong></span></h2>
                            <p dir="ltr">{!! $blogDetail->description !!}</p>
                        @endforeach


                        <p style="text-align: center;"></p>
                        <p style="text-align: center;"><strong><span>If you wanted to know more or have any questions, we are here to help you and you can always contact us:</span></strong>
                        </p>
                        <p></p>

                        <p style="text-align: center;"><strong><span>Phone: 0090543730000</span></strong></p>
                        <p></p>
                        <p></p>
                        <p style="text-align: center;"><strong><span>Or via WhatsApp through&nbsp;</span></strong><a
                                href="" target="_blank" title="what's app study fans"
                                rel="noopener noreferrer"><b><span>this link</span></b></a><strong><span>.<span
                                        lang="ar-sa" dir="rtl"></span></span></strong></p>
                        <p><strong></strong></p>
                        <p><strong></strong></p>
                        <p><span lang="ar-sa"></span><span lang="ar-sa"></span></p>
                    </div>
                    <div class="col-md-4 my-2 pl-md-4 mb-3 mb-md-2 order-md-last order-first left-side ">

                        <div class="d-md-block d-none sticky inner">
                            <div class="contents-menu boxed overflow-hidden p-4 mb-3">
                                <span class="title d-block mb-3"> Contents </span>
                                <div class="menu">
                                    @foreach($blog->blogDetails()->get() as $blogDetail)
                                        <p style="text-align: left;"><a href="#t{{$loop->index}}"
                                                                        title="{!! $blogDetail->description !!}"
                                                                        rel="noopener noreferrer"><u>{{$blogDetail->title}}</u></a>
                                        </p>
                                    @endforeach
                                </div>
                            </div>
                            <div class=" boxed overflow-hidden p-4 mb-3">
                                <span class="title d-block mb-2">
                                Are you ready for the next big event now in your life?</span>
                                <span class="d-block my-2"> Register now and save your time</span>
                                <a href="#" class="btn btn-primary regp w-100 mt-md-0 my-2">Register
                                    Now </a>
                            </div>
                            <div class="  boxed explore-more overflow-hidden p-4 mb-3">
                                <span class="title d-block mb-2"> Explore more topics</span>
                                <a href="the-best-universities-to-study-biomedical-engineering-in-turkiye.html"
                                   class="item d-flex align-items-center my-3">
                                    <img class="img rounded mr-2"
                                         alt="The best universities to study biomedical engineering in Turkey"
                                         data-class="LazyLoad" src="{{$blog->imagePath}}">
                                    <div>
                                        <div class="tags ">
                                        </div>
                                        <h3 class="title mb-0 bold">The best universities to study biomedical
                                            engineering in Turkey </h3>
                                    </div>
                                </a>
                                <a href="your-comprehensive-guide-to-studying-pharmacy-in-turkey-in-english.html"
                                   class="item d-flex align-items-center my-3">
                                    <img class="img rounded mr-2" alt="Your guide to Study Pharmacy in Turkey"
                                         data-class="LazyLoad" src="{{$blog->imagePath}}">
                                    <div>
                                        <div class="tags ">
                                        </div>
                                        <h3 class="title mb-0 bold">Your guide to Study Pharmacy in Turkey </h3>
                                    </div>
                                </a>
                            </div>
                        </div>
                    </div>
                </div>

                <div
                    class="to-share border-top border-bottom py-2 my-4 d-flex flex-column flex-md-row  justify-content-between">
                    <div class="tags  mb-md-0 mb-3 pt-2">
                    </div>
                    <div class="share-icons  align-items-center d-flex justify-content-between">
                        <spn class="title mr-md-3 mr-1"> Share This topic</spn>
                        <div class="icons">
                            <a class="icon ml-md-2 ml-1  p-2"
                               href="https://www.facebook.com/sharer/sharer.php?u=https://studyfans.com/en/blogs/what-is-the-difference-between-cyber-security-and-information-security"
                               target="_blank" rel="noopener">
                                <i class="fab fa-facebook-square "> </i>
                            </a>
                            <a class="icon ml-md-2 ml-1  p-2"
                               href="https://www.instagram.com/?url=https://studyfans.com/en/blogs/what-is-the-difference-between-cyber-security-and-information-security"
                               target="_blank" rel="noopener">
                                <i class="fab fa-instagram"> </i>
                            </a>
                            <a class="icon ml-md-2 ml-1  p-2" href="https://api.whatsapp.com/send?phone=905437394024"
                               target="_blank" rel="noopener">
                                <i class="fab fa-whatsapp"> </i>
                            </a>
                        </div>
                    </div>
                </div>

                <div class="related mt-3">
                    <h3 class="med-title bold my-3">Explore more topics </h3>
                    <div class="my-3 row list-items px-md-0 px-2 ">
                        @foreach($blogs as $item)
                            <div class="col-md-6 col-lg-4 mb-3">
                                <div class="card cardRes">
                                    <img src="{{$item->imagePath}}" alt="topicImg">
                                    <div class="card-body">
                                        <h2 class="card-title blogTitle line-clamp-2">What is the difference between
                                            cyber
                                            security and information security ?</h2>
                                        <div class="card-foooter pt-5">
                                            <div class="name"><img src="{{asset('frontend/img/uniguide .png')}}"
                                                                   alt="logo">{{$item->title}}
                                            </div>
                                            <div class="date">{{$item->created_at->format('d/m/Y')}}</div>
                                        </div>
                                        <a href="{{route('frontend.blogs.show',$item->id)}}"
                                           class="btn btn-primary seeAll explore mt-4">Explore
                                            More</a>
                                    </div>
                                </div>
                            </div>
                        @endforeach
                    </div>
                </div>
            </section>
            <section class="my-2 pb-4 register-bar container">
                <div
                    class="p-3 px-lg-5 bar text-white rounded d-flex flex-md-row flex-column justify-content-between align-items-center">
                    <div class="d-flex align-items-center pl-lg-4 gap-5">
                        <img class="logo mr-2 mr-md-3" alt data-class="LazyLoad"
                             src="{{asset('frontend/img/white.png')}}">
                        <div>
                            <h3 class="med-title mb-0 bold">
                                ِRealize your dream now

                            </h3>
                            and register in the best Turkish universities
                        </div>

                    </div>
                    <a href="#" class="btn my-2 btn-light register mob-full-width">
                        Register Now
                    </a>
                </div>
            </section>
        </section>
    </main>

    <!-- Blog End-->



    @push('scripts')
        <script src="{{asset('frontend/js/scrollFixer.js')}}"></script>
        <script src="{{asset('frontend/js/details.js')}}"></script>
    @endpush

@endsection