Feel free to adjust stylings. This project uses LESS. Under /less global stylings are defined. You will find here imported fonts and the page layout.
Each resume has its own directory. For example 'resume-1' is under /resumes/resume-1. Each resume directory contains a Mustache template and a less-file. Font-sizes and box-shadows are being adjusted automatically.
Font-sizes adjust automatically depending on how much content your resume has. The bottom margin of the content is defined in /public/javascript.js:
// minimum margin of content to bottom of page
var marginBottom = 50; // in px
@@ -62,7 +62,7 @@ var marginBottom = 50; // in px
If you want to deactivate the automatic font adjustment just remove this line from /public/javascript.js:
checkFont();
-CSS3 Box-Shadows
+CSS3 Box-Shadows
Due to this Chrome bug, CSS3 box-shadows are not rendered properly in the PDF files. The solution is to add this styling to elements with box-shadows:
-webkit-print-color-adjust:exact;
-webkit-filter:opacity(1);
@@ -74,11 +74,30 @@ var marginBottom = 50; // in px
adding a new and absolute positioned element (with same size, position, border-radius and box-shadow) to the HTMl body,
and adding the stylings for -webkit-print-color-adjust and -webkit-filter to the new element.
-If shadows may be displayed wrong, please check that the element with a box-shadow has a proper height, width and positioning;
+If shadows may be displayed wrong, please check that the element with a box-shadow has a proper height, width and positioning.
+Icons
+This project contains the Google Material and fontawesome icon set.
Adjusting PDF-generation and page size
-mixu/electroshot is used to generate PDFs. convertToPdf() in /src/htmlToPdf.js runs a short bash script for each resume running under localhost:3000/resumes/resume-X. By default PDF equals A4. For more PDF settings check mixu/electroshot.
+electroshot is used to generate PDFs. convertToPdf() in /src/htmlToPdf.js runs a short bash script for each resume running under localhost:3000/resumes/resume-X. By default the PDF size is A4. For more PDF settings check mixu/electroshot.
Adding fonts
-TODO
+To add a font to the project, search for the npm-module of the desired font, e.g. roboto-fontface for font face 'Roboto'. Add dependency to package.json with npm i --save, e.g. npm i --save roboto-fontface.
+Create a new less file in /less/fonts, e.g. 'roboto.less'. /node_modules are accessable through localhost:3000. That means if the corresponding woff-file is under /node_modules/roboto-fontface/anyFont.woff the source url needs to equal /roboto-fontface/anyFont.woff:
+@font-face {
+ font-family: 'Roboto';
+ src: url('/roboto-fontface/fonts/Roboto/Roboto-Thin.eot');
+ src: local('Roboto Thin'), local('Roboto-Thin'), url('/roboto-fontface/fonts/Roboto/Roboto-Thin.woff') format('woff'), url('/roboto-fontface/fonts/Roboto/Roboto-Thin.ttf') format('truetype')
+ font-weight: 100;
+ font-style: normal;
+}
+
+Import new less file in /less/fonts.less:
+@import "fonts/opensans.less";
+@import "fonts/montserrat.less";
+@import "fonts/raleway.less";
+@import "fonts/opensans-condensed.less";
+@import "fonts/material-design-icons.less";
+@import "fonts/roboto.less";
+
Adding a template
TODO
Build With