@extends('layout.main')
@section('note.notehead')
    <!-- Search Engine -->
    <meta name="description" content="{{ $data->attributes->summary }}">
    <meta name="image" content="{{ env('STRAPI_URL') }}{{ $data->attributes->featuredmedia->data->attributes->path }}">
    <!-- Schema.org for Google -->
    <meta itemprop="name" content="{{ $data->attributes->title }}">
    <meta itemprop="description" content="{{ $data->attributes->summary }}">
    <meta itemprop="image" content="{{ env('STRAPI_URL') }}{{ $data->attributes->featuredmedia->data->attributes->path }}">
    <!-- Twitter -->
    <meta name="twitter:card" content="summary">
    <meta name="twitter:title" content="{{ $data->attributes->title }}">
    <meta name="twitter:description" content="{{ $data->attributes->summary }}">
    <meta name="twitter:site" content="@MoreliamixC">
    <meta name="twitter:creator" content="@MoreliamixC">
    <meta name="twitter:image:src"
        content="{{ env('STRAPI_URL') }}{{ $data->attributes->featuredmedia->data->attributes->path }}">
    <!-- Twitter - Article -->
    <!-- Open Graph general (Facebook, Pinterest & Google+) -->
    <meta name="og:title" content="{{ $data->attributes->title }}">
    <meta name="og:description" content="{{ $data->attributes->summary }}">
    <meta name="og:image" content="{{ env('STRAPI_URL') }}{{ $data->attributes->featuredmedia->data->attributes->path }}">
    <meta name="og:url" content="{{ env('APP_URL') }}{{ $data->attributes->slug }}/">
    <meta name="og:site_name" content="moreliamix.com">
    <meta name="og:locale" content="es_LA">
    <meta name="fb:app_id" content="2701661783493513">
    <meta name="og:type" content="article">
    <!-- Open Graph - Article -->
    <meta name="article:section" content="{{ $data->attributes->categories->data[0]->attributes->name }}">
    <meta name="article:author" content="moreliamix.com">

    <style type="text/css">
        .fb_iframe_widget_fluid_desktop,
        .fb_iframe_widget_fluid_desktop span,
        .fb_iframe_widget_fluid_desktop iframe {
            max-width: 100% !important;
            width: 100% !important;
        }

        #main-amazon {
            width: 100%;
            text-align: center;
        }

        /* General button style */
        .btn {
            border: none;
            font-family: 'Lato';
            font-size: inherit;
            color: inherit;
            background: none;
            cursor: pointer;
            display: inline-block;
            text-transform: uppercase;
            letter-spacing: 1px;
            font-weight: 700;
            outline: none;
            position: relative;
            -webkit-transition: all 0.3s;
            -moz-transition: all 0.3s;
            transition: all 0.3s;
        }

        .btn:after {
            content: '';
            z-index: -1;
            -webkit-transition: all 0.3s;
            -moz-transition: all 0.3s;
            transition: all 0.3s;
        }

        /* Pseudo elements for icons */
        .btn:before {
            font-family: 'FontAwesome';
            speak: none;
            font-style: normal;
            font-weight: normal;
            font-variant: normal;
            text-transform: none;
            line-height: 1;
            position: relative;
            -webkit-font-smoothing: antialiased;
        }


        /* Icon separator */
        .btn-sep {
            padding: 12px 10px 12px 70px;
        }

        .btn-sep:before {
            background: rgba(0, 0, 0, 0.15);
        }

        /* Button 3 */
        .btn-3 {
            background: #e74c3c;
            color: #fff;
        }

        .btn-3:hover {
            background: #c0392b;
        }

        .btn-3:active {
            background: #c0392b;
            top: 2px;
        }

        .btn-3:before {
            position: absolute;
            height: 100%;
            left: 0;
            top: 0;
            line-height: 3;
            font-size: 140%;
            width: 60px;
        }

        /* Icons */

        .icon-cart:before {
            content: url({{asset('images/icons/amazon_16438.png')}})
        }
    </style>
@endsection
@section('content')
<div id="fb-root"></div>
<script async defer crossorigin="anonymous" src="https://connect.facebook.net/es_ES/sdk.js#xfbml=1&version=v7.0&appId=2701661783493513&autoLogAppEvents=1" nonce="QZIKuRHy"></script>
    <main>
        <section class="noticias">
            <div class="container">
                <div class="content">
                    <div class="content__body">
                        <div class="content__big content__big_sinsmall">

                            <article class="entry mb-0">
                                <div class="single-post__entry-header entry__header">
                                    <h1 class="single-post__entry-title"
                                        style="font-weight: bolder;
                                    font-size: 40px;">
                                        {{ $data->attributes->title }}
                                    </h1>

                                    <div class="entry__meta-holder">
                                        <ul class="entry__meta"
                                            style="    padding-bottom: 12px;
                                        margin-left: 42px;">
                                            <li class="entry__meta-date">
                                                <a
                                                    href="/{{ $data->attributes->categories->data[0]->attributes->key_word }}/">{{ $data->attributes->categories->data[0]->attributes->name }}</a>
                                            </li>
                                            <li class="entry__meta-author">
                                                {{ $data->attributes->authors->data[0]->attributes->name }}
                                            </li>
                                            <li class="entry__meta-date">
                                                {{ $data->attributes->published_date }}
                                            </li>
                                        </ul>
                                    </div>
                                </div> <!-- end entry header -->

                                <div class="entry__img-holder">
                                    <img src="{{ env('STRAPI_URL') }}{{ $data->attributes->featuredmedia->data->attributes->path }}"
                                        alt="{{ $data->attributes->title }}" class="entry__img">
                                </div>

                                <div class="">
                                    <div class="entry__article">
                                        @php
                                            echo $data->attributes->content;
                                        @endphp
                                        <div class="fb-comments" data-href="{{ env('APP_URL') }}/" data-numposts="7"
                                            data-width="900" data-lazy="true"></div>
                                    </div> <!-- end entry article -->
                                </div> <!-- end entry article wrap -->
                            </article> <!-- end standard post -->
                        </div>
                    </div>
                </div>
                @include('layout.sidebar')
            </div>
        </section>
    </main>
@endsection