Pala logó
PALA...
FEJLESZTŐI SPECIFIKÁCIÓK / ARCHITEKTÚRA & ADAPTÍV LAYOUT

Architektúra és Egykódos Flutter Layout (<600dp vs >=600dp)

A Pala „One Core, Several Clients” felépítése, a Material Design 3 adaptív 600dp töréspontja, az állapotmegőrzési szabályok és a WCAG 2.1 AA akadálymentességi előírások.

1. „One Core, Several Clients” Monorepo Felépítés

A Pala egyetlen közös adattípus- és üzletilogika-magot (lib/) használ, amelyre négy különböző felhasználói felület épül:

lib/ & bin/

Közös Dart Kréta API kliens, adatmodellek, Demó adatok, ICS/CSV export és a kétpaneles TUI.

app/

Material Design 3 Flutter alkalmazás Androidra, Windowsra, Linuxra és macOS-re (package:pala).

extension/

Manifest V3 böngészőbővítmény (Chrome & Firefox) építési lépés nélküli ES modulokkal.

website/

Statikus Next.js 16 + Tailwind CSS v4 főoldal és dokumentációs portál.

2. Adaptív 600dp Töréspont és Állapotmegőrzés

TöréspontElsődleges KomponensElrendezési MintaÉrintési Célterület (WCAG 2.1 AA)
Compact (< 600dp)Alsó NavigationBarEgyoszlopos görgethető folyam, alsó hüvelykujj-zónaMin. 48×48dp (Android) / 44×44pt (iOS)
Expanded (>= 600dp)Bal oldali NavigationRailMaster-Detail osztott nézet vezérlőpanelekkelMin. 48×48dp + hover és fókusz állapotok
app/lib/ — WCAG 2.1 AA Érintési Célterület és Szemantika példa
Semantics(
  button: true,
  label: 'Szellem Jegy hozzáadása',
  child: ConstrainedBox(
    constraints: const BoxConstraints(minWidth: 48, minHeight: 48),
    child: IconButton.filledTonal(
      onPressed: onAddGhostGrade,
      icon: const Icon(Icons.calculate_outlined),
    ),
  ),
)