<!doctype html>
<html class="no-js" lang="en" dir="ltr">
<head>
    {% include "theme::partials/metadata" %}
    {{ asset_add("news.css", "theme::css/slider.css") }}
    {{ asset_add("news.css", "theme::css/scroll.css") }}
    {{ asset_style("news.css", ["min"]) }}

    <link rel="stylesheet" media="screen and (min-device-width: 320px) and (max-device-width: 860px)" href="{{ asset_url("theme::css/hamburgers.css") }}">
</head>
<body>

{% include "theme::partials/navigation" %}

<section class="grid-container first-section-fixer full columns">
    <section class="grid-x">
        <section class="cell slideContent columns no-padding">
            <div class="slideHighlight columns no-padding">
                <ul class="slides">
                    {% set highlights = entries('posts').type('default').featured().get() %}

                    {% for highlight in highlights %}

                        <li>
                            <div class="image-highlight columns no-padding">
                                <img src="{{ image(highlight.news_cover_image.cropped()).quality(100).url() }}"
                                     alt="{{ highlight.title }}"/>{# .resize(973, 617) #}
                            </div>
                            <div class="captionhighlight columns no-padding">
                                <div class="midleheight">
                                    <span class="titlehighlight">{{ trans('theme::news.highlight_news') }}</span>
                                    <h2 class="namehighlight">
                                        {{ highlight.title }}
                                    </h2>
                                    <p>
                                        {{ str_truncate(highlight.summary, 105)|raw }}
                                    </p>
                                    <a href="{{ url('news/' ~ highlight.slug) }}" class="link">{{ trans("theme::news.see_detail")}}</a>
                                </div>
                            </div>
                        </li>

                    {% endfor %}
                </ul>
            </div>
        </section>


        <section class="cell fujiListNews columns">
            <section class="grid-x">
                {% set featured = entries('posts').type('default').recent().first() %}
                <div class="columns small-12 medium-12 large-6 cell bigListNews">
                    <a href="{{ url('news/' ~ featured.slug) }}">
                        <img class="lazy" src="{{ image('theme::img/blank.png').url() }}"
                         data-src="{{ image(featured.news_cover_image.cropped()).url() }}"
                         alt="{{ featured.title }}"/>
                    </a>
                    <div class="caption">
                        <span class="date">{{ featured.publish_at.format("d M Y")}}</span>
                        <a href="{{ url('news/' ~ featured.slug) }}">
                            <h2 class="titleCaption">
                                {{ str_limit(featured.title, 65) }}
                            </h2>
                        </a>
                        {# <a href="#" class="link">+ view all news</a> #}
                    </div>
                </div>
                <div class="columns thumbnews small-12 medium-12 large-6 cell">
                    <ul>
                        {% for post in entries('posts').type('default').live().get() %}
                        <li>
                            <a href="{{ url('news/' ~ post.slug) }}" class="layerImg">
                                <img class="lazy" src="{{ image('theme::img/blank.png').url() }}"
                                     data-src="{{ image(post.news_cover_image.cropped()).resize(263, 174).url() }}"
                                     alt="{{ post.title }}"/>
                            </a>
                            <div class="caption">
                                    <span class="date">{{ post.publish_at.format("d M Y")}}</span>
                                    <a href="{{ url('news/' ~ post.slug) }}">
                                        <h4 class="title">
                                            {{ str_limit(post.title, 65) }}
                                        </h4>
                                    </a>
                            </div>
                        </li>
                        {% endfor %}
                    </ul>
                </div>
            </section>
        </section><!-- END fujiInspiring -->

        {% include "templates::campaign/featured-products" %}

    </section>
</section>
{% include "theme::partials/footer" %}
{% include "theme::partials/scripts" %}

<script src="{{ asset_url("theme::js/slider.js") }}"></script>
<script src="{{ asset_url("theme::js/scroll.min.js") }}"></script>

    <script type="text/javascript">
      global();
      $(document).ready(function(){
        news();
      });
    </script>
  </body>
</html>
