From 7c1f12198ead83921123bf50c8c6ba20e29153c2 Mon Sep 17 00:00:00 2001 From: devlinjd Date: Mon, 26 Oct 2015 08:03:03 -0400 Subject: [PATCH] Add explicit CSS files for PDFs. --- themes/hello-world/templates/pdf.css | 1 + themes/minimist/templates/pdf.css | 65 +++++++++ themes/modern/templates/pdf.css | 203 +++++++++++++++++++++++++++ 3 files changed, 269 insertions(+) create mode 100644 themes/hello-world/templates/pdf.css create mode 100644 themes/minimist/templates/pdf.css create mode 100644 themes/modern/templates/pdf.css diff --git a/themes/hello-world/templates/pdf.css b/themes/hello-world/templates/pdf.css new file mode 100644 index 0000000..3c29971 --- /dev/null +++ b/themes/hello-world/templates/pdf.css @@ -0,0 +1 @@ +{# An empty CSS file. #} diff --git a/themes/minimist/templates/pdf.css b/themes/minimist/templates/pdf.css new file mode 100644 index 0000000..fb4e9cd --- /dev/null +++ b/themes/minimist/templates/pdf.css @@ -0,0 +1,65 @@ +body { + margin: 0; + padding: 0; + font-family: 'Open Sans', sans-serif; +} + +h1 { + font-size: 3em; +} + +main { + max-width: 800px; + margin: 3em auto; +} + +main > header { + position: relative; +} + +thead { + display: none; +} + +#contact { + width: 200px; + position: absolute; + right: 0; + bottom: 8px; + text-align: right; + font-size: 75%; + font-weight: 600; +} + +#summary { + font-style: italic; +} + +#employment h3, #employment .tenure { + font-size: 20px; + font-weight: bold; +} + +#employment h3 { + float: left; + width: 100%; +} + +.tenure { + color: #ABABAB; + float: right; + text-align: right; +} + +.keywords { + color: #037FD6; +} + +h2 { + font-size: 32px; + font-weight: 300; +} + +td { + padding: 10px 0; +} diff --git a/themes/modern/templates/pdf.css b/themes/modern/templates/pdf.css new file mode 100644 index 0000000..2ebd70d --- /dev/null +++ b/themes/modern/templates/pdf.css @@ -0,0 +1,203 @@ +* { + box-sizing: border-box; +} + +main { + display: block; +} + +body { + font-family: 'Helvetica Neue', Helvetica, 'Lato', sans-serif; + font-size: 15px; + color: #333; + line-height: 1.42857143; + background-color: #F0F0F0; + margin: 0; + padding: 0; +} + +/* Typical page borders are awkward when rendered to PDF. */ +body.pdf { + background-color: #FFFFFF; +} + +/* Adobe or wkhtmltopdf has issues with the
tag, so we use
for +the PDF case,
for the HTML case, and style both via an ID. */ +#main { + background-color: #FFF; + margin: 10px; + padding: 10px; + border: 1px solid #E6E6E6; +} + +body.pdf > #main { + border: none; +} + +#container > header { + padding-top: 6em; + padding-bottom: 1em; +} + +body.pdf #container > header { + padding: 0; +} + +#main > #container > section { + margin-left: 5em; + position: relative; + display: block; +} + +#main > #container > section > span.fa + { + position: absolute; + top: 4px; + left: -50px; + font-size: 30px; + color: #BFC1C3; +} + +hr { + margin-top: 20px; + margin-bottom: 20px; + border: 0; + border-top: 1px solid #EEE; +} + +.tenure { + font-size: 75%; +} + +h1 { + margin: 0; + font-size: 46px; +} + +h3 { + font-size: 24px; + color: #BFC1C3; + text-transform: uppercase; + font-weight: normal; +} + +h4 { + margin-bottom: 0; + font-size: 18px; +} + +a, a:visited { + color: #428BCA; + text-decoration: none; + font-weight: bold; +} + +a:hover { + text-decoration: underline; +} + +.defunct { + color: #989898; + font-weight: bold; +} + +#summary > p > strong { + font-size: 1.25em; +} + + +.label-keyword { + display: inline-block; + background: #7eb0db; + color: white; + font-size: 0.9em; + padding: 5px; + border: 1px solid #357ebd; + border-radius: 5px; + margin-top: 2px; +} + +.card-skills { + position: relative; +} +.card-nested { + min-height: 0; + margin-bottom: 10px; + border-width: 1px 0 0 0; +} +.card { + background: #FFF; + border-radius: 3px; + padding: 10px; +} + +.skill-level { + border-radius: 3px; + position: absolute; + top: 10px; + bottom: 10px; + left: 0; + width: 10px; + box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.5); +} +.skill-level .skill-progress { + position: absolute; + border-radius: 3px; + bottom: 0; + width: 100%; + -webkit-transition: height 1s ease; +} +.skill-level .skill-progress.beginner { + height: 50%; + background: #e74c3c; +} +.skill-level .skill-progress.intermediate { + height: 70%; + background: #f1c40f; +} +.skill-level .skill-progress.advanced { + height: 80%; + background: #428bca; +} +.skill-level .skill-progress.master { + height: 95%; + background: #5cb85c; +} +.skill-info { + margin-left: 10px; +} +@media (max-width: 480px) { + .skill-info { + margin-left: 20px; + } +} + +.list-unstyled { + padding-left: 0; + list-style: none; +} + +.card-skills { + position: relative; +} + +.space-top { + margin-top: 10px; +} + +#container { + max-width: 800px; + margin: 0 auto; +} + +#elevator-pitch { + text-align: center; + font-size: 24px; + color: #BFC1C3; + text-transform: uppercase; + font-weight: normal; +} + +.res-label { + font-style: italic; +}