Checkpoint of in-progress work: the registration wizard (address prefill, DUO diploma lookup, policy questions), decision-DTO contracts, parse-don't- validate value objects, infrastructure adapters, plus CLAUDE.md and the architecture/ADR docs. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
38 lines
1.8 KiB
TypeScript
38 lines
1.8 KiB
TypeScript
import { Component, input } from '@angular/core';
|
|
import { RouterLink } from '@angular/router';
|
|
|
|
/** Organism: site header with Rijksoverheid-style wordmark + title.
|
|
ponytail: text wordmark instead of the licensed Rijksoverheid logo. */
|
|
@Component({
|
|
selector: 'app-site-header',
|
|
imports: [RouterLink],
|
|
// :host display:block so the full-bleed bar fills the flex column (custom
|
|
// elements default to display:inline, which collapsed the bar to its content).
|
|
styles: [`
|
|
:host{display:block}
|
|
.bar{background:var(--rhc-color-lintblauw-700);color:var(--rhc-color-wit);inline-size:100%}
|
|
.inner{display:flex;align-items:center;gap:var(--rhc-space-max-xl);max-inline-size:var(--app-content-max);margin-inline:auto;padding:var(--rhc-space-max-xl) var(--rhc-space-max-2xl);box-sizing:border-box}
|
|
.brand{display:flex;align-items:center;gap:var(--rhc-space-max-lg);color:inherit;text-decoration:none}
|
|
.mark{display:inline-block;inline-size:var(--rhc-space-max-md);block-size:var(--rhc-space-max-4xl);background:var(--rhc-color-wit)}
|
|
.name{font-weight:var(--rhc-text-font-weight-bold);line-height:var(--rhc-text-line-height-sm)}
|
|
.sub{font-weight:var(--rhc-text-font-weight-regular);font-size:var(--rhc-text-font-size-sm)}
|
|
.portal{margin-inline-start:auto;font-weight:var(--rhc-text-font-weight-semi-bold)}
|
|
`],
|
|
template: `
|
|
<header class="utrecht-page-header bar">
|
|
<div class="inner">
|
|
<a routerLink="/dashboard" class="brand">
|
|
<span aria-hidden="true" class="mark"></span>
|
|
<span class="name">
|
|
Rijksoverheid<br><span class="sub">BIG-register</span>
|
|
</span>
|
|
</a>
|
|
<span class="portal">{{ subtitle() }}</span>
|
|
</div>
|
|
</header>
|
|
`,
|
|
})
|
|
export class SiteHeaderComponent {
|
|
subtitle = input('Mijn omgeving');
|
|
}
|