Warm paper and coffee ink for a 6 AM room. Ember is the only action color; pine means "here". Serif for numbers that matter, system type for everything else.
<g-count>The number the greeter glances at as the room fills. Kiosk header.
<g-card> signatureThe manual check-in fallback: tap a name, it flips to "Here" with the time. Try tapping these.
<g-search>Filters the roll-call grid as you type. Try it on the demo grid below.
<g-kpi>Admin dashboard headline numbers. Tone only when the number needs attention.
<g-trend>Saturday attendance, one bar per week. Hover a bar for the exact count; the latest week is labeled directly.
<g-health>Of each group's members, how many showed up in the last four weeks.
<g-chip>Outreach states. Icon + word, never color alone.
<g-outreach>Who to call, how long they've been missing, and one button to move it along. The button advances the status — try it.
<g-meeting>Past meetings show attendance; upcoming ones show as ember. Topic and location (basement of cathedral / cathedral center) appear when set. The pill marks the kind — regular Saturday meeting vs. special events — and special events that need help get an ember "needs volunteers" pill.
<g-intake>Default is the minimal ask: email, mobile, and the communication checkbox.
The full kiosk variant adds name, invited-by, and instant-promote via the
fields attribute. Submit either — the gallery just echoes what it captured.
<g-meeting-grid>Admin sets up meetings excel-style: rows default to the next Saturdays at 6:00, location picks from the two rooms, agenda is free text. Skip masks a week with no meeting (click it again to restore). "Save schedule" applies the whole grid. Edit anything and save — the gallery echoes the plan.
<g-quadrant>The four groups split town at the cross downtown: tap the part of town you live in. When a home address is given instead, the backend geocodes it and computes the quadrant automatically — this tap is the no-address fallback. Group names appear once each quadrant is claimed.
<g-login>The console gate for leaders and admins. The screen at the door does not use this — an unattended kiosk runs on its own device token. Two paths in: email and password anywhere, or tap-your-name-and-six-digits on the door screen, where a keyboard is the slow part. The PIN keypad only appears when the API hands over a name list, which it does only for a registered kiosk. Submit an empty password, or type a wrong PIN, to see the failure state.
<g-nav> + <g-profile>Views down the left, account at the bottom. Click an item to move the
highlight; click the avatar to open the profile menu (your info, password, skin,
log out). g-profile works on its own too.
<g-meeting-now>The banner at the top of the door screen: topic as the headline, then when and where. Location is a pill because "which room" is the question men actually ask on the way in.
<g-attendance-board>The first thing an admin sees after signing in: how last Saturday went, total and by group. The number badge is the group's quadrant number, in reading order from the top-left (1=NW, 2=NE, 3=SW, 4=SE); a group with no quadrant claimed shows a dash.
<g-drawer>Expands from the right over whatever you were doing, and slides away when it's done — the door uses it for the first-time form, so the greeter never leaves the roster and loses the room. Closes on the X, the scrim, or Escape. Unlike the other components this one keeps its children instead of rendering from attributes.
<g-modes>More than one way for a man to find himself: tap his face, tap his name, or type part of it. Every mode writes the same check-in, tagged with which one he used — so the pilot tells you which to keep. Switch modes to see the roster change.
<g-gate>First-run screen on a kiosk or admin browser: paste the token once, it's remembered.