<?php declare(strict_types=1); ?>

<!doctype html>
<html lang="<?php echo $tfPreference->escapeForXss('defaultLanguage'); ?>">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">    
    <meta name="description" content="<?php echo $tfMetadata->description; ?>">
    <meta name="author" content="<?php echo $tfMetadata->author; ?>">
    <meta name="dcterms.rights" content="<?php echo $tfMetadata->copyright; ?>">
    <meta name="generator" content="<?php echo $tfMetadata->generator; ?>">
    <meta name="robots" content="<?php echo $tfMetadata->robots; ?>">
    <link rel="alternate" type="application/rss+xml" title="RSS" href="<?php echo TFISH_URL . 'rss.php'; ?>" />
    <link rel="schema.dcterms" href="http://purl.org/dc/terms/">
    
    <!-- Favicons -->
    <link rel="apple-touch-icon" sizes="180x180" href="<?php echo TFISH_URL . 'apple-touch-icon.png'; ?>">
    <link rel="icon" type="image/png" sizes="32x32" href="<?php echo TFISH_URL . 'favicon-32x32.png'; ?>">
    <link rel="icon" type="image/png" sizes="16x16" href="<?php echo TFISH_URL . 'favicon-16x16.png'; ?>">
    <link rel="manifest" href="<?php echo TFISH_URL . 'site.webmanifest'; ?>">
    <link rel="mask-icon" href="<?php echo TFISH_URL . 'safari-pinned-tab.svg'; ?>" color="#5bbad5">
    <meta name="msapplication-TileColor" content="#da532c">
    <meta name="theme-color" content="#ffffff">

    <title><?php echo $tfMetadata->title; ?></title>
    
    <!-- jQuery -->
    <script src="<?php echo TFISH_JS_URL . 'jquery/jquery.min.js'; ?>"></script>
    
    <!-- Popper -->
    <script src="<?php echo TFISH_JS_URL . 'popper/popper.min.js'; ?>"></script>
    
    <!-- Bootstrap -->
    <link href="<?php echo TFISH_JS_URL . 'bootstrap/css/bootstrap.min.css'; ?>" rel="stylesheet">
    <script src="<?php echo TFISH_JS_URL . 'bootstrap/js/bootstrap.min.js'; ?>"></script>
    
    <!-- Font Awesome -->
    <script defer src="<?php echo TFISH_JS_URL . 'fontawesome/fontawesome-all.min.js'; ?>"></script>

    <!-- Custom styles for this template -->
    <link href="<?php echo TFISH_THEMES_URL . 'pricing/style.css'; ?>" rel="stylesheet">
  </head>

  <body>

    <div class="d-flex flex-column flex-md-row align-items-center p-3 px-md-4 mb-3 bg-white border-bottom box-shadow">
      <h5 class="my-0 mr-md-auto font-weight-normal"><a href="<?php echo TFISH_URL; ?>"><?php echo $tfPreference->escapeForXss('siteName'); ?></a></h5>
      <nav class="my-2 my-md-0 mr-md-3">
        <a class="p-2 text-dark" href="#">Features</a>
        <a class="p-2 text-dark" href="#">Enterprise</a>
        <a class="p-2 text-dark" href="#">Support</a>
        <a class="p-2 text-dark" href="#">Pricing</a>
      </nav>
      <a class="btn btn-outline-primary" href="#">Sign up</a>
    </div>

    <div class="container">
        
      <!-- Main page -->
      <?php echo $tfTemplate->render('main'); ?>

      <!-- Footer -->
      <footer class="pt-4 my-md-5 pt-md-5 border-top">
        <div class="row">
          <div class="col-12 col-md">
            <img class="mb-2" src="https://getbootstrap.com/assets/brand/bootstrap-solid.svg" alt="" width="24" height="24">
            <small class="d-block mb-3 text-muted">Copyright &copy; 2018 | <?php echo TfSession::getLoginLink(); ?></small>
          </div>
          <div class="col-6 col-md">
            <h5>Features</h5>
            <ul class="list-unstyled text-small">
              <li><a class="text-muted" href="#">Cool stuff</a></li>
              <li><a class="text-muted" href="#">Random feature</a></li>
              <li><a class="text-muted" href="#">Team feature</a></li>
              <li><a class="text-muted" href="#">Stuff for developers</a></li>
              <li><a class="text-muted" href="#">Another one</a></li>
              <li><a class="text-muted" href="#">Last time</a></li>
            </ul>
          </div>
          <div class="col-6 col-md">
            <h5>Resources</h5>
            <ul class="list-unstyled text-small">
              <li><a class="text-muted" href="#">Resource</a></li>
              <li><a class="text-muted" href="#">Resource name</a></li>
              <li><a class="text-muted" href="#">Another resource</a></li>
              <li><a class="text-muted" href="#">Final resource</a></li>
            </ul>
          </div>
          <div class="col-6 col-md">
            <h5>About</h5>
            <ul class="list-unstyled text-small">
              <li><a class="text-muted" href="#">Team</a></li>
              <li><a class="text-muted" href="#">Locations</a></li>
              <li><a class="text-muted" href="#">Privacy</a></li>
              <li><a class="text-muted" href="#">Terms</a></li>
            </ul>
          </div>
        </div>
      </footer>
    </div>

    <script src="<?php echo TFISH_THEMES_URL . 'assets/js/vendor/holder.min.js'; ?>"></script>
    <script>
      Holder.addTheme('thumb', {
        bg: '#55595c',
        fg: '#eceeef',
        text: 'Thumbnail'
      });
    </script>
  </body>
</html>
