diff --git a/LOTUS_BUGS.md b/LOTUS_BUGS.md index 0c6e8af38..5f98420a4 100644 --- a/LOTUS_BUGS.md +++ b/LOTUS_BUGS.md @@ -307,63 +307,63 @@ This document tracks identified bugs, edge cases, and architectural discrepancie ### 🟠 Moderate β€” Interaction Pattern or Visual Deviations -| # | Area | File | Lines | Issue | Native Pattern | -| :-- | :------------------------- | :---------------------------------------- | :---------------- | :--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| N5 | Read Receipts | `ReadReceiptAvatars.tsx` | 62–137 | Trigger button is raw `` to fetch the next page | -| N66 | DateRangeButton β€” Native `` | `SearchFilters.tsx` | 558–589 | "From" and "To" date fields are raw `` with inline style overrides including `fontSize: '0.82rem'` | `SelectRoomButton` (same file, line 224) and `SelectSenderButton` (line 424) both use folds ``; the date inputs are the only native browser inputs in the search filter row | -| N67 | SeasonalEffect / NightLight Z-Index Order | `SeasonalEffect.tsx` / `App.tsx` | 759 / 62–77 | `SeasonalEffect` mounts at `zIndex: 9999`; `NightLightOverlay` at `zIndex: 9998`. Seasonal particles render **above** Night Light so they are never tinted. `SeasonalEffect` also shares `z-index: 9999` with the skip-to-content link in `ClientLayout.tsx` | Expected UX: Night Light tints all visible content including effects; requires either a higher Night Light z-index or a lower SeasonalEffect z-index | -| N68 | Syntax Highlighting β€” `--lt-accent-*` Vars in Non-TDS Themes | `syntaxHighlight.ts` | 313–323 | `tokenStyle()` returns `var(--lt-accent-cyan/green/orange/purple, hardcoded-fallback)` β€” `--lt-*` vars only exist in TDS mode; fallbacks are Monokai dark colors that have poor contrast on light themes and no relationship to the existing `--prism-*` variables in `ReactPrism.css` | `ReactPrism.css` uses `--prism-keyword`, `--prism-selector` etc. which switch correctly between light and dark palettes; syntax highlighting should use the same variable family | -| N69 | Mention Highlight β€” `` Instead of `HexColorPickerPopOut` | `General.tsx` | 644–675 | Raw `` with hardcoded pixel dimensions; OS-native color picker chrome renders completely differently from the rest of settings UI | `PowersEditor.tsx:125–143` establishes `}>` as the codebase's color-picking pattern; Reset button should be `` (spinner while loading) replacing the passive text | `RoomActivityLog.tsx:425` and `MessageSearch.tsx:129` both render a folds `` to fetch the next page | +| N66 | DateRangeButton β€” Native `` | `SearchFilters.tsx` | 558–589 | "From" and "To" date fields are raw `` with inline style overrides including `fontSize: '0.82rem'` β€” **FIXED**: replaced both with folds ``; removed now-unused `color` import | `SelectRoomButton` (same file, line 224) and `SelectSenderButton` (line 424) both use folds ``; the date inputs are the only native browser inputs in the search filter row | +| N67 | SeasonalEffect / NightLight Z-Index Order | `SeasonalEffect.tsx` / `App.tsx` | 759 / 62–77 | `SeasonalEffect` mounts at `zIndex: 9999`; `NightLightOverlay` at `zIndex: 9998`. Seasonal particles render **above** Night Light so they are never tinted. `SeasonalEffect` also shares `z-index: 9999` with the skip-to-content link in `ClientLayout.tsx` β€” **FIXED**: lowered `SeasonalEffect` overlay to `zIndex: 9997` (below Night Light at 9998 and modals at 9999), so Night Light now tints the particles and dialogs are never obscured | Expected UX: Night Light tints all visible content including effects; requires either a higher Night Light z-index or a lower SeasonalEffect z-index | +| N68 | Syntax Highlighting β€” `--lt-accent-*` Vars in Non-TDS Themes | `syntaxHighlight.ts` | 313–323 | `tokenStyle()` returns `var(--lt-accent-cyan/green/orange/purple, hardcoded-fallback)` β€” `--lt-*` vars only exist in TDS mode; fallbacks are Monokai dark colors that have poor contrast on light themes and no relationship to the existing `--prism-*` variables in `ReactPrism.css` | `ReactPrism.css` uses `--prism-keyword`, `--prism-selector` etc. which switch correctly between light and dark palettes; syntax highlighting should use the same variable family | +| N69 | Mention Highlight β€” `` Instead of `HexColorPickerPopOut` | `General.tsx` | 644–675 | Raw `` with hardcoded pixel dimensions; OS-native color picker chrome renders completely differently from the rest of settings UI | `PowersEditor.tsx:125–143` establishes `}>` as the codebase's color-picking pattern; Reset button should be ` + + {collapsed ? 'Read more ↓' : 'Show less ↑'} + + )} ); diff --git a/src/app/components/seasonal/SeasonalEffect.tsx b/src/app/components/seasonal/SeasonalEffect.tsx index 07879b701..a5ba93c8f 100644 --- a/src/app/components/seasonal/SeasonalEffect.tsx +++ b/src/app/components/seasonal/SeasonalEffect.tsx @@ -756,7 +756,9 @@ function SeasonalOverlay({ theme, reduced }: { theme: SeasonTheme; reduced: bool position: 'fixed', inset: 0, pointerEvents: 'none', - zIndex: 9999, + // Below the Night Light overlay (9998) so seasonal particles are tinted + // by it, and below modals (9999) so dialogs are never obscured. + zIndex: 9997, overflow: 'hidden', }} > diff --git a/src/app/components/user-profile/UserRoomProfile.tsx b/src/app/components/user-profile/UserRoomProfile.tsx index 830bde89e..a9f0aa050 100644 --- a/src/app/components/user-profile/UserRoomProfile.tsx +++ b/src/app/components/user-profile/UserRoomProfile.tsx @@ -237,11 +237,20 @@ function UserPrivateNotes({ userId }: { userId: string }) { return ( - + Private Note - - {saving ? 'Saving…' : charsLeft < 100 ? `${charsLeft} left` : ''} - + {saving ? ( + + + + Saving… + + + ) : ( + + {charsLeft < 100 ? `${charsLeft} left` : ''} + + )}