<!DOCTYPE html>

<html lang="de">
  <head>
    <meta charset="utf-8" />
    <title>CV {{ cv.first_name }} {{ cv.last_name }}</title>
    <meta name="author" content="{{ cv.first_name }} {{ cv.last_name }}" />
    <meta name="generator" content="Weasyprint" />

    <link rel="stylesheet" href="cv.css" />
  </head>

  <body>
    <div id="letter_top"></div>

    <div id="address">
      <ul>
        <li>{{ cv.letter.recipient.name }}</li>
        <li><strong>{{ cv.letter.recipient.company }}</strong></li>
        <li>{{ cv.letter.recipient.street }}</li>
        <li>{{ cv.letter.recipient.city }}</li>
      </ul>
    </div>

    <div id="subject">
      {{ cv.letter.subject }}
    </div>
    <div id="date">{{ cv.letter.date }}</div>

    <footer>
      <a>{{ cv.first_name }} {{ cv.last_name }}</a>
      <a class="icon address_icon">{{ cv.contact.address_full }}</a>
      <a href="tel:{{ cv.contact.phone_url }}" class="icon phone_icon">{{ cv.contact.phone }}</a>
      <a href="mailto:{{ cv.contact.email }}" class="icon mail_icon">{{ cv.contact.email }}</a>
    </footer>

    <article id="letter">
      <p>{{ cv.letter.greeting }}</p>

      {{ letter_body | safe }}

      <p>{{ cv.letter.closing }}</p>

      <img
        src="{{ cv.signature }}"
        class="signature"
        alt="{{ cv.first_name }} {{ cv.last_name }}"
      />
    </article>

    <div id="appended">
      Anbei: {{ cv.letter.appended }}
    </div>

    <header>
      <div id="name">
        <span id="first_name">{{ cv.first_name }}</span
        ><span id="last_name">{{ cv.last_name }}</span>
      </div>

      <div id="description">
        {{ cv.description }}
      </div>
    </header>

    <aside>
      <img src="{{ cv.photo }}" id="profile_image" />

      <section id="contact">
        <a class="icon address_icon">{{ cv.contact.address }}</a>
        <a href="tel:{{ cv.contact.phone_url }}" class="icon phone_icon">{{ cv.contact.phone }}</a>
        <a href="mailto:{{ cv.contact.email }}" class="icon mail_icon">{{ cv.contact.email }}</a>
        <a href="{{ cv.contact.github_url }}" class="icon github_icon">{{ cv.contact.github }}</a>
        <a href="{{ cv.contact.linkedin_url }}" class="icon linkedin_icon">{{ cv.contact.linkedin }}</a>
      </section>

      <section class="skills">
        <h1>Skills</h1>

        <ul>
          {% for skill in cv.skills %}
          <li class="{{ skill.css_class }}">
            {{ skill.name }}
            {% if skill.specification %}
            <span class="specification">{{ skill.specification | replace('\n', '<br>') | safe }}</span>
            {% endif %}
          </li>
          {% endfor %}
          {% for cert in cv.certificates %}
          <li class="certificate">
            <a href="{{ cert.url }}">{{ cert.name }}</a>
          </li>
          {% endfor %}
          {% for other in cv.other_skills %}
          <li class="other">{{ other.text }}</li>
          {% endfor %}
        </ul>
      </section>

      <section class="skills">
        <h1>Sprachen</h1>

        <ul>
          {% for lang in cv.languages %}
          <li class="{{ lang.css_class }}">
            {{ lang.name }}{% if lang.specification %}<span class="inline-specification">{{ lang.specification }}</span>{% endif %}
          </li>
          {% endfor %}
        </ul>
      </section>

      <section>
        <h1>Sonstiges</h1>

        {% for activity in cv.other_activities %}
        <div class="experience">
          <div class="time">{{ activity.time }}</div>
          <div class="title">{{ activity.title }}</div>
          {% if activity.institution %}
          <div class="institution">{{ activity.institution }}</div>
          {% endif %}
          {% if activity.description %}
          <div class="description">
            {{ activity.description }}
          </div>
          {% endif %}
        </div>
        {% endfor %}
      </section>
    </aside>

    <main>
      <section id="experiences">
        <h1>Arbeitserfahrung</h1>

        {% for exp in cv.work_experience %}
        <div class="experience">
          <div class="time">{{ exp.time }}</div>
          <div class="title">
            {{ exp.title }}
          </div>
          {% if exp.institution %}
          <div class="institution">{{ exp.institution }}</div>
          {% endif %}
          {% if exp.description %}
          <div class="description">
            {{ exp.description }}
          </div>
          {% endif %}
          {% if exp.grades %}
          <div class="grades">{{ exp.grades }}</div>
          {% endif %}

          {% for sub in exp.sub_experiences %}
          <div class="sub_experience">
            <div class="time">{{ sub.time }}</div>
            <div class="title">
              {{ sub.title }}
            </div>
            {% if sub.bullets %}
            <ul>
              {% for bullet in sub.bullets %}
              <li>{{ bullet }}</li>
              {% endfor %}
            </ul>
            {% endif %}
          </div>
          {% endfor %}
        </div>
        {% endfor %}
      </section>

      <section id="education">
        <h1>Ausbildung</h1>

        {% for edu in cv.education %}
        <div class="experience">
          <div class="time">{{ edu.time }}</div>
          <div class="title">{{ edu.title }}</div>
          {% if edu.institution %}
          <div class="institution">{{ edu.institution }}</div>
          {% endif %}
          {% if edu.description %}
          <div class="description">
            {{ edu.description }}
          </div>
          {% endif %}
          {% if edu.grades %}
          <div class="grades">{{ edu.grades }}</div>
          {% endif %}
        </div>
        {% endfor %}
      </section>
    </main>
  </body>
</html>
