Improve markup consistency.

2016-01-11 13:47:14 -05:00 · 2016-01-11 13:47:14 -05:00 · fa00a9c640
parent 700c388b01
commit fa00a9c640
12 changed files with 113 additions and 183 deletions
--- a/partials/html/section/education.html
+++ b/partials/html/section/education.html
@ -3,11 +3,13 @@
 <section id="education">
  <header>
    <h2>{{{sectionTitle "Education"}}}</h2>
+    {{#> icon-education }}{{/icon-education}}
  </header>
-  {{#> icon-education }}{{/icon-education}}
  {{#each r.education.history}}
+    <div>
    <h3>{{{ institution }}}</h3>
-    <span class="tenure">{{dateRange .}}<span>
+    <span class="tenure">{{dateRange .}}</span>
+    </div>
  {{/each}}
 </section>
 {{/section}}
--- a/partials/html/section/employment.html
+++ b/partials/html/section/employment.html
@ -3,9 +3,10 @@
 <section id="employment">
  <header>
  <h2>{{{sectionTitle "Employment"}}}</h2>
-  </header>
  {{#> icon-employment }}{{/icon-employment}}
+  </header>
  {{#each r.employment.history}}
+    <div>
      <h3><em>{{ position }}</em>,
        {{#if url }}
        <a href="{{ url }}">{{ employer }}</a>
@ -22,6 +23,7 @@
        {{/each}}
        </ul>
      {{/if}}
+    </div>
  {{/each}}
 </section>
 {{/section}}
--- a/partials/html/section/projects.html
+++ b/partials/html/section/projects.html
@ -3,9 +3,10 @@
 <section id="projects">
  <header>
  <h2>{{{sectionTitle "Projects"}}}</h2>
+  {{#> icon-projects }}{{/icon-projects}}
  </header>
-  {{#> icon-projects }}{{/icon-projects}}  
  {{#each r.projects}}
+    <div>
    <h3>{{#if role}}<em>{{camelCase role }}</em>,{{/if}}
    {{#if url}}
    <a href="{{{ url }}}">{{ title }}</a>
@ -21,6 +22,7 @@
      {{/each}}
      </ul>
    {{/if}}
+    </div>
  {{/each}}
 </section>
 {{/section}}
--- a/partials/html/section/recognition.html
+++ b/partials/html/section/recognition.html
@ -3,11 +3,13 @@
 <section id="awards">
  <header>
  <h2>{{{sectionTitle "recognition" "Awards"}}}</h2>
-  </header>
  {{#> icon-recognition }}{{/icon-recognition}}
+  </header>
  {{#each r.recognition}}
+    <div>
    <h3><em>{{ title }}</em>, {{ from }} <span class="tenure">{{formatDate safe.date 'YYYY' }}</span></h3>
    {{ summary }}
+    </div>
  {{/each}}
 </section>
 {{/section}}
--- a/partials/html/section/samples.html
+++ b/partials/html/section/samples.html
@ -3,9 +3,10 @@
 <section id="samples">
  <header>
  <h2>{{{sectionTitle "Samples"}}}</h2>
-  </header>
  {{#> icon-samples }}{{/icon-samples}}
+  </header>
  {{#each r.samples}}
+    <div>
    <h3>
    {{#if url}}
    <a href="{{{ url }}}">{{ title }}</a>
@ -21,6 +22,7 @@
      {{/each}}
      </ul>
    {{/if}}
+    </div>
  {{/each}}
 </section>
 {{/section}}
--- a/partials/html/section/service.html
+++ b/partials/html/section/service.html
@ -3,9 +3,10 @@
 <section id="volunteer">
  <header>
  <h2>{{{sectionTitle "Service"}}}</h2>
-  </header>
  {{#> icon-service }}{{/icon-service}}
+  </header>
  {{#each r.service.history}}
+    <div>
    <h3><em>{{ position }}</em>,
      {{#if url}}
      <a href="{{ url }}">{{ organization }}</a>
@ -13,7 +14,7 @@
      {{ organization }}
      {{/if}}
    </h3>
-    <span class="tenure">{{dateRange .}}<span>
+    <span class="tenure">{{dateRange .}}</span>
    <p style="clear: both;">{{{ summary }}}</p>
    {{#if highlights}}
      <ul>
@ -22,6 +23,7 @@
      {{/each}}
      </ul>
    {{/if}}
+    </div>
  {{/each}}
 </section>
 {{/section}}
--- a/partials/html/section/skills.html
+++ b/partials/html/section/skills.html
@ -3,8 +3,8 @@
 <section id="skills">
  <header>
  <h2>{{{sectionTitle "Skills"}}}</h2>
-  </header>
  {{#> icon-skills }}{{/icon-skills}}  
+  </header>
  <table>
    <thead>
      <tr>
--- a/partials/html/section/speaking.html
+++ b/partials/html/section/speaking.html
@ -3,11 +3,13 @@
 <section id="speaking">
  <header>
  <h2>{{{sectionTitle "speaking" "Speaking Engagements"}}}</h2>
-  </header>
  {{#> icon-speaking }}{{/icon-speaking}}
+  </header>
  {{#each r.speaking}}
+    <div>
    <h3><em>{{ title }}</em>, {{ from }} <span class="tenure">{{formatDate safe.date 'YYYY' }}</span></h3>
    {{ summary }}
+    </div>
  {{/each}}
 </section>
 {{/section}}
--- a/partials/html/section/writing.html
+++ b/partials/html/section/writing.html
@ -3,12 +3,15 @@
 <section id="publications">
  <header>
  <h2>{{{sectionTitle "Writing"}}}</h2>
-  </header>
  {{#> icon-writing }}{{/icon-writing}}
+  </header>
  {{#each r.writing }}
+    <div>
    <h3><em>{{#if url}}<a href="{{{ url }}}">{{{ title }}}</a>{{else}}{{{ title }}}{{/if}}</em>,
-      {{ publisher.name }} <span class="tenure">{{formatDate safe.date 'YYYY'}}</span></h3>
-  {{# if summary}}{{{ summary }}}{{/if}}
+      {{ publisher.name }}</h3>
+      <span class="tenure">{{formatDate safe.date 'YYYY'}}</span>
+      {{{ summary }}}
+    </div>
  {{/each}}
 </section>
 {{/section}}
--- a/themes/positive/src/positive-doc.xml
+++ b/themes/positive/src/positive-doc.xml
@ -526,12 +526,43 @@
      </w:p>
      {{/has}}
      {{#section "skills"}}{{> skills }}{{/section}}
+
+      {{#*inline "header-employment"}}
+      {{> header-icon _title="EMPLOYMENT" _section="employment" _icon="pict/emp" }}
+      {{/inline}}
      {{#section "employment"}}{{> section/employment }}{{/section}}
-      {{#section "education"}}{{> section/education }}{{/section}}
+
+      {{#*inline "header-projects"}}
+      {{> header-icon _title="PROJECTS" _section="projects" _icon="pict/star" }}
+      {{/inline}}
      {{#section "projects"}}{{> section/projects }}{{/section}}
+
+      {{#*inline "header-education"}}
+      {{> header-icon _title="EDUCATION" _section="education" _icon="pict/edu" }}
+      {{/inline}}
+      {{#section "education"}}{{> section/education }}{{/section}}
+
+      {{#*inline "header-service"}}
+      {{> header-icon _title="SERVICE" _section="service" _icon="pict/srv" }}
+      {{/inline}}
      {{#section "service"}}{{> section/service }}{{/section}}
+
+      {{#*inline "header-writing"}}
+      {{> header-icon _title="WRITING" _section="writing" _icon="pict/wri" }}
+      {{/inline}}
      {{#section "writing"}}{{> section/writing }}{{/section}}
+
+      {{#*inline "header-recognition"}}
+      {{> header-icon _title="RECOGNITION" _section="recognition" _icon="pict/rec" }}
+      {{/inline}}
      {{#section "recognition"}}{{> section/recognition }}{{/section}}
+
+      {{#*inline "header-speaking"}}
+      {{> header-icon _title="SPEAKING" _section="speaking" _icon="pict/arrow" }}
+      {{/inline}}
+      {{#section "speaking"}}{{> section/speaking }}{{/section}}
+
+
      <w:sectPr wsp:rsidR="00B43FDC" wsp:rsidRPr="000A3AF0" wsp:rsidSect="001B7422">
        <w:pgSz w:w="12240" w:h="15840"/>
        <w:pgMar w:top="1440" w:right="1440" w:bottom="1440" w:left="1440" w:header="720" w:footer="720" w:gutter="0"/>
--- a/themes/positive/src/positive-html.css
+++ b/themes/positive/src/positive-html.css
@ -33,6 +33,9 @@ h2 {

 h3 {
  font-size: 1em;
+  margin-top: 0;
+  width: 66%;
+  float: left;
 }

 table {
@ -52,6 +55,10 @@ td:last-child {
  text-align: justify; /* HTML justification sucks, but in this case... */
 }

+hr {
+  display: none;
+}
+
 main {
  padding: 15px;
  max-width: 800px;
@ -62,12 +69,21 @@ section {
  margin-top: 1em;
 }

-li {
-  margin-left: 2em;
+section > div {
+  margin-top: 1em;
+  overflow: hidden; /* Clear floated children */
 }

-h3 {
-  margin-top: 1em;
+section > div p {
+  clear: both;
+}
+
+section > header {
+  position: relative;
+}
+
+li {
+  margin-left: 2em;
 }

 p, li {
@ -88,12 +104,11 @@ main > header {
  margin-bottom: 1em;
 }

-
-main > header > h1 {
+h1 {
  float: left;
 }

-main > header > h1, .label {
+h1, h2, .label {
  font-size: 2.5em;
  text-transform: uppercase;
  font-weight: 300;
@ -105,11 +120,13 @@ main > header > h1, .label {
 float: right;
 }

-h2 > span.fa {
+header > span.fa {
  text-align: center;
  margin-right: 3px;
  position: absolute;
  width: 40px;
+  top: 10px;
+  font-size: 30px;
  transform: translateX(-110%);
  color: #DADADA;
 }
@ -121,5 +138,5 @@ h2 > span.fa {

 #summary {
  color: #717171;
-  font-size: 1.25em;  
+  font-size: 1.25em;
 }
--- a/themes/positive/src/positive-html.html
+++ b/themes/positive/src/positive-html.html
@ -20,182 +20,47 @@
      </header>


-{{#has "info.brief"}}
+      {{#has "info.brief"}}
      <section id="summary">
        {{{ r.info.brief }}}
      </section>
-{{/has}}
+      {{/has}}


-{{#section "skills"}}
-      <section id="skills">
-        <header>
-        <h2><span class="fa fa-code"></span> Skills</h2>
-        </header>
-        <table>
-          <thead>
-            <tr>
-              <th>{{{sectionTitle "Skills"}}}</th>
-              <th>Keywords</th>
-            </tr>
-          </thead>
-          <tbody>
-            {{#each r.skills.sets}}
-            <tr>
-              <td style="width: 33%;">{{{ name }}}</td>
-              <td class="keywords">{{#each skills}}{{{ this }}} {{/each}}</td>
-            </tr>
-            {{/each}}
-          </tbody>
-        </table>
-      </section>
-{{/section}}
+      {{!<!--
+        Use predefined global partials for the other sections.

+        The "inline" bit before each section allows us to pass a custom heading
+        icon into the global partial. For this theme, we're using Font Awesome.
+      -->}}

+      {{#*inline "icon-skills"}}<span class="fa fa-lg fa-star"></span>{{/inline}}
+      {{> section/skills }}

-{{#section "employment"}}
-      <section id="employment">
-        <header>
-        <h2><span class="fa fa-building" style="vertical-align: top;"></span> {{{sectionTitle "Employment"}}}</h2>
-        </header>
+      {{#*inline "icon-employment"}}<span class="fa fa-lg fa-building"></span>{{/inline}}
+      {{> section/employment }}

-        {{#each r.employment.history }}
-          <h3><em>{{ position }}</em>,
-            {{#if url }}
-            <a href="{{ url }}">{{{ employer }}}</a>
-            {{else}}
-            {{{ employer }}}
-            {{/if}}
-            <span class="tenure">{{formatDate safe.start 'YYYY-MM' }} &mdash; {{formatDate safe.end 'YYYY-MM' }}<span></h3>
-          <p style="clear: both;">{{{ summary }}}</p>
-          {{#if highlights}}
-            <ul>
-            {{#each highlights}}
-              <li>{{{ this }}}</li>
-            {{/each}}
-            </ul>
-          {{/if}}
-        {{/each}}
+      {{#*inline "icon-projects"}}<span class="fa fa-lg fa-star"></span>{{/inline}}
+      {{> section/projects }}

-      </section>
-{{/section}}
+      {{#*inline "icon-education"}}<span class="fa fa-lg fa-mortar-board"></span>{{/inline}}
+      {{> section/education }}

-{{#section 'projects'}}
-<hr>
-<section id="projects">
-  <header>
-  <h3>{{{sectionTitle "Projects"}}}</h3>
-  </header>
-  <span class="fa fa-lg fa-building"></span>
-  {{#each r.projects}}
-    {{#if url}}
-    <h4><span class="res-label">{{ role }}</span>, <a href="{{{ url }}}">{{ title }}</a></h4>
-    {{else}}
-    <h4><span class="res-label">{{ role }}</span>, <span class="defunct">{{ title }}</span></h4>
-    {{/if}}
-    <span class="tenure">{{formatDate safe.start 'YYYY-MM' }}&mdash;{{formatDate safe.end 'YYYY-MM' }}</span>
-    {{{ summary }}}
-    {{#if proj.highlights}}
-      <ul>
-      {{#each highlights}}
-        <li>{{{ this }}}</li>
-      {{/each}}
-      </ul>
-    {{/if}}
-  {{/each}}
+      {{#*inline "icon-service"}}<span class="fa fa-lg fa-child"></span>{{/inline}}
+      {{> section/service }}

-</section>
-{{/section}}
+      {{#*inline "icon-samples"}}<span class="fa fa-lg fa-share"></span>{{/inline}}
+      {{> section/samples }}

-{{#section 'samples'}}
-<hr>
-<section id="samples">
-  <header>
-  <h3>{{{sectionTitle "Samples"}}}</h3>
-  </header>
-  <span class="fa fa-lg fa-building"></span>
-  {{#each r.samples}}
-    {{#if url}}
-    <h4><span class="res-label">{{ role }}</span>, <a href="{{{ url }}}">{{ title }}</a></h4>
-    {{else}}
-    <h4><span class="res-label">{{ role }}</span>, <span class="defunct">{{ title }}</span></h4>
-    {{/if}}
-    <span class="tenure">{{formatDate safe.start 'YYYY-MM' }}&mdash;{{formatDate safe.end 'YYYY-MM' }}</span>
-    {{{ summary }}}
-    {{#if proj.highlights}}
-      <ul>
-      {{#each highlights}}
-        <li>{{{ this }}}</li>
-      {{/each}}
-      </ul>
-    {{/if}}
-  {{/each}}
+      {{#*inline "icon-writing"}}<span class="fa fa-lg fa-pencil"></span>{{/inline}}
+      {{> section/writing }}

-</section>
-{{/section}}
+      {{#*inline "icon-recognition"}}<span class="fa fa-lg fa-trophy"></span>{{/inline}}
+      {{> section/recognition }}

-{{#section "education"}}
-      <section id="education">
-        <header>
-        <h2><span class="fa fa-mortar-board"></span> {{{sectionTitle "Education"}}}</h2>
-        </header>
-        {{#each r.education.history}}
-          <h3>{{{ institution }}} <span class="tenure">{{formatDate safe.start 'YYYY' }} &mdash; {{formatDate safe.end 'YYYY' }}<span></h3>
-        {{/each}}
+      {{#*inline "icon-speaking"}}<span class="fa fa-lg fa-users"></span>{{/inline}}
+      {{> section/speaking }}

-      </section>
-{{/section}}
-
-{{#section "service"}}
-      <section id="volunteer">
-        <header>
-        <h2><span class="fa fa-child" style="vertical-align: top;"></span> {{{sectionTitle "Service"}}}</h2>
-        </header>
-        {{#each r.service.history}}
-          <h3><em>{{{ position }}}</em>,
-            {{#if url}}
-            <a href="{{ url }}">{{{ organization }}}</a>
-            {{else}}
-            {{{ organization }}}
-            {{/if}}
-            <span class="tenure">{{formatDate safe.start 'YYYY' }} &mdash; {{formatDate safe.end 'YYYY' }}<span></h3>
-          <p style="clear: both;">{{{ summary }}}</p>
-          {{#if highlights}}
-            <ul>
-            {{#each highlights}}
-              <li>{{{ this }}}</li>
-            {{/each}}
-            </ul>
-          {{/if}}
-        {{/each}}
-
-      </section>
-{{/section}}
-
-{{#section "writing"}}
-      <section id="publications">
-        <header>
-        <h2><span class="fa fa-book"></span> {{{sectionTitle "Writing"}}}</h2>
-        </header>
-        {{#each r.writing }}
-          <h3><em>{{#if url}}<a href="{{{ url }}}">{{{ title }}}</a>{{else}}{{{ title }}}{{/if}}</em>,
-            {{{ publisher.name }}} <span class="tenure">{{formatDate safe.date 'YYYY'}}</span></h3>
-        {{# if summary}}{{{ summary }}}{{/if}}
-        {{/each}}
-      </section>
-{{/section}}
-
-{{#section "recognition"}}
-      <section id="awards">
-        <header>
-        <h2><span class="fa fa-trophy"></span> {{{"sectionTitle" "recognition" "Awards"}}}</h2>
-        </header>
-        {{#each r.recognition}}
-          <h4><span class="res-label">{{{ title }}}</span>, {{{ from }}} <span class="tenure">{{formatDate safe.date 'YYYY' }}</span></h4>
-          {{{ summary }}}
-        {{/each}}
-      </section>
-{{/section}}

    </main>
  </body>