Phase 3 Devlog — Face & Layout Polish Phase 3 added a handful of new facial states on top of the existing set (talking, angry, blink, thinking, sleep, surprised): manic, disgust, and exasperated. Each is just CSS — scaling the unibrow, eyes, and mouth per state and letting the existing transition properties handle the interpolation. They’re wired into guessMood(), so the reply text picks which one fires.The main bug was in the pupils. Bumping their size seemed trivial, but the original CSS used a multi-offset box-shadow to fake small catchlight dots around the pupil, and none of those shadow values had an explicit color. Browsers default an unset box-shadow color to currentColor, which here was the page’s neon-green text color. Scaling the pattern up didn’t just make the pupil bigger, it made a glowing green blob visible around it. Fixed by dropping the multi-dot trick for a single solid pupil with one inset highlight — simpler, and it scales cleanly.There was also a first pass that auto-cycled through every state on a timer so they’d show up without an API key connected. It conflicted with the actual reply-driven logic, so it got pulled — states now only ever fire off a real message, same as talking and surprised always did.A second bug turned up after that: the auto-blink loop was resetting the container’s full class list on every blink, which incidentally wiped out whatever mood state a reply had just set. Since blinks fire every 2–6 seconds, this meant states were getting cut short or skipped entirely. Fixed by having blink toggle its own class instead of resetting the container.Smaller changes: the chat history panel moved to the leftmost column, the unibrow got nudged up slightly to give the bigger pupils more room, and the inaccurate relative timestamps (“3m ago”) on chat list items were removed in favor of just showing message count.
Comments 0
No comments yet. Be the first!
Sign in to join the conversation.