
Build your best resume ever!
A collection of multiple beautiful resumes build with LESS and Mustache Templates. Choose your favorite Curriculum Vitae and easily export it as PDF.
Follow these instructions to set up this project and create your own CV.
To run this project, please install node.
See:
npm install./src/person.js./public/person.jpg with your portrait.npm start. Check out http://localhost:3000.If you adjust your data in /src/person.js, please stop application with CTRL + C and restart with npm start.
When finished, run npm start and run npm run PDF in a new console window to generate resumes as PDF. You will find all resumes as PDFs in /pdf.
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
If you do not want the font-size of an element to adjust automatically, please use !important:
.anyFont {
font-size: 12px !important;
}
If you want to deactivate the automatic font adjustment just remove this line from /public/javascript.js:
checkFont();
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);
Unfortunately, fonts and images get blurred and lose quality. Therefore fixBoxShadows() in /public/javascript.js fixes this bug, by
-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.
This project contains the Google Material and fontawesome icon sets.
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.
To add a font to the project, search for the npm-module of the desired font, e.g. roboto-fontface for '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";
TODO
Feel free to create your own templates. Please read this documentation carefully. After adding your template please add a preview as in /public/preview and add it to the README. Compile index.html for github Pages with npm run readme. If needed adjust github Pages styling in /less/githubPages.less.