<!DOCTYPE html>
<html>
<head>
    {% if page.title %}
    <title>Baka MPlayer | {{ page.title }}</title>
    {% else %}
    <title>Baka MPlayer</title>
    {% endif %}
    <meta name="description" content="The mpv based media player">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel='stylesheet' href='https://fonts.googleapis.com/css?family=Noto+Sans'>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css">
    <link rel="shortcut icon" href="{{ '/favicon.ico' | relative_url }}">
    <link rel="stylesheet" href="{{ '/css/global.css' | relative_url }}" media="all">
    {% if page.style %}
    <link rel='stylesheet' href="{{ '/css/'|append:page.style | relative_url }}" media="all">
    {% endif %}

    <script type="text/javascript">
        (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
        (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
        m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
        })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

        ga('create', 'UA-30348549-2', 'u8sand.net');
        ga('require', 'displayfeatures');
        ga('send', 'pageview');
    </script>
</head>

<body>
    <nav>
        <div class="container">
            <ul>
                <li>
                    <a
                        href="{{ '/' | relative_url }}"
                        {% if page.permalink == '/' %}class="active"{% endif %}
                    >Home</a>
                </li>
                <li>
                    <a
                        href="{{ '/installation/' | relative_url }}"
                        {% if page.permalink == '/installation/' %}class="active"{% endif %}
                    >Installation</a>
                </li>
                <li>
                    <a
                        href="{{ '/help/' | relative_url }}"
                        {% if page.permalink == '/help/' %}class="active"{% endif %}
                    >Help</a>
                </li>
            </ul>
        </div>
    </nav>
    {{ content }}
    <footer>
        <div class="container">
            <p>Copyright © 2021 - <a href="{{ '/about/' | relative_url }}">About Us</a> / <a href="{{ '/history/' | relative_url }}">History</a></p>
        </div>
    </footer>
</body>
</html>