This commit is contained in:
salomonelli 2020-04-29 20:43:22 +02:00
commit 367e40477e
2 changed files with 35 additions and 18 deletions

View File

@ -33,6 +33,7 @@
v-for="(skill, index) in person.skills" v-for="(skill, index) in person.skills"
class="grid-item" class="grid-item"
:key="index" :key="index"
:class="{ link: skill.url !== undefined}"
:href="skill.url"> :href="skill.url">
<span class="squarred-grid-item"> <span class="squarred-grid-item">
{{ skill.name }} {{ skill.name }}
@ -52,7 +53,7 @@
</div> </div>
<a <a
class="section-link" class="section-link link"
:href="contactLinks.email"> :href="contactLinks.email">
<i class="section-link__icon material-icons">mail</i>{{ person.contact.email }} <i class="section-link__icon material-icons">mail</i>{{ person.contact.email }}
</a> </a>
@ -63,28 +64,28 @@
<a <a
v-if="person.contact.website" v-if="person.contact.website"
class="section-link" class="section-link link"
:href="person.contact.website"> :href="person.contact.website">
<i class="section-link__icon fa fa-globe"></i>{{ person.contact.website }} <i class="section-link__icon fa fa-globe"></i>{{ person.contact.website }}
</a> </a>
<a <a
v-if="person.contact.linkedin" v-if="person.contact.linkedin"
class="section-link" class="section-link link"
:href="contactLinks.linkedin"> :href="contactLinks.linkedin">
<i class="section-link__icon fa fa-linkedin"></i>{{ person.contact.linkedin }} <i class="section-link__icon fa fa-linkedin"></i>{{ person.contact.linkedin }}
</a> </a>
<a <a
v-if="person.contact.github" v-if="person.contact.github"
class="section-link" class="section-link link"
:href="contactLinks.github"> :href="contactLinks.github">
<i class="section-link__icon fa fa-github"></i>{{ person.contact.github }} <i class="section-link__icon fa fa-github"></i>{{ person.contact.github }}
</a> </a>
<a <a
v-if="person.contact.medium" v-if="person.contact.medium"
class="section-link" class="section-link link"
:href="contactLinks.medium"> :href="contactLinks.medium">
<i class="section-link__icon fa fa-medium"></i>{{ person.contact.medium }} <i class="section-link__icon fa fa-medium"></i>{{ person.contact.medium }}
</a> </a>
@ -103,6 +104,7 @@
v-for="(experience, index) in person.experience" v-for="(experience, index) in person.experience"
:key="index" :key="index"
class="section-content__item" class="section-content__item"
:class="{ link: experience.website !== undefined}"
:href="experience.website"> :href="experience.website">
<span class="section-content__header">{{ experience.position }}</span> <span class="section-content__header">{{ experience.position }}</span>
@ -127,6 +129,7 @@
v-for="(education, index) in person.education" v-for="(education, index) in person.education"
class="section-content__item" class="section-content__item"
:key="index" :key="index"
:class="{ link: education.website !== undefined}"
:href="education.website"> :href="education.website">
<span class="section-content__header"> {{ education.school }} </span> <span class="section-content__header"> {{ education.school }} </span>
@ -147,6 +150,7 @@
<div class="section-content-grid"> <div class="section-content-grid">
<a v-for="(project, index) in person.projects" :key="index" <a v-for="(project, index) in person.projects" :key="index"
class="section-content__item-grid" class="section-content__item-grid"
:class="{ link: project.url !== undefined}"
:href="project.url"> :href="project.url">
<span class="section-content__header"> {{ project.name }} </span> <span class="section-content__header"> {{ project.name }} </span>
<span class="section-content__subheader">{{ project.platform }}</span> <span class="section-content__subheader">{{ project.platform }}</span>
@ -167,6 +171,7 @@
v-for="(contribution, index) in person.contributions" v-for="(contribution, index) in person.contributions"
class="section-content__item-grid" class="section-content__item-grid"
:key="index" :key="index"
:class="{ link: contribution.url !== undefined}"
:href="contribution.url"> :href="contribution.url">
<span class="section-content__header"> {{ contribution.name }} </span> <span class="section-content__header"> {{ contribution.name }} </span>
<span class="section-content__text"> {{ contribution.description }} </span> <span class="section-content__text"> {{ contribution.description }} </span>
@ -201,7 +206,7 @@ export default Vue.component(name, getVueOptions(name));
@base-padding: 30px; @base-padding: 30px;
@left-column-width: 240px; @left-column-width: 240px;
a { .link {
color: inherit; color: inherit;
cursor: pointer; cursor: pointer;
text-decoration-line: none; text-decoration-line: none;

View File

@ -100,20 +100,26 @@
<div class="section-headline">{{ lang.experience }}</div> <div class="section-headline">{{ lang.experience }}</div>
<div class="block" v-for="experience in person.experience" :key="experience.company"> <div class="block" v-for="experience in person.experience" :key="experience.company">
<div class="block-helper"></div> <a
<h3 class="headline">{{experience.position}} - {{experience.company}}</h3> :href="experience.website">
<div class="subheadline">{{experience.timeperiod}}</div> <div class="block-helper"></div>
<p class="info"> <h3 class="headline">{{experience.position}} - {{experience.company}}</h3>
{{experience.description}} <div class="subheadline">{{experience.timeperiod}}</div>
</p> <p class="info">
{{experience.description}}
</p>
</a>
</div> </div>
<div class="section-headline">{{ lang.education }}</div> <div class="section-headline">{{ lang.education }}</div>
<div class="block" v-for="education in person.education" :key="education.degree"> <div class="block" v-for="education in person.education" :key="education.degree">
<div class="block-helper"></div> <a
<div class="headline">{{education.degree}}</div> :href="education.website">
<p class="info"> <div class="block-helper"></div>
{{education.timeperiod}}, {{education.description}} <div class="headline">{{education.degree}}</div>
</p> <p class="info">
{{education.timeperiod}}, {{education.description}}
</p>
</a>
</div> </div>
</div> </div>
@ -136,7 +142,13 @@ export default Vue.component(name, getVueOptions(name));
background:#cccccc; background:#cccccc;
} }
a { a {
cursor:pointer; color: inherit;
cursor: pointer;
text-decoration-line: none;
&:visited {
color: inherit;
}
} }
.description-personal { .description-personal {
margin-left:20px; margin-left:20px;