Make rich text images selectable and resizable #274
Conversation
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| const [currentWidth, setCurrentWidth] = useState<number | 'inherit'>(width ?? 'inherit'); | ||
| const [currentHeight, setCurrentHeight] = useState<number | 'inherit'>(height ?? 'inherit'); |
There was a problem hiding this comment.
When no width/height are provided we now initialize the component state to 'inherit', so resolvedWidth/resolvedHeight end up set to 'inherit' rather than the previous 'auto'. Because the wrapping span uses w-full, any image inserted without explicit dimensions now inherits 100% width and expands to fill the container, changing the layout of existing documents even in read-only view. The default should stay auto (natural size) unless the payload explicitly requests inherit.
Useful? React with 👍 / 👎.
- Refactored Icons.tsx to use map-based lookup. - Extracted RichTextEditor sub-components to components/rich-text/. - Fixed slider styling in index.html. - Adjusted Warm and Cool light theme palettes.
- Sharper corners (rounded-sm instead of rounded-md/lg) - Reduced focus rings (ring-1, subtle opacity) - Removed shadows from modals, tooltips, dropdowns, context menus - Updated hover states to use tree-selected for list items - Ghost buttons now use text-only hover (no background) - Smaller toggle switch for compact feel
- Removed visible border, subtle background - Sharper corners - Reduced focus ring intensity - Muted placeholder color
Per user request, the side-by-side editor and preview panes now scroll independently instead of being synchronized.
Added useZoomProperty prop to ZoomPanContainer that uses CSS zoom instead of transform:scale(). This allows text to reflow when zooming, eliminating the whitespace issue.
- Applied Antigravity design language (sharper corners, reduced focus rings, flat design) - Fixed MD preview zoom to reflow text properly - Fixed tree selection visibility in light mode - Disabled scroll sync between editor and preview - Improved search box styling
Summary
Testing
Codex Task