<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Scripted</title>
    <!-- Required meta tags -->
    <meta charset="utf-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1, shrink-to-fit=no"
    />

    <!-- CSS -->
    <link
      href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/css/bootstrap.min.css"
      rel="stylesheet"
      integrity="sha384-F3w7mX95PdgyTmZZMECAngseQB83DfGTowi0iMjiWaeVhAn4FJkqJByhZMI3AhiU"
      crossorigin="anonymous"
    />
    <link rel="stylesheet" href="./View/src/CSS/Main.css" />

  </head>

  <body>
    <div class="container">
      <div class="col-auto">
        <div class="row g-5 py-5">
          <h1
            class="display-1 fw-bold mb-5 text-uppercase d-flex justify-content-center"
          >
            <span class="fast-flicker">s</span>
            <span>crip</span>
            <span class="flicker">t</span>
            <span>ed</span>
          </h1>
        </div>
        <div class="row d-flex justify-content-center g-5 py-5">
            <a
                    id="enigme"
                    class="mb-3 text-uppercase d-flex justify-content-center align-items-center"
                    style="width: 260px; height: 50px"
            <?php
                if (isset($_SESSION['role']) && $_SESSION['role'] == 'user'){
                    echo 'href="index.php?action=goToPresentation"';
                }
                else{
                    echo 'href="index.php?action=goToLogin"';
                }
            ?>
            >
            <span></span>
            <span></span>
            <span></span>
            <span></span>
            <span></span>
            Énigmes
          </a>
        </div>
        <div class="row d-flex justify-content-center g-5 py-4">
          <a
            id="multi"
            class="mb-3 text-uppercase d-flex justify-content-center align-items-center"
            href="index.php?action=goToQueue"
            style="width: 260px; height: 50px"
          >
            <span></span>
            <span></span>
            <span></span>
            <span></span>
            Multijoueur
          </a>
        </div>
      </div>
    </div>

    <!-- Bootstrap JS -->
    <script
      src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/js/bootstrap.bundle.min.js"
      integrity="sha384-/bQdsTh/da6pkI1MST/rWKFNjaCP5gBSY4sEBT38Q/9RBh9AH40zEOg7Hlq2THRZ"
      crossorigin="anonymous"
    ></script>
  </body>
</html>
