<!DOCTYPE html>
<html>
  <head>
    <title></title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
    <script defer src="https://use.fontawesome.com/releases/v5.0.6/js/all.js"></script>
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
  </head>
  <body>
        <!-- Navbar -->
        <nav class=".show-on-medium-and-down">
            <div class="nav-wrapper menue">
                <div class="right ic">
                    <button id="iconadd" target-trigger="addmodal" class="modal-trigger">
                        <i class="md-36 material-icons">add_shopping_cart</i>
                    </button>
                </div>
            </div>
        </nav>
        <!-- Navbar ende -->

        <br>
        <br>

        <!-- Einkaufslisten -->
        <div class="row">

            <div class="col s12 m6 l3">
                <div class="card-panel #00B7FF" id="einkaufslisten">
                    <span class="white-text">
                    </span>
                </div>
            </div>

        </div>         
        <!-- Einkaufslisten ende -->

        <!-- Modal -->
        <div id="addmodal" class="modal">
            <div class="modal-content">
                <h4 id="blaueschrift">Einkaufsliste hinzufügen</h4>

                <!-- Form -->
                <div class="row">
                    <form class="col s12">
                        <div class="row">
                            <div class="input-field col s12 m6">
                                <input id="einkaufslistenname" type="text" class="validate">
                                <label for="einkaufslistenname">Einkaufslisten Name</label>
                            </div>
                            <div class="input-field col s12 m6">
                                <input id="einkaufslistenbeschreibung" type="text" class="validate">
                                <label for="einkaufslistenbeschreibung">Beschreibung</label>
                            </div>
                        </div>
                    </form>
                </div>
                <!-- Form -->

            </div>
            <div class="modal-footer">
                <button class="btn-small add #00B7FF">hinzufügen</button>
            </div>
        </div>
        <!-- Modal -->



    <!-- <h1></h1>
    <p>Welcome to </p> -->
    <a href="/myshoppinglists">Meine Einkaufslisten anzeigen</a><br>
    <a href="/sharedshoppinglists">Mit mir geteilte Einkaufslisten anzeigen</a><br>
    <a href="">Einkaufsliste erstellen</a><br>
    <a href='/logout'>Logout</a>

    <script src="/jquery/dist/jquery.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
    <script src="/javascripts/ajax.js"></script>
  </body>
</html>