Procházet zdrojové kódy

Merkanalyse web-vs-app: 13 nieuwe taken (P0-11/12, P1-32..36, P2-16..21) + merk-DNA van uitgaanskrant.com vastgelegd

Look&feel-review van uitgaanskrant.com naast de app: site-palet en
typografie uitgelezen uit live CSS, app-styling geteld over lib/,
screenshots via profile-build op emulator. Kernbevinding: app-thema
staat nog op FlutterFlow-fabrieksinstellingen (primary #4B39EF) terwijl
er 3 bijna-gelijke roden los hardcoded staan, geen daarvan het logo-rood.

Rapport: https://claude.ai/code/artifact/29f3412a-305f-49f3-971c-cd9bd310beb1
Werklijst: https://claude.ai/code/artifact/0c0c7347-d681-417d-83d7-7feb1de6457d

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
bob před 2 týdny
rodič
revize
858e3a55dc
2 změnil soubory, kde provedl 180 přidání a 0 odebrání
  1. 37 0
      CLAUDE.md
  2. 143 0
      TASKS.md

+ 37 - 0
CLAUDE.md

@@ -349,6 +349,23 @@ export PATH="/home/bob/fvm/bin:$HOME/.pub-cache/bin:$PATH" && /home/bob/Projects
   crash van de app zelf. Bouw bij dit toestel bewust een korte
   `sleep`/wachttijd tussen opeenvolgende input-acties in i.p.v. ze
   direct na elkaar te vuren.
+- **Screenshots van de website zelf (voor look&feel-vergelijkingen):
+  headless Chromium werkt, maar met twee valkuilen.** (1) Snap-Chromium
+  mag niet schrijven in `/tmp/claude-*` (Permission denied) — schrijf
+  naar `~/uk-shots/` o.i.d. (2) De homepage opent met een
+  cookiebanner + een JS-modal die het hele scherm vult, en
+  `--blink-settings=scriptEnabled=false` laat `--screenshot` stil
+  falen. Werkend recept: pagina ophalen met Python, `<script>`-tags
+  strippen, `<base href="https://uitgaanskrant.com/">` in de `<head>`
+  zetten, lokaal opslaan en dán `chromium --headless=new
+  --window-size=430,1500 --screenshot=x.png file://...` — CSS en
+  afbeeldingen laden gewoon via de base-href.
+- **Telefoonformaat-screenshots zonder de telefoon-emulator te
+  claimen:** de tablet-AVD (`emulator-5556`) is tijdelijk om te zetten
+  met `adb -s emulator-5556 shell wm size 1080x2160` +
+  `wm density 420`, en daarna terug met `wm size reset` /
+  `wm density reset`. Handig wanneer op `emulator-5554` al een
+  debug-sessie van iemand anders draait die je niet wilt verstoren.
 - **AVD crasht/valt soms zelf uit (los van de app) — diagnose via
   `journalctl --user -u android-emulator.service` (telefoon) of
   `...-tablet.service` (tablet), niet via `adb logcat`.** Bevestigd
@@ -1443,6 +1460,26 @@ exacte veldnaam+type-specificatie (kost hem seconden per veld).
 
 ## Domein/architectuurcontext
 
+- **Merk-DNA van uitgaanskrant.com (bron van waarheid voor look&feel;
+  uitgelezen 2026-08-30 uit de live CSS + berekende stijlen).** Vier
+  kleuren met elk één vaste rol, nergens door elkaar gebruikt:
+  **#9A141D** logo-rood = identiteit, **#FF680D** oranje = actie
+  (links, menubalk, actieve pagina, knoppen), **#3E454C** leisteen =
+  chroom én standaard tekstkleur, **#09B34A** groen = categorielabel.
+  Verder: #EE3338 locatiespeldje, #F2F2F2 kruimelpad/rustvlakken.
+  Typografie: **Roboto** voor interface (body 14px, sectiekoppen 16px
+  600 in kapitalen), **Droid Serif bold** voor inhoudelijke titels
+  (Noto Serif is de directe opvolger in Google Fonts). Componenten:
+  witte kaart met 3px #EEE rand, **geen** afronding en **geen**
+  schaduw; categorielabel is een recht groen blokje (12px, padding
+  `0 7px`), geen pil; Font-Awesome-icoon vóór datum en adres;
+  kruimelpad op elke detailpagina. **Vuistregel bij twijfel: rood is
+  merk en chroom, oranje is wat je aanklikt om verder te komen** — de
+  site gebruikt rood nóóit als knopkleur. Het app-thema staat nog op
+  FlutterFlow-fabrieksinstellingen (`primary` #4B39EF); zie P1-32 t/m
+  P1-34 en het Designbrug-rapport in `TASKS.md` voor de mapping.
+
+
 - **Firebase App Check beschermt alleen Firebase-diensten zelf
   (Firestore/Cloud Functions/Storage), niet de eigen Drupal-backend van
   dit project.** Besproken 2026-08-25 (Bob's vraag n.a.v. FlutterFlow's

+ 143 - 0
TASKS.md

@@ -876,6 +876,35 @@ export: `EdgeInsetsDirectional.fromSTEB(0.0, 0.0, 0.0, 48.0)` staat nu
 op regel 1279. `SafeArea` bleek dus niet nodig, gewone vaste padding
 volstond. Uit deze lijst verwijderd.)*
 
+
+---
+
+*(Onderstaande taken komen uit de merkanalyse web-vs-app van 2026-08-30.
+Volledige onderbouwing met screenshots: [Designbrug-rapport](https://claude.ai/code/artifact/29f3412a-305f-49f3-971c-cd9bd310beb1).
+Afvinkbare werklijst: [Designbrug werklijst](https://claude.ai/code/artifact/0c0c7347-d681-417d-83d7-7feb1de6457d).)*
+
+**P0-11 · Eigenaar: Bob.** Menu (`drawer_component_widget.dart`)
+scrollt praktisch niet: 21 items, past op geen telefoonscherm, en
+schuift alleen na een lange doelbewuste veeg — een korte veeg doet
+zichtbaar niets. Gevolg: "Thuis bezorgen", "Mijn Account" en de
+terugknop worden door een deel van de gebruikers nooit gezien.
+Vermoedelijke oorzaak: `SingleChildScrollView` binnen
+`SingleChildScrollView` (regel 97 en 124). Fix: buitenste scroll-wrapper
+weg, en Provincie/Gemeente inklapbaar maken of samenvoegen tot één
+lijst met een schakelaar erboven (halveert de lengte én maakt het
+verschil tussen die twee eindelijk zichtbaar).
+
+**P0-12 · Eigenaar: Bob.** Twee identieke hartjes met verschillende
+betekenis op één scherm. Het hartje in de header favoriet de
+**gemeente** (`header_buttons_component_widget.dart`:254,
+`addToFavorieteGemeenteIds`); het hartje op de pagina favoriet de
+**gelegenheid** (`horecagelegenheid_current_widget.dart`:380-427).
+Niets onderscheidt ze. Fix: labels erbij ("Gemeente volgen" tegenover
+"Bewaren"), of het gemeentehartje uit de header halen en één keer bij
+de gemeentekeuze zetten. Voeg bij gemeente-volgen de regel toe die de
+site ook gebruikt: dat je die gemeente donderdags in de agendamail
+krijgt — dat verband is in de app nergens zichtbaar.
+
 ## Minor — non-blockers (launch mag hier niet op wachten)
 
 Bob's expliciete categorie (2026-08-14): kleine restpunten uit P0-8 die
@@ -2075,6 +2104,60 @@ incident** — **7 nid's** bevatten hetzelfde kapotte-`?`-patroon
 `?`-patronen) — bedoeld als concrete startlijst voor handmatig herstel
 in Drupal, geen uitputtende audit.
 
+
+---
+
+*(Onderstaande taken komen uit de merkanalyse web-vs-app van 2026-08-30.
+Volledige onderbouwing met screenshots: [Designbrug-rapport](https://claude.ai/code/artifact/29f3412a-305f-49f3-971c-cd9bd310beb1).
+Afvinkbare werklijst: [Designbrug werklijst](https://claude.ai/code/artifact/0c0c7347-d681-417d-83d7-7feb1de6457d).)*
+
+**P1-32 · Eigenaar: Bob** (7 velden, ±10 min in zijn eigen browser).
+Merkkleuren in Theme Settings → Colors zetten; het thema staat nog
+volledig op FlutterFlow-fabrieksinstelling. `primary` #4B39EF →
+**#9A141D** (logo-rood), `secondary` #39D2C0 → **#FF680D**
+(actie-oranje van de site), `tertiary` #EE8B60 → **#09B34A**
+(categoriegroen), `primaryText` #14181B → **#3E454C**, `secondaryText`
+#57636C → **#838A8F**, `primaryBackground` #F1F4F8 → **#F2F2F2**,
+`alternate` #E0E3E7 → **#EEEEEE**. **Direct daarna nalopen:** alle nu
+paarse knoppen worden hierdoor rood, maar op de site is rood nooit een
+knopkleur — "Alle evenementen"/"Alle horecagelegenheden" horen oranje
+te worden. Vuistregel: rood = merk en chroom, oranje = wat je aanklikt.
+
+**P1-33 · Eigenaar: Claude** (mechanisch, ±1 sessie; pas ná P1-32).
+Drie bijna-gelijke hardcoded roden vervangen door thema-`primary`:
+`#B1061E` (42×), `#B50808` (15×), `#B12727` (8×) — geen daarvan is het
+logo-rood. Verspreid over 25 bestanden; zwaartepunten:
+`header_buttons_component_widget.dart` (4×, staat op vrijwel elk
+scherm), `horecagelegenheden_overzicht_widget.dart` (7×),
+`..._overzicht_provincie_page_widget.dart` (7×),
+`..._overzicht_page_data_type_widget.dart` (7×),
+`horecagelegenheid_current_widget.dart` (4×). Die drie
+overzicht-varianten zijn onderling kopieën — elke ingreep is er drie
+keer dezelfde; samenvoegen tot één pagina met parameters scheelt bij
+élke volgende taak op die schermen.
+
+**P1-34 · Eigenaar: Bob** (1 instelling). Body-lettertype in Theme
+Settings → Typography van Inter/Inter Tight naar **Roboto**, het
+lettertype van de site. Layoutrisico klein (letters lijken sterk op
+elkaar); daarna wel even de tabbalken nalopen, daar zit de minste
+ruimte.
+
+**P1-35 · Eigenaar: Bob** (klein per pagina). Advertentieblok staat op
+de detailpagina's direct onder de titel en duwt tabs/adres/tijden onder
+de vouw. De site zet advertenties consequent ná de inhoud. Verplaats de
+`AdBanner`-node naar onder de Info-tab of onderaan de pagina, op
+`horecagelegenheid_current` en `event_current`/
+`evenement_horecagelegenheid`.
+
+**P1-36 · Eigenaar: Bob.** In `horecagelegenheidoverzicht_kaart_widget.dart`
+liggen drie groene categoriepillen over het logo van de zaak heen
+(precies over de naam in het beeldmerk), met daarnaast een leeg grijs
+vlak van dezelfde grootte — leest als een kapotte afbeelding. Fix:
+labels uit de `Stack` halen en onder titel/adres plaatsen (zoals de
+site), leeg grijs vlak weg, en meteen labelvorm van pil naar recht
+blokje (radius 8 → 0). Los van P2-12 (blur-hash-laadplaatshouder,
+al afgerond) — dit is een leeg vlak, geen laadprobleem.
+
 ## P2 — features & concept, na livegang
 
 **P2-1 · Eigenaar: Bob — testen in de API, komt terug.** Datum-filter:
@@ -2908,3 +2991,63 @@ horecagelegenheid-picker gevuld via `mijn_horecagelegenheden`). **Check
 bij het oppakken eerst of de andere, parallelle sessie (zie
 waarschuwing bovenaan deze taak) hier intussen al iets aan gebouwd
 heeft** — nog niet herverifieerd sinds de eerdere check.
+
+---
+
+*(Onderstaande taken komen uit de merkanalyse web-vs-app van 2026-08-30.
+Volledige onderbouwing met screenshots: [Designbrug-rapport](https://claude.ai/code/artifact/29f3412a-305f-49f3-971c-cd9bd310beb1).
+Afvinkbare werklijst: [Designbrug werklijst](https://claude.ai/code/artifact/0c0c7347-d681-417d-83d7-7feb1de6457d).)*
+
+**P2-16 · Eigenaar: Bob** (klein). Tabnamen gelijktrekken met de site.
+Home: app heeft Uitgaan/Activiteiten/Cultuur/Films/Jeugd, site heeft
+Uitgaan/Stadsactiviteiten/Cultuur&Info → "Activiteiten" wordt
+"Stadsactiviteiten", "Cultuur" wordt "Cultuur&Info" (Films en Jeugd
+mogen blijven; de app mag fijnmaziger zijn, zolang gedeelde namen
+kloppen). Gelegenheiddetail: app heeft Info/Links/Bezorgen, site heeft
+Info/Opening/Map → openingstijden en kaart terug als eigen tab, "Links"
+onder Info. Let op: `evenement_horecagelegenheid` noemt dezelfde tab al
+wél "Openingstijden" — die twee schermen spreken elkaar nu tegen.
+
+**P2-17 · Eigenaar: Claude** (mechanisch). Slagschaduw onder
+titelteksten verwijderen (property-zoekbalk → "shadow"). Tien
+componenten: `uitgaantabel_kaart_widget.dart`,
+`kaart_tabel_uitgaan_comp_widget.dart`,
+`kaart_tabel_uitgaan_s_comp_widget.dart`,
+`kaart_slider_uitgaan_s_comp_widget.dart`,
+`home_uitgaantabel_kaart_component`, `p_uitgaan_slider_kaart_component`,
+`p_uitgaantabel_kaart_component_orgineel_met_kaartjeerin`,
+`event_current_widget.dart`, `horecagelegenheid_current_widget.dart`.
+De site gebruikt dit effect nergens.
+
+**P2-18 · Eigenaar: Claude** (mechanisch, ±12 iconen; pas ná P0-11).
+Eén icoon per categorie in het menu: "Cultuur" en "Jeugd" hebben nu
+onder Provincie een ánder icoon dan onder Gemeente. Vervalt grotendeels
+als P0-11 de twee lijsten samenvoegt — daarom pas daarna oppakken.
+
+**P2-19 · Eigenaar: Bob.** `nav.dart`:129 stuurt een ingelogde
+gebruiker naar het provincie/gemeente-keuzescherm en een uitgelogde
+naar Home; de site doet het omgekeerd (iedereen begint landelijk,
+kiezen mag later). Nu voelt inloggen als een drempel i.p.v. een
+voordeel. Fix: altijd Home als startpunt, plus de gekozen gemeente als
+klikbare regel in de header ("Amsterdam · wijzigen") — dat beantwoordt
+meteen de vraag "welke gemeente zie ik hier eigenlijk?", die op de
+lijstschermen nergens beantwoord wordt.
+
+**P2-20 · Eigenaar: Bob** (groter, eigen sessie; pas als het kleurbeeld
+klopt). Serif-koppen invoeren: de site zet elke inhoudelijke titel in
+Droid Serif bold — dát maakt het krantengevoel, en het is het enige
+merkkenmerk dat je niet met kleur kunt namaken. **Noto Serif Bold** is
+de directe opvolger en zit in Google Fonts. Toepassen op kaarttitels en
+detailtitels, interface blijft Roboto. Serif is breder, dus daarna alle
+kaarttitels op afbreken/overlopen nakijken. Ook een legitieme uitkomst:
+niet doen — dan is de app herkenbaar op kleur maar mist hij de
+kranten-uitstraling.
+
+**P2-21 · Eigenaar: Claude.** Tabletweergave herschikken i.p.v.
+uitrekken: op tabletformaat blijven kaarten één kolom en rekken ze mee
+tot volledige schermbreedte (onleesbaar lange regels, sliderband wordt
+een leeg vlak). Fix: boven ±700px twee kolommen in de lijstweergaven +
+de tekstkolom in kaarten begrenzen. Verifiëren op `emulator-5556`
+(tablet) én telefoonformaat. Staat los van P1-11 (labels/overflow, al
+afgerond) — dit gaat puur over kolomindeling.
+