{% extends "blog/base.html" %}
{% load static %}

<!-- This tempalte creates the homepage of the web app. It contains an overview
of the different functions of the web app and some general info about the web
app.-->

{% block content %}
<div class="parallax-container">
  <div class="parallax">
    <img src="{% static "/blog/images/4116197.jpg" %}">
  </div>
  <div class="section white hide-on-large-only">
    <div class="row container">
      <ul class="collection">
        <li class="collection-item avatar">
          <a href="{% url "MdBs" %}"><i class="material-icons circle blue-grey">account_circle</i>
          <span class="title">Abgeordnete (MdBs)</span></a>
          <p class="grey-text text-darken-3 lighten-3">Profile aller Mitglieder des Deutschen Bundestags von 1949 bis heute.</p>
          <p class="grey-text text-darken-3 lighten-3">Durchsuch- und sortierbare Liste.</p>
        </li>
        <li class="collection-item avatar">
          <a href="{% url "Protokoll-list" %}"><i class="material-icons circle blue-grey">insert_drive_file</i>
          <span class="title">Protokolle</span></a>
          <p>Liste der Plenarprotokolle von 1949 bis einschließlich 2017.</p>
        </li>
        <li class="collection-item avatar">
          <a href="{% url "Reden" %}"><i class="material-icons circle blue-grey">insert_comment</i>
          <span class="title">Reden</span></a>
          <p>Übersicht über alle einzelnen Reden und Redebeiträge der Mitglieder des Bundestags von 1949 bis 2017.</p>
        </li>
        <li class="collection-item avatar">
          <a href="{% url "ngram-viewer-jahr" %}"><i class="material-icons circle blue-grey">trending_up</i>
          <span class="title">Ngram Viewer</span></a>
          <p>Mit dem Ngram Viewer können Begriffshäufigkeiten dargestellt werden.</p>
        </li>
      </ul>
    </div>
  </div>
  <div class="container hide-on-med-and-down">
    <div class="row" style="margin-top: 25px;">
      <div class="col s12 m3 l3">
        <div class="card medium hoverable">
          <div class="card-content">
            <p class="center-align"><i class="large material-icons blue-grey-text darken-4">account_circle</i></p>
            <span class="card-title">Abgeordnete (MdBs)</span>
                <p class="grey-text text-darken-3 lighten-3">Profile aller Mitglieder des Deutschen Bundestags von 1949 bis heute.</p>
          </div>
          <div class="card-action">
            <a href="{% url "MdBs" %}"><span class="light-green-text text-darken-4"><i class="material-icons right">send</i>Zu den MdBs</span></a>
          </div>
        </div>
      </div>
      <div class="col s12 m3 l3">
        <div class="card medium hoverable">
          <div class="card-content">
            <p class="center-align"><i class="large material-icons blue-grey-text darken-4">insert_drive_file</i></p>
            <span class="card-title">Protokolle</span>
            <p class="grey-text text-darken-3 lighten-3">Liste der Plenarprotokolle von 1949 bis einschließlich 2017.</p>
          </div>
          <div class="card-action">
            <a href="{% url "Protokoll-list" %}"><span class="light-green-text text-darken-4"><i class="material-icons right">send</i>Zu den Protokollen</span></a>
          </div>
        </div>
      </div>
      <div class="col s12 m3 l3">
        <div class="card medium hoverable">
          <div class="card-content">
            <p class="center-align"><i class="large material-icons blue-grey-text darken-4">insert_comment</i></p>
            <span class="card-title">Reden</span>
            <p class="grey-text text-darken-3 lighten-3">Übersicht über alle einzelnen Reden und Redebeiträge der Mitglieder des Bundestags von 1949 bis 2017.</p>
          </div>
          <div class="card-action">
            <a href="{% url "Reden" %}"><span class="light-green-text text-darken-4"><i class="material-icons right">send</i>Zu den Reden</span></a>
          </div>
        </div>
      </div>
      <div class="col s12 m3 l3">
        <div class="card medium hoverable">
          <div class="card-content">
            <p class="center-align"><i class="large material-icons blue-grey-text darken-4">trending_up</i></p>
            <span class="card-title">Ngram Viewer</span>
            <p class="grey-text text-darken-3 lighten-3">Stellt Begriffshäufigkeiten der Reden über den Zeitram von 1949 bis 2017 dar.</p>
          </div>
          <div class="card-action">
            <a href="{% url "ngram-viewer-jahr" %}"><span class="light-green-text text-darken-4"><i class="material-icons right">send</i>Zum Ngram Viewer</span></a>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
<div class="parallax-container">
  <div class="parallax">
    <img src="{% static "/blog/images/4094966.jpg" %}">
  </div>
  <div class="section white">
    <div class="row">
      <div class="container grey-text text-darken-3 lighten-3">
      <h4 class="header black-text">Das Projekt</h4>
      <p>Das Projekt Bundesdata
      möchte die Bundestagsplenarprotokolle für alle
      Bürger und Bürgerinnen in einer strukturierten und einfachen Form
      zugänglich und analysierbar machen sowie interaktive Statistiken zu diesen liefern.</p>
      <p>Für dieses Unterfangen
      wurden die von der Bundesregierung bereitgestellten XML-Versionen der
      Bundestagsplenarprotokolle automatisch mit zusätzlichen Informationen
      versehen und strukturiert. Mit den verschiednen Tools auf Bundesdata
      können die Protokolle von 1949 bis 2017 einfach durchsucht und
      deren Inhalte analysiert werden.</p>
    </div>
    </div>
  </div>
</div>
<div class="parallax-container">
  <div class="parallax">
    <img src="{% static "/blog/images/4116197.jpg" %}">
  </div>
  <div class="section white">
    <div class="row">
      <div class="container grey-text text-darken-3 lighten-3">
      <h4 class="header black-text">Die Tools</h4>
      <p>Politikinteressierte können z.B.
      recherchieren, welches <a href="{% url "MdBs" %}">Mitglied des Bundestags</a> zu welcher Zeit der
      deutschen Geschichte welche <a href="{% url "Reden"%}">Reden oder Redebeiträge</a> im Bundestag
      gehalten hat. Mit Hilfe des <a href="{% url "ngram-viewer-jahr"%}">Ngram Viewers</a> können Begriffe im Verlauf
      der Zeit dargestellt werden, um geschichtliche und politische Ereignisse,
      die sich in der Sprache der Reden widerspiegeln, sichtbar und analysierbar
      zu machen.</p>
      <p>Das Projekt ist im Rahmen einer Masterarbeit entstanden.
      Mehr Informationen zum Projekt, der Arbeit, der Datengrundlage sowie der
      automatischen Auszeichnung mit zusätzlichen Informationen und
      Metadaten gibt es auf der <a href="{% url "about-page" %}">Info-Seite</a>.</p>
      </div>
  </div>
</div>
</div>
<div class="parallax-container">
  <div class="parallax">
    <img src="{% static "/blog/images/4116197.jpg" %}">
  </div>
  <div class="section white">
    <div class="row">
      <div class="container grey-text text-darken-3 lighten-3">
        <br />
        <div class="slider">
          <ul class="slides" style="background-color: inherit; text-align: center;">
            <li>
              <img src="{% static "/blog/images/slide_ngram_viewer.png" %}"> <!-- random image -->
              <div class="caption right-align">
              </div>
            </li>
            <li>
              <img src="{% static "/blog/images/slider_profile.png" %}"> <!-- random image -->
              <div class="caption right-align">
              </div>
            </li>
            <li>
              <img src="{% static "/blog/images/one_speech.png" %}"> <!-- random image -->
              <div class="caption right-align">
              </div>
            </li>
            <li>
              <img src="{% static "/blog/images/one_protocol.png" %}"> <!-- random image -->
              <div class="caption right-align">
              </div>
            </li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</div>
<div class="parallax-container">
  <div class="parallax">
    <img src="{% static "/blog/images/4094966.jpg" %}">
  </div>
</div>
{% endblock content %}
