118 lines
		
	
	
		
			3.5 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			118 lines
		
	
	
		
			3.5 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
<!doctype html>
 | 
						|
<html lang="de">
 | 
						|
 | 
						|
<head>
 | 
						|
  <meta charset="UTF-8" />
 | 
						|
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 | 
						|
  <title>Lebenslauf</title>
 | 
						|
</head>
 | 
						|
 | 
						|
<body class="bg-gray-100 print:bg-white text-gray-800">
 | 
						|
  <script type="module" src="/src/main.ts"></script>
 | 
						|
  <main
 | 
						|
    class="max-w-6xl mx-auto p-6 bg-white shadow-lg rounded-lg mt-8 print:mt-0 print:rounded-none print:shadow-none">
 | 
						|
    <header class="mb-2">
 | 
						|
      <h1 class="text-5xl text-primary font-bold -ml-1">{{ firstname }} {{ lastname }}</h1>
 | 
						|
      <h2 class="text-s text-primary italic">{{ title }}</h2>
 | 
						|
    </header>
 | 
						|
    <div class="flex justify-between">
 | 
						|
      <aside class="w-60">
 | 
						|
        <figure>
 | 
						|
          <img src="{{ image_url }}" />
 | 
						|
        </figure>
 | 
						|
        <div class="mt-1">
 | 
						|
          <div class="mb-1">
 | 
						|
            <h2 class="mediumHeader pb-1">Persönliche Daten</h2>
 | 
						|
            <hr class="line">
 | 
						|
          </div>
 | 
						|
          <div class="flex flex-col justify-items-start gap-2">
 | 
						|
            <div>
 | 
						|
              <h3 class="smallHeader">Anschrift</h3>
 | 
						|
              <p>{{ address }}</p>
 | 
						|
            </div>
 | 
						|
            <div>
 | 
						|
              <h3 class="smallHeader">Email</h3>
 | 
						|
              <a href="mailto:{{ email }}">{{ email }}</a>
 | 
						|
            </div>
 | 
						|
            <div>
 | 
						|
              <h3 class="smallHeader">Telefon</h3>
 | 
						|
              <a href="tel:{{ tel }}">{{ tel }}</a>
 | 
						|
            </div>
 | 
						|
            <div>
 | 
						|
              <h3 class="smallHeader">Staatsbürgerschaft</h3>
 | 
						|
              <p>{{ nationality }}</p>
 | 
						|
            </div>
 | 
						|
            <div>
 | 
						|
              <h3 class="smallHeader">Familienstand</h3>
 | 
						|
              <p>{{ marital_status }}</p>
 | 
						|
            </div>
 | 
						|
            <div>
 | 
						|
              <h3 class="smallHeader">Geburtsort</h3>
 | 
						|
              <p>{{ place_of_birth }}</p>
 | 
						|
            </div>
 | 
						|
          </div>
 | 
						|
        </div>
 | 
						|
        <div class="mt-1">
 | 
						|
          <div class="mb-1">
 | 
						|
            <h2 class="mediumHeader pb-1">Technologien</h2>
 | 
						|
            <hr class="line">
 | 
						|
          </div>
 | 
						|
          <div class="mb-1">
 | 
						|
            <ul>
 | 
						|
              {{#each skils}}
 | 
						|
              <li>{{this}}</li>
 | 
						|
              {{/each}}
 | 
						|
            </ul>
 | 
						|
          </div>
 | 
						|
        </div>
 | 
						|
        <div class="mt-1">
 | 
						|
          <div class="mb-1">
 | 
						|
            <h2 class="mediumHeader mb-1">Sprachen</h2>
 | 
						|
            <hr class="line">
 | 
						|
          </div>
 | 
						|
          <div class="mb-1">
 | 
						|
            <ul>
 | 
						|
              {{#each languages}}
 | 
						|
              <li>{{this}}</li>
 | 
						|
              {{/each}}
 | 
						|
            </ul>
 | 
						|
          </div>
 | 
						|
        </div>
 | 
						|
        <div class="mt-1">
 | 
						|
          <div class="mb-1">
 | 
						|
            <h2 class="mediumHeader pb-1">Links</h2>
 | 
						|
            <hr class="line">
 | 
						|
          </div>
 | 
						|
          <div class="mb-1">
 | 
						|
            <a class="flex" href="https://github.com/PSenfft">
 | 
						|
              <img class="object-contain w-16 h-16" src="github-mark.svg" />
 | 
						|
              <img class="object-contain w-18 h-18" src="qrcode_github.com.svg" />
 | 
						|
            </a>
 | 
						|
          </div>
 | 
						|
        </div>
 | 
						|
      </aside>
 | 
						|
      <section class="w-40 grow-2 border-l-1 border-gray-300 ml-3 pl-3">
 | 
						|
        <div class="ml-2 pb-12">
 | 
						|
          <h2 class="mediumHeader">Beruflicher Werdegang</h2>
 | 
						|
          <hr class="line">
 | 
						|
          {{#each jobs}}
 | 
						|
          {{> dateList this}}
 | 
						|
          {{/each}}
 | 
						|
          <div>
 | 
						|
          </div>
 | 
						|
        </div>
 | 
						|
        <div class="ml-2 pb-12">
 | 
						|
          <h2 class="mediumHeader">Akademische Laufbahn</h2>
 | 
						|
          <hr class="line">
 | 
						|
          {{#each schools}}
 | 
						|
          {{> dateList this }}
 | 
						|
          {{/each}}
 | 
						|
          <div>
 | 
						|
          </div>
 | 
						|
        </div>
 | 
						|
      </section>
 | 
						|
    </div>
 | 
						|
  </main>
 | 
						|
</body>
 | 
						|
 | 
						|
</html> |