61 lines
2.5 KiB
TypeScript
61 lines
2.5 KiB
TypeScript
import { ChangeDetectionStrategy, Component } from '@angular/core';
|
|
import { CommonModule } from '@angular/common';
|
|
import { SectionComponent } from '../../shared/ui/section/section.component';
|
|
|
|
@Component({
|
|
selector: 'app-about-me-section',
|
|
standalone: true,
|
|
imports: [CommonModule, SectionComponent],
|
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
template: `
|
|
<app-section
|
|
[id]="sectionId"
|
|
eyebrow="About me"
|
|
title="Engineer, collaborator, perpetual learner"
|
|
lead="I like to keep teams moving: establish a clear plan, align stakeholders, and turn good ideas into shipped, measurable outcomes."
|
|
>
|
|
<div class="grid gap-8 lg:grid-cols-2">
|
|
<div class="space-y-4 text-zinc-600 dark:text-zinc-200">
|
|
<p>
|
|
I care about pairing good taste with solid engineering practices.
|
|
Whether building a new product or refining an existing one, I work
|
|
to keep the codebase tidy, the UI cohesive, and the delivery
|
|
predictable.
|
|
</p>
|
|
<p>
|
|
I thrive in cross-functional teams, translating between design,
|
|
product, and engineering to keep efforts aligned and transparent.
|
|
</p>
|
|
</div>
|
|
<div class="grid gap-3">
|
|
<div
|
|
class="rounded-xl border border-zinc-200 bg-white/60 p-4 dark:border-slate-800/60 dark:bg-slate-900/40"
|
|
>
|
|
<p class="text-sm font-semibold text-emerald-600 dark:text-emerald-300">
|
|
Working principles
|
|
</p>
|
|
<ul class="mt-2 space-y-2 text-sm text-zinc-600 dark:text-zinc-300">
|
|
<li>• Design for clarity, then refine for speed.</li>
|
|
<li>• Prefer simple interfaces over clever abstractions.</li>
|
|
<li>• Optimize for maintainability and team velocity.</li>
|
|
</ul>
|
|
</div>
|
|
<div
|
|
class="rounded-xl border border-zinc-200 bg-white/60 p-4 dark:border-slate-800/60 dark:bg-slate-900/40"
|
|
>
|
|
<p class="text-sm font-semibold text-emerald-600 dark:text-emerald-300">Ways I help</p>
|
|
<ul class="mt-2 space-y-2 text-sm text-zinc-600 dark:text-zinc-300">
|
|
<li>• Structuring design systems and component libraries.</li>
|
|
<li>• Improving developer experience and tooling.</li>
|
|
<li>• Coaching teams on pragmatic testing and reviews.</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</app-section>
|
|
`
|
|
})
|
|
export class AboutMeSectionComponent {
|
|
readonly sectionId = 'about-me';
|
|
}
|