<template>
  <div v-if="show" class="overlaydiv">
    <div class="overlaycontentdiv kapitel">
      <div class="overlayscrolldiv">
        <div class="scrollcontentdiv">
          <div class="overlayheader">KAPITEL</div>
          <div class="columns w-row">
            <div class="column w-col w-col-6">
              <div class="text-block-6">Bezeichnung:&nbsp;</div>
            </div>
            <div class="column-2 w-col w-col-6">
              <div class="form-block-3 w-form">
                <form id="email-form" name="email-form" data-name="Email Form">
                  <input
                    type="text"
                    id="name"
                    name="name"
                    data-name="Name"
                    maxlength="256"
                    class="text-field-2 w-input"
                  >
                </form>
                <div class="w-form-done"></div>
                <div class="w-form-fail"></div>
              </div>
            </div>
          </div>
          <div class="columns-2 w-row">
            <div class="column-3 w-col w-col-6">
              <div class="text-block-6">Beschreibung:</div>
            </div>
            <div class="column-4 w-col w-col-6">
              <div class="form-block-4 w-form">
                <form id="email-form-2" name="email-form-2" data-name="Email Form 2">
                  <input
                    type="text"
                    id="name-2"
                    name="name-2"
                    data-name="Name 2"
                    maxlength="256"
                    class="text-field-3 w-input"
                  >
                </form>
                <div class="w-form-done"></div>
                <div class="w-form-fail"></div>
              </div>
            </div>
          </div>
          <div class="separatordiv lessspace"></div>
          <div class="overviewlistscrolldiv">
            <div class="overviewlistcontentdiv">
              <div class="overviewlistheader">
                <div class="overviewlistheaderitem">Kapitel</div>
                <div class="overviewlistheaderitem">EiC&nbsp;Basics, 1. Auflage</div>
                <div class="overviewlistheaderitem">EiC&nbsp;Basics, 2. Auflage</div>
                <div class="overviewlistheaderitem">EiC&nbsp;Basics, 3. Auflage</div>
                <div class="overviewlistheaderitem">EiC&nbsp;Basics, 4. Auflage</div>
                <div class="overviewlistheaderitem">EiC&nbsp;Basics, 5. Auflage</div>
              </div>
              <div class="overviewlistrow">
                <div class="overviewlistrowitem">Kapitel 1</div>
                <div class="overviewlistrowitem">X</div>
                <div class="overviewlistrowitem">X</div>
                <div class="overviewlistrowitem">X</div>
                <div class="overviewlistrowitem">X</div>
                <div class="overviewlistrowitem">X</div>
              </div>
              <div class="overviewlistrow">
                <div class="overviewlistrowitem">Kapitel 2</div>
                <div class="overviewlistrowitem">X</div>
                <div class="overviewlistrowitem">X</div>
                <div class="overviewlistrowitem">X</div>
                <div class="overviewlistrowitem">X</div>
                <div class="overviewlistrowitem">X</div>
              </div>
              <div class="overviewlistrow">
                <div class="overviewlistrowitem">Kapitel 3</div>
                <div class="overviewlistrowitem">X</div>
                <div class="overviewlistrowitem">X</div>
                <div class="overviewlistrowitem">X</div>
                <div class="overviewlistrowitem">X</div>
                <div class="overviewlistrowitem">X</div>
              </div>
              <div class="overviewlistrow">
                <div class="overviewlistrowitem">Kapitel 4</div>
                <div class="overviewlistrowitem">X</div>
                <div class="overviewlistrowitem">X</div>
                <div class="overviewlistrowitem">X</div>
                <div class="overviewlistrowitem">X</div>
                <div class="overviewlistrowitem">X</div>
              </div>
              <div class="overviewlistrow">
                <div class="overviewlistrowitem">Kapitel 5</div>
                <div class="overviewlistrowitem">X</div>
                <div class="overviewlistrowitem">X</div>
                <div class="overviewlistrowitem">X</div>
                <div class="overviewlistrowitem">X</div>
                <div class="overviewlistrowitem">X</div>
              </div>
              <div class="overviewlistrow">
                <div class="overviewlistrowitem">Kapitel 6</div>
                <div class="overviewlistrowitem">X</div>
                <div class="overviewlistrowitem">X</div>
                <div class="overviewlistrowitem">X</div>
                <div class="overviewlistrowitem">X</div>
                <div class="overviewlistrowitem">X</div>
              </div>
            </div>
          </div>
          <a href="#" class="overlaybutton w-button">SPEICHERN</a>
        </div>
      </div>
    </div>
    <a @click="hide" href="#" class="closedialogbutton w-button"></a>
  </div>
</template>

<script>
import overlay from "@/components/mixins/overlay.mixin";
export default {
  mixins: [overlay]
};
</script>

<style>
</style>
