{{!-- overrideCSS target="classes" prop="body" value="resume-pdf-layout" --}}
{{!-- overrideCSS target="classes" prop="layout" value="resume-container" --}}
{{!-- overrideCSS target="classes" prop="container" value="resume-paper" --}}

{{#section "styles"}}
<link rel="stylesheet" href="{{baseUrl}}/static/css/resume.css">
{{/section}}

{{#section "scripts"}}
<script src="/static/js/printButton.js"></script>
{{/section}}


<div class="no-print">
    <button id="print-button" class="btn-primary">Print to PDF</button>
    <button id="print-preview-button" class="btn-primary">Print Preview</button>
</div>

<h1 class="resume-h1">{{name}}</h1>
<div class="resume-contact-bar">
  {{#with demographics}}
    {{#if city}}{{city}}, {{/if}}
    {{#if state}}{{state}}{{/if}}
    {{#if zip}} {{zip}}{{/if}}
  {{/with}}
  {{#if contact_information.cell}} | {{contact_information.cell}}{{/if}}
  {{#if contact_information.email}} | {{contact_information.email}}{{/if}}
  {{#if website}}
    | <a href="{{website}}" class="resume-link">{{website}}</a>
  {{/if}}
</div>

<h2 class="resume-h2">Skills</h2>
<div class="resume-skills">
  {{#with skills}}
  <div class="resume-skill-category"><strong>Languages:</strong> {{#each languages}}{{this}}{{#unless @last}}, {{/unless}}{{/each}}</div>
  <div class="resume-skill-category"><strong>Frameworks:</strong> {{#each frameworks}}{{this}}{{#unless @last}}, {{/unless}}{{/each}}</div>
  <div class="resume-skill-category"><strong>Tools:</strong> {{#each tools}}{{this}}{{#unless @last}}, {{/unless}}{{/each}}</div>
  <div class="resume-skill-category"><strong>Operating Systems:</strong> {{#each operating_systems}}{{this}}{{#unless @last}}, {{/unless}}{{/each}}</div>
  <div class="resume-skill-category"><strong>Infrastructure & Admin:</strong> {{#each infrastructure_and_admin}}{{this}}{{#unless @last}}, {{/unless}}{{/each}}</div>
  <div class="resume-skill-category"><strong>Methodologies:</strong> {{#each methodologies}}{{this}}{{#unless @last}}, {{/unless}}{{/each}}</div>
  {{/with}}
</div>

<h2 class="resume-h2">Technical Projects</h2>
{{#each technical_projects}}
  <div class="resume-entry">
    <div class="resume-entry-header">
      <span>{{name}}</span>
    </div>
    <div class="resume-sub-header">
      <span>{{#each technologies}}{{this}}{{#unless @last}}, {{/unless}}{{/each}}</span>
    </div>
    <p class="resume-summary">{{summary}}</p>
    <ul class="resume">
      {{#each features}}
        <li>{{this}}</li>
      {{/each}}
    </ul>
  </div>
{{/each}}



<section>
  <h2 class="resume-h2">Education</h2>
  {{#each education}}
  <div class="resume-entry">
    <div class="resume-entry-header">
      <span>{{institution}}</span>
      <span>{{#if from}}{{from}} — {{/if}}{{to}}</span>
    </div>
    <div class="resume-sub-header">
      <span>{{degree}} in {{program}}</span>
      <span>{{#if city}}{{city}}, {{state}}{{/if}}</span>
    </div>
  </div>
  {{/each}}
</section>

<section>
  <h2>Experience</h2>
  {{#each work_history}}
  <div class="resume-entry">
    <div class="resume-entry-header">
      <span>{{position}}</span>
      <span>{{#if from}}{{from}} — {{/if}}{{to}}</span>
    </div>
    <div class="resume-sub-header">
      <span>{{company}}</span>
      {{#if location}}
        <span>{{location}}</span>
      {{else}}
        <span>{{#if state}}{{#if city}}{{city}}, {{state}}{{/if}}{{/if}}</span>
      {{/if}}
    </div>
    <ul class="resume">
      {{#each responsibilities}}
        <li>{{this}}</li>
      {{/each}}
    </ul>
  </div>
  {{/each}}
</section>