{% extends "layout.html" %}

{% block head %}
    {{ super() }}
    <meta name="HandheldFriendly" content="true"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="apple-touch-icon-precomposed" sizes="152x152" href="{{ "images/apple-touch-icon-precomposed-152.png"|resolveAsset }}">
    <link rel="shortcut icon" href="{{ "images/favicon.ico"|resolveAsset }}" type="image/x-icon">
{% endblock %}

{% block style %}
    <link rel="stylesheet"
        href="//cdn.bootcss.com/bootstrap/3.3.6/css/bootstrap.min.css"
        integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7"
        crossorigin="anonymous">
    <link rel="stylesheet"
        href="//cdn.bootcss.com/font-awesome/4.6.0/css/font-awesome.min.css"
        integrity="sha384-I6JCnqxMbC2DuiHjsoCiLa15NVbKRf8/ooANRLsXD87zD2dVqzlz6Oqjvj470ztk"
        crossorigin="anonymous">
    <link rel="stylesheet" href="{{ "style.css"|resolveAsset }}">
    {{ super() }}
    {% for type, style in config.styles %}
        {% if fileExists(style) and type == "website" %}
        <link rel="stylesheet" href="{{ style|resolveFile }}">
        {% endif %}
    {% endfor %}
    <style>
        .faq-page-footer {
            text-align: center;
        }
        .navbar {
            margin-bottom: 0;
        }
        table {
            border: 1px solid #ccc;
            border-radius: 3px;
        }
        th {
            text-align: center;
        }
        td {
            padding: 0 2px;
            text-align: left;
            vertical-align: top;
            min-width: 60px;
        }
        th:not(:last-child), td:not(:last-child) {
            border-right: 1px solid #ccc;
        }
        tr:not(:last-child) {
            border-bottom: 1px solid #ccc;
        }
        thead {
            border-bottom: 1px solid #ccc;
        }
        #go-top  {
            position: fixed;
            z-index: 1;
            right: 20px;
            bottom: 20px;
            font-size: 40px;
            border: 2px solid black;
            border-radius: 10px;
        }
        img {
            width: 100%;
            height: 100%;
            margin: 0 auto;
        }
        .faq-page {
            font-size: 16px;
            padding: 0px 3px;
        }
        blockquote {
            font-size: inherit;
            border: 1px solid #ccc; 
            border-radius: 5px;
            padding: 5px;
            background-color: #f3f3f3;
            color: #313131;
        }
    </style>
{% endblock %}

{% block body %}
<div id="top"></div>
<i id="go-top" class="fa fa-arrow-up"></i>
<div class="faq-page-container">
    {% block page %}{% endblock %}

    {% block faq_footer %}
    <div class="faq-page-footer">
        <span>最后编辑于 {{ file.mtime|date('YYYY-MM-DD HH:mm:ss') }}</span>
    </div>
    {% endblock %}
</div>
{% endblock %}


{% block javascript %}
<script src="{{ "gitbook.js"|resolveAsset }}"></script>
{% for resource in plugins.resources.js %}
    {% if resource.url %}
    <script src="{{ resource.url }}"></script>
    {% else %}
    <script src="{{ resource.path|resolveAsset }}"></script>
    {% endif %}
{% endfor %}
<script>
(function() {
    gitbook.page.hasChanged({{ template.getJSContext()|dump|safe }})
})();
</script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<script>
$('#go-top').on('click', () => {
    window.location = '#top';
})
</script>
{% endblock %}