ilia/resume
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #224 from OrenSchwartz/oblique_with_about_and_arrow_skills

Browse Source 
added support for about and arrow icons instead of triangles in obliq…
This commit is contained in:
Sara Steiert 2020-04-29 21:42:49 +02:00 committed by GitHub
commit 8f3cc56e18
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 17 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/resumes/oblique.vue
View File

@ -15,6 +15,7 @@
</div> </div>
</div> </div>
<div class="resume-content"> <div class="resume-content">
<div class="about">{{person.about}}</div>
<div class="experience"> <div class="experience">
<h3>{{ lang.experience }}</h3> <h3>{{ lang.experience }}</h3>
@ -46,7 +47,7 @@
<h3>{{ lang.skills }}</h3> <h3>{{ lang.skills }}</h3>
<div class="skills" v-for="skill in person.skills" :key="skill.name"> <div class="skills" v-for="skill in person.skills" :key="skill.name">
<div class="skill-block"> <div class="skill-block">
<i class="material-icons">details</i> <i class="material-icons">keyboard_arrow_right</i>
<span class="skill">{{skill.name}}</span> <span class="skill">{{skill.name}}</span>
</div> </div>
</div> </div>
@ -93,6 +94,7 @@ export default Vue.component(name, getVueOptions(name));
font-weight:bold; font-weight:bold;
text-transform:uppercase; text-transform:uppercase;
margin-bottom:10px; margin-bottom:10px;
font-size: 22px;
} }
.resume-header .triangle { .resume-header .triangle {
width:0; width:0;
@ -102,13 +104,13 @@ export default Vue.component(name, getVueOptions(name));
border-color:#006064 transparent transparent transparent; border-color:#006064 transparent transparent transparent;
position:absolute; position:absolute;
left:-600px; left:-600px;
top:0; top:-200px;
} }
.resume-header .person-header { .resume-header .person-header {
position:absolute; position:absolute;
z-index:20; z-index:20;
right:15%; right:15%;
top:200px; top:50px;
.person-wrapper { .person-wrapper {
overflow:hidden; overflow:hidden;
position:relative; position:relative;
@ -145,15 +147,25 @@ export default Vue.component(name, getVueOptions(name));
margin-top:10px; margin-top:10px;
} }
} }
.company {
font-weight:bold;
}
.resume-content { .resume-content {
margin-top:435px; margin-top:435px;
margin-left:15%; margin-left:15%;
width:70%; width:70%;
.about {
font-size: 20px;
font-weight: 350;
top: -200px;
margin-top: -200px;
width: 375px;
}
.experience .experience-block { .experience .experience-block {
line-height:1; line-height:1;
margin-bottom:10px; margin-bottom:10px;
.row:first-child { .row:first-child {
font-size:20px; font-size:18px;
text-transform:uppercase; text-transform:uppercase;
i { i {
font-size:17px; font-size:17px;
@ -193,7 +205,7 @@ export default Vue.component(name, getVueOptions(name));
line-height:1; line-height:1;
} }
.contact { .contact {
margin-top:50px; margin-top: 0px;
a, span { a, span {
display:inline-block; display:inline-block;
font-size:20px; font-size:20px;