<!DOCTYPE html>
<html lang="de" dir="ltr">
   <head>
      <meta charset="utf-8">
      <title>Frontpage</title>
      <link rel="stylesheet" type="text/css" href="css/ecom.css">
      <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
   </head>
   <body>
      <nav class='hero'>
         <div class='content-width bar-flex'>
            <h1>Project eCommerce</h1>
            <button>Angebote</button>
            <div class='spacer input-icon secondary'>
               <input type="text" placeholder="Nach Produkten suchen..."/>
               <button>Finden</button>
            </div>
            <button>Login</button>
         </div>
      </nav>

      <main class="sidebar-layout content-width">
         <nav>
            <ul>
               <li><a>Dashboard</a>
                  <ul>
                     <li><a>Artikel</a></li>
                     <li><a>Umsatzsteuer</a></li>
                     <li><a class='selected'>Geldbuchungen</a></li>
                     <li><a>Einstellungen</a></li>
                  </ul>
               </li>
               <li><a>Lieferanten</a>
                  <ul>
                     <li><a>Warenbuchungen</a></li>
                     <li><a>Geldbuchungen</a></li>
                  </ul>
               </li>
               <li><a>Lager</a>
                  <ul>
                     <li><a>Bestandsbuchungen</a></li>
                  </ul>
               </li>
               <li><a>Kunden</a>
                  <ul>
                     <li><a>Bestellungen</a></li>
                     <li><a>Geldbuchungen</a></li>
                  </ul>
               </li>
            </ul>
         </nav>

         <div class="content-width">
            <h1>Geldbuchungen</h1>
            <p>
               <table>
                  <tr>
                     <th>Id</th>
                     <th>Datum</th>
                     <th>Betrag</th>
                     <th>Gegenkonto</th>
                     <th>Betreff</th>
                  </tr>
                  <tr>
                     <td>#100</td>
                     <td>2019-10-08</td>
                     <td>100,50 €</td>
                     <td>Lieferant: Hans</td>
                     <td>Bestellungen: #41</td>
                  </tr>
                  <tr>
                     <td>#100</td>
                     <td>2019-10-08</td>
                     <td>100,50 €</td>
                     <td>Lieferant: Hans</td>
                     <td>Bestellungen: #41</td>
                  </tr>
                  <tr>
                     <td>#100</td>
                     <td>2019-10-08</td>
                     <td>100,50 €</td>
                     <td>Lieferant: Hans</td>
                     <td>Bestellungen: #41</td>
                  </tr>
                  <tr>
                     <td>#100</td>
                     <td>2019-10-08</td>
                     <td>100,50 €</td>
                     <td>Lieferant: Hans</td>
                     <td>Bestellungen: #41</td>
                  </tr>
                  <tr>
                     <td>#100</td>
                     <td>2019-10-08</td>
                     <td>100,50 €</td>
                     <td>Lieferant: Hans</td>
                     <td>Bestellungen: #41</td>
                  </tr>
                  <tr>
                     <td>#100</td>
                     <td>2019-10-08</td>
                     <td>100,50 €</td>
                     <td>Lieferant: Hans</td>
                     <td>Bestellungen: #41</td>
                  </tr>
                  <tr>
                     <td>#100</td>
                     <td>2019-10-08</td>
                     <td>100,50 €</td>
                     <td>Lieferant: Hans</td>
                     <td>Bestellungen: #41</td>
                  </tr>
                  <tr>
                     <td>#100</td>
                     <td>2019-10-08</td>
                     <td>100,50 €</td>
                     <td>Lieferant: Hans</td>
                     <td>Bestellungen: #41</td>
                  </tr>
                  <tr>
                     <td>#100</td>
                     <td>2019-10-08</td>
                     <td>100,50 €</td>
                     <td>Lieferant: Hans</td>
                     <td>Bestellungen: #41</td>
                  </tr>
               </table>
            </p>
            <p>
               <a class="button">Manuelle Buchung</a>
            </p>
         </div>
      </main>
      <footer class="hero-black">
         <div class='content-width bar-flex'>
            <h3>Project eCommerce</h3>
            <div class="spacer"></div>
            <div>
               <h4>Seite</h4>
               <ul>
                  <li><a>Login</a></li>
                  <li><a>Angebote</a></li>
                  <li><a>Suche</a></li>
                  <li><a>Mitarbeiter Login</a></li>
               </ul>
            </div>
            <div>
               <h4>Mehr</h4>
               <ul>
                  <li><a>Nutzungsbedingungen</a></li>
                  <li><a>Datenschutz</a></li>
                  <li><a>Über</a></li>
               </ul>
            </div>
         </div>
      </footer>
   </body>
</html>