diff --git a/themes/modern/src/modern-html.css b/themes/modern/src/modern-html.css index 9f33cee..5ec9553 100644 --- a/themes/modern/src/modern-html.css +++ b/themes/modern/src/modern-html.css @@ -14,13 +14,13 @@ main { } body { - font-family: {{{fontList 'default'}}}; font-size: 15px; color: #333; line-height: 1.42857143; background-color: #F0F0F0; margin: 0; padding: 0; + font-family: {{{fontList 'default'}}}; } /* Typical page borders are awkward when rendered to PDF. */ @@ -51,18 +51,23 @@ body.pdf #container > header { } #main > #container > section { - margin-left: 5em; + margin-left: 150px; position: relative; display: block; } +section > div { + margin-bottom: 60px; +} + span.fa { + font-size: 56px; position: absolute; - top: 4px; - left: -50px; - font-size: 30px; - color: #BFC1C3; + top: 37px; + transform: translateY(-50%); + left: -100px; + color: #1a4367; } hr { @@ -79,13 +84,16 @@ hr { h1 { margin: 0; font-size: 46px; + display: inline-block; } h2 { - font-size: 24px; - color: #BFC1C3; + font-size: 30px; + color: #4376a2; text-transform: uppercase; font-weight: normal; + padding-top: 20px; + margin-bottom: 60px; } h3 { @@ -108,20 +116,53 @@ a:hover { font-weight: bold; } +#summary { + font-size: 150%; + margin-left: 0; + padding: 20px 0; +} + #summary > p > strong { font-size: 1.25em; } +#contact { + float: right; +} + +#summary > header > .fa-info { + font-size: 70px; + letter-spacing: 5px; + text-transform: uppercase; + font-weight: normal; + top: 50%; + left: -85px; + transform: translateY(-50%); +} + +#summary h2 { + display: none; +} + .label-keyword { display: inline-block; - background: #7eb0db; - color: white; + background: #e8f4ff; + color: black; font-size: 0.9em; padding: 5px; border: 1px solid #357ebd; border-radius: 5px; margin-top: 2px; + font-weight: bold; + text-align: center; +} + +.notes { + font-size: 10px; + display: block; + font-weight: normal; + text-transform: uppercase; } .card-skills { @@ -178,6 +219,12 @@ a:hover { margin-left: 20px; } } +.skill-info > strong { + font-weight: 400; + font-size: 24px; + color: #1d1d1d; + line-height: 24px; +} .list-unstyled { padding-left: 0; @@ -189,7 +236,7 @@ a:hover { } .space-top { - margin-top: 10px; + margin-top: 5px; } #container { diff --git a/themes/modern/src/modern-html.html b/themes/modern/src/modern-html.html index ec86050..202bcbb 100644 --- a/themes/modern/src/modern-html.html +++ b/themes/modern/src/modern-html.html @@ -139,7 +139,12 @@
{{#if skills}} {{#each skills}} - {{ this }} +
+ {{ this }} + {{#ifHasSkill @root.r .}} + {{skillYears . }} years + {{/ifHasSkill}} +
{{/each}} {{/if}}
diff --git a/themes/modern/src/modern-pdf.css b/themes/modern/src/modern-pdf.css index 02927ee..9322235 100644 --- a/themes/modern/src/modern-pdf.css +++ b/themes/modern/src/modern-pdf.css @@ -1,3 +1,10 @@ +{{! + + Templatized CSS file for the Modern theme. Expanded by Handlebars during + resume generation. + +}} + * { box-sizing: border-box; } @@ -7,17 +14,17 @@ main { } body { - font-family: {{{fontList 'default'}}}; font-size: 15px; color: #333; line-height: 1.42857143; background-color: #F0F0F0; margin: 0; padding: 0; + font-family: {{{fontList 'default'}}}; } /* Typical page borders are awkward when rendered to PDF. */ -body { +body.pdf { background-color: #FFFFFF; } @@ -30,7 +37,7 @@ the PDF case,
for the HTML case, and style both via an ID. */ border: 1px solid #E6E6E6; } -body > #main { +body.pdf > #main { border: none; } @@ -44,18 +51,23 @@ body.pdf #container > header { } #main > #container > section { - margin-left: 5em; + margin-left: 150px; position: relative; display: block; } +section > div { + margin-bottom: 60px; +} + span.fa { + font-size: 56px; position: absolute; - top: 4px; - left: -50px; - font-size: 30px; - color: #BFC1C3; + top: 37px; + transform: translateY(-50%); + left: -100px; + color: #1a4367; } hr { @@ -72,13 +84,16 @@ hr { h1 { margin: 0; font-size: 46px; + display: inline-block; } h2 { - font-size: 24px; - color: #BFC1C3; + font-size: 30px; + color: #4376a2; text-transform: uppercase; font-weight: normal; + padding-top: 20px; + margin-bottom: 60px; } h3 { @@ -101,20 +116,53 @@ a:hover { font-weight: bold; } +#summary { + font-size: 150%; + margin-left: 0; + padding: 20px 0; +} + #summary > p > strong { font-size: 1.25em; } +#contact { + float: right; +} + +#summary > header > .fa-info { + font-size: 70px; + /*letter-spacing: 5px; PDFs hate letter-spacing */ + text-transform: uppercase; + font-weight: normal; + top: 50%; + left: -85px; + transform: translateY(-50%); +} + +#summary h2 { + display: none; +} + .label-keyword { display: inline-block; - background: #7eb0db; - color: white; + background: #e8f4ff; + color: black; font-size: 0.9em; padding: 5px; border: 1px solid #357ebd; border-radius: 5px; margin-top: 2px; + font-weight: bold; + text-align: center; +} + +.notes { + font-size: 10px; + display: block; + font-weight: normal; + text-transform: uppercase; } .card-skills { @@ -171,6 +219,12 @@ a:hover { margin-left: 20px; } } +.skill-info > strong { + font-weight: 400; + font-size: 24px; + color: #1d1d1d; + line-height: 24px; +} .list-unstyled { padding-left: 0; @@ -182,7 +236,7 @@ a:hover { } .space-top { - margin-top: 10px; + margin-top: 5px; } #container { diff --git a/themes/modern/src/modern-pdf.html b/themes/modern/src/modern-pdf.html index ba8550d..da67717 100644 --- a/themes/modern/src/modern-pdf.html +++ b/themes/modern/src/modern-pdf.html @@ -45,7 +45,7 @@ available that allows us to do either, conditionally. --> }} - {{{styleSheet "modern-pdf.css"}}} + {{{styleSheet "pdf.css"}}} {{!