dvorakmortonxd/freezmo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

More shinier bubbles; the chat's top edge fades instead of clipping

Browse source 
Bubbles: ten -> eighteen (interleaved, 18px to 96px, 10-23s runs), with a
tighter specular hotspot, a reflected-light glint low on the sphere, a 1px
glass edge and a brighter inner rim on both the bubbles and the drifting
orbs. Bodies stay translucent with capped opacity, so wallpaper text stays
readable; bubble-perf shows no added frame cost.

Chat: the conversation scrolls up to the glass header, and a line clipped
exactly at that edge read as a rendering bug over the busy wallpaper - the
scroller now carries a 14px top mask in Aero, shorter than the column's
16px top padding so a fresh conversation shows no dimming.

Contrast 0 findings, axe clean, chat 101/101, mobile 123/123 (bubble count
pinned to 18), regression 44/44, i18n 13/13, native 33/33.
Version 0.3.7, SW -> freezmo-v66.
This commit is contained in:
Martin Dvořák 2026-10-13 13:19:12 +00:00
commit 4ba80a9bf2
7 changed files with 74 additions and 20 deletions
Download patch file Download diff file Expand all files Collapse all files

8
components/IceBackdrop.tsx
View file

@ -43,6 +43,14 @@ export function IceBackdrop() {
<span className="ice-bubble ice-bubble-8" />
<span className="ice-bubble ice-bubble-9" />
<span className="ice-bubble ice-bubble-10" />
<span className="ice-bubble ice-bubble-11" />
<span className="ice-bubble ice-bubble-12" />
<span className="ice-bubble ice-bubble-13" />
<span className="ice-bubble ice-bubble-14" />
<span className="ice-bubble ice-bubble-15" />
<span className="ice-bubble ice-bubble-16" />
<span className="ice-bubble ice-bubble-17" />
<span className="ice-bubble ice-bubble-18" />
<span className="ice-grain" />
</div>
);

2
components/chat/ChatScreen.tsx
View file

@ -569,7 +569,7 @@ export function ChatScreen() {
</header>
<div className="relative min-h-0 flex-1">
<div ref={scrollRef} onScroll={onScroll} className="h-full overflow-y-auto overscroll-contain">
<div ref={scrollRef} onScroll={onScroll} className="chat-scroll h-full overflow-y-auto overscroll-contain">
<div className="mx-auto w-full max-w-3xl space-y-4 px-4 py-4">
{messages.length === 0 ? (
<div className="space-y-5 py-6">