Lobo_Corp/playground-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Finalized the About page for now

Browse Source
This commit is contained in:
Lobo
2025-11-29 15:13:47 +01:00
parent 664aed47a6
commit 839b7c9ba5
11 changed files with 410 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files

109
src/app/pages/about/about.component.html
View File

@@ -38,17 +38,6 @@
<a href="{{UrlConstants.LINKED_IN}}" target="_blank" rel="noopener">LinkedIn</a>
</div>
</div>
<div class="actions">
<a mat-flat-button color="primary" [href]="cvHref" target="_blank" rel="noopener">
<mat-icon>picture_as_pdf</mat-icon>
{{ 'ABOUT.DOWNLOAD_CV' | translate }}
</a>
<a mat-stroked-button routerLink="/projects">
<mat-icon>work_outline</mat-icon>
{{ 'ABOUT.VIEW_PROJECTS' | translate }}
</a>
</div>
</div>
</mat-card>
@@ -77,8 +66,6 @@
<mat-card class="experience">
<h2>{{ 'ABOUT.SECTION.EXPERIENCE' | translate }}</h2>
<div class="xp-list">
@for (entry of xpKeys; track entry) {
<div class="xp-item">
@@ -94,9 +81,6 @@
<div class="head-row">
<strong>{{ (entry.key + '.ROLE') | translate }}</strong>
<span class="time">{{ (entry.key + '.TIME') | translate }}</span>
<div class="company-row">
{{ (entry.key + '.COMPANY') | translate }}
</div>
</div>
<div class="company-row">
@@ -124,32 +108,45 @@
<h2>{{ 'ABOUT.SECTION.PROJECTS' | translate }}</h2>
<div class="xp-list">
@for (entry of projectKeys; track entry) {
<div class="xp-item">
<div class="xp-head">
<strong>{{ 'ABOUT.XP.T1.ROLE' | translate }}</strong>
<span class="time">{{ 'ABOUT.XP.T1.TIME' | translate }}</span>
<div class="head-row">
<strong>{{ (entry.key + '.TITLE') | translate }}</strong>
</div>
<div class="company-row">
{{ (entry.key + '.DESCRIPTION') | translate }}
</div>
<div class="link-row">
<a class="link-with-icon"
href="{{entry.externalLink}}"
target="_blank"
rel="noopener noreferrer">
<mat-icon>open_in_new</mat-icon>
{{ (entry.key + '.LINK_EXTERNAL') | translate }}
</a>
</div>
<div class="link-row">
<a class="link-with-icon"
href="{{entry.internalLink}}"
rel="noopener noreferrer">
<mat-icon>link</mat-icon>
{{ (entry.key + '.LINK_INTERNAL') | translate }}
</a>
</div>
<div class="highlights-noMargin">
<ul>
<li>{{ entry.key + '.HIGHLIGHTS.P1' | translate }}</li>
<li>{{ entry.key + '.HIGHLIGHTS.P2' | translate }}</li>
<li>{{ entry.key + '.HIGHLIGHTS.P3' | translate }}</li>
</ul>
</div>
<div class="xp-sub">{{ 'ABOUT.XP.T1.COMPANY' | translate }}</div>
<ul>
<li>{{ 'ABOUT.XP.T1.P1' | translate }}</li>
<li>{{ 'ABOUT.XP.T1.P2' | translate }}</li>
<li>{{ 'ABOUT.XP.T1.P3' | translate }}</li>
</ul>
</div>
<mat-divider></mat-divider>
<div class="xp-item">
<div class="xp-head">
<strong>{{ 'ABOUT.XP.T2.ROLE' | translate }}</strong>
<span class="time">{{ 'ABOUT.XP.T2.TIME' | translate }}</span>
</div>
<div class="xp-sub">{{ 'ABOUT.XP.T2.COMPANY' | translate }}</div>
<ul>
<li>{{ 'ABOUT.XP.T2.P1' | translate }}</li>
<li>{{ 'ABOUT.XP.T2.P2' | translate }}</li>
</ul>
</div>
@if(entry.key !== projectKeys.at(projectKeys.length-1)?.key)
{
<mat-divider></mat-divider>
}
}
</div>
</mat-card>
@@ -158,30 +155,20 @@
<div class="xp-list">
<div class="xp-item">
<div class="xp-head">
<strong>{{ 'ABOUT.XP.T1.ROLE' | translate }}</strong>
<span class="time">{{ 'ABOUT.XP.T1.TIME' | translate }}</span>
</div>
<div class="xp-sub">{{ 'ABOUT.XP.T1.COMPANY' | translate }}</div>
<ul>
<li>{{ 'ABOUT.XP.T1.P1' | translate }}</li>
<li>{{ 'ABOUT.XP.T1.P2' | translate }}</li>
<li>{{ 'ABOUT.XP.T1.P3' | translate }}</li>
</ul>
</div>
@for (entry of educationKeys; track entry) {
<div class="head-row">
<strong>{{ (entry.key + '.WHERE') | translate }}</strong>
<span class="time">{{ (entry.key + '.WHEN') | translate }}</span>
</div>
<div class="company-row">
{{ (entry.key + '.WHAT') | translate }}
</div>
<mat-divider></mat-divider>
<div class="xp-item">
<div class="xp-head">
<strong>{{ 'ABOUT.XP.T2.ROLE' | translate }}</strong>
<span class="time">{{ 'ABOUT.XP.T2.TIME' | translate }}</span>
</div>
<div class="xp-sub">{{ 'ABOUT.XP.T2.COMPANY' | translate }}</div>
<ul>
<li>{{ 'ABOUT.XP.T2.P1' | translate }}</li>
<li>{{ 'ABOUT.XP.T2.P2' | translate }}</li>
</ul>
@if(entry.key !== educationKeys.at(educationKeys.length-1)?.key)
{
<mat-divider style="margin-top: .5rem; margin-bottom: .5rem"></mat-divider>
}
}
</div>
</div>
</mat-card>