{% extends 'base/base.html' %}
{% block style %}
{{ super() }}
<style>
 .vote {
     font-size: 10px;
     line-height: 1;
     padding: 2px 8px;
     border: 1px solid #C4C4C4;
     border-radius: 3px;
     color: #778;
     display: inline-block;
     vertical-align: baseline;
     text-align: center;
     background-color: #fff;
     text-decoration: none;
 }
</style>
{% endblock %}
{% block script -%}
{{ super() }}
<script type="text/javascript">
 var voteData = {
     'vote_up': "{{ url_for('topic.vote_up',topicId=topic.uid)}}",
     'vote_down': "{{ url_for('topic.vote_down',topicId=topic.uid)}}"
 };
 DoVote(voteData);
</script>
{%- endblock script %}

{% block content %}
{% set board = topic.board %}
<ol class="breadcrumb" style="margin:0">
    <li><a href="{{ url_for('forums.forums') }}"><span class="glyphicon glyphicon-home" aria-hidden="true"></span>社区首页</a></li>
    <li><a href="{{ url_for('board.board',parent_b=board.parent_board) }}">{{ board.parent_board }}</a></li>
    <li><a href="{{ url_for('board.board',parent_b=board.parent_board,child_b=board.board)}}">{{ board.board }}</a></li>
    <li class="active">{{ topic.title }}</li>
</ol>
{% set last_reply = topic.replies.first() %}
{% from 'base/paginate.html' import footer as p_footer %}
<div class="row">
    <div class="col-md-9">
        <div class="panel panel-default">
            <div class="panel-heading media ">
                <div class="media-body">
                    <h3 class="media-heading">{{ topic.title}}</h3>
                    <small style="color:#999">
                        <div class="votes">
                            {% if topic.vote and topic.vote > 0 -%}
                            <a id="topic-up-vote" class="vote" href="javascript:void(0)" style="text-decoration:none;">
                                <i class="icon-chevron-up">{{ topic.vote}}</i>
                            </a>
                            {% else %}
                            <a id="topic-up-vote" class="vote" href="javascript:void(0)" style="text-decoration:none;">
                                <i class="icon-chevron-up"></i>
                            </a>
                            {%- endif %}
                            {% if topic.vote and topic.vote < 0 %}
                            <a id="topic-down-vote" class="vote" href="javascript:void(0)" style="text-decoration:none;">
                                <i class="icon-chevron-down">{{ topic.vote}}</i>
                            </a>
                            {% else %}
                            <a id="topic-down-vote" class="vote" href="javascript:void(0)" style="text-decoration:none;">
                                <i class="icon-chevron-down"></i>
                            </a>
                            {%- endif %}
                        </div>
                        {% for tag in topic.tags %}
                        {{ link_base.tag(tag) }}
                        {% endfor %}
                        <br/>
                        {{ link_base.user(topic.author.username )}}
                        于 <abbr class="timeago" title="{{ topic.publish}}">{{ topic.publish | timesince }}</abbr>发布
                        {% if last_reply %}
                        最后由{{ link_base.user(last_reply.author.username )}}于
                        <abbr class="timeago" title="{{ topic.publish}}">{{ last_reply.publish | timesince }}</abbr>回复
                        {% endif %}
                    </small>
                </div>
                <div class="media-right">
                    <a href="{{ url_for('user.user',user_url=topic.author.username)}}">
                        <img class="media-object img-circle" src="{{ link_base.avatar(topic.author) }}" alt="avatar" style="width:64px;height:64px">
                    </a>
                </div>
            </div>
            <div class="panel-body topic-content">
                {% if topic.is_markdown %}
                {{ topic.content | markdown }}
                {% else %}
                {{ topic.content | safe_clean }}
                {% endif %}
            </div>
        </div>
        {% include 'topic/replies.html' %}
    </div>
    <div class="col-md-3" style="padding-left:0">
        {% set ask_url = url_for('topic.ask',boardId=topic.board.id) %}
        {% include 'topic/panel.html' %}
        {{ panel_base.board() }}
    </div>
</div>
{% endblock %}