JuanCanham
/
fresh-themes
mirror of https://github.com/JuanCanham/fresh-themes.git
1
0
Fork 0
Code Issues Releases Wiki Activity

feat: modern: improve cosmetics

This commit is contained in:
hacksalot 2018-02-07 03:51:47 -05:00
parent 3350494294
commit 4fcdf560fc
No known key found for this signature in database
GPG Key ID: 2F343EC247CA4B06
5 changed files with 139 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

69
themes/modern/src/modern-html.css
View File

@ -14,13 +14,13 @@ main {
} }
body { body {
font-family: {{{fontList 'default'}}};
font-size: 15px; font-size: 15px;
color: #333; color: #333;
line-height: 1.42857143; line-height: 1.42857143;
background-color: #F0F0F0; background-color: #F0F0F0;
margin: 0; margin: 0;
padding: 0; padding: 0;
font-family: {{{fontList 'default'}}};
} }
/* Typical page borders are awkward when rendered to PDF. */ /* Typical page borders are awkward when rendered to PDF. */
@ -51,18 +51,23 @@ body.pdf #container > header {
} }
#main > #container > section { #main > #container > section {
margin-left: 5em; margin-left: 150px;
position: relative; position: relative;
display: block; display: block;
} }
section > div {
margin-bottom: 60px;
}
span.fa span.fa
{ {
font-size: 56px;
position: absolute; position: absolute;
top: 4px; top: 37px;
left: -50px; transform: translateY(-50%);
font-size: 30px; left: -100px;
color: #BFC1C3; color: #1a4367;
} }
hr { hr {
@ -79,13 +84,16 @@ hr {
h1 { h1 {
margin: 0; margin: 0;
font-size: 46px; font-size: 46px;
display: inline-block;
} }
h2 { h2 {
font-size: 24px; font-size: 30px;
color: #BFC1C3; color: #4376a2;
text-transform: uppercase; text-transform: uppercase;
font-weight: normal; font-weight: normal;
padding-top: 20px;
margin-bottom: 60px;
} }
h3 { h3 {
@ -108,20 +116,53 @@ a:hover {
font-weight: bold; font-weight: bold;
} }
#summary {
font-size: 150%;
margin-left: 0;
padding: 20px 0;
}
#summary > p > strong { #summary > p > strong {
font-size: 1.25em; 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 { .label-keyword {
display: inline-block; display: inline-block;
background: #7eb0db; background: #e8f4ff;
color: white; color: black;
font-size: 0.9em; font-size: 0.9em;
padding: 5px; padding: 5px;
border: 1px solid #357ebd; border: 1px solid #357ebd;
border-radius: 5px; border-radius: 5px;
margin-top: 2px; margin-top: 2px;
font-weight: bold;
text-align: center;
}
.notes {
font-size: 10px;
display: block;
font-weight: normal;
text-transform: uppercase;
} }
.card-skills { .card-skills {
@ -178,6 +219,12 @@ a:hover {
margin-left: 20px; margin-left: 20px;
} }
} }
.skill-info > strong {
font-weight: 400;
font-size: 24px;
color: #1d1d1d;
line-height: 24px;
}
.list-unstyled { .list-unstyled {
padding-left: 0; padding-left: 0;
@ -189,7 +236,7 @@ a:hover {
} }
.space-top { .space-top {
margin-top: 10px; margin-top: 5px;
} }
#container { #container {

7
themes/modern/src/modern-html.html
View File

@ -139,7 +139,12 @@
<div class="space-top labels"> <div class="space-top labels">
{{#if skills}} {{#if skills}}
{{#each skills}} {{#each skills}}
<span class="label label-keyword">{{ this }}</span> <div class="label label-keyword">
<span class="kw">{{ this }}</span>
{{#ifHasSkill @root.r .}}
<span class="notes">{{skillYears . }} years</span>
{{/ifHasSkill}}
</div>
{{/each}} {{/each}}
{{/if}} {{/if}}
</div> </div>

80
themes/modern/src/modern-pdf.css
View File

@ -1,3 +1,10 @@
{{!
Templatized CSS file for the Modern theme. Expanded by Handlebars during
resume generation.
}}
* { * {
box-sizing: border-box; box-sizing: border-box;
} }
@ -7,17 +14,17 @@ main {
} }
body { body {
font-family: {{{fontList 'default'}}};
font-size: 15px; font-size: 15px;
color: #333; color: #333;
line-height: 1.42857143; line-height: 1.42857143;
background-color: #F0F0F0; background-color: #F0F0F0;
margin: 0; margin: 0;
padding: 0; padding: 0;
font-family: {{{fontList 'default'}}};
} }
/* Typical page borders are awkward when rendered to PDF. */ /* Typical page borders are awkward when rendered to PDF. */
body { body.pdf {
background-color: #FFFFFF; background-color: #FFFFFF;
} }
@ -30,7 +37,7 @@ the PDF case, <main> for the HTML case, and style both via an ID. */
border: 1px solid #E6E6E6; border: 1px solid #E6E6E6;
} }
body > #main { body.pdf > #main {
border: none; border: none;
} }
@ -44,18 +51,23 @@ body.pdf #container > header {
} }
#main > #container > section { #main > #container > section {
margin-left: 5em; margin-left: 150px;
position: relative; position: relative;
display: block; display: block;
} }
section > div {
margin-bottom: 60px;
}
span.fa span.fa
{ {
font-size: 56px;
position: absolute; position: absolute;
top: 4px; top: 37px;
left: -50px; transform: translateY(-50%);
font-size: 30px; left: -100px;
color: #BFC1C3; color: #1a4367;
} }
hr { hr {
@ -72,13 +84,16 @@ hr {
h1 { h1 {
margin: 0; margin: 0;
font-size: 46px; font-size: 46px;
display: inline-block;
} }
h2 { h2 {
font-size: 24px; font-size: 30px;
color: #BFC1C3; color: #4376a2;
text-transform: uppercase; text-transform: uppercase;
font-weight: normal; font-weight: normal;
padding-top: 20px;
margin-bottom: 60px;
} }
h3 { h3 {
@ -101,20 +116,53 @@ a:hover {
font-weight: bold; font-weight: bold;
} }
#summary {
font-size: 150%;
margin-left: 0;
padding: 20px 0;
}
#summary > p > strong { #summary > p > strong {
font-size: 1.25em; 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 { .label-keyword {
display: inline-block; display: inline-block;
background: #7eb0db; background: #e8f4ff;
color: white; color: black;
font-size: 0.9em; font-size: 0.9em;
padding: 5px; padding: 5px;
border: 1px solid #357ebd; border: 1px solid #357ebd;
border-radius: 5px; border-radius: 5px;
margin-top: 2px; margin-top: 2px;
font-weight: bold;
text-align: center;
}
.notes {
font-size: 10px;
display: block;
font-weight: normal;
text-transform: uppercase;
} }
.card-skills { .card-skills {
@ -171,6 +219,12 @@ a:hover {
margin-left: 20px; margin-left: 20px;
} }
} }
.skill-info > strong {
font-weight: 400;
font-size: 24px;
color: #1d1d1d;
line-height: 24px;
}
.list-unstyled { .list-unstyled {
padding-left: 0; padding-left: 0;
@ -182,7 +236,7 @@ a:hover {
} }
.space-top { .space-top {
margin-top: 10px; margin-top: 5px;
} }
#container { #container {

9
themes/modern/src/modern-pdf.html
View File

@ -45,7 +45,7 @@
available that allows us to do either, conditionally. available that allows us to do either, conditionally.
--> }} --> }}
{{{styleSheet "modern-pdf.css"}}} {{{styleSheet "pdf.css"}}}
{{! <!-- {{! <!--
Now, depending on options, "modern-html.css" will either be embedded Now, depending on options, "modern-html.css" will either be embedded
@ -139,7 +139,12 @@
<div class="space-top labels"> <div class="space-top labels">
{{#if skills}} {{#if skills}}
{{#each skills}} {{#each skills}}
<span class="label label-keyword">{{ this }}</span> <div class="label label-keyword">
<span class="kw">{{ this }}</span>
{{#ifHasSkill @root.r .}}
<span class="notes">{{skillYears . }} years</span>
{{/ifHasSkill}}
</div>
{{/each}} {{/each}}
{{/if}} {{/if}}
</div> </div>

2
themes/modern/theme.json
View File

@ -13,7 +13,7 @@
}, },
"fonts": { "fonts": {
"all": { "all": {
"default": [ "Helvetica Neue", "Helvetica", "Segoe UI", "Calibri", "sans-serif" ], "default": [ "Open Sans", "Helvetica Neue", "Helvetica", "Segoe UI", "Calibri", "sans-serif" ],
"heading1": ["Arial"], "heading1": ["Arial"],
"heading2": ["Arial"] "heading2": ["Arial"]
}, },