{{> layout/writer_header320}}
{{#detail}}
<div class="detail">
    <h2 class="share-h2">{{title}}</h2>

    <h3 class="share-h3">{{subTitle}}</h3>

    <p>
        <a href="{{channelLink}}">{{channel}}</a>
        <a href="{{twoChannelLink}}">{{twoChannel}}</a>
        {{time}}
    </p>

    <div class="media">
        <!--大图轮播-->
        {{# coverSwiper}}
        <div class="detail-banner swiper-container">
            <ul class="swiper-wrapper">
                {{#banner}}
                <li class="swiper-slide">
                    <img src="{{.}}" alt="">
                </li>
                {{/banner}}
            </ul>
            <div class="detail-switch">3/5</div>
        </div>
        {{/ coverSwiper}}
        <!--只有一张封面图-->
        {{^ coverSwiper}}
        {{# coverPic}}
        <img src="{{img}}"/>
        {{/ coverPic}}
        {{/ coverSwiper}}

        <!--翻转、变脸、视频-->
        {{# coverEffect}}
        <div>{{{html}}}</div>
        {{/ coverEffect}}
    </div>
    <!--内容-->
    <div class="detail-text" cover-url="{{coverUrl}}">
        {{{detailStr}}}
    </div>
</div>
{{/detail}}

<!--标签-->
<div class="tags">
    <ul>
        {{#tags}}
        <li>
            <a href="{{link}}" target="_blank">{{name}}</a>
        </li>
        {{/tags}}
    </ul>
</div>

<div class="comment">
    <ul class="statslist stats-btn">
        <li class="wow">
            <div>
                <span>
                    <i style="display: inline;">4</i>
                    <img src="http://cmsres.test.yoho.cn/res/new/boys/images/mobile/smile-mobile.png" alt=""
                         style="display: none;">
                </span>
            </div>
        </li>
        <li class="zzz">
            <div>
                <span>
                    <i style="display: inline;">1</i>
                    <img src="http://cmsres.test.yoho.cn/res/new/boys/images/mobile/nothing-mobile.png" alt=""
                         style="display: none;">
                </span>
            </div>
        </li>
        <li class="wtf">
            <div>
                <span>
                    <i style="display: inline;">2</i>
                    <img src="http://cmsres.test.yoho.cn/res/new/boys/images/mobile/bad-mobile.png" alt=""
                         style="display: none;">
                </span>
            </div>
        </li>
        <li class="comments">
            <div>
                <span class="comment-num" id="comment-num"><img
                        src="http://cmsres.test.yoho.cn/res/new/boys/images/mobile/comment-mobile.png"></span>
            </div>
        </li>
    </ul>
    {{# comment}}
    <div class="comments-box" data-id="{{id}}" data-type="{{type}}" data-c="{{c}}" data-twoc="{{twoc}}">
        <ul class="comments-list"></ul>
        <div class="comment-textarea"><textarea placeholder="说点什么..."></textarea>

            <div class="login-status clearfix">
                <div class="userimg">
                    <img src="{{userImg}}" alt="">
                    <i></i>
                </div>
                <div class="userinfo" style="display: none;">
                    <span></span>
                    <a class="exit-btn" href="javascript:;">退出</a>
                </div>
                <div class="publish">
                    <a class="publish-btn" href="javascript:;">Publish</a>
                </div>
            </div>
        </div>
    </div>
    {{/ comment}}
</div>


<div class="detail-page">
    <span class="detail-prev">
        <a href="{{prevLink}}" title="{{prevTitle}}" onclick="prevOrNextClickEvent();">上一篇</a>
    </span>
    <span class="detail-next">
        <a href="{{nextLink}}" title="{{nextTitle}}" onclick="prevOrNextClickEvent();">下一篇</a>
    </span>
</div>


<div class="recomment">
    <h2>相关推荐</h2>
    <ul></ul>
</div>
{{> layout/footer320}}


<script id="related-tpl" type="x-tmpl-mustache">
\{{#relatedPost}}
    <li>
        <a href="\{{link}}" target="_blank" onclick="relatedClickEvent();">
            <div class="content-pic">
                <img src="\{{cover}}" alt="" />
                \{{#isVideo}}
                    <span class="video-icon"></span>
                \{{/isVideo}}
            </div>
            <div class="content-text">
                <h2>\{{title}}</h2>
                <h3>\{{subtitle}}</h3>
            </div>
        </a>
    </li>
\{{/relatedPost}}
</script>