GeorgeandClaude Sonnet 5.5
fad66abec4
Los radios estaban escritos en cada componente. Ahora salen de --radius (campos), --radius-lg (botones), --radius-pill (insignias) y --radius-panel (tablas y ventanas, 0 por defecto). Sin cambio visual: un tema nuevo puede redondear la interfaz sin tocar componentes. Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
37 lines
1.4 KiB
TypeScript
37 lines
1.4 KiB
TypeScript
import { ChangeDetectionStrategy, Component, inject } from '@angular/core';
|
|
import { RouterLink } from '@angular/router';
|
|
import { SessionStore } from '../../core/auth/session.store';
|
|
import { MenuService } from '../../core/menu/menu.service';
|
|
|
|
@Component({
|
|
selector: 'sbo-home-page',
|
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
imports: [RouterLink],
|
|
template: `
|
|
<h1>Bienvenido, {{ session.user()?.firstName }}</h1>
|
|
<p class="sub">{{ session.company() }}</p>
|
|
@for (m of menu.modules(); track m.id) {
|
|
<section>
|
|
<h2>{{ m.label }}</h2>
|
|
<div class="links">
|
|
@for (i of m.items; track i.path) {
|
|
<a [routerLink]="i.path">{{ i.label }}</a>
|
|
}
|
|
</div>
|
|
</section>
|
|
}
|
|
`,
|
|
styles: `
|
|
h1 { margin: 0; font-size: 18px; font-weight: 600; }
|
|
.sub { margin: 2px 0 16px; color: var(--quiet); }
|
|
h2 { margin: 12px 0 6px; font-size: 13px; color: var(--quiet); text-transform: uppercase; letter-spacing: .4px; }
|
|
.links { display: flex; flex-wrap: wrap; gap: 6px; }
|
|
a { padding: 4px 12px; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius-lg); color: var(--ink); text-decoration: none; }
|
|
a:hover { background: var(--row-sel); border-color: var(--focus); }
|
|
`,
|
|
})
|
|
export class HomePage {
|
|
protected readonly session = inject(SessionStore);
|
|
protected readonly menu = inject(MenuService);
|
|
}
|