1
0
mirror of https://github.com/JuanCanham/fresh-themes.git synced 2024-11-24 09:00:11 +00:00

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

View File

@ -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 {

View File

@ -139,7 +139,12 @@
<div class="space-top labels">
{{#if 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}}
{{/if}}
</div>

View File

@ -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, <main> 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 {

View File

@ -45,7 +45,7 @@
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
@ -139,7 +139,12 @@
<div class="space-top labels">
{{#if 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}}
{{/if}}
</div>

View File

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