ADD resume 5 and 6
This commit is contained in:
salamimitpizza
parent
1ac0b35c73
commit
1ccd10e25a
@ -5,3 +5,4 @@
|
||||
@import (less) "../node_modules/roboto-fontface/css/roboto/roboto-fontface.css";
|
||||
@import (less) "../node_modules/roboto-fontface/css/roboto-condensed/roboto-condensed-fontface.css";
|
||||
@import (less) "../node_modules/roboto-fontface/css/roboto-slab/roboto-slab-fontface.css";
|
||||
@import (less) "../node_modules/@typopro/web-montserrat/TypoPRO-Montserrat.css";
|
||||
|
||||
@ -24,6 +24,7 @@
|
||||
"author": "salamimipizza",
|
||||
"homepage": "https://salamimitpizza.github.io/beautifulCV/",
|
||||
"dependencies": {
|
||||
"@typopro/web-montserrat": "^3.4.9",
|
||||
"buffer-to-string": "^0.1.0",
|
||||
"electron": "^1.4.15",
|
||||
"electroshot": "^1.2.0",
|
||||
|
||||
2
public/style.min.css
vendored
2
public/style.min.css
vendored
File diff suppressed because one or more lines are too long
@ -41,6 +41,21 @@
|
||||
<img src="/resume-3/resume-3.png" />
|
||||
<span class="resume-title">Resume 3</span>
|
||||
</a>
|
||||
|
||||
<a class="resume" href="/resume-4">
|
||||
<img src="/resume-4/resume-4.png" />
|
||||
<span class="resume-title">Resume 4</span>
|
||||
</a>
|
||||
|
||||
<a class="resume" href="/resume-5">
|
||||
<img src="/resume-5/resume-5.png" />
|
||||
<span class="resume-title">Resume 5</span>
|
||||
</a>
|
||||
|
||||
<a class="resume" href="/resume-6">
|
||||
<img src="/resume-6/resume-6.png" />
|
||||
<span class="resume-title">Resume 5</span>
|
||||
</a>
|
||||
</section>
|
||||
</main>
|
||||
</div>
|
||||
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
235
resumes/resume-5/resume-5.less
Normal file
235
resumes/resume-5/resume-5.less
Normal file
@ -0,0 +1,235 @@
|
||||
.resume5 {
|
||||
background: #ECEFF1;
|
||||
}
|
||||
|
||||
#resume5 {
|
||||
.dp1 {
|
||||
box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 1px 5px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.2);
|
||||
}
|
||||
|
||||
.dp2 {
|
||||
box-shadow: 0 4px 5px 0 rgba(0,0,0,0.14), 0 1px 10px 0 rgba(0,0,0,0.12), 0 2px 4px -1px rgba(0,0,0,0.3);
|
||||
}
|
||||
|
||||
.dp3 {
|
||||
box-shadow: 0 6px 10px 0 rgba(0,0,0,0.14), 0 1px 18px 0 rgba(0,0,0,0.12), 0 3px 5px -1px rgba(0,0,0,0.3);
|
||||
}
|
||||
|
||||
.dp4 {
|
||||
box-shadow: 0 8px 10px 1px rgba(0,0,0,0.14), 0 3px 14px 2px rgba(0,0,0,0.12), 0 5px 5px -3px rgba(0,0,0,0.3);
|
||||
}
|
||||
|
||||
.dp5 {
|
||||
box-shadow: 0 16px 24px 2px rgba(0,0,0,0.14), 0 6px 30px 5px rgba(0,0,0,0.12), 0 8px 10px -5px rgba(0,0,0,0.3);
|
||||
}
|
||||
|
||||
.introduction {
|
||||
height: 25%;
|
||||
position: relative;
|
||||
background: #009688;
|
||||
|
||||
.wrapper {
|
||||
width: 100%;
|
||||
display: inline-block;
|
||||
margin-top: 50px;
|
||||
height: auto;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
|
||||
.img {
|
||||
background: url('person.jpg');
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
height: 100px;
|
||||
width: 100px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.position {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.name {
|
||||
color: white;
|
||||
margin-top: 16px;
|
||||
font-size: 42px;
|
||||
font-weight: 300;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.resume-content {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.card-row {
|
||||
display: flex;
|
||||
padding-left: 2.5%;
|
||||
padding-right: 2.5%;
|
||||
margin-bottom: 15px;
|
||||
|
||||
&.multiple .card:last-child {
|
||||
margin-left: 2.5%;
|
||||
}
|
||||
}
|
||||
|
||||
.card {
|
||||
flex: 1;
|
||||
background: white;
|
||||
border-radius: 2px;
|
||||
|
||||
.title {
|
||||
display: block;
|
||||
line-height: 32px;
|
||||
margin-bottom: 8px;
|
||||
font-size: 24px;
|
||||
font-weight: 300;
|
||||
padding: 24px;
|
||||
background: #607D8B;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.text {
|
||||
line-height: 1.5;
|
||||
font-family: "Roboto", sans-serif;
|
||||
font-weight: normal;
|
||||
font-size: 14px;
|
||||
color: black;
|
||||
|
||||
.name {
|
||||
font-size: 36px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.row {
|
||||
padding: 24px;
|
||||
border-bottom: 1px solid #B0BEC5;
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.chip {
|
||||
display: inline-block;
|
||||
height: 32px;
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
line-height: 32px;
|
||||
padding: 0 12px;
|
||||
border-radius: 16px;
|
||||
background-color: #CFD8DC;
|
||||
margin-bottom: 5px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.resume-footer {
|
||||
background: rgba(51, 51, 51, 0.08);
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
|
||||
.contact {
|
||||
width: 100%;
|
||||
padding: 2.5%;
|
||||
font-weight: 300px;
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
color: #455A64;
|
||||
|
||||
a,
|
||||
a:focus,
|
||||
a:hover,
|
||||
a:visited {
|
||||
color: #455A64;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
i.fa {
|
||||
margin-left: 10px;
|
||||
margin-right: 10px;
|
||||
font-size: 8px;
|
||||
color: #969da0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.degree {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.degree-description {
|
||||
color: #455A64;
|
||||
}
|
||||
|
||||
.skill-desc {
|
||||
color: #455A64;
|
||||
}
|
||||
|
||||
.timeline {
|
||||
position: relative;
|
||||
margin-top: -6px;
|
||||
|
||||
.line {
|
||||
border-left: 1px solid #B0BEC5;
|
||||
height: 100px;
|
||||
position: absolute;
|
||||
left: 38px;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.experience-block {
|
||||
padding-left: 24px;
|
||||
padding-right: 24px;
|
||||
display: inline-block;
|
||||
margin-bottom: 20px;
|
||||
|
||||
&:first-of-type {
|
||||
padding-top: 29px;
|
||||
}
|
||||
|
||||
.circle {
|
||||
height: 30px;
|
||||
width: 30px;
|
||||
display: inline-block;
|
||||
background: #009688;
|
||||
border-radius: 50%;
|
||||
float: left;
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.job {
|
||||
margin-left: 53px;
|
||||
margin-top: -5px;
|
||||
padding: 10px;
|
||||
background: #CFD8DC;
|
||||
width: 240px;
|
||||
|
||||
.jobtitle {
|
||||
line-height: 1.0;
|
||||
font-family: Roboto,sans-serif;
|
||||
font-weight: 400;
|
||||
font-size: 18px;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.company,
|
||||
.description,
|
||||
.timeperiod {
|
||||
line-height: 1.0;
|
||||
color: #455A64;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
90
resumes/resume-5/resume-5.mustache
Normal file
90
resumes/resume-5/resume-5.mustache
Normal file
@ -0,0 +1,90 @@
|
||||
<page class="a4 resume4">
|
||||
<div id="resume5">
|
||||
<div class="introduction dp3">
|
||||
<div class="wrapper">
|
||||
<div class="img dp4">
|
||||
</div>
|
||||
<div class="text">
|
||||
<div class="name">{{person.name}}</div>
|
||||
<div class="position">{{person.position}}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="resume-content">
|
||||
<div class="card-row">
|
||||
<div class="card dp1">
|
||||
<div class="content">
|
||||
<div class="title dp3">Education</div>
|
||||
<div class="text">
|
||||
{{#person.education}}
|
||||
<div class="row line">
|
||||
<div class="degree">{{degree}}</div>
|
||||
<div class="degree-description">{{description}}</div>
|
||||
</div>
|
||||
{{/person.education}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-row multiple">
|
||||
<div class="card dp1">
|
||||
<div class="content ">
|
||||
<div class="title dp3">Experience</div>
|
||||
<div class="text">
|
||||
<div class="timeline">
|
||||
{{#person.experience}}
|
||||
<div class="experience-block">
|
||||
<div class="circle dp1"></div>
|
||||
<div class="job dp1">
|
||||
<div class="job-row">
|
||||
<span class="jobtitle">{{position}}</span>
|
||||
</div>
|
||||
<div class="job-row">
|
||||
<span class="company">{{company}}, </span>
|
||||
<span class="timeperiod">{{timeperiod}}, </span>
|
||||
<span class="description">{{description}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{/person.experience}}
|
||||
|
||||
<div class="line"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card dp1">
|
||||
<div class="content">
|
||||
<div class="title dp3">Skills</div>
|
||||
<div class="text">
|
||||
<div class="row">
|
||||
<div class="chips">
|
||||
{{#person.skills}}
|
||||
<div class="chip">{{name}}</div>
|
||||
{{/person.skills}}
|
||||
</div>
|
||||
<p class="skill-desc">{{person.skillDescription}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="resume-footer">
|
||||
<div class="contact">
|
||||
<a href="mailto:{{person.contact.email}}">{{person.contact.email}}</a>
|
||||
<i class="fa fa-circle"></i> {{person.contact.phone}}
|
||||
<i class="fa fa-circle"></i> {{person.contact.street}}, {{person.contact.city}}
|
||||
<i class="fa fa-circle"></i>
|
||||
<a href="{{person.contact.website}}">{{person.contact.website}}</a>
|
||||
<i class="fa fa-circle"></i>
|
||||
<a href="{{person.contact.github}}">{{person.contact.github}}</a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</page>
|
||||
BIN
resumes/resume-5/resume-5.pdf
Normal file
BIN
resumes/resume-5/resume-5.pdf
Normal file
Binary file not shown.
BIN
resumes/resume-5/resume-5.png
Normal file
BIN
resumes/resume-5/resume-5.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 103 KiB |
161
resumes/resume-6/resume-6.less
Normal file
161
resumes/resume-6/resume-6.less
Normal file
@ -0,0 +1,161 @@
|
||||
.resume6 {
|
||||
background: #171717;
|
||||
font-family: 'TypoPRO Montserrat';
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
#resume6 {
|
||||
color: white;
|
||||
|
||||
h3 {
|
||||
background: #1cb251;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-weight: 300;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 9px;
|
||||
padding-top: 20px;
|
||||
padding-bottom: 20px;
|
||||
border-radius: 35px;
|
||||
}
|
||||
|
||||
.left-col {
|
||||
float: left;
|
||||
width: 38%;
|
||||
padding: 3%;
|
||||
|
||||
.person-box {
|
||||
width: 100%;
|
||||
background: #282828;
|
||||
|
||||
.img {
|
||||
height: 300px;
|
||||
width: 100%;
|
||||
background: url('/person.jpg');
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 7%;
|
||||
|
||||
.person-name {
|
||||
width: 100%;
|
||||
margin-bottom: 10px;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.person-position {
|
||||
color: #767676;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.skill {
|
||||
margin-bottom: 35px;
|
||||
width: 90%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
|
||||
.skill-name {
|
||||
color: #9a9a9a;
|
||||
}
|
||||
}
|
||||
|
||||
.skills-other {
|
||||
color: rgba(154,154,154,.8);
|
||||
}
|
||||
|
||||
.skills-block {
|
||||
h3 {
|
||||
margin-top: 30px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.skill-bar {
|
||||
width: 100%;
|
||||
background: #282828;
|
||||
height: 10px;
|
||||
border-radius: 20px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
margin-top: 10px;
|
||||
|
||||
.level {
|
||||
width: 99%;
|
||||
position: absolute;
|
||||
background: #9a9a9a;
|
||||
height: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.skill-circle {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
margin-top: -15px;
|
||||
transform: translateX(-15px);
|
||||
|
||||
.circle {
|
||||
background: #c6c6c6;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.right-col {
|
||||
width: 53%;
|
||||
float: left;
|
||||
padding-top: 3%;
|
||||
padding-right: 3%;
|
||||
|
||||
.education,
|
||||
.experience {
|
||||
margin-bottom: 20px;
|
||||
|
||||
.education-block,
|
||||
.experience-block {
|
||||
font-size: 20px;
|
||||
padding: 20px;
|
||||
border-bottom: 1px #262626 solid;
|
||||
color: rgba(154, 154, 154, 0.8);
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.row:first-child {
|
||||
color: #9a9a9a;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.contact {
|
||||
table {
|
||||
color: #9a9a9a;
|
||||
padding: 20px;
|
||||
font-size: 20px;
|
||||
font-weight: 300;
|
||||
|
||||
a,
|
||||
a:focus,
|
||||
a:hover,
|
||||
a:visited {
|
||||
color: #9a9a9a;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
i.fa {
|
||||
color: rgba(154, 154, 154, 0.8);
|
||||
font-size: 30px;
|
||||
margin-right: 20px;
|
||||
margin-top: 2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
100
resumes/resume-6/resume-6.mustache
Normal file
100
resumes/resume-6/resume-6.mustache
Normal file
@ -0,0 +1,100 @@
|
||||
<page class="a4 resume6">
|
||||
<div id="resume6">
|
||||
<div class="left-col">
|
||||
<div class="person-box">
|
||||
<div class="img"></div>
|
||||
<div class="content">
|
||||
<div class="person-name"> {{person.name}} </div>
|
||||
<div class="person-position"> {{person.position}} </div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="skills-block">
|
||||
|
||||
<h3>Skills</h3>
|
||||
<div class="skills">
|
||||
{{#person.skills}}
|
||||
<div class="skill">
|
||||
<span class="skill-name">{{name}}</span>
|
||||
<div class="skill-bar">
|
||||
<div style="width: {{level}}%" class="level"> </div>
|
||||
</div>
|
||||
<div class="skill-circle">
|
||||
<div style="left: {{level}}%" class="circle"></div>
|
||||
</div>
|
||||
</div>
|
||||
{{/person.skills}}
|
||||
</div>
|
||||
|
||||
<span class="skills-other"> {{person.skillDescription}} </span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right-col">
|
||||
<div class="experience">
|
||||
<h3>Experience</h3>
|
||||
|
||||
{{#person.experience}}
|
||||
<div class="experience-block">
|
||||
<div class="row">
|
||||
<span class="company"> {{company}} -</span>
|
||||
<span class="job-title"> {{position}} </span>
|
||||
</div>
|
||||
<div class="row">
|
||||
<span class="time-period"> {{timeperiod}}</span>
|
||||
</div>
|
||||
<div class="row">
|
||||
|
||||
<span class="job-description"> {{description}} </span>
|
||||
</div>
|
||||
</div>
|
||||
{{/person.experience}}
|
||||
|
||||
</div>
|
||||
<div class="education">
|
||||
|
||||
<h3>Education</h3>
|
||||
|
||||
{{#person.education}}
|
||||
<div class="education-block">
|
||||
<div class="row">
|
||||
<span class="degree">{{degree}}</span>
|
||||
</div>
|
||||
<div class="row">
|
||||
<span class="degree-description">{{description}}</span>
|
||||
</div>
|
||||
</div>
|
||||
{{/person.education}}
|
||||
</div>
|
||||
|
||||
<div class="contact">
|
||||
<h3>Contact</h3>
|
||||
|
||||
<table>
|
||||
<tr>
|
||||
<td><i class="fa fa-envelope" aria-hidden="true"></i></td>
|
||||
<td><a href="mailto:{{person.contact.email}}">{{person.contact.email}}</a></td>
|
||||
|
||||
</tr>
|
||||
<tr>
|
||||
<td><i class="fa fa-phone" aria-hidden="true"></i></td>
|
||||
<td><a href="tel:{{person.contact.phone}}">{{person.contact.phone}}</a></td>
|
||||
|
||||
</tr>
|
||||
<tr>
|
||||
<td><i class="fa fa-home" aria-hidden="true"></i></td>
|
||||
<td>{{person.contact.street}} <br> {{person.contact.city}}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><i class="fa fa-globe" aria-hidden="true"></i></td>
|
||||
<td><a href="{{person.contact.website}}">{{person.contact.website}}</a></td>
|
||||
|
||||
</tr>
|
||||
<tr>
|
||||
<td><i class="fa fa-github" aria-hidden="true"></i></td>
|
||||
<td><a href="{{person.contact.github}}">{{person.contact.github}}</a></td>
|
||||
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</page>
|
||||
BIN
resumes/resume-6/resume-6.pdf
Normal file
BIN
resumes/resume-6/resume-6.pdf
Normal file
Binary file not shown.
BIN
resumes/resume-6/resume-6.png
Normal file
BIN
resumes/resume-6/resume-6.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 166 KiB |
@ -2,3 +2,5 @@
|
||||
@import "resume-2/resume-2.less";
|
||||
@import "resume-3/resume-3.less";
|
||||
@import "resume-4/resume-4.less";
|
||||
@import "resume-5/resume-5.less";
|
||||
@import "resume-6/resume-6.less";
|
||||
|
||||
@ -2,3 +2,5 @@ electroshot localhost:3000/resume-1 2481x3508 --pdf-margin none --format pdf --o
|
||||
electroshot localhost:3000/resume-2 2481x3508 --pdf-margin none --format pdf --out resumes/resume-2 --filename "resume-2.pdf"
|
||||
electroshot localhost:3000/resume-3 2481x3508 --pdf-margin none --format pdf --out resumes/resume-3 --filename "resume-3.pdf"
|
||||
electroshot localhost:3000/resume-4 2481x3508 --pdf-margin none --format pdf --out resumes/resume-4 --filename "resume-4.pdf"
|
||||
electroshot localhost:3000/resume-5 2481x3508 --pdf-margin none --format pdf --out resumes/resume-5 --filename "resume-5.pdf"
|
||||
electroshot localhost:3000/resume-6 2481x3508 --pdf-margin none --format pdf --out resumes/resume-6 --filename "resume-6.pdf"
|
||||
|
||||
19
server.js
19
server.js
@ -14,6 +14,7 @@ app.use(express.static(path.join(__dirname, 'public')));
|
||||
app.use(express.static(path.join(__dirname, 'node_modules/material-design-icons/iconfont')));
|
||||
app.use('/fonts', express.static(path.join(__dirname, 'node_modules/npm-font-open-sans-condensed/fonts')));
|
||||
app.use('/fonts', express.static(path.join(__dirname, 'node_modules/roboto-fontface/fonts')));
|
||||
app.use(express.static(path.join(__dirname, 'node_modules/@typopro/web-montserrat')));
|
||||
app.use(express.static(path.join(__dirname, 'resumes')));
|
||||
app.use(express.static(path.join(__dirname, 'node_modules')));
|
||||
app.use('/fonts', express.static(path.join(__dirname, 'node_modules/open-sans-fontface/fonts')));
|
||||
@ -63,6 +64,24 @@ app.get('/resume-4', function(req, res) {
|
||||
});
|
||||
});
|
||||
|
||||
app.get('/resume-5', function(req, res) {
|
||||
res.render('layout', {
|
||||
partials: {
|
||||
content: 'resume-5/resume-5'
|
||||
},
|
||||
person: person
|
||||
});
|
||||
});
|
||||
|
||||
app.get('/resume-6', function(req, res) {
|
||||
res.render('layout', {
|
||||
partials: {
|
||||
content: 'resume-6/resume-6'
|
||||
},
|
||||
person: person
|
||||
});
|
||||
});
|
||||
|
||||
app.listen(3000, '0.0.0.0', function() {
|
||||
console.log('Listening on localhost:3000!');
|
||||
});
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user