Skip to content
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions .Jules/apex.md
Original file line number Diff line number Diff line change
Expand Up @@ -22,3 +22,5 @@ Prefer visitor-facing craft on live surfaces (Home, Work, Biography, Contact, an
## 2026-05-26 - Product Manifesto | Signal: Product Leadership "Guiding Principles" trend | Lean Implementation: Isolated experimental route, uses Hero/Icon primitives, ~45 lines delta.

## 2026-05-27 - Strategic Reading List | Signal: Portfolio "Bookshelf" trend | Lean Implementation: Isolated experimental route, static data array, uses Hero/Pill/Icon primitives, ~48 lines delta.

## 2026-05-28 - Working With Me | Signal: Operating Manual / Collaboration Guide trend | Lean Implementation: Isolated experimental route (`/experimental/working-with-me`), feature flagged via Zod schema, ~48 lines delta total.
1 change: 1 addition & 0 deletions src/content.config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,7 @@ export const collections = {
enable_logo_wobble_v1: z.boolean().default(false),
enable_cta_tactile_v1: z.boolean().default(false),
enable_theme_toggle_tactile_v1: z.boolean().default(false),
enable_working_with_me: z.boolean().default(false),
}),
}),
};
3 changes: 2 additions & 1 deletion src/content/flags/config.json
Original file line number Diff line number Diff line change
Expand Up @@ -7,5 +7,6 @@
"enable_reading_list": true,
"enable_logo_wobble_v1": true,
"enable_cta_tactile_v1": true,
"enable_theme_toggle_tactile_v1": true
"enable_theme_toggle_tactile_v1": true,
"enable_working_with_me": true
}
86 changes: 86 additions & 0 deletions src/pages/experimental/working-with-me.astro
Original file line number Diff line number Diff line change
@@ -0,0 +1,86 @@
---
import CallToAction from '../../components/CallToAction.astro';
import Hero from '../../components/Hero.astro';
import BaseLayout from '../../layouts/BaseLayout.astro';
import { getEntry } from 'astro:content';

const flagsEntry = await getEntry('flags', 'config');
if (!flagsEntry?.data.enable_working_with_me) return Astro.redirect('/404/');

const items = [
{ t: 'Asynchronous First', d: 'Clear written context over unnecessary meetings.' },
{ t: 'Bias for Action', d: 'Ship small, iterate fast, validate with real data.' },
{ t: 'Radical Transparency', d: 'Open trade-off decisions and honest feedback.' },
Comment on lines +10 to +13

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Cards — LinkedIn-carousel principle titles ("Asynchronous First", "Bias for Action", "Radical Transparency"). Drop the slogan labels; write like a person.

Suggested:

const items = [
  { t: 'Write first', d: 'Prefer a clear written note over a meeting that could have been an update.' },
  { t: 'Ship small', d: 'Start with something you can try this week. Learn from what ships.' },
  { t: 'Say the trade-off', d: 'Share the decision, the option you passed on, and why.' },
];

];
---

<BaseLayout
title="Working With Me | Alexander Härenstam"
description="Operating manual"

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Meta / title — thin brochure vs reading-list.

Suggested:

title="Working with me | Product Manager, Developer Experience at IFS"
ogTitle="Working with me | Product Manager, Developer Experience at IFS"
description="Product Manager, Developer Experience at IFS. How I like to collaborate."

robots="noindex"
>
<main id="main-content" class="wrapper stack gap-8">
<Hero title="Working With Me" align="start">
<p class="lede">Operating manual on collaboration, communication, and decision-making.</p>

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Lede — generic operating-manual brochure. Match reading-list: plain, specific, first-person.

Suggested:

<p class="lede">
  Product Manager, Developer Experience at IFS. How I like to work with others: write
  first, ship small, and say the trade-offs out loud.
</p>

</Hero>
<div class="grid">
{
items.map(({ t, d }) => (
<div class="card">
<>
<strong>{t}</strong>
<p>{d}</p>
</>
</div>
))
}
</div>
<div class="actions">
<CallToAction
href="https://www.linkedin.com/in/alehar/"
target="_blank"
rel="noopener noreferrer"
data-hire-event="hire_cta_click"
data-hire-surface="working-with-me">Connect on LinkedIn</CallToAction
>
Comment on lines +39 to +45

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

CTA chrome — reading-list uses Get in touch plus a hint line, not Connect on LinkedIn.

Suggested:

<CallToAction
  href="https://www.linkedin.com/in/alehar/"
  target="_blank"
  rel="noopener noreferrer"
  data-hire-event="hire_cta_click"
  data-hire-surface="working-with-me"
>
  Get in touch
</CallToAction>
<p class="cta-hint">LinkedIn · replies from me</p>

(Add .cta-hint styles from /experimental/reading-list — font-size: var(--text-sm), color: var(--gray-300).)

</div>
</main>
</BaseLayout>

<style>
.lede {
margin: 0;
color: var(--gray-200);
max-width: 46ch;
}
.grid {
display: grid;
gap: 1rem;
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
.card {
padding: 1.25rem;
border: 1px solid var(--gray-800);
border-radius: 0.5rem;
background: var(--gradient-subtle);
}
.card strong {
display: block;
color: var(--gray-0);
}
.card p {
margin: 0.35rem 0 0;
color: var(--gray-300);
}
.actions {
display: flex;
align-items: flex-start;
margin-top: 0.5rem;
padding-bottom: var(--chat-fab-clearance);
}
@media (min-width: 50em) {
.actions {
padding-bottom: 0;
}
}
</style>
Loading