{% extends '@layout/_layout.twig' %}

{% block title %}
    {{ 'Блог'|trans }}. {{ 'BDSM.fm - cимбиоз социальной сети, сайта знакомств, блога и энциклопедии. Тематические знакомства по всему миру'|trans }}
{% endblock %}

{% block about %}
    <!-- BEGIN about -->
    <div class="about_us">
        <div class="about_us-header">
            <div class="about_us-header__video">
                <video autoplay="autoplay" loop="loop" tabindex="0">
                    <source src="/videos/Bdsm-about-preview.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'/>
                    <source src="/videos/Bdsm-about-preview.webm" type='video/webm; codecs="vp8, vorbis"'/>
                    <source src="/videos/Bdsm-about-preview.ogv" type='video/ogg; codecs="theora, vorbis"'/>

                    Video tag not supported. Download the video <a href="/videos/Bdsm-about-preview.webm" download="">here</a>.
                </video>
            </div>
            <div class="container container--flex">
                <div class="about_us-header__nav">
                    <h1 class="about_us-header__title wow fadeInDown" data-wow-delay=".15s">
                        BDSM.fm - cимбиоз социальной сети, сайта знакомств,
                        блога и энциклопедии. <span
                                class="sentence-disappear">Тематические знакомства по всему миру</span>
                    </h1>

                    <nav class="about_us__navigation a-nav wow fadeInUp" data-wow-delay=".4s">
                        <ul class="a-nav__list js-mobile-scroll-to-active">
                            <li class="a-nav__item">
                                <a href="/about" class="a-nav__link">О проекте</a>
                            </li>
                            <li class="a-nav__item">
                                <a href="/bdsmfm" class="a-nav__link">Возможности сайта</a>
                            </li>
                            <li class="a-nav__item">
                                <a href="/app" class="a-nav__link">Приложение</a>
                            </li>
                            <li class="a-nav__item is-active">
                                <a href="/develop" class="a-nav__link">Блог</a>
                            </li>
                            <li class="a-nav__item">
                                <a href="/partners" class="a-nav__link">Партнерам</a>
                            </li>
                        </ul>
                    </nav>
                </div>
                <div class="about_us-header__news a-news wow fadeInRight" data-wow-delay=".3s">
                    <span class="a-news__title">Последние новости</span>
                    <ul class="a-news__list">
                        <li class="a-news__item">
                            <a href="#" class="a-news__link">
                                <span>20 марта</span>
                                Обновления! Приватность и режим "Взрослого
                            </a>
                        </li>
                        <li class="a-news__item">
                            <a href="#" class="a-news__link">
                                <span>4 февраля</span>
                                Новый раздел на сайте BDSM.fm - "В эфире"
                            </a>
                        </li>
                        <li class="a-news__item">
                            <a href="#" class="a-news__link">
                                <span>2 февраля</span>
                                Обновления! Приватность и режим "Взрослого
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>

        <div class="about_us-wrapper">
            <!-- BEGIN about-blog -->
            <div class="about-blog">
                <div class="container container--flex">
                    <div class="about-blog__body blog">
                        {% for item in news.views %}
                            <!-- BEGIN blog-item -->
                            <div class="blog-item">
                                <header class="blog-item__header">
                                    <a href="{{ news_url(item) }}"
                                       class="blog-item__title">{{ news_title(item) }}</a>
                                    <span class="blog-item__date">
                                {{ time_date(item.createdAt) }}
                            </span>
                                </header>
                                <div class="blog-item__picture">
                                    <a href="{{ news_url(item) }}" class="blog-item__link">
                                        <img src="{{ news_image_url(item,0,isguest()) }}" alt="BLOG TITLE">
                                    </a>
                                </div>
                                <div class="blog-item__tags">
                                    <div class="profile-main-info__tags post-view-tags">
                                        {% for tag in item.tags %}
                                            <a class="blogs-tags-elem" href="{{ path('news',{},{'tag':tag}) }}">
                                                {{ tag }}
                                            </a>
                                        {% endfor %}
                                    </div>
                                </div>
                                <div class="blog-item__text">
                                    <p>
                                        {% autoescape false %}
                                            {{ news_content(item)|replace({'[]':''})|striptags|slice(0,290)~'...' }}
                                        {% endautoescape %}
                                    </p>
                                    <a href="{{ news_url(item,2,isguest()) }}"
                                       class="photos-card__link js-read-more">Читать полностью…</a>
                                </div>
                                <footer class="blog-item__footer"
                                        {% if isguest() %}style="justify-content: flex-start" {% endif %}>
                                    <span class="user-action user-action--likes{% if not isguest()%} js-user-news-like{% if item.hasLike(globals.id) %} is-active{% endif %}{% endif %}" 
                                        data-news-id="{{ item.id }}">
                                        <i class="i i--likes"></i>
                                        <strong>{{ item.likeCount }}</strong>
                                    </span>
                                    <span class="user-action user-action--comments{% if not isguest() %} js-user-diary-comment{% endif %}">
                                        <i class="i i--comments"></i>
                                        <strong>{{ item.commentCount }}</strong>
                                    </span>
                                    <span class="user-action user-action--views">
                                        <i class="i i--views"></i>
                                        <strong>{{ item.viewCount }}</strong>
                                    </span>
                                    {% if isguest() == false %}
                                        <span class="user-action user-action--bookmarks js-news-bookmarks-add{% if item.hasBookmark(globals.id) %} is-bookmark{% endif %}"
                                              data-news-id="{{ item.id }}"
                                              data-bookmarks-id="{{ item.bookmarkId(globals.id) }}"
                                              data-bookmarks-default-text="В закладки"
                                              data-bookmarks-success-text="Убрать из закладок">
                                            <i class="i i--bookmarks"></i>
                                            <strong>
                                            {% if item.hasBookmark(globals.id) %}
                                                Убрать из закладок
                                            {% else %}
                                                В закладки
                                            {% endif %}
                                            </strong>
                                        </span>
                                        <div class="ya-share2" data-services="facebook,vkontakte"
                                         data-counter=""
                                         data-info="ARTICLE TITLE"></div>
                                    {% endif %}
                                </footer>
                            </div>
                            <!-- END blog-item ヽ(•‿•)ノ -->
                        {% endfor %}
                    </div>
                    <div class="about-blog__aside">
                        <a class="twitter-timeline" href="https://twitter.com/FmBdsm"></a>
                        <script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
                    </div>
                </div>
            </div>
            <!-- END about-blog ヽ(•‿•)ノ -->
        </div>
    </div>
    <!-- END about_us ヽ(•‿•)ノ -->
    <footer class="main-footer">
        <div class="container container--1280">
            <div class="main-footer-links">
                <a href="mailto:info@bdsm.fm" class="footer-link">{{ 'Help'|trans }}</a>
                <a href="{{ path('conditions') }}" class="footer-link">{{ 'Agreement'|trans }}</a>
                <a href="{{ path('policy') }}" class="footer-link">{{ 'Privacy policy'|trans }}</a>
            </div>
            <div class="main-footer-created_by">
                <span>BDSM.fm © 2016-2017</span>
                <span>
                {{ 'Created by'|trans }}
                    <a href="//yoldi.ru" target="_blank">Yoldi.ru</a>
            </span>
            </div>
        </div>
    </footer>
{% endblock %}